HTML: Restructure html folder

This changes the HTML part of GitX to be more consistent -- we now use a "views" directory where every web view has it's own directory. Furthermore, GitX-wide Javascript is added in the "lib" directory. The same is true for CSS in the "css" directory. Every view can have its own custom CSS and JS, and those are put in the views directory (without JS or CSS prefix directories).
deminew · Oct 21, 2008 · bd097b0 · bd097b0
1 parent 4363ad1
commit bd097b0
Show file tree

Hide file tree

Showing 22 changed files with 153 additions and 175 deletions.
diff --git a/GitX.xcodeproj/project.pbxproj b/GitX.xcodeproj/project.pbxproj
diff --git a/PBWebChangesController.m b/PBWebChangesController.m
@@ -12,7 +12,7 @@ @implementation PBWebChangesController
 
 - (void) awakeFromNib
 {
-	startFile = @"diff";
+	startFile = @"commit";
 	[super awakeFromNib];
 
 	[unstagedFilesController addObserver:self forKeyPath:@"selection" options:0 context:@"UnstagedFileSelected"];

diff --git a/PBWebController.m b/PBWebController.m
@@ -15,7 +15,9 @@ @implementation PBWebController
 
 - (void) awakeFromNib
 {
-	NSString* file = [[NSBundle mainBundle] pathForResource:startFile ofType:@"html"];
+	NSString *path = [NSString stringWithFormat:@"html/views/%@", startFile];
+	NSString* file = [[NSBundle mainBundle] pathForResource:@"index" ofType:@"html" inDirectory:path];
+	NSLog(@"path: %@, file: %@", path, file);
 	NSURLRequest * request = [NSURLRequest requestWithURL:[NSURL fileURLWithPath:file]];
 
 	finishedLoading = NO;

diff --git a/PBWebDiffController.m b/PBWebDiffController.m
@@ -13,7 +13,7 @@ @implementation PBWebDiffController
 
 - (void) awakeFromNib
 {
-	startFile = @"simpleDiff";
+	startFile = @"diff";
 	[super awakeFromNib];
 	[diffController addObserver:self forKeyPath:@"diff" options:0 context:@"ChangedDiff"];
 }

diff --git a/PBWebHistoryController.m b/PBWebHistoryController.m
@@ -24,7 +24,7 @@ @implementation PBWebHistoryController
 
 - (void) awakeFromNib
 {
-	startFile = @"commit";
+	startFile = @"history";
 	[super awakeFromNib];
 	[historyController addObserver:self forKeyPath:@"webCommit" options:0 context:@"ChangedCommit"];
 }

diff --git a/html/css/GitX.css b/html/css/GitX.css
@@ -0,0 +1 @@
+@import url("diff.css");
diff --git a/html/diff_style.css → html/css/diff.css b/html/diff_style.css → html/css/diff.css
@@ -29,13 +29,6 @@ pre code {
   width: 100%;
 }
 
-#message {
-	margin: 5px;
-	margin-left: 20px;
-	font-family: Monaco;
-	width: auto;
-}
-
 #CurrentHunk {
 	border-left: 5px solid black;
 }

