Small fixes and semantics.

This commit is contained in:
Lars Jung 2012-10-28 16:43:19 +01:00
parent 3a92606e0c
commit 84be82d175
18 changed files with 81 additions and 83 deletions

View file

@ -1,5 +1,5 @@
#extended .context-menu {
#view .context-menu {
display: block;
position: absolute;

View file

@ -26,9 +26,9 @@
}
#pv-txt-text {
word-break: break-all;
&.highlighted {
word-break: break-all;
tr:hover {
background-color: rgba(0,0,0,0.05);

View file

@ -14,7 +14,7 @@ body {
display: none;
}
}
#extended.view-details {
#view.view-details {
.header .label, .item .label {
margin-right: 110px;
}
@ -22,7 +22,7 @@ body {
display: none;
}
}
#extended.view-icons {
#view.view-icons {
padding: 0;
border: none;
}

View file

@ -1,5 +1,5 @@
#extended.view-details {
#view.view-details {
li {

View file

@ -1,5 +1,5 @@
#extended.view-grid {
#view.view-grid {
li {

View file

@ -1,5 +1,5 @@
#extended.view-icons {
#view.view-icons {
li {
text-align: center;

View file

@ -1,5 +1,5 @@
#extended.view-list {
#view.view-list {
li {

View file

@ -16,7 +16,7 @@
@item-background-col-sel: rgba(240,100,0,0.2);
@item-border-col-sel: rgba(240,100,0,0.2);
#extended {
#view {
display: none;
margin: 0 auto;

View file

@ -18,11 +18,11 @@
@import "inc/notify";
@import "inc/content";
@import "inc/extended";
@import "inc/extended-details";
@import "inc/extended-icons";
@import "inc/extended-list";
@import "inc/extended-grid";
@import "inc/view";
@import "inc/view-details";
@import "inc/view-icons";
@import "inc/view-list";
@import "inc/view-grid";
// @import "inc/context-menu";
@import "inc/dropbox";
@import "inc/no-js-fallback";

View file

@ -120,11 +120,18 @@ modulejs.define('core/location', ['_', 'modernizr', 'core/settings', 'core/event
}
}
notify.set('loading...');
load(function () {
notify.set();
event.pub('location.changed', getItem());
});
var item = getItem();
if (item.isLocationLoaded) {
event.pub('location.changed', item);
refresh();
} else {
notify.set('loading...');
load(function () {
item.isLocationLoaded = true;
notify.set();
event.pub('location.changed', item);
});
}
},
refresh = function () {

View file

@ -88,7 +88,7 @@ modulejs.define('ext/filter', ['_', '$', 'core/settings', 'core/resource'], func
$filter = $(template).appendTo('#navbar');
$input = $filter.find('input');
$noMatch = $(noMatchTemplate).appendTo('#extended');
$noMatch = $(noMatchTemplate).appendTo('#view');
$filter
.on('click', function () {

View file

@ -203,8 +203,8 @@ modulejs.define('ext/preview-img', ['_', '$', 'core/settings', 'core/resource',
initItem = function (item) {
if (item.$extended && _.indexOf(settings.types, item.type) >= 0) {
item.$extended.find('a').on('click', function (event) {
if (item.$view && _.indexOf(settings.types, item.type) >= 0) {
item.$view.find('a').on('click', function (event) {
event.preventDefault();

View file

@ -254,8 +254,8 @@ modulejs.define('ext/preview-txt', ['_', '$', 'core/settings', 'core/resource',
initItem = function (item) {
if (item.$extended && _.indexOf(_.keys(settings.types), item.type) >= 0) {
item.$extended.find('a').on('click', function (event) {
if (item.$view && _.indexOf(_.keys(settings.types), item.type) >= 0) {
item.$view.find('a').on('click', function (event) {
event.preventDefault();

View file

@ -59,7 +59,7 @@ modulejs.define('ext/select', ['_', '$', 'core/settings', 'core/event'], functio
.animate(
{
left: l + w * 0.5 * shrink,
top: t + h * 0.5 * shrink,
top: t + h * 0.5 * shrink,
width: w * (1 - shrink),
height: h * (1 - shrink),
opacity: 0
@ -111,14 +111,19 @@ modulejs.define('ext/select', ['_', '$', 'core/settings', 'core/event'], functio
}
},
onLocationChanged = function () {
publish();
},
onLocationRefreshed = function (item, added, removed) {
var selectionChanged = false;
_.each(removed, function (item) {
if (item.$extended && item.$extended.hasClass('selected')) {
item.$extended.removeClass('selected');
if (item.$view && item.$view.hasClass('selected')) {
item.$view.removeClass('selected');
selectionChanged = true;
}
});
@ -136,6 +141,7 @@ modulejs.define('ext/select', ['_', '$', 'core/settings', 'core/event'], functio
$selectionRect.hide().appendTo('body');
event.sub('location.changed', onLocationChanged);
event.sub('location.refreshed', onLocationRefreshed);
$document

View file

@ -39,24 +39,24 @@ modulejs.define('ext/thumbnails', ['_', 'core/settings', 'core/event', 'core/ser
if (type) {
if (item.thumbSmall) {
item.$extended.find('.icon.small img').addClass('thumb').attr('src', item.thumbSmall);
item.$view.find('.icon.small img').addClass('thumb').attr('src', item.thumbSmall);
} else {
requestThumbSmall(type, item.absHref, function (src) {
if (src && item.$extended) {
if (src && item.$view) {
item.thumbSmall = src;
item.$extended.find('.icon.small img').addClass('thumb').attr('src', src);
item.$view.find('.icon.small img').addClass('thumb').attr('src', src);
}
});
}
if (item.thumbBig) {
item.$extended.find('.icon.big img').addClass('thumb').attr('src', item.thumbBig);
item.$view.find('.icon.big img').addClass('thumb').attr('src', item.thumbBig);
} else {
requestThumbBig(type, item.absHref, function (src) {
if (src && item.$extended) {
if (src && item.$view) {
item.thumbBig = src;
item.$extended.find('.icon.big img').addClass('thumb').attr('src', src);
item.$view.find('.icon.big img').addClass('thumb').attr('src', src);
}
});
}

View file

@ -161,8 +161,8 @@ modulejs.define('ext/tree', ['_', '$', 'core/settings', 'core/resource', 'core/e
shiftTree = function (forceVisible, dontAnimate) {
var $tree = $("#tree"),
$extended = $("#extended"),
left = ((settings.slide && $tree.outerWidth() < $extended.offset().left) || forceVisible || !$extended.is(':visible')) ? 0 : 18 - $tree.outerWidth();
$view = $("#view"),
left = ((settings.slide && $tree.outerWidth() < $view.offset().left) || forceVisible || !$view.is(':visible')) ? 0 : 18 - $tree.outerWidth();
if (dontAnimate) {
$tree.stop().css({ left: left });
@ -199,17 +199,6 @@ modulejs.define('ext/tree', ['_', '$', 'core/settings', 'core/resource', 'core/e
$tree.scrollpanel('update');
},
onContentChanged = function (item) {
while (item.parent) {
item = item.parent;
}
update(item);
adjustSpacing();
shiftTree(false, true);
},
onLocationChanged = function (item) {
fetchTree(item, function (root) {

View file

@ -16,22 +16,24 @@ modulejs.define('view/items', ['_', '$', 'core/settings', 'core/resource', 'core
'</a>' +
'</li>',
hintTemplate = '<span class="hint"/>',
itemsTemplate = '<ul id="items" class="clearfix">' +
'<li class="header">' +
'<a class="icon"/>' +
'<a class="label" href="#"><span class="l10n-name"/></a>' +
'<a class="date" href="#"><span class="l10n-lastModified"/></a>' +
'<a class="size" href="#"><span class="l10n-size"/></a>' +
'</li>' +
'</ul>',
emptyTemplate = '<div class="empty l10n-empty"/>',
contentTemplate = '<div id="content"><div id="extended"/></div>',
contentTemplate = '<div id="content">' +
'<div id="view">' +
'<ul id="items" class="clearfix">' +
'<li class="header">' +
'<a class="icon"/>' +
'<a class="label" href="#"><span class="l10n-name"/></a>' +
'<a class="date" href="#"><span class="l10n-lastModified"/></a>' +
'<a class="size" href="#"><span class="l10n-size"/></a>' +
'</li>' +
'</ul>' +
'<div class="empty l10n-empty"/>' +
'</div>' +
'</div>',
// updates this single item
update = function (item, force) {
if (!force && item.$extended) {
return item.$extended;
if (!force && item.$view) {
return item.$view;
}
var $html = $(itemTemplate),
@ -74,10 +76,10 @@ modulejs.define('view/items', ['_', '$', 'core/settings', 'core/resource', 'core
$html.addClass('folder-parent');
}
if (item.$extended) {
item.$extended.replaceWith($html);
if (item.$view) {
item.$view.replaceWith($html);
}
item.$extended = $html;
item.$view = $html;
return $html;
},
@ -96,9 +98,8 @@ modulejs.define('view/items', ['_', '$', 'core/settings', 'core/resource', 'core
onLocationChanged = function (item) {
var $extended = $('#extended'),
$items = $('#items'),
$empty = $extended.find('.empty');
var $items = $('#items'),
$empty = $('#view').find('.empty');
$items.find('.item').remove();
@ -120,9 +121,8 @@ modulejs.define('view/items', ['_', '$', 'core/settings', 'core/resource', 'core
onLocationRefreshed = function (item, added, removed) {
var $extended = $('#extended'),
$items = $('#items'),
$empty = $extended.find('.empty');
var $items = $('#items'),
$empty = $('#view').find('.empty');
_.each(added, function (item) {
@ -131,8 +131,8 @@ modulejs.define('view/items', ['_', '$', 'core/settings', 'core/resource', 'core
_.each(removed, function (item) {
item.$extended.fadeOut(400, function () {
item.$extended.remove();
item.$view.fadeOut(400, function () {
item.$view.remove();
});
});
@ -146,16 +146,12 @@ modulejs.define('view/items', ['_', '$', 'core/settings', 'core/resource', 'core
init = function () {
var $content = $(contentTemplate),
$extended = $content.find('#extended'),
$items = $(itemsTemplate),
$emtpy = $(emptyTemplate).hide();
$view = $content.find('#view'),
$items = $view.find('#items'),
$emtpy = $view.find('.empty').hide();
format.setDefaultMetric(settings.binaryPrefix);
$extended
.append($items)
.append($emtpy);
$items
.on('mouseenter', '.item a', onMouseenter)
.on('mouseleave', '.item a', onMouseleave);

View file

@ -19,15 +19,15 @@ modulejs.define('view/viewmode', ['_', '$', 'core/settings', 'core/resource', 'c
adjustSpacing = function () {
var contentWidth = $('#content').width(),
$extended = $('#extended'),
itemWidth = ($extended.hasClass('view-icons') || $extended.hasClass('view-grid')) ? ($extended.find('.item').eq(0).width() || 1) : 1;
$view = $('#view'),
itemWidth = ($view.hasClass('view-icons') || $view.hasClass('view-grid')) ? ($view.find('.item').eq(0).width() || 1) : 1;
$extended.width(Math.floor(contentWidth / itemWidth) * itemWidth);
$view.width(Math.floor(contentWidth / itemWidth) * itemWidth);
},
update = function (viewmode) {
var $extended = $('#extended');
var $view = $('#view');
viewmode = _.indexOf(settings.modes, viewmode) >= 0 ? viewmode : settings.modes[0];
store.put(storekey, viewmode);
@ -35,10 +35,10 @@ modulejs.define('view/viewmode', ['_', '$', 'core/settings', 'core/resource', 'c
_.each(modes, function (mode) {
if (mode === viewmode) {
$('#view-' + mode).addClass('current');
$extended.addClass('view-' + mode).show();
$view.addClass('view-' + mode).show();
} else {
$('#view-' + mode).removeClass('current');
$extended.removeClass('view-' + mode);
$view.removeClass('view-' + mode);
}
});