From 1e84eeb6e37417b3037a0600a6dfea91b00e32e5 Mon Sep 17 00:00:00 2001
From: OpenShift guest <benoit.schweblin@gmail.com>
Date: Mon, 25 Mar 2013 08:03:22 -0400
Subject: [PATCH] Update UI

---
 css/main.css |  2 --
 index.html   |  7 +++++--
 js/main.js   | 45 ++++++++++++++++++++++++++++++++-------------
 3 files changed, 37 insertions(+), 17 deletions(-)

diff --git a/css/main.css b/css/main.css
index 1660bc9e..89228096 100644
--- a/css/main.css
+++ b/css/main.css
@@ -4,8 +4,6 @@ body {
 }
 
 #file-title {
-	float:right;
-	padding: 10px;
 }
 
 #file-title-input {
diff --git a/index.html b/index.html
index cceedb32..8bb4001a 100644
--- a/index.html
+++ b/index.html
@@ -41,7 +41,10 @@
 		<div class="navbar-inner">
 			<div id="wmd-button-bar" class="nav"></div>
 			<ul class="nav pull-right">
-			 <li class="navbar-form pull-left">
+    		 <li>
+        		<a class="brand pull-right" id="file-title" href="javascript:void(0);"></a>
+    		 </li>
+			 <li class="navbar-form">
 			  <input id="file-title-input" type="text" class="span3" placeholder="File title" />
 			 </li>
 				<li class="dropdown"><a class="dropdown-toggle"
@@ -58,8 +61,8 @@
 						<li><a id="drive-link" href="javascript:void(0);"><i class="icon-magnet"></i> Link
 								with Google Drive</a></li>
 					</ul></li>
+    			<li class="divider-vertical"></li>
 			</ul>
-			<a class="brand pull-right" id="file-title" href="javascript:void(0);"></a>
 		</div>
 	</div>
 	<textarea id="wmd-input"></textarea>
diff --git a/js/main.js b/js/main.js
index d1397c4c..c7b51f78 100644
--- a/js/main.js
+++ b/js/main.js
@@ -23,12 +23,12 @@ var fileManager = (function($) {
 		$("#file-title-input").blur(function() {
 			var title = $.trim($(this).val());
 			if(title) {
-				fileIndex = localStorage["file.current"];
+				var fileIndex = localStorage["file.current"];
 				localStorage[fileIndex + ".title"] = title;
 			}
 			$(this).hide();
 			$("#file-title").show();
-			fileManager.selectFile();
+			fileManager.updateFileTitleUI();
 		});
 	};
 	
@@ -40,7 +40,7 @@ var fileManager = (function($) {
 		}
 		this.updateFileTitleList();
 		// If no file create one
-		if(this.fileTitleList.length == 0) {
+		if(this.fileTitleList.length === 0) {
 			this.createFile();
 			this.updateFileTitleList();
 		}
@@ -58,9 +58,8 @@ var fileManager = (function($) {
 		// Update the editor and the file title
 		var fileIndex = localStorage["file.current"];
 		$("#wmd-input").val(localStorage[fileIndex + ".content"]);
-		var title = localStorage[fileIndex + ".title"];
-		$("#file-title").text(title);
-		$("#file-title-input").val(title);
+        editor.refreshPreview();
+        this.updateFileTitleUI();
 	};
 
 	fileManager.createFile = function(title) {
@@ -83,23 +82,39 @@ var fileManager = (function($) {
 			var title = localStorage[fileIndex + ".title"];
 			if(title) {
 				this.fileTitleList[i] = title;
+			}
+		}
+	};
+    
+    fileManager.updateFileTitleUI = function() {
+        // Update the editor and the file title
+		var fileIndex = localStorage["file.current"];
+		var title = localStorage[fileIndex + ".title"];
+		$("#file-title").text(title);
+		$("#file-title-input").val(title);
+		$("#file-selector").empty();
+		for(var i=0; i<this.fileTitleList.length; i++) {
+			title = this.fileTitleList[i];
+			if(title) {
+        		var fileIndex1 = "file." + i;
 				var a = $("<a>").text(title);
 				var li = $("<li>").append(a);
-				if(fileIndex == localStorage["file.current"]) {
+				if(fileIndex1 == fileIndex) {
 					li.addClass("disabled");
 				}
 				else {
-					a.click((function(fileIndex) {
+					a.attr("href", "javascript:void(0);")
+                    .click((function(fileIndex) {
 						return function() {
 							localStorage["file.current"] = fileIndex;
 							fileManager.selectFile();
 						};
-					})(fileIndex));
+					})(fileIndex1));
 				}
 				$("#file-selector").append(li);
 			}
 		}
-	};
+    };
 
 	fileManager.saveFile = function() {
 		var content = $("#wmd-input").val();
@@ -180,12 +195,16 @@ var gdrive = (function($) {
 	return gdrive;
 })(jQuery);
 
+var converter;
+var editor;
+
 (function($) {
 
 	$(function() {
-		var converter = Markdown.getSanitizingConverter();
-		var editor = new Markdown.Editor(converter);
-		editor.run();
+        converter = Markdown.getSanitizingConverter();
+        editor = new Markdown.Editor(converter);
+        editor.run();
+
 		$(window).resize(resize);
 		resize();