From fa392246ec57c59614e02645aa0fe74a0bd71ac7 Mon Sep 17 00:00:00 2001
From: Einar Egilsson
Date: Thu, 8 Oct 2009 08:03:15 +0000
Subject: UI refactoring and added skin

git-svn-id: http://einaregilsson.googlecode.com/svn/mozilla/redirector/trunk@256 119bf307-c92d-0410-89bd-8f53e6181181
---
 chrome/content/code/browserOverlay.xul.js   |   2 +-
 chrome/content/code/redirectList.xul.js     |  47 ++++------
 chrome/content/code/redirector.prototype.js |   2 +
 chrome/content/ui/editRedirect.xul          |  13 +--
 chrome/content/ui/redirectList.xul          | 137 ++++++++++++++++++----------
 5 files changed, 119 insertions(+), 82 deletions(-)

(limited to 'chrome/content')

diff --git a/chrome/content/code/browserOverlay.xul.js b/chrome/content/code/browserOverlay.xul.js
index 968e9c4..5c84859 100644
--- a/chrome/content/code/browserOverlay.xul.js
+++ b/chrome/content/code/browserOverlay.xul.js
@@ -81,7 +81,7 @@ var RedirectorOverlay = {
         } else {
             window.openDialog("chrome://redirector/content/ui/redirectList.xul",
                     windowName,
-                    "chrome,dialog,resizable=no,centerscreen", this);
+                    "chrome,dialog,resizable=yes,centerscreen", this);
         }
     
     },
diff --git a/chrome/content/code/redirectList.xul.js b/chrome/content/code/redirectList.xul.js
index 81dd4a4..c980178 100644
--- a/chrome/content/code/redirectList.xul.js
+++ b/chrome/content/code/redirectList.xul.js
@@ -9,6 +9,8 @@ var RedirectList = {
     lstRedirects: null,
     btnDelete   : null,
     btnEdit     : null,
+    btnUp		: null,
+    btnDown		: null,
 
     addItemsToListBox : function(items) {
 
@@ -22,9 +24,10 @@ var RedirectList = {
             newItem.getElementsByAttribute('name', 'dscrRedirectTo')[0].setAttribute('value', item.redirectUrl);
             var checkEnabled = newItem.getElementsByAttribute('name', 'chkEnabled')[0];
             checkEnabled.setAttribute('checked', !item.disabled);
+            newItem.setAttribute('class', item.disabled ? 'disabledRedirect' : '');
             newItem.item = item;
             this.lstRedirects.appendChild(newItem);
-            newItem.setAttribute('selected', false);
+            newItem.setAttribute('selected', false)
         }
         
         //Enable, disable functionality
@@ -35,11 +38,12 @@ var RedirectList = {
 			     	parent = parent.parentNode;   
 		        }
 		        parent.item.disabled = !ev.originalTarget.hasAttribute('checked');
+	            parent.setAttribute('class', parent.item.disabled ? 'disabledRedirect' : '');
 		        Redirector.save();
 	        }
         },false);
     },
