Merge branch 'release'1.0

12 files changed, 119 insertions, 12 deletions

diff --git a/LICENSE b/LICENSE
index 171e2d3..30eccb6 100644
--- a/LICENSE
+++ b/LICENSE
@@ -13,7 +13,7 @@ modification, are permitted provided that the following conditions are met:
      this list of conditions and the following disclaimer.
   2. Redistributions in binary form must reproduce the above copyright notice,
      this list of conditions and the following disclaimer in the documentation
-	 and/or other materials provided with the distribution.
+     and/or other materials provided with the distribution.
   3. The name of the author may not be used to endorse or promote products
      derived from this software without specific prior written permission.
 
diff --git a/Makefile b/Makefile
index 889509f..c40d9b0 100644
--- a/Makefile
+++ b/Makefile
@@ -1,21 +1,26 @@
 PREFIX=/usr/
 DESTDIR=
+VERSION=1.0
 
 THEME_FILES=\
 	index.html \
 	index.theme \
 	petrichor.js \
-	petrichor.css \
-	bg.jpg \
-	iec5009.svg \
-	drop-down.svg
+	petrichor.css
 
-all:
+.PHONY: all install
 
+all: $(THEME_FILES)
 
-install:
+install: all
 	for f in $(THEME_FILES) ; do \
 		install -Dm 644 "$$f" -t "$(DESTDIR)/$(PREFIX)/share/lightdm-webkit/themes/petrichor/" ; \
 	done
+	cp -r image "$(DESTDIR)/$(PREFIX)/share/lightdm-webkit/themes/petrichor/"
 	install -Dm 644 LICENSE "$(DESTDIR)/$(PREFIX)/share/licenses/petrichor/LICENSE"
 
+clean:
+	rm index.theme
+
+index.theme: index.theme.in
+	sed -e 's/{VERSION}/$(VERSION)/g' $^ > $@
diff --git a/bg.jpg b/image/bg.jpg
index 5ad178e..5ad178e 100644
--- a/bg.jpg
+++ b/image/bg.jpg
diff --git a/image/cancel.png b/image/cancel.png
new file mode 100644
index 0000000..4d6a0ca
--- /dev/null
+++ b/image/cancel.png
diff --git a/drop-down.svg b/image/drop-down.svg
index 9dafd13..9dafd13 100644
--- a/drop-down.svg
+++ b/image/drop-down.svg
diff --git a/iec5009.svg b/image/iec5009.svg
index ec62caa..ec62caa 100644
--- a/iec5009.svg
+++ b/image/iec5009.svg
diff --git a/image/reboot.png b/image/reboot.png
new file mode 100644
index 0000000..52695ec
--- /dev/null
+++ b/image/reboot.png
diff --git a/image/shutdown.png b/image/shutdown.png
new file mode 100644
index 0000000..d2a7b96
--- /dev/null
+++ b/image/shutdown.png
diff --git a/index.html b/index.html
index 5fa7934..6b1b34d 100644
--- a/index.html
+++ b/index.html
@@ -20,7 +20,30 @@
 		<div id="message-container">
 			<span id="message-label"></span>
 		</div>
+		<a id="mask" href="#" onclick="hide_element('power-confirm');hide_element('mask');"></a>
+		<div id="power-confirm" onclick="document.getElementById('mask').click();">
+			<ul>
+				<li>
+					<a class="button" href="#" onclick="lightdm.shutdown();">
+						<div class="icon" id="icon-shutdown"></div>
+						<span>Power off</span>
+					</a>
+				</li>
+				<li>
+					<a class="button" href="#" onclick="lightdm.restart();">
+						<div class="icon" id="icon-reboot"></div>
+						<span>Restart</span>
+					</a>
+				</li>
+				<li>
+					<a class="button" href="#" onclick="hide_element('power-confirm');hide_element('mask');">
+						<div class="icon" id="icon-cancel"></div>
+						<span>Cancel</span>
+					</a>
+				</li>
+			</ul>
+		</div>
 		<select id="session-list" class="ease-opacity"></select>
