better asset list UI

sebastiandeutsch · Dec 7, 2009 · 773d904 · 773d904
1 parent 2df7666
commit 773d904
Show file tree

Hide file tree

Showing 3 changed files with 50 additions and 18 deletions.
diff --git a/app/views/vrame/assets/_assetable.html.erb b/app/views/vrame/assets/_assetable.html.erb
@@ -1,11 +1,12 @@
 <% assetable = asset.assetable %>
+<% assetable_type = asset.assetable_type %>
 <% if assetable %>
-	<% if asset.assetable_type == 'Document' %>
+	<% if assetable_type == 'Document' %>
 		<p>
 			Dokument
 			<%= link_to assetable.title, [:edit, :vrame, assetable] %>
 		</p>
-	<% elsif asset.assetable_type == 'Collection' %>
+	<% elsif assetable_type == 'Collection' %>
 		<% collectionable = assetable.collectionable %>
 		<% if collectionable %>
 			<p>
@@ -16,7 +17,7 @@
 			<p>Collection ohne Zugehörigkeit</p>
 		<% end %>
 	<% else %>
-		<p><%= link_to "#{asset.title} #{asset.assetable_type}", "/vrame/assets/#{asset.id}" %></p>
+		<p><%= link_to "#{assetable_type}: #{assetable.try(:title)} ", "/vrame/assets/#{asset.id}" %></p>
 	<% end %>
 <% else %>
 	<p>möglicherwese verwaist (kein Verweis von Asset auf Assetable, ggf. nur umgekehrt)</p>

diff --git a/app/views/vrame/shared/_asset_list_item.html.erb b/app/views/vrame/shared/_asset_list_item.html.erb
@@ -9,15 +9,18 @@
 
 	<div class="beside-image">
 
-		<p class="title">
-			<textarea name="title" placeholder="Titel bearbeiten" title="Titel bearbeiten" data-asset-id="<%= asset.id %>" data-authenticity-token="<%= form_authenticity_token %>"><%=h asset.title %></textarea>
-		</p>
-
 		<p class="filename"><%=h file.original_filename %></p>
 		<p class="filesize"><%= number_to_human_size(file.size) %></p>
 
-		<p class="edit"><%= link_to 'Editieren', edit_vrame_asset_path(asset), :class => 'smaller edit button invert' %></p>
+		<p class="title">
+			<label>
+				<span>Titel bearbeiten:</span>
+				<textarea name="title" data-asset-id="<%= asset.id %>" data-authenticity-token="<%= form_authenticity_token %>"><%=h asset.title %></textarea>
+			</label>
+		</p>
+
 		<p class="delete"><%= link_to 'Löschen', vrame_asset_path(asset), :class => 'smaller delete button invert', 'data-authenticity-token' => form_authenticity_token %></p>
+		<p class="edit"><%= link_to 'Editieren', edit_vrame_asset_path(asset), :class => 'smaller edit button invert' %></p>
 
 	</div>
 

diff --git a/public/vrame/stylesheets/asset_list.css b/public/vrame/stylesheets/asset_list.css
@@ -26,6 +26,12 @@
 	font-size: 12px;
 }
 
+/** 
+ * @subsection Image Column
+ *
+ *
+ */
+
 .asset-list .image-wrapper {
 	float: left;
 	margin: 0;
@@ -40,30 +46,52 @@
 }
 
 .asset-list .beside-image {
+	float: left;
 	padding-left: 10px;
+}
+
+/** 
+ * @subsection Info and form fields
+ *
+ *
+ */
+
+.asset-list .filename {
+	height: 19px;
+	white-space: nowrap;
 	overflow: hidden;
 }
 
-.asset-list label {}
+.asset-list .filesize {}
+
+.asset-list p.title {
+	margin-bottom: 5px;
+}
+
+.asset-list p.title span {
+	display: block;
+}
 
 .asset-list textarea {
-	padding: 2px;
+	display: block;
+	margin: 0;
 	width: 178px;
 	height: 50px;
+	padding: 2px;
 	font-family: arial,sans-serif;
 	font-size: 13px;
 }
 
-.asset-list .filename {
-	height: 19px;
-	white-space: nowrap;
-	overflow: hidden;
-}
-
-.asset-list .filesize {}
+/** 
+ * @subsection Control buttons
+ *
+ *
+ */
 
-.asset-list .delete {
+.asset-list p.edit,
+.asset-list p.delete {
 	float: right;
+	margin-left: 10px;
 }
 
 /**