1 files changed, 69 insertions, 7 deletions

diff --git a/module/web/templates/default/package_ui.js b/module/web/templates/default/package_ui.js
index 5f39710c1..759412621 100644
--- a/module/web/templates/default/package_ui.js
+++ b/module/web/templates/default/package_ui.js
@@ -1,5 +1,13 @@
 //{% load i18n %}
-var load; // populate later
+var load, pack_box;
+
+document.addEvent("domready", function(){
+    load = new Fx.Tween($("load-indicator"), {link: "cancel"});
+    pack_box = new Fx.Tween($('pack_box'));
+    $('pack_reset').addEvent('click', function(){
+        hide_pack()
+    });
+});
 
 function indicateLoad() {
     //$("load-indicator").reveal();
@@ -10,6 +18,19 @@ function indicateFinish() {
     load.start("opacity", 0)
 }
 
+function show_pack(){
+    bg_show();
+    $("pack_box").setStyle('display', 'block');
+    pack_box.start('opacity',1)
+}
+
+function hide_pack(){
+    bg_hide();
+    pack_box.start('opacity',0).chain(function(){
+        $('pack_box').setStyle('display', 'none');
+    });
+}
+
 var PackageUI = new Class({
     initialize: function(url, type) {
         this.url = url;
@@ -22,7 +43,7 @@ var PackageUI = new Class({
             clone: true,
             revert: true,
             opacity: 0.4,
-            handle: ".packagename",
+            handle: ".package_drag",
             onStart: this.startSort,
             onComplete: this.saveSort.bind(this)
         });
@@ -102,11 +123,18 @@ var Package = new Class({
     parseElement: function() {
         var imgs = this.ele.getElements('img');
 
-        imgs[0].addEvent('click', this.deletePackage.bind(this));
+        this.name = this.ele.getElements('.name')[0];
+        this.folder = this.ele.getElements('.folder')[0];
+        this.password = this.ele.getElements('.password')[0];
+        this.prio = this.ele.getElements('.prio')[0];
 
-        imgs[1].addEvent('click', this.restartPackage.bind(this));
+        imgs[1].addEvent('click', this.deletePackage.bind(this));
 
-        imgs[2].addEvent('click', this.movePackage.bind(this));
+        imgs[2].addEvent('click', this.restartPackage.bind(this));
+
+        imgs[3].addEvent('click', this.editPackage.bind(this));
+
+        imgs[4].addEvent('click', this.movePackage.bind(this));
 
         this.ele.getElement('.packagename').addEvent('click', this.toggle.bind(this));
 
@@ -137,8 +165,8 @@ var Package = new Class({
             html += "<span class='child_status'>{statusmsg}</span>{error}&nbsp;".substitute({"statusmsg": link.statusmsg, "error":link.error});
             html += "<span class='child_status'>{format_size}</span>".substitute({"format_size": link.format_size});
             html += "<span class='child_status'>{plugin}</span>&nbsp;&nbsp;".substitute({"plugin": link.plugin});
-            html += "<img title='{% trans "Delete Link" %}' style='cursor: pointer;' width='10px' height='10px' src='{{ MEDIA_URL }}img/delete.png' />&nbsp;&nbsp;"
-            html += "<img title='{% trans "Restart Link" %}' style='cursor: pointer;margin-left: -4px' width='10px' height='10px' src='{{ MEDIA_URL }}img/arrow_refresh.png' /></div>"
+            html += "<img title='{% trans "Delete Link" %}' style='cursor: pointer;' width='10px' height='10px' src='{{ MEDIA_URL }}img/delete.png' />&nbsp;&nbsp;";
+            html += "<img title='{% trans "Restart Link" %}' style='cursor: pointer;margin-left: -4px' width='10px' height='10px' src='{{ MEDIA_URL }}img/arrow_refresh.png' /></div>";
 
             var div = new Element("div",{
                 "id": "file_"+link.id,
@@ -251,6 +279,40 @@ var Package = new Class({
         event.stop();
     },
 
+
+    editPackage: function(event){
+        $("pack_form").removeEvents("submit");
+        $("pack_form").addEvent("submit", this.savePackage.bind(this));
+
+        $("pack_id").set("value", this.id);
+        $("pack_name").set("value", this.name.get("text"));
+        $("pack_folder").set("value", this.folder.get("text"));
+        $("pack_pws").set("value", this.password.get("text"));
+
+        var prio = 3;
+        $("pack_prio").getChildren("option").each(function(item, index){
+           item.erase("selected");
+            if (prio.toString() == this.prio.get("text")){
+                item.set("selected","selected");
+            }
+            prio--;
+        }.bind(this));
+
+
+        show_pack();
+        event.stop();
+    },
+
+    savePackage: function(event){
+        $("pack_form").send();
+        this.name.set("text", $("pack_name").get("value"));
+        this.folder.set("text", $("pack_folder").get("value"));
+        this.password.set("text", $("pack_pws").get("value"));
+        this.prio.set("text", $("pack_prio").get("value"));
+        hide_pack();
+        event.stop();
+    },
+
     saveSort: function(ele, copy) {
         var order = [];
         this.sorts.serialize(function(ele,pos){