Show folder contents with editable names.
authorTom Clegg <tom@curoverse.com>
Mon, 28 Apr 2014 23:30:35 +0000 (19:30 -0400)
committerTom Clegg <tom@curoverse.com>
Tue, 29 Apr 2014 00:12:47 +0000 (20:12 -0400)
apps/workbench/app/assets/javascripts/editable.js
apps/workbench/app/assets/stylesheets/application.css.scss
apps/workbench/app/assets/stylesheets/cards.css.scss [new file with mode: 0644]
apps/workbench/app/controllers/application_controller.rb
apps/workbench/app/controllers/groups_controller.rb
apps/workbench/app/helpers/application_helper.rb
apps/workbench/app/models/arvados_base.rb
apps/workbench/app/models/arvados_resource_list.rb
apps/workbench/app/models/collection.rb
apps/workbench/app/views/groups/show.html.erb

index e6799bf78b40d4a3b3ef0cb4cbcb3c764db82d4d..24da2866d7118852bb34fe68d8eed87f5e740dff 100644 (file)
@@ -1,4 +1,4 @@
-$.fn.editable.defaults.ajaxOptions = {type: 'put', dataType: 'json'};
+$.fn.editable.defaults.ajaxOptions = {type: 'post', dataType: 'json'};
 $.fn.editable.defaults.send = 'always';
 
 // Default for editing is popup.  I experimented with inline which is a little
@@ -13,8 +13,13 @@ $.fn.editable.defaults.params = function (params) {
     var a = {};
     var key = params.pk.key;
     a.id = params.pk.id;
-    a[key] = {};
+    a[key] = params.pk.defaults || {};
     a[key][params.name] = params.value;
+    if (params.pk._method) {
+        a['_method'] = params.pk._method;
+    } else {
+        a['_method'] = 'put';
+    }
     return a;
 };
 
@@ -24,6 +29,13 @@ $.fn.editable.defaults.validate = function (value) {
     }
 }
 
+$(document).
+    on('ready ajax:complete', function() {
+        $('#editable-submit').click(function() {
+            console.log($(this));
+        });
+    });
+
 $.fn.editabletypes.text.defaults.tpl = '<input type="text" name="editable-text">'
 
 $.fn.editableform.buttons = '\
index 455e4c0a9fa6cb13553cd121b5c64f427c8fbc90..ff97da8efdb35cdfb1bb647f3473bcf40e7221e8 100644 (file)
@@ -44,6 +44,10 @@ table.table-justforlayout {
     font-size: .8em;
     color: #888;
 }
+.arvados-uuid {
+    font-size: .8em;
+    font-family: monospace;
+}
 table .data-size, .table .data-size {
     text-align: right;
 }
diff --git a/apps/workbench/app/assets/stylesheets/cards.css.scss b/apps/workbench/app/assets/stylesheets/cards.css.scss
new file mode 100644 (file)
index 0000000..c9560ad
--- /dev/null
@@ -0,0 +1,85 @@
+.card {
+    padding-top: 20px;
+    margin: 10px 0 20px 0;
+    background-color: #ffffff;
+    border: 1px solid #d8d8d8;
+    border-top-width: 0;
+    border-bottom-width: 2px;
+    -webkit-border-radius: 3px;
+    -moz-border-radius: 3px;
+    border-radius: 3px;
+    -webkit-box-shadow: none;
+    -moz-box-shadow: none;
+    box-shadow: none;
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+}
+.card.arvados-object {
+    position: relative;
+    display: inline-block;
+    width: 170px;
+    height: 175px;
+    padding-top: 0;
+    margin-left: 20px;
+    overflow: hidden;
+    vertical-align: top;
+}
+.card.arvados-object .card-top.green {
+    background-color: #53a93f;
+}
+.card.arvados-object .card-top.blue {
+    background-color: #427fed;
+}
+.card.arvados-object .card-top {
+    position: absolute;
+    top: 0;
+    left: 0;
+    display: inline-block;
+    width: 170px;
+    height: 25px;
+    background-color: #ffffff;
+}
+.card.arvados-object .card-info {
+    position: absolute;
+    top: 25px;
+    display: inline-block;
+    width: 100%;
+    height: 101px;
+    overflow: hidden;
+    background: #ffffff;
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+}
+.card.arvados-object .card-info .title {
+    display: block;
+    margin: 8px 14px 0 14px;
+    overflow: hidden;
+    font-size: 16px;
+    font-weight: bold;
+    line-height: 18px;
+    color: #404040;
+}
+.card.arvados-object .card-info .desc {
+    display: block;
+    margin: 8px 14px 0 14px;
+    overflow: hidden;
+    font-size: 12px;
+    line-height: 16px;
+    color: #737373;
+    text-overflow: ellipsis;
+}
+.card.arvados-object .card-bottom {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    display: inline-block;
+    width: 100%;
+    padding: 10px 20px;
+    line-height: 29px;
+    text-align: center;
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+}
index 41d5566885c59bbdfed4e70b1673e70e78035c1c..2e3a59624117b8a782b220de2ff73c90f76b1cee 100644 (file)
@@ -129,7 +129,9 @@ class ApplicationController < ActionController::Base
   end
 
   def create