diff --git a/html/diff.html b/html/diff.html
diff --git a/html/diff.js b/html/diff.js
diff --git a/Images/spinner.gif → html/images/spinner.gif b/Images/spinner.gif → html/images/spinner.gif
diff --git a/html/GitX.js → html/lib/GitX.js b/html/GitX.js → html/lib/GitX.js
@@ -24,4 +24,23 @@ Array.prototype.indexOf = function(item, i) {
   for (; i < length; i++)
     if (this[i] === item) return i;
   return -1;
-};
+};
+
+var notify = function(text, state) {
+	var n = $("notification");
+	n.style.display = "";
+	$("notification_message").innerHTML = text;
+
+	// Change color
+	if (!state) { // Busy
+		$("spinner").style.display = "";
+		n.setAttribute("class", "");
+	}
+	else if (state == 1) { // Success
+		$("spinner").style.display = "none";
+		n.setAttribute("class", "success");
+	} else if (state == -1) {// Fail
+		$("spinner").style.display = "none";
+		n.setAttribute("class", "fail");
+	}
+}
diff --git a/html/diffHighlighter.js → html/lib/diffHighlighter.js b/html/diffHighlighter.js → html/lib/diffHighlighter.js
diff --git a/html/keyboardNavigation.js → html/lib/keyboardNavigation.js b/html/keyboardNavigation.js → html/lib/keyboardNavigation.js
diff --git a/html/md5.js → html/lib/md5.js b/html/md5.js → html/lib/md5.js
diff --git a/html/simpleDiff.html b/html/simpleDiff.html
diff --git a/html/views/commit/commit.css b/html/views/commit/commit.css
@@ -0,0 +1,19 @@
+body {
+	padding: 0px;
+	margin: 0px;
+	margin-top: 20px;
+}
+
+#title {
+	padding: 0px;
+	padding-left: 5px;
+	border-bottom: 1px solid black;
+	margin: 0px;
+	font-weight: 500;
+	background-color: #ECF3FD;
+	font-size: 100%;
+	position: fixed;
+	font-family: Helvetica;
+	top: 0px;
+	width: 100%;
+}
diff --git a/html/views/commit/commit.js b/html/views/commit/commit.js
@@ -0,0 +1,25 @@
+var showFileChanges = function(file, cached) {
+	// New file?
+	var diff = $("diff");
+
+	if (file.status == 0)
+	{
+		var contents = file.unstagedChanges();
+		if (contents)
+			diff.innerHTML = contents.escapeHTML();
+		else
+			diff.innerHTML = "Could not display changes";
+
+		diff.style.display= '';
+		$('title').innerHTML = "New file: " + file.path;
+	}  else {
+		diff.style.display = 'none';
+		if (cached)
+			diff.innerHTML = file.cachedChangesAmend_(Controller.amend()).escapeHTML();
+		else
+			diff.innerHTML = file.unstagedChanges().escapeHTML();
+		highlightDiffs();
+		diff.style.display = '';
+		$("title").innerHTML = "Changes for " + file.path;
+	}
+}
diff --git a/html/views/commit/index.html b/html/views/commit/index.html
@@ -0,0 +1,27 @@
+<html>
+<head>
+	<title>Diff for file</title>
+	<link rel="stylesheet" href="../../css/GitX.css" type="text/css" media="screen" title="no title" charset="utf-8">
+	<script src="../../lib/GitX.js" type="text/javascript" charset="utf-8"></script>
+	<script src="../../lib/md5.js" type="text/javascript" charset="utf-8"></script>
+	<script src="../../lib/diffHighlighter.js" type="text/javascript" charset="utf-8"></script>
+	<script src="../../lib/keyboardNavigation.js" type="text/javascript" charset="utf-8"></script>
+
+	<link rel="stylesheet" href="commit.css" type="text/css" media="screen" title="no title" charset="utf-8">
+	<script src="commit.js" type="text/javascript" chahrset="utf-8"></script>
+</head>
+
+<body>
+	<h1 id='title'>Nothing to commit</h1>
+
+	<div id="notification" style="display:none;">
+		<img src="../../images/spinner.gif" alt="Spinner" id="spinner"></img>
+		<div id="notification_message"></div>
+	</div>
+
+	<pre>
+		<code class="diffcode" id='diff'>
+			Nothing to commit (working directory clean)
+		</code>
+	</pre>
+</body>
diff --git a/html/views/diff/index.html b/html/views/diff/index.html
@@ -0,0 +1,21 @@
+<html>
+<head>
+	<title>Details for commit</title>
+	<link rel="stylesheet" href="../../css/GitX.css" type="text/css" media="screen" title="no title" charset="utf-8">
+	<script src="../../lib/GitX.js" type="text/javascript" charset="utf-8"></script>
+	<script src="../../lib/md5.js" type="text/javascript" charset="utf-8"></script>
+	<script src="../../lib/diffHighlighter.js" type="text/javascript" charset="utf-8"></script>
+	<script src="../../lib/keyboardNavigation.js" type="text/javascript" charset="utf-8"></script>
+
+	<script type="text/javascript" charset="utf-8">
+		var showDiff = function(diff) {
+			document.getElementById("details").innerHTML = diff.escapeHTML();
+			highlightDiffs();
+		}
+	</script>
+</head>
+
+<body>
+	<pre><code class="diffcode" id='details'>
+	</code></pre>
+</body>
diff --git a/html/commits.css → html/views/history/history.css b/html/commits.css → html/views/history/history.css
@@ -79,8 +79,10 @@ a.servicebutton{
 }
 
 #message {
