begin testing gears, redesigning the add torrent window

deluge/ui/webui/templates/ajax/index.html

@@ -8,6 +8,7 @@
 		<link rel="stylesheet" type="text/css" href="$base/template_style.css" />
 		<script src="$base/template/static/js/mootools-1.2-core.js" type="text/javascript"></script>
 		<script src="$base/template/static/js/mootools-1.2-more.js" type="text/javascript"></script>
+		<script src="$base/template/static/js/gears_init.js" type="text/javascript"></script>
 		<script src="$base/template/static/js/Rpc.js" type="text/javascript"></script>
 		<script src="$base/template/static/js/mooui.js" type="text/javascript"></script>
 		<script src="$base/template/static/js/deluge.js" type="text/javascript"></script>

deluge/ui/webui/templates/ajax/render/html/create_torrent_info.html

@@ -1,4 +1,2 @@
-<fieldset>
+<label>Author:</label><input type="text" /><br/>
-    <label>Author:</label><input type="text" /><br/>
+<label>Comments:</label><input type="text" />
-    <label>Comments:</label><input type="text" />
-</fieldset>

deluge/ui/webui/templates/ajax/render/html/window_add_torrent.html

@@ -1,15 +1,15 @@
-<form id="addFromFile">
+<h3>Torrents</h3>
-	<fieldset>
+<select />
-		<legend>$_('From File')</legend>
+<div id="addButtons">
-		<label for="torrentFile">$_('Torrent File'):</label><input type="file" id="file" name="file" accept="application/x-bittorrent" /><br/>
+    <button class="file">File</button>
-		<input type="submit" value="$_('Add')!" name="submit" class="deluge_button" />
+    <button class="url">Url</button>
-	</fieldset>
+    <button class="infohash">Infohash</button>
-</form>
+    <button class="remove">Remove</button>
-
+</div>
-<form id="addFromUrl">
+<form>
-	<fieldset>
+    <div id="tabs" class="moouiTabs"></div>
-		<legend>$_('From Url')</legend>
-		<label for="torrentUrl">$_('Torrent Url'):</label><input type="text" id="url" name="url" /><br/>
-		<input type="submit" value="$_('Add')!" name="submit" class="deluge_button" />
-	</fieldset>
 </form>
+<div id="buttons">
+    <button id="cancel">Cancel</button>
+    <button id="save">Save</button>
+</div>

deluge/ui/webui/templates/ajax/render/html/window_create_torrent.html

@@ -1,13 +1,14 @@
 <h3>Files</h3>
 <table id="createTorrentFiles">
 </table>
+<div id="browse">
+    <button class="file">File</button>
+    <button class="folder">Folder</button>
+</div>
 <form>
-    <div id="createTorrentTabs">
+    <div id="tabs" class="moouiTabs"></div>
-        
-    </div>
-    <br style="clear: both;" />
-    <div id="createButtons">
-        <button class="delugeButton">Cancel</button>
-        <button class="delugeButton">Save</button>
-    </div>
 </form>
+<div id="buttons">
+    <button id="cancel">Cancel</button>
+    <button id="save">Save</button>
+</div>

deluge/ui/webui/templates/ajax/render/js/deluge-strings.js

@@ -53,3 +53,6 @@ Deluge.Strings.add('Move Storage', '$_('Move Storage')');
 Deluge.Strings.add('Add Torrents', '$_('Add Torrents')');
 Deluge.Strings.add('Create Torrent', '$_('Create Torrent')');
 Deluge.Strings.add('Torrents Window', '$_('Torrents Window')');
+Deluge.Strings.add('From Url', '$_('From Url')');
+Deluge.Strings.add('Ok', '$_('Ok')');
+Deluge.Strings.add('Cancel', '$_('Cancel')');

deluge/ui/webui/templates/ajax/static/js/deluge-add.js

