github-migration
/
engine
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

polishing the locomotive_media plugin (wip)

This commit is contained in:
did 2011-11-19 16:41:16 +01:00
parent 72c2cb2059
commit 63e2a63d1a
8 changed files with 46 additions and 117 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
app/assets/images/locomotive/list/icons/trash_off.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 437 B

2
app/assets/javascripts/locomotive/views/content_assets/picker_item_view.js.coffee
View File

@ -7,7 +7,7 @@ class Locomotive.Views.ContentAssets.PickerItemView extends Backbone.View
className: 'asset'
events:
'click h4 a': 'select_asset'
'click h4 a, .icon, .image': 'select_asset'
'click a.remove': 'remove_asset'
render: ->

6
app/assets/javascripts/locomotive/views/content_assets/picker_view.js.coffee
View File

@ -82,7 +82,7 @@ class Locomotive.Views.ContentAssets.PickerView extends Backbone.View
(@_item_views ||= []).push(view)
@$('ul.list .clear').before(view.render().el)
@_refresh()
@_refresh() & @_move_to_last_asset()
remove_asset: (asset) ->
view = _.find @_item_views, (tmp) -> tmp.model == asset
@ -90,6 +90,10 @@ class Locomotive.Views.ContentAssets.PickerView extends Backbone.View
@_refresh()
@center()
_move_to_last_asset: ->
limit = @$('ul.list li.clear').position()
@$('ul.list').animate(scrollTop: limit.top, 400) if limit?
_refresh: ->
if @collection.length == 0
@$('ul.list').hide() & @$('p.no-items').show()

133
app/assets/stylesheets/locomotive/content_assets.scss
View File

@ -10,10 +10,10 @@ ul.content-assets {
position: relative;
float: left;
width: 139px;
height: 140px;
height: 170px;
clear: none;
margin: 0 17px 17px 0;
margin: 0 10px 10px 0;
@include border-radius(8px);
@include box-shadow(rgba(0, 0, 0, 0.2) 0px 1px 0px 0px);
@ -47,10 +47,11 @@ ul.content-assets {
}
.icon, .image {
width: 80px;
height: 80px;
width: 85px;
height: 85px;
border: 4px solid #fff;
margin: 10px 0 5px 24px;
margin: 20px 0 0px 22px;
cursor: pointer;
@include box-shadow(rgba(0, 0, 0, 0.3) 3px 3px 5px 1px);
}
@ -62,8 +63,8 @@ ul.content-assets {
display: table-cell;
vertical-align: middle;
text-align: center;
width: 80px;
height: 85px;
width: 85px;
height: 90px;
}
} // .image
@ -71,14 +72,14 @@ ul.content-assets {
.inside {
position: relative;
top: 24px;
width: 80px;
top: 30px;
width: 85px;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
color: #fff;
font-size: 12px;
font-size: 14px;
font-weight: bold;
text-align: center;
text-transform: uppercase;
@ -103,104 +104,24 @@ ul.content-assets {
.actions {
position: absolute;
top: 8px;
right: 5px;
bottom: 17px;
right: 17px;
a {
display: block;
width: 16px;
height: 16px;
background: transparent image-url("locomotive/list/icons/trash_off.png") repeat 0 0;
text-indent: -9999px;
&:hover{
background-image: image-url("locomotive/list/icons/trash.png");
}
}
}
} // li.asset
}
// ul.assets {
// list-style: none;
// margin: 0px;
// padding: 0px;
// }
//
// ul.assets li.asset {
// position: relative;
// float: left;
// width: 139px;
// height: 140px;
// background: transparent url(/assets/locomotive//list/thumb.png) no-repeat 0 0;
// margin: 0 17px 17px 0;
// }
//
// ul.assets li.asset.last {
// margin-right: 0px;
// }
//
// ul.assets li.asset h4 { margin: 0px; height: 30px; border-bottom: 1px solid #ccced7; position: relative; }
//
// ul.assets li.asset h4 a {
// position: absolute;
// top: 7px;
// left: 12px;
// font-weight: bold;
// font-size: 0.6em;
// color: #1f82bc;
// text-decoration: none;
// }
//
// ul.assets li.asset h4 a:hover { text-decoration: underline; }
//
// ul.assets li.asset div.icon, ul.assets li.asset div.image {
// width: 80px;
// height: 80px;
// border: 4px solid #fff;
// margin: 10px 0 0 24px;
// box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.3);
// -moz-box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.3);
// -webkit-box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.3);
// }
//
// ul.assets li.asset div.image {
// background: transparent url(/assets/locomotive//list/empty.png) repeat 0 0;
// }
//
// ul.assets li.asset div.image .inside {
// display: table-cell;
// vertical-align: middle;
// text-align: center;
// width: 72px;
// height: 72px;
// }
//
// ul.assets li.asset div.icon .inside {
// position: relative;
// top: 24px;
// text-align:center;
// width: 80px;
// -webkit-transform: rotate(-45deg);
// -moz-transform: rotate(-45deg);
// font-weight: bold;
// color: #fff;
// text-shadow: 0px 1px 0px #333;
// text-transform: uppercase;
// font-size: 1.1em;
// }
//
// ul.assets li.asset div.pdf {
// background: #e82f2d;
// background: -webkit-gradient(linear, left top, right bottom, from(#fc4e42), to(#b9101d));
// background: -moz-linear-gradient(-45deg, #fc4e42, #b9101d);
// }
//
// ul.assets li.asset div.media {
// background: #6e489c;
// background: -webkit-gradient(linear, left top, right bottom, from(#ba89d1), to(#4f317d));
// background: -moz-linear-gradient(-45deg, #ba89d1, #4f317d);
// }
//
// ul.assets li.asset div.other {
// background: #4a4a50;
// background: -webkit-gradient(linear, left top, right bottom, from(#92939a), to(#28282b));
// background: -moz-linear-gradient(-45deg, #92939a, #28282b);
// }
//
//
// ul.assets li.asset div.actions {
// position: absolute;
// top: 4px;
// right: 12px;
// }

2
app/assets/stylesheets/locomotive/dialog_changes.scss
View File

@ -66,7 +66,7 @@
.list {
overflow: auto;
height: 350px;
height: 360px;
}
} // .ui-dialog-content

