worked on web-ui

6 files changed, 51 insertions, 24 deletions

diff --git a/module/web/static/css/default/style.less b/module/web/static/css/default/style.less
index d7be7289b..93a017fba 100644
--- a/module/web/static/css/default/style.less
+++ b/module/web/static/css/default/style.less
@@ -139,6 +139,10 @@ a:hover {
   -webkit-font-smoothing: antialiased;

 }

 

+.label-info, .badge-info {

+  background-color: @blue;

+}

+

 /*

     Header

 */

@@ -406,6 +410,7 @@ footer h2 {
   font-weight: bold;

   border-radius: 5px;

   line-height: 28px;

+  cursor: pointer;

 }

 

 .package-view > div:hover {

@@ -416,6 +421,7 @@ footer h2 {
   display: inline-block;

   height: 100%;

   padding-left: 8px;

+  padding-right: 8px;

 }

 

 .package-row.first {

@@ -425,7 +431,7 @@ footer h2 {
 .package-row.second {

   width: 30%;

   .gradient(top, @blueDark, @blueDarker);

-

+  font-size: smaller;

 }

 

 .package-view a {

@@ -464,8 +470,12 @@ footer h2 {
   display: inline-block;

   height: 100%;

   padding-left: 8px;

+  padding-right: 8px;

 }

 

 .file-row.first {

   width: 50%;

 }

+.file-row.second {

+  width: 30%;

+}

diff --git a/module/web/static/js/views/abstract/itemView.js b/module/web/static/js/views/abstract/itemView.js
index 993764d3e..a8cb14e7d 100644
--- a/module/web/static/js/views/abstract/itemView.js
+++ b/module/web/static/js/views/abstract/itemView.js
@@ -24,11 +24,15 @@ define(['jquery', 'backbone', 'underscore'], function($, Backbone, _) {
             this.$el.zapIn();
         },
 
-        load: function() {
+        load: function(e) {
+            if(e)
+                e.stopPropagation();
             this.model.fetch();
         },
 
-        delete: function() {
+        delete: function(e) {
+            if(e)
+                e.stopPropagation();
             this.model.destroy();
         }
 
diff --git a/module/web/static/js/views/packageTreeView.js b/module/web/static/js/views/packageTreeView.js
index f746bf0a3..516c2f5d1 100644
--- a/module/web/static/js/views/packageTreeView.js
+++ b/module/web/static/js/views/packageTreeView.js
@@ -64,7 +64,7 @@ define(['jquery', 'backbone', 'underscore', 'models/TreeCollection', 'views/pack
                     type: 'POST',
                     data: {
                         name: JSON.stringify($('#name').val()),
-                        links: JSON.stringify(['http://download.pyload.org/random.bin'])
+                        links: JSON.stringify(['http://download.pyload.org/random.bin', 'invalid link'])
                     },
                     success: function() {
                         self.tree.fetch({success: function() {
diff --git a/module/web/static/js/views/packageView.js b/module/web/static/js/views/packageView.js
index 6a7e3cc65..a0de18827 100644
--- a/module/web/static/js/views/packageView.js
+++ b/module/web/static/js/views/packageView.js
@@ -8,7 +8,7 @@ define(['jquery', 'views/abstract/itemView', 'underscore', 'views/fileView', 'ut
         className: 'package-view',
         template: _.template($("#template-package").html()),
         events: {
-            'click .load': 'load',
+            'click .package-header': 'load',
             'click .delete': 'delete',
             'click .show-dialog': 'show_dialog'
         },
@@ -28,6 +28,8 @@ define(['jquery', 'views/abstract/itemView', 'underscore', 'views/fileView', 'ut
         },
 
         render: function() {
+
+            // TODO: on expanding don't re-render
             this.$el.html(this.template(this.model.toJSON()));
 
             var data = [
@@ -54,7 +56,9 @@ define(['jquery', 'views/abstract/itemView', 'underscore', 'views/fileView', 'ut
             });
         },
 
-        show_dialog: function() {
+        show_dialog: function(e) {
+            console.log(e);
+            e.stopPropagation();
             var self = this;
             this.requireOnce(['views/modal/modalView'], function(modalView){
                 if (self.modal === null)
diff --git a/module/web/templates/default/base.html b/module/web/templates/default/base.html
index d948a404a..2b50cc2ad 100644
--- a/module/web/templates/default/base.html
+++ b/module/web/templates/default/base.html
@@ -37,10 +37,10 @@
         </div>

         <div class="right">

             {% if user %}

-{#                <div class="btn-group btn-group-vertical">#}

-{#                    <a class="btn btn-mini" href="#"><i class="icon-align-left"></i></a>#}

-{#                    <a class="btn btn-mini" href="#"><i class="icon-align-center"></i></a>#}

-{#                </div>#}

+                {#                <div class="btn-group btn-group-vertical">#}

+                {#                    <a class="btn btn-mini" href="#"><i class="icon-align-left"></i></a>#}

+                {#                    <a class="btn btn-mini" href="#"><i class="icon-align-center"></i></a>#}

+                {#                </div>#}

                 <div id="notification_div">

                     <span class="label label-info" style="position: absolute; left: 0;">O Msg.</span>

                     <span class="label label-success" style="position: absolute; right: 0;">Started</span>

@@ -50,8 +50,12 @@
                     </div>

                 </div>

 

-                <div class="header_block" style="margin-top: 16px;">

-                    <div class="btn-group">

+                <div class="header_block">

+                    <span class="label label-info"

+                          style="width: 100%; display: inline-block; text-align: center">

+                        Info

+                    </span>

+                    <div class="btn-group" style="margin-top: 5px">

                         <a class="btn btn-blue btn-small" href="#"><i class="icon-user icon-white"></i> User</a>

                         <a class="btn btn-blue btn-small dropdown-toggle" data-toggle="dropdown" href="#"><span

                                 class="caret"></span></a>

@@ -63,13 +67,13 @@
                             <li><a href="#"><i class="i"></i> Make admin</a></li>

                         </ul>

                     </div>

-{#                    <div class="btn-toolbar">#}

-{#                        <div class="btn-group">#}

-{#                            <a class="btn btn-mini" href="#"><i class="icon-align-left"></i></a>#}

-{#                            <a class="btn btn-mini" href="#"><i class="icon-align-center"></i></a>#}

-{#                            <a class="btn btn-mini" href="#"><i class="icon-align-right"></i></a>#}

-{#                        </div>#}

-{#                    </div>#}

+                    {#                    <div class="btn-toolbar">#}

+                    {#                        <div class="btn-group">#}

+                    {#                            <a class="btn btn-mini" href="#"><i class="icon-align-left"></i></a>#}

+                    {#                            <a class="btn btn-mini" href="#"><i class="icon-align-center"></i></a>#}

+                    {#                            <a class="btn btn-mini" href="#"><i class="icon-align-right"></i></a>#}

+                    {#                        </div>#}

+                    {#                    </div>#}

                 </div>

                 <div id="speedgraph"></div>

                 <div class="header_block">

diff --git a/module/web/templates/default/dashboard.html b/module/web/templates/default/dashboard.html
index 67b3b8483..2ce97635e 100644
--- a/module/web/templates/default/dashboard.html
+++ b/module/web/templates/default/dashboard.html
@@ -9,19 +9,21 @@
 

 {% block head %}

     <script type="text/template" id="template-package">

-        <div>

+        <div class="package-header">

             <div class="package-row first">

                 Package <%= pid %>: <%= name %>

-                <div class="package-graph">3/5</div>

+                <div class="package-graph pull-right">3/5</div>

             </div>

             <div class="package-row second">

                 <span>

-                56 Files (xy Finished, z Active, t Total)

+                <%= stats.linkstotal %> Files (xy / z /t)

+                </span>

+                <span class="pull-right">

+                    <%= stats.sizedone %> / <%= stats.sizetotal %>

                 </span>

             </div>

 

             <div class="package-row third">

-                <a class="load"> Load</a>

                 <a class="delete"> Delete</a>

                 <a class="show-dialog"> Show</a>

             </div>

@@ -35,9 +37,13 @@
             </div>

             <div class="file-row second">

                 <%= download.statusmsg %>

+                <span class="pull-right">

+                    Size: <%= size %>

+                </span>

             </div>

 

             <div class="file-row third">

+                <%= download.plugin %>

             </div>

         </div>

     </script>

@@ -48,7 +54,6 @@
         <li>

             <ul class="breadcrumb">

                 <li><a href="#">{{ _("Home") }}</a> <span class="divider">/</span></li>

-                <li><a href="#">Library</a> <span class="divider">/</span></li>

                 <li class="active">Data</li>

             </ul>

         </li>