-
+    
     onLoad : function() {
         try {
             this.lstRedirects = document.getElementById('lstRedirects');
@@ -48,6 +52,8 @@ var RedirectList = {
             this.lstRedirects.removeChild(this.template);
             this.btnDelete = document.getElementById('btnDelete');
             this.btnEdit = document.getElementById('btnEdit');
+            this.btnUp = document.getElementById('btnUp');
+            this.btnDown = document.getElementById('btnDown');
             this.addItemsToListBox(Redirector.list);
 	        this.strings = document.getElementById('redirector-strings');
         } catch(e) {
@@ -55,25 +61,6 @@ var RedirectList = {
         }
     },
 
-    openHelp : function() {
-        var windowName = 'redirectorHelp';
-        var windowsMediator = Cc["@mozilla.org/appshell/window-mediator;1"].getService(Ci.nsIWindowMediator);
-        var win;
-        var iter = windowsMediator.getEnumerator(null);
-        while (iter.hasMoreElements()) {
-            win = iter.getNext();
-            if (win.name == windowName) {
-                win.focus();
-                return;
-            }
-        }
-        window.openDialog("chrome://redirector/content/ui/help.html", windowName, "chrome,dialog,resizable=yes,location=0,toolbar=0,status=0,width=800px,height=600px,centerscreen", this);
-    },
-    
-    close : function() {
-        window.close();
-    },
-    
     moveUp : function(){
         if (this.lstRedirects.selectedIndex <= 0) {
             return;
@@ -89,14 +76,16 @@ var RedirectList = {
     },
 
     switchItems : function(firstIndex) {
-        var first = Redirector.list[firstIndex];
-        var second = Redirector.list[firstIndex+1];
-        Redirector.list[firstIndex] = second;
-        Redirector.list[firstIndex+1] = first;
-        this.setListItemValues(this.lstRedirects.children[firstIndex+1], first);
-        this.setListItemValues(this.lstRedirects.children[firstIndex], second);
-        this.lstRedirects.selectedIndex -= 1;
+        var firstRedirect = Redirector.list[firstIndex];
+        var secondRedirect = Redirector.list[firstIndex+1];
+        Redirector.list[firstIndex] = secondRedirect;
+        Redirector.list[firstIndex+1] = firstRedirect;
+        var firstItem = this.lstRedirects.children[firstIndex];
+        var secondItem = this.lstRedirects.children[firstIndex+1];
+        this.lstRedirects.removeChild(secondItem);
+        this.lstRedirects.insertBefore(secondItem, firstItem);
         Redirector.save();
+        this.selectionChange();
     }, 
     
     setListItemValues : function(listItem, item){
@@ -163,6 +152,8 @@ var RedirectList = {
 
         this.btnEdit.disabled = (index == -1);
         this.btnDelete.disabled = (index == -1);
+        this.btnUp.disabled = (index <= 0);
+        this.btnDown.disabled = (index == -1 || index >= Redirector.list.length-1);
     },
     
     importExport : function(mode, captionKey, func) {
diff --git a/chrome/content/code/redirector.prototype.js b/chrome/content/code/redirector.prototype.js
index 3f6c0fb..8218395 100644
--- a/chrome/content/code/redirector.prototype.js
+++ b/chrome/content/code/redirector.prototype.js
@@ -91,6 +91,7 @@ Redirector.prototype = {
 	        if (!aContext || !aContext.loadURI) {
 	            return nsIContentPolicy.ACCEPT;
 	        }
+		    this.debug("START: " + new Date().getTime());
 	        this.debug("Checking " + contentLocation.spec);
 	        
 	        var url = contentLocation.spec;
@@ -112,6 +113,7 @@ Redirector.prototype = {
         } catch(e) {
 	    	this.debug(e);   
         }
+	    this.debug("END: " + new Date().getTime());
         return nsIContentPolicy.ACCEPT;
     },
 
diff --git a/chrome/content/ui/editRedirect.xul b/chrome/content/ui/editRedirect.xul
index 22d4a8d..a8531ea 100644
--- a/chrome/content/ui/editRedirect.xul
+++ b/chrome/content/ui/editRedirect.xul
@@ -1,6 +1,7 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!-- $Id$ -->
 <?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
+<?xml-stylesheet href="chrome://redirector/skin/redirector.css" type="text/css"?>
 <!DOCTYPE dialog SYSTEM "chrome://redirector/locale/editRedirect.xul.dtd">
 <dialog title="&redirectWindow.title;"
         orient="vertical"
@@ -18,22 +19,22 @@
   </stringbundleset>
 
   <grid>
-    <rows>
+    <rows class="editRedirects">
       <row align="center">
-        <text value="&txtExampleUrl.label;" style="margin-top:6px;"/>
-        <textbox id="txtExampleUrl" style="width:400px;"/>
+        <text value="&txtExampleUrl.label;" />
+        <textbox id="txtExampleUrl" />
       </row>
       <row align="center">
-        <text value="&txtIncludePattern.label;" style="margin-top:6px;"/>
+        <text value="&txtIncludePattern.label;" />
         <textbox id="txtIncludePattern" taborder="1"/>
         <button id="btnTestPattern" label="&btnTestPattern.label;" onclick="EditRedirect.testPattern();" taborder="2"/>
       </row>
       <row align="center">
-        <text value="&txtExcludePattern.label;" style="margin-top:6px;"/>
+        <text value="&txtExcludePattern.label;" />
         <textbox id="txtExcludePattern" taborder="3"/>
       </row>
       <row align="center">
-        <text value="&txtRedirectUrl.label;" style="margin-top:6px;"/>
+        <text value="&txtRedirectUrl.label;" />
         <textbox id="txtRedirectUrl" taborder="4"/>
       </row>
       <row align="center">
diff --git a/chrome/content/ui/redirectList.xul b/chrome/content/ui/redirectList.xul
index 8317b15..3d5cdc2 100644
--- a/chrome/content/ui/redirectList.xul
+++ b/chrome/content/ui/redirectList.xul
@@ -1,6 +1,8 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!-- $Id -->
 <?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
+<?xml-stylesheet href="chrome://redirector/skin/redirector.css" type="text/css"?>
+
 <!DOCTYPE dialog SYSTEM "chrome://redirector/locale/redirectList.xul.dtd">
 <window title="&window.title;"
         orient="vertical"
@@ -12,51 +14,92 @@
 		xmlns:nc="http://home.netscape.com/NC-rdf#"
         xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
 
-  <script type="application/x-javascript" src="../code/redirect.js"/>
-  <script type="application/x-javascript" src="../code/redirectList.xul.js"/>
-  <stringbundleset id="stringbundleset">
-    <stringbundle id="redirector-strings" src="chrome://redirector/locale/redirector.properties"/>
-  </stringbundleset>
-
-  <vbox>
-      <richlistbox seltype="single" id="lstRedirects" style="margin-bottom:5px; border:solid 1px grey;" height="430px" ondblclick="RedirectList.editRedirect();" onselect="RedirectList.selectionChange();">
-        <richlistitem style="border-bottom:dotted 1px grey;" selected="false">
-            <grid>
-			    <cols>
-			    </cols>
-			    <rows>
-				    <row>
-		              <label style="font-weight:bold;" value="&colIncludePattern.label;:" />
-		              <description name="dscrIncludePattern" />
-				    </row>
-				    <row>
-		              <label style="font-weight:bold;" value="&colExcludePattern.label;:" />
-		              <description name="dscrExcludePattern" />
-				    </row>
-				    <row>
-		              <label style="font-weight:bold;" value="&colRedirectTo.label;:" />
-		              <description name="dscrRedirectTo" />
-				    </row>
-				    <row>
-		              <label style="font-weight:bold;" value="&colEnabled.label;:" />
-		              <hbox><checkbox checked="false" name="chkEnabled" label="" /> <spacer flex="1"/></hbox>
-				    </row>
-			    </rows>
-            </grid>
-        </richlistitem>
-      </richlistbox>
-      <hbox style="align:right;">
-        <button id="btnAdd" onclick="RedirectList.addRedirect();" label="&btnAdd.label;" disabled="false" />
-        <button id="btnEdit" onclick="RedirectList.editRedirect();" label="&btnEdit.label;" disabled="true" />
-        <button id="btnDelete" onclick="RedirectList.deleteRedirect();" label="&btnDelete.label;" disabled="true" />
-        <button id="btnImport" onclick="RedirectList.import();" label="&btnImport.label;"/>
-        <button id="btnExport" onclick="RedirectList.export();" label="&btnExport.label;"/>
-        <button id="btnHelp" onclick="RedirectList.openHelp();" label="&btnHelp.label;"/>
-        <button id="btnClose" onclick="RedirectList.close();" label="&btnClose.label;"/>
-        <!-- TODO: include in v2.0 
-        <button id="btnUp" onclick="RedirectList.moveUp();" label="UP" disabled="false" />
-        <button id="btnDown" onclick="RedirectList.moveDown();" label="Down" />
-        -->
-      </hbox>
-  </vbox>
+	<script type="application/x-javascript" src="../code/redirect.js"/>
+	<script type="application/x-javascript" src="../code/redirectList.xul.js"/>
+	<stringbundleset id="stringbundleset">
+		<stringbundle id="redirector-strings" src="chrome://redirector/locale/redirector.properties"/>
+	</stringbundleset>
+	<tabbox flex="1" >
+		<tabs>
+			<tab label="Redirects" />
+			<tab label="Preferences" />
+			<tab label="Import / Export" />
+			<tab label="Help" />
+		</tabs>
+		<tabpanels flex="1">
+			<tabpanel flex="1">
+				<vbox flex="1">
+					<richlistbox seltype="single" id="lstRedirects" flex="1" ondblclick="RedirectList.editRedirect();" onselect="RedirectList.selectionChange();">
+						<richlistitem class="redirectListItem" selected="false">
+							<grid>
+								<cols />
+								<rows class="redirectRows">
+									<row>
+										<label value="&colIncludePattern.label;:" />
+										<description name="dscrIncludePattern" />
+									</row>
+									<row>
+										<label value="&colExcludePattern.label;:" />
+										<description name="dscrExcludePattern" />
+									</row>
+									<row>
+										<label value="&colRedirectTo.label;:" />
+										<description name="dscrRedirectTo" />
+									</row>
+									<row>
+										<label value="&colEnabled.label;:" />
+										<hbox><checkbox checked="false" name="chkEnabled" label="" /> <spacer flex="1"/></hbox>
+									</row>
+								</rows>
+							</grid>
+						</richlistitem>
+					</richlistbox>
+					<hbox>
+						<button id="btnAdd" onclick="RedirectList.addRedirect();" label="&btnAdd.label;" disabled="false" />
+						<button id="btnEdit" onclick="RedirectList.editRedirect();" label="&btnEdit.label;" disabled="true" />
+						<button id="btnDelete" onclick="RedirectList.deleteRedirect();" label="&btnDelete.label;" disabled="true" />
+						<button id="btnUp" onclick="RedirectList.moveUp();" label="UP" disabled="false" />
+						<button id="btnDown" onclick="RedirectList.moveDown();" label="Down" />
+					</hbox>
+				</vbox>
+			</tabpanel>
+			<tabpanel>
+				<vbox flex="1">
+					<groupbox>
+						<caption label="General" />
+						<hbox>
+							<checkbox label="Enable Redirector" />
+							<spacer flex="1" />
+						</hbox>
+						<hbox>
+							<checkbox label="Show status bar icon" />
+							<spacer flex="1" />
+						</hbox>
+						<hbox>
+							<checkbox label="Show context menu" />
+							<spacer flex="1" />
+						</hbox>
+					</groupbox>
+					<groupbox>
+						<caption label="Debugging" />
+						<hbox>
+							<checkbox label="Enable debug output" />
+							<spacer flex="1" />
+						</hbox>
+					</groupbox>
+					<spacer flex="1" />
+				</vbox>
+			</tabpanel>
+			<tabpanel>
+				<vbox>
+					<button id="btnImport" onclick="RedirectList.import();" label="&btnImport.label;"/>
+					<button id="btnExport" onclick="RedirectList.export();" label="&btnExport.label;"/>
+					<spacer flex="1" />
+				</vbox>
+			</tabpanel>
+			<tabpanel>
+				<browser type="content" src="chrome://redirector/content/ui/help.html" flex="1" />
+			</tabpanel>
+		</tabpanels>
+	</tabbox>
 </window>
-- 
cgit v1.2.3-70-g09d2