@@ -20,14 +20,61 @@ Deluge.Widgets.AddWindow = new Class({
         this.addEvent('loaded', this.loaded.bindWithEvent(this));
     },
     
-    loaded: function(event) {
+    loaded: function(e) {
-        this.formfile = this.content.getChildren()[0];
+        this.urlWindow = new Deluge.Widgets.AddTorrent.Url();
-        this.formurl = this.content.getChildren()[1];
+        
-        this.formurl.addEvent('submit', function(e) {
+        this.urlButton = this.content.getElement('button.url');
-            e.stop();
+        this.urlButton.addEvent('click', function(e) {
-            Deluge.Client.add_torrent_url(this.formurl.url.value, {});
+            this.urlWindow.show();
-            this.hide();
+        }.bindWithEvent(this));
-        }.bindWithEvent(this))
+    }
+});
+
+Deluge.Widgets.AddTorrent = {}
+
+Deluge.Widgets.AddTorrent.Url = new Class({
+    Extends: Widgets.Window,
+    
+    options: {
+        width: 300,
+        height: 100,
+        title: Deluge.Strings.get('From Url')
+    },
+    
+    initialize: function() {
+        this.parent();
+        this.bound = {
+            onOkClick: this.onOkClick.bindWithEvent(this),
+            onCancelClick: this.onCancelClick.bindWithEvent(this)
+        };
+        
+        this.form = new Element('form');
+        this.urlInput = new Element('input', {
+            type: 'text'
+        });
+        this.okButton = new Element('button');
+        this.okButton.set('text', Deluge.Strings.get('Ok'));
+        this.cancelButton = new Element('button');
+        this.cancelButton.set('text', Deluge.Strings.get('Cancel'));
+        this.form.grab(new Element('label').set('text', 'Url'));
+        this.form.grab(this.urlInput).grab(new Element('br'));
+        this.form.grab(this.okButton).grab(this.cancelButton);
+        this.content.grab(this.form);
+        
+        this.okButton.addEvent('click', this.bound.onOkClick);
+        this.cancelButton.addEvent('click', this.bound.onCancelClick);
+    },
+    
+    onOkClick: function(e) {
+        var url = this.urlInput.get('value');
+        Deluge.Client.add_torrent_url(url, {});
+        e.stop();
+    },
+    
+    onCancelClick: function(e) {
+        this.urlInput.set('value', '');
+        this.hide();
+        e.stop();
     }
 });
 