-	font-family: Helvetica;
-	margin-left: 0px;
+	font-family: Monaco;
+	margin: 5px;
+	margin-left: 20px;
+	width: auto;
 	font-size: 12px;
 }
 

diff --git a/html/commit.js → html/views/history/history.js b/html/commit.js → html/views/history/history.js
@@ -37,25 +37,6 @@ var Commit = function(obj) {
 	}
 };
 
-var notify = function(text, state) {
-	var n = $("notification");
-	n.style.display = "";
-	$("notification_message").innerHTML = text;
-
-	// Change color
-	if (!state) { // Busy
-		$("spinner").style.display = "";
-		n.setAttribute("class", "");
-	}
-	else if (state == 1) { // Success
-		$("spinner").style.display = "none";
-		n.setAttribute("class", "success");
-	} else if (state == -1) {// Fail
-		$("spinner").style.display = "none";
-		n.setAttribute("class", "fail");
-	}
-}
-
 var gistie = function() {
 	notify("Uploading code to Gistie..", 0);
 

diff --git a/html/commit.html → html/views/history/index.html b/html/commit.html → html/views/history/index.html
@@ -1,13 +1,14 @@
 <html>
 <head>
 	<title>Details for commit</title>
-	<link rel="stylesheet" href="commits.css" type="text/css" media="screen" title="no title" charset="utf-8">
-	<link rel="stylesheet" href="diff_style.css" type="text/css" media="screen" title="no title" charset="utf-8">
-	<script src="GitX.js" type="text/javascript" charset="utf-8"></script>
-	<script src="md5.js" type="text/javascript" charset="utf-8"></script>
-	<script src="commit.js" type="text/javascript" charset="utf-8"></script>
-	<script src="diffHighlighter.js" type="text/javascript" charset="utf-8"></script>
-	<script src="keyboardNavigation.js" type="text/javascript" charset="utf-8"></script>
+	<link rel="stylesheet" href="../../css/GitX.css" type="text/css" media="screen" title="no title" charset="utf-8">
+	<script src="../../lib/GitX.js" type="text/javascript" charset="utf-8"></script>
+	<script src="../../lib/md5.js" type="text/javascript" charset="utf-8"></script>
+	<script src="../../lib/diffHighlighter.js" type="text/javascript" charset="utf-8"></script>
+	<script src="../../lib/keyboardNavigation.js" type="text/javascript" charset="utf-8"></script>
+
+	<link rel="stylesheet" href="history.css" type="text/css" media="screen" title="no title" charset="utf-8">
+	<script src="history.js" type="text/javascript" charset="utf-8"></script>
 </head>
 
 <body style="padding: 0px; border: 0px">
@@ -42,7 +43,7 @@
 	</tr>
 	</table>
 	<div id="notification" style="display:none;">
-		<img src="spinner.gif" alt="Spinner" id="spinner"></img>
+		<img src="../../images/spinner.gif" alt="Spinner" id="spinner"></img>
 		<div id="notification_message"></div>
 	</div>
 	<hr>