4
app/models/locomotive/extensions/asset/vignette.rb
View File

@ -5,10 +5,10 @@ module Locomotive
def vignette_url
if self.image?
if self.width < 80 && self.height < 80
if self.width < 85 && self.height < 85
self.source.url
else
Locomotive::Dragonfly.resize_url(self.source, '80x80#')
Locomotive::Dragonfly.resize_url(self.source, '85x85#')
end
end
end

8
app/presenters/locomotive/content_asset_presenter.rb
View File

@ -1,8 +1,12 @@
module Locomotive
class ContentAssetPresenter < BasePresenter
def full_filename
self.source.source_filename
end
def filename
truncate(self.source.source_filename, :length => 19)
truncate(self.source.source_filename, :length => 22)
end
def short_name
@ -32,7 +36,7 @@ module Locomotive
def as_json
{}.tap do |hash|
%w(id filename short_name extname content_type content_type_text url vignette_url).map(&:to_sym).each do |meth|
%w(id full_filename filename short_name extname content_type content_type_text url vignette_url).map(&:to_sym).each do |meth|
hash[meth] = self.send(meth)
end
end

4
app/views/locomotive/content_assets/_picker.html.haml
View File

@ -17,7 +17,7 @@
%script{ :type => 'text/html', :id => 'content_asset' }
%h4
= link_to '{{filename}}', '{{url}}'
= link_to '{{filename}}', '{{url}}', :alt => '{{full_filename}}', :title => '{{full_filename}}'
{{#if image}}
.image
.inside
@ -29,4 +29,4 @@
{{/if}}
.actions
= link_to image_tag('locomotive/list/icons/cross.png'), '#', :class => 'remove', :'data-confirm' => t('locomotive.messages.confirm')
= link_to 'x', '#', :class => 'remove', :'data-confirm' => t('locomotive.messages.confirm')