-		<img id="shutdown" class="ease-opacity" src="iec5009.svg" onclick="lightdm.shutdown();" />
+		<img id="shutdown" class="ease-opacity" src="image/iec5009.svg" onclick="show_element('power-confirm');show_element('mask');" />
 	</body>
 </html>
diff --git a/index.theme b/index.theme.in
index 13639be..c1e6a14 100644
--- a/index.theme
+++ b/index.theme.in
@@ -1,6 +1,6 @@
 [theme]
 name=Petrichor
-version=1.0
+version={VERSION}
 description=Petrichor Theme
 engine=lightdm-webkit2-greeter
 url=index.html
diff --git a/petrichor.css b/petrichor.css
index 72d1b6e..a8ef1ad 100644
--- a/petrichor.css
+++ b/petrichor.css
@@ -1,7 +1,7 @@
 html
 {
 	color: #FFF;
-	background-image: url('bg.jpg');
+	background-image: url('image/bg.jpg');
 	background-size: cover;
 	font-family: "Roboto Condensed";
 }
@@ -18,6 +18,75 @@ body,html
 	transition: opacity ease 0.3s;
 }
 
+#mask
+{
+	text-align: center;
+	transition: visibility 0s linear 0.15s, opacity 0.15s linear;
+	position: absolute;
+	top: 0px;
+	left: 0px;
+	right: 0px;
+	bottom: 0px;
+	background-color: rgba(0,0,0,0.7);
+	visibility: hidden;
+	opacity: 0;
+}
+
+#power-confirm
+{
+	position: absolute;
+	left: 50%;
+	bottom: 50px;
+	visibility: hidden;
+	opacity: 0;
+}
+
+#power-confirm > ul
+{
+	display: inline-block;
+	margin: 0px 0px 0px -50%;
+}
+
+#power-confirm li
+{
+	text-align: center;
+	list-style: none;
+	display: inline-block;
+	margin-left: 2em;
+	margin-right: 2em;
+}
+
+#power-confirm li a
+{
+	text-decoration: none;
+	color: inherit;
+	font-size: 1.5em;
+	display: inline-block;
+}
+
+#power-confirm li div
+{
+	display: block;
+	height: 96px;
+	width: 96px;
+	border-radius: 48px;
+}
+
+#icon-shutdown
+{
+	background: url('image/shutdown.png') #C33;
+}
+
+#icon-reboot
+{
+	background: url('image/reboot.png') #33C;
+}
+
+#icon-cancel
+{
+	background: url('image/cancel.png') #3C3;
+}
+
 #shutdown
 {
 	position: absolute;
@@ -106,7 +175,7 @@ a.user
 	transition: visibility 0s linear 0.15s, opacity 0.15s linear;
 }
 
-#password-container.shown, #message-container.shown
+#password-container.shown, #message-container.shown, #mask.shown, #power-confirm.shown
 {
 	visibility: visible;
 	opacity: 1;
@@ -151,7 +220,7 @@ a.user
 	color: #333;
 	opacity: 0.5;
 	padding-right: 2em;
-	background: url('drop-down.svg') no-repeat right #FFF;
+	background: url('image/drop-down.svg') no-repeat right #FFF;
 	-webkit-appearance: none;
 	-moz-appearance: none; /* only for when testing */
 }
diff --git a/petrichor.js b/petrichor.js
index b5e06ed..fa4a100 100644
--- a/petrichor.js
+++ b/petrichor.js
@@ -2,6 +2,16 @@ password_prompt = false;
 selected_user = null;
 time_remaining = 0
 
+function show_element(id)
+{
+	document.getElementById(id).classList.add("shown");
+}
+
+function hide_element(id)
+{
+	document.getElementById(id).classList.remove("shown");
+}
+
 function show_prompt(text, type)
 {
 	password_prompt = true;