-    @object ||= model_class.new params[model_class.to_s.underscore.singularize]
+    new_resource_attrs = params[model_class.to_s.underscore.singularize].
+      reject { |k,v| k.to_s == 'uuid' }
+    @object ||= model_class.new new_resource_attrs
     @object.save!
 
     respond_to do |f|
index b360b19aae0b93b0dbb5d3c325fb9c21458d4c6e..672fe90174f58b5fe418def2ca7c8b0007b017b0 100644 (file)
@@ -5,4 +5,9 @@ class GroupsController < ApplicationController
     @links_from = Link.where link_class: 'permission', tail_uuid: @group_uuids
     @links_to = Link.where link_class: 'permission', head_uuid: @group_uuids
   end
+
+  def show
+    @objects = @object.owned_items include_linked: true
+    super
+  end
 end
index b17231336fbd9b51f3187000a7ad9c42073ae154..d6b258be6112cbe158c32d2d46814515edfd4fed 100644 (file)
@@ -141,16 +141,29 @@ module ApplicationHelper
 
     attrvalue = attrvalue.to_json if attrvalue.is_a? Hash or attrvalue.is_a? Array
 
+    ajax_options = {
+      "data-pk" => {
+        id: object.uuid,
+        key: object.class.to_s.underscore
+      }
+    }
+    if object.uuid
+      ajax_options['data-url'] = url_for(action: "update", id: object.uuid, controller: object.class.to_s.pluralize.underscore)
+    else
+      ajax_options['data-url'] = url_for(action: "create", controller: object.class.to_s.pluralize.underscore)
+      ajax_options['data-pk'][:defaults] = object.attributes
+      ajax_options['data-pk'][:_method] = 'post'
+    end
+    ajax_options['data-pk'] = ajax_options['data-pk'].to_json
+
     link_to attrvalue.to_s, '#', {
       "data-emptytext" => "none",
       "data-placement" => "bottom",
       "data-type" => input_type,
-      "data-url" => url_for(action: "update", id: object.uuid, controller: object.class.to_s.pluralize.underscore),
       "data-title" => "Update #{attr.gsub '_', ' '}",
       "data-name" => attr,
-      "data-pk" => "{id: \"#{object.uuid}\", key: \"#{object.class.to_s.underscore}\"}",
       :class => "editable"
-    }.merge(htmloptions)
+    }.merge(htmloptions).merge(ajax_options)
   end
 
   def render_pipeline_component_attribute(object, attr, subattr, value_info, htmloptions={})
index 1cf0d1fe840458a3ba3f805917e71b49154c0bac..81732bad79320abcf78590217dd8a1a28dd6bfbb 100644 (file)
@@ -299,6 +299,10 @@ class ArvadosBase < ActiveRecord::Base
     (name if self.respond_to? :name) || uuid
   end
 
+  def content_summary
+    self.class.to_s
+  end
+
   def selection_label
     friendly_link_name
   end
index ba3f0a05bfac9b6336f20b15a9af4807e78647af..a474b1378ff07ab72fda18b0b27854128be57753 100644 (file)
@@ -159,7 +159,7 @@ class ArvadosResourceList
   end
 
   def name_for item_or_uuid
-    links_for(item_or_uuid, 'name').first.name
+    links_for(item_or_uuid, 'name').first.andand.name
   end
 
 end
index 5460e9a6e01641192b2ee0c9c0c12d9773e293e3..a63bf90cb006d450f7dccf958ec06aa83fa67d24 100644 (file)
@@ -1,4 +1,5 @@
 class Collection < ArvadosBase
+  include ApplicationHelper
 
   MD5_EMPTY = 'd41d8cd98f00b204e9800998ecf8427e'
 
@@ -7,6 +8,10 @@ class Collection < ArvadosBase
     !!locator.to_s.match("^#{MD5_EMPTY}(\\+.*)?\$")
   end
 
+  def content_summary
+    human_readable_bytes_html(total_bytes) + " " + super
+  end
+
   def total_bytes
     if files
       tot = 0
index fdb460e562a918977aaa8298be93cf8a8aee4c2a..41541f8cf820f63ac8aa5385e511e89f0962a745 100644 (file)
@@ -2,91 +2,6 @@
 .arvados-nav-container {
     display:none;
 }