@@ -43,12 +90,32 @@ Deluge.Widgets.CreateTorrent = new Class({
     
     initialize: function() {
         this.parent();
-        this.addEvent('loaded', this.loaded.bindWithEvent(this));
+        this.bound = {
+            onLoad: this.onLoad.bindWithEvent(this),
+            onFileClick: this.onFileClick.bindWithEvent(this),
+            onFilesPicked: this.onFilesPicked.bind(this)
+        }
+        this.addEvent('loaded', this.bound.onLoad);
     },
     
-    loaded: function(event) {
+    onLoad: function(e) {
-        this.tabs = new Deluge.Widgets.CreateTorrent.Tabs(this.content.getElement('div'));
+        this.tabs = new Deluge.Widgets.CreateTorrent.Tabs(this.content.getElement('.moouiTabs'));
-        this.content.addClass('createTorrent');
+        this.fileButton = this.content.getElement('button.file');
+        this.folderButton = this.content.getElement('button.folder');
+        this.content.id = 'createTorrent';
+        
+        this.fileButton.addEvent('click', this.bound.onFileClick);
+    },
+    
+    onFileClick: function(e) {
+        var desktop = google.gears.factory.create('beta.desktop');
+        desktop.openFiles(this.onFilesPicked.bind(this));
+    },
+    
+    onFilesPicked: function(files) {
+        for (var i = 0; i < files.length; i++) {
+            alert(files[i].blob);
+        };
     }
 });
 

deluge/ui/webui/templates/ajax/static/js/gears_init.js

@@ -0,0 +1,87 @@
+// Copyright 2007, Google Inc.
+//
+// Redistribution and use in source and binary forms, with or without
+// modification, are permitted provided that the following conditions are met:
+//
+//  1. Redistributions of source code must retain the above copyright notice,
+//     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.
+//  3. Neither the name of Google Inc. nor the names of its contributors may be
+//     used to endorse or promote products derived from this software without
+//     specific prior written permission.
+//
+// THIS SOFTWARE IS PROVIDED BY THE AUTHOR ``AS IS'' AND ANY EXPRESS OR IMPLIED
+// WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
+// MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO
+// EVENT SHALL THE AUTHOR BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+// SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
+// PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS;
+// OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY,
+// WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
+// OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF
+// ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+//
+// Sets up google.gears.*, which is *the only* supported way to access Gears.
+//
+// Circumvent this file at your own risk!
+//
+// In the future, Gears may automatically define google.gears.* without this
+// file. Gears may use these objects to transparently fix bugs and compatibility
+// issues. Applications that use the code below will continue to work seamlessly
+// when that happens.
+
+(function() {
+  // We are already defined. Hooray!
+  if (window.google && google.gears) {
+    return;
+  }
+
+  var factory = null;
+
+  // Firefox
+  if (typeof GearsFactory != 'undefined') {
+    factory = new GearsFactory();
+  } else {
+    // IE
+    try {
+      factory = new ActiveXObject('Gears.Factory');
+      // privateSetGlobalObject is only required and supported on WinCE.
+      if (factory.getBuildInfo().indexOf('ie_mobile') != -1) {
+        factory.privateSetGlobalObject(this);
+      }
+    } catch (e) {
+      // Safari
+      if ((typeof navigator.mimeTypes != 'undefined')
+           && navigator.mimeTypes["application/x-googlegears"]) {
+        factory = document.createElement("object");
+        factory.style.display = "none";
+        factory.width = 0;
+        factory.height = 0;
+        factory.type = "application/x-googlegears";
+        document.documentElement.appendChild(factory);
+      }
+    }
+  }
+
+  // *Do not* define any objects if Gears is not installed. This mimics the
+  // behavior of Gears defining the objects in the future.
+  if (!factory) {
+    return;
+  }
+
+  // Now set up the objects, being careful not to overwrite anything.
+  //
+  // Note: In Internet Explorer for Windows Mobile, you can't add properties to
+  // the window object. However, global objects are automatically added as
+  // properties of the window object in all browsers.
+  if (!window.google) {
+    google = {};
+  }
+
+  if (!google.gears) {
+    google.gears = {factory: factory};
+  }
+})();
+

deluge/ui/webui/templates/ajax/static/themes/classic/style.css

@@ -200,7 +200,7 @@ ul.moouiMenu li.moouiMenuSep:hover {
 }
 
 .moouiWindow {
-	background: #304663;
+	background: #37506f;
 	border: 1px solid #1c2431;
 }
 
@@ -253,7 +253,7 @@ form .disabled {
 	color: Gray;
 }
 
-form .deluge_button, button.deluge_button, button.delugeButton  {
+form .deluge_button, button  {
 	background-color: #37506f;
 	border:1px solid #68a;
 	cursor: pointer;
@@ -265,7 +265,7 @@ form .deluge_button, button.deluge_button, button.delugeButton  {
 	margin: 2px;
 }
 
-form .deluge_button:hover, button.deluge_button:hover, button.delugeButton:hover {
+form .deluge_button:hover, button:hover {
 	background-color:#68a;
 }
 
@@ -359,6 +359,10 @@ label.fluid {
     margin: 2px;
 }
 
+#createTorrent h3 {
+    margin-bottom: 0px;
+}
+
 #createTorrentTabs .moouiTabPage {
     height: 110px;
 }
@@ -369,8 +373,13 @@ label.fluid {
     margin: 0;
 }
 
+#fileButton #folderButton {
+    margin: 0 auto 10px auto;
+    text-align: center;
+}
+
 #createTorrentFiles {
-    height: 110px;
+    height: 90px;
     width: 370px;
     margin: 10px;
     border:1px solid #23344b;