From cec9cb43ec98e32f08c7d6aa26098b13bbe37a63 Mon Sep 17 00:00:00 2001
From: Joshua Smith <thewanuki@gmail.com>
Date: Thu, 2 Jul 2015 13:27:21 -0400
Subject: [PATCH] Create better status bar API + Structure, add time to status
 bar

---
 laskyawm-bar.css  | 11 ++++++++++-
 laskyawm-bar.js   | 35 ++++++++++++++++++++++++++++++++---
 laskyawm-clock.js | 33 +++++++++++++++++++++++++++++++++
 laskyawm-power.js |  7 +++++--
 laskyawm.html     |  1 +
 laskyawm.js       |  8 ++++----
 6 files changed, 85 insertions(+), 10 deletions(-)
 create mode 100644 laskyawm-clock.js

diff --git a/laskyawm-bar.css b/laskyawm-bar.css
index d1573c3..5532a48 100644
--- a/laskyawm-bar.css
+++ b/laskyawm-bar.css
@@ -4,6 +4,7 @@
 	position: absolute;
 	width: 100%;
 	height: 25px;
+	color: white;
 }
 .barButton {
 	color: white;
@@ -17,9 +18,17 @@
 	text-align: center;
 	display: inline-block;
 }
-#togglePowerMenu {
+#barIcons {
 	float: right;
+}
+#barIcons > * {
+	padding: 3px 0;
+	font-size: 15px;
+	float: right;
+}
+#togglePowerMenu {
 	padding: 4px 10px 5px;
+	margin: 0;
 }
 .barMenu {
 	display: none;
diff --git a/laskyawm-bar.js b/laskyawm-bar.js
index 8ae5df2..94017af 100644
--- a/laskyawm-bar.js
+++ b/laskyawm-bar.js
@@ -1,5 +1,34 @@
 /* This file is licensed under the Affero General Public License. */
 
-var bar = document.createElement('div');
-bar.id = 'bar';
-document.body.appendChild(bar);
\ No newline at end of file
+/*global $ */
+
+(function() {
+	// Add namespace
+	var bar = window.bar = {};
+	
+	// Add bar
+	var barElement = document.createElement('div');
+	barElement.id = 'bar';
+	document.body.appendChild(barElement);
+
+	// Add icon panel
+	var barIcons = window.barIcons = document.createElement('div');
+	barIcons.id = 'barIcons';
+	barElement.appendChild(barIcons);
+	
+	bar.addItem = function(node) {
+		$(barIcons).append(node);
+		bar.updateWidth();
+	};
+	
+	bar.removeItem = function(node) {
+		barIcons.removeChild(node);
+		bar.updateWidth();
+	};
+	
+	bar.updateWidth = function() {
+		window.barIconsWidth = barIcons.offsetWidth;
+	};
+	
+	bar.updateWidth();
+})(window);
\ No newline at end of file
diff --git a/laskyawm-clock.js b/laskyawm-clock.js
new file mode 100644
index 0000000..c8d2d30
--- /dev/null
+++ b/laskyawm-clock.js
@@ -0,0 +1,33 @@
+/* This file is licensed under the Affero General Public License. */
+
+/*global deviceType */
+
+(function() {
+	// Don't show clock on mobile
+	if(deviceType === 'mobile') {
+		return;
+	}
+	
+	// Create clock widget
+	var clock = document.createElement('span');
+	clock.id = 'barClock';
+	updateTime();
+	
+	// Add to bar
+	window.bar.addItem(clock);
+
+	// Prevent freeze
+	var updateTimeout;
+	
+	function updateTime() {
+		// Clear timeout
+		clearTimeout(updateTimeout);
+		
+		// Get time
+		var currentTime = new Date();
+		clock.textContent = currentTime.toLocaleTimeString(navigator.language, {hour: 'numeric', minute: 'numeric'});
+
+		// Keep up-to-date
+		updateTimeout = setTimeout(updateTime, 60000 - (currentTime.getSeconds() * 1000) - currentTime.getMilliseconds());
+	}
+})();
\ No newline at end of file
diff --git a/laskyawm-power.js b/laskyawm-power.js
index 7e3afa8..ba69067 100644
--- a/laskyawm-power.js
+++ b/laskyawm-power.js
@@ -1,6 +1,6 @@
 /* This file is licensed under the Affero General Public License. */
 
-/*global $, prepareUrl */
+/*global $, prepareUrl, bar */
 
 var powerMenu;
 
@@ -11,11 +11,14 @@ togglePowerMenu.type = 'image';
 togglePowerMenu.alt = 'Log Out…';
 prepareUrl('/Core/power.png', {rootParent: '/'}, function(url) {
 	togglePowerMenu.src = url;
+	togglePowerMenu.addEventListener('load', function() {
+		bar.updateWidth();
+	});
 });
 togglePowerMenu.addEventListener('click', function() {
 	$(powerMenu).toggle();
 });
-document.body.appendChild(togglePowerMenu);
+bar.addItem(togglePowerMenu);
 
 powerMenu = document.createElement('div');
 powerMenu.id = 'powerMenu';
diff --git a/laskyawm.html b/laskyawm.html
index 594dc60..1ccea70 100644
--- a/laskyawm.html
+++ b/laskyawm.html
@@ -15,4 +15,5 @@
 	<script src="laskyawm-bar.js"></script>
 	<script src="laskyawm-apps.js"></script>
 	<script src="laskyawm-power.js"></script>
+	<script src="laskyawm-clock.js"></script>
 </body>
\ No newline at end of file
diff --git a/laskyawm.js b/laskyawm.js
index 7d41ba6..5b6818b 100644
--- a/laskyawm.js
+++ b/laskyawm.js
@@ -1,6 +1,6 @@
 /* This file is licensed under the Affero General Public License. */
 
-/*global _, $, File, apps, powerMenu, getFile: true, prepareUrl: true, listenForFileChanges: true, showProgress: true, setProgress: true, hideProgress: true, openFile: true, openWindow: true, extension: true */
+/*global _, $, File, barIconsWidth, apps, powerMenu, getFile: true, prepareUrl: true, listenForFileChanges: true, showProgress: true, setProgress: true, hideProgress: true, openFile: true, openWindow: true, extension: true */
 
 var deviceType = window.matchMedia('only screen and (max-device-width: 640px)').matches ? 'mobile' : 'desktop';
 
@@ -687,8 +687,8 @@ function positionMinimized() {
 			if(left < minMinimizedLeft) {
 				minimizedLeft = minMinimizedLeft;
 				moved = true;
-			} else if(left > window.innerWidth - 350) {
-				minimizedLeft = window.innerWidth - 350;
+			} else if(left > window.innerWidth - barIconsWidth - 260) {
+				minimizedLeft = window.innerWidth - barIconsWidth - 260;
 				moved = true;
 				pushLeft = true;
 			} else {
@@ -703,7 +703,7 @@ function positionMinimized() {
 			}
 			if(moved) {
 				if(!win.realLeft) win.realLeft = win.style.left;
-				win.style.cssText += '; left: ' + (pushLeft ? window.innerWidth - 350 : minimizedLeft) + 'px !important;';
+				win.style.cssText += '; left: ' + (pushLeft ? window.innerWidth - barIconsWidth - 260 : minimizedLeft) + 'px !important;';
 			}
 			full[minimizedLeft] = win;
 		}