-.card {
-    padding-top: 20px;
-    margin: 10px 0 20px 0;
-    background-color: #ffffff;
-    border: 1px solid #d8d8d8;
-    border-top-width: 0;
-    border-bottom-width: 2px;
-    -webkit-border-radius: 3px;
-    -moz-border-radius: 3px;
-    border-radius: 3px;
-    -webkit-box-shadow: none;
-    -moz-box-shadow: none;
-    box-shadow: none;
-    -webkit-box-sizing: border-box;
-    -moz-box-sizing: border-box;
-    box-sizing: border-box;
-}
-.card.arvados-object {
-    position: relative;
-    display: inline-block;
-    width: 170px;
-    height: 175px;
-    padding-top: 0;
-    margin-left: 20px;
-    overflow: hidden;
-    vertical-align: top;
-}
-.card.arvados-object .card-top.green {
-    background-color: #53a93f;
-}
-.card.arvados-object .card-top.blue {
-    background-color: #427fed;
-}
-.card.arvados-object .card-top {
-    position: absolute;
-    top: 0;
-    left: 0;
-    display: inline-block;
-    width: 170px;
-    height: 25px;
-    background-color: #ffffff;
-}
-.card.arvados-object .card-info {
-    position: absolute;
-    top: 25px;
-    display: inline-block;
-    width: 100%;
-    height: 101px;
-    overflow: hidden;
-    background: #ffffff;
-    -webkit-box-sizing: border-box;
-    -moz-box-sizing: border-box;
-    box-sizing: border-box;
-}
-.card.arvados-object .card-info .title {
-    display: block;
-    margin: 8px 14px 0 14px;
-    overflow: hidden;
-    font-size: 16px;
-    font-weight: bold;
-    line-height: 18px;
-    color: #404040;
-}
-.card.arvados-object .card-info .desc {
-    display: block;
-    margin: 8px 14px 0 14px;
-    overflow: hidden;
-    font-size: 12px;
-    line-height: 16px;
-    color: #737373;
-    text-overflow: ellipsis;
-}
-.card.arvados-object .card-bottom {
-    position: absolute;
-    bottom: 0;
-    left: 0;
-    display: inline-block;
-    width: 100%;
-    padding: 10px 20px;
-    line-height: 29px;
-    text-align: center;
-    -webkit-box-sizing: border-box;
-    -moz-box-sizing: border-box;
-    box-sizing: border-box;
-}
 <% end %>
 
 <% content_for :above_left_nav do %>
       </div>
       <div class="panel-body">
         <p>
-        </p><table class="table">
+        </p>
+        <table class="table">
           <tbody>
+            <colgroup>
+              <col width="30%" />
+              <col width="20%" />
+              <col width="20%" />
+              <col width="30%" />
+            </colgroup>
+            <% @objects.each do |object| %>
             <tr>
               <td>
-                Some Subfolder
-              </td>
-              <td>
-                12 items
-              </td>
-              <td>
-                2014-04-01
-              </td>
-            </tr>
-            <tr>
-              <td>
-                Test Dataset
+                <% name_link = @objects.links_for(object, 'name').first || Link.new(link_class: "name", owner_uuid: @object.uuid, tail_uuid: @object.uuid, head_uuid: object.uuid, name: "") %>
+                <%= render_editable_attribute name_link, 'name', nil, { 'data-emptytext' => "Unnamed #{object.class}" } %>
               </td>
               <td>
-                4 GiB
+                <%= object.content_summary %>
               </td>
-              <td>
-                2014-04-01
+              <td title="<%= object.modified_at %>">
+                <span>
+                  <%= raw distance_of_time_in_words(object.modified_at, Time.now).sub('about ','~').sub(' ','&nbsp;') + '&nbsp;ago' %>
+                </span>
               </td>
-            </tr>
-            <tr>
-              <td>
-                Test Dataset 2
-              </td>
-              <td>
-                4 GiB
-              </td>
-              <td>
-                2014-04-01
-              </td>
-            </tr>
-            <tr>
-              <td>
-                GATK Exome Pipeline
-              </td>
-              <td>
-                7 components
-              </td>
-              <td>
-                2014-03-21
-              </td>
-            </tr>
-            <tr>
-              <td>
-                Reference result
-              </td>
-              <td>
-                250 MiB
-              </td>
-              <td>
-                2014-03-22
-              </td>
-            </tr>
-            <tr>
-              <td>
-                Some other thing
-              </td>
-              <td>
-                1.2 TiB
-              </td>
-              <td>
-                2014-01-01
+              <td class="arvados-uuid">
+                <%= link_to_if_arvados_object(object, {no_tags: true}) %>
               </td>
             </tr>
+            <% end %>
           </tbody>
           <thead>
             <tr>
               <th>
                 Modified
               </th>
+              <th>
+                UUID
+              </th>
             </tr>
           </thead>
         </table>