Author: gabriel.walt
Date: Tue May 5 03:15:20 2009
New Revision: 500
Modified:
branches/electron/pages/media/pages/css/pages.css
branches/electron/pages/media/pages/javascript/pages.js
branches/electron/pages/media/pages/javascript/pages_list.js
branches/electron/pages/models.py
branches/electron/pages/templates/admin/pages/page/change_list_table.html
branches/electron/pages/templates/admin/pages/page/menu.html
Log:
Various minor enhancements on the page listing
Modified: branches/electron/pages/media/pages/css/pages.css
==============================================================================
--- branches/electron/pages/media/pages/css/pages.css (original)
+++ branches/electron/pages/media/pages/css/pages.css Tue May 5 03:15:20
2009
@@ -39,6 +39,7 @@
.popup a .help {
display: none;
position: absolute;
+ z-index: 100;
top: -24px;
padding: 2px 4px;
border: 1px solid #888;
@@ -49,6 +50,7 @@
background: #ffb;
white-space: nowrap;
text-transform: none;
+ cursor: default;
}
a.popup:hover .help,
.popup a:hover .help {
@@ -113,22 +115,26 @@
background: #ffb;
}
-/* Title cell */
-.change-list thead th.title-cell {
+/* Title cell theader */
+.change-list thead .title-cell {
padding: 5px 10px;
}
-.change-list .title-cell-container {
+
+/* Title cell tbody */
+.change-list tbody .title-cell-container {
position: relative;
text-align: left;
font-weight: bold;
height: 100%;
+ padding-right: 150px;
}
-.change-list .title-cell .changelink {
+.change-list tbody .title-cell .title {
+ float: left;
margin: 0 0 0 20px;
padding: 0 14px 0 0;
background: none;
}
-.change-list .title-cell .changelink:hover {
+.change-list tbody .title-cell .title:hover {
background: url(../images/icons/edit.gif) right 0.2em no-repeat;
}
@@ -157,26 +163,46 @@
left: -4px;
}
-/* Languages */
-.change-list .translation {
+/* Actions */
+.change-list .actions {
position: absolute;
right: -5px; top: 0;
margin: 0; padding: 0;
}
-.change-list .highlighted .translation,
-.change-list .insertable .translation {
+.change-list .actions a {
+ float: left;
+ width: 15px;
+ height: 14px;
+ padding: 0;
+ margin-right: 5px;
+ background-repeat: no-repeat;
+ background-position: center 0.25em;
+ opacity: 0.3;
+}
+.change-list .actions a:hover,
+.change-list tr:hover .actions a {
+ opacity: 1;
+}
+.change-list .insert-add .actions a,
+.change-list .insert-move .actions a {
display: none;
}
-.change-list .translation li {
- float: left;
- list-style: none;
- padding: 0
+.change-list .actions a.viewlink {
+ background-image: url(../images/icons/view.gif);
}
-.change-list .translation .changelink {
- margin: 0 4px 0 0;
- padding: 0 14px 0 0;
+.change-list .actions a.movelink {
+ background-image: url(../images/icons/move.gif);
+}
+.change-list .actions a.cancellink {
+ display: none;
font-weight: normal;
- text-transform: uppercase;
+ opacity: 1;
+}
+.change-list .insert-move .selected .actions a.cancellink {
+ display: block;
+ width: auto;
+ height: auto;
+ padding: 0 10px;
}
/* Move links */
@@ -212,32 +238,51 @@
.change-list .insert .help {
top: -20px;
}
+.change-list .insert a.cancellink {
+ display: none;
+ font-weight: normal;
+}
+.change-list .insert-add .selected .insert a.cancellink {
+ display: block;
+ width: auto;
+ height: auto;
+ margin: 4px 5px;
+ padding: 0 5px;
+ background: none;
+}
+.change-list .insert a.cancellink .help {
+ top: -24px;
+}
.change-list .insert-loading {
position: absolute;
- right: 12px; top: -2px;
+ left: 0; top: -1px;
+ font-size: 16px;
}
-/* Actions */
-.change-list .action-cell {
+/* Languages */
+.change-list .language-cell {
width: 1%;
- min-width: 80px;
white-space: nowrap;
- padding: 5px 10px;
+ padding: 5px 0 5px 10px;
}
-.change-list .action-cell a {
- float: left;
- width: 15px;
- height: 14px;
+.change-list .language-cell ul {
+ margin: 0;
padding: 0;
- margin-right: 5px;
- background-repeat: no-repeat;
- background-position: center 0.25em;
}
-.change-list .action-cell a.viewlink {
- background-image: url(../images/icons/view.gif);
+.change-list .language-cell li {
+ display: inline;
+ list-style: none;
+ padding: 0
}
-.change-list .action-cell a.movelink {
- background-image: url(../images/icons/move.gif);
+.change-list .language-cell .changelink {
+ margin: 0 4px;
+ padding: 0 12px 0 0;
+ font-weight: normal;
+ text-transform: uppercase;
+ background: none;
+}
+.change-list .language-cell .changelink:hover {
+ background: url(../images/icons/edit.gif) right 0.2em no-repeat;
}
/* Publication status */
Modified: branches/electron/pages/media/pages/javascript/pages.js
==============================================================================
--- branches/electron/pages/media/pages/javascript/pages.js (original)
+++ branches/electron/pages/media/pages/javascript/pages.js Tue May 5
03:15:20 2009
@@ -1,7 +1,9 @@
/* Common stuff used in pages_list.js as well as in pages_form.js */
+
var pages = {};
+
pages.cookie = function(name, value, options) {
if (typeof value != 'undefined') { // name and value given, set cookie
options = options || {};
@@ -44,6 +46,7 @@
}
};
+
pages.fade_color = function (elem, o) {
o = $.extend({
duration: 2000, // Time [ms] the animation should last
@@ -75,6 +78,7 @@
}, o.frame);
};
+
pages.update_published_icon = function (url, select, img) {
var opt = { 0: 'draft', 1: 'published', 3: 'hidden' };
img.attr({
@@ -88,3 +92,16 @@
});
});
};
+
+
+$(function () {
+ // Ignore clicks on help popups, just hide the help message
+ $('a.popup .help, .popup a .help').click(function (e) {
+ var help = $(this).css('display', 'none')
+ help.parents('a').mouseout(function() {
+ help.css('display', null);
+ });
+ e.stopPropagation();
+ return false;
+ });
+});
Modified: branches/electron/pages/media/pages/javascript/pages_list.js
==============================================================================
--- branches/electron/pages/media/pages/javascript/pages_list.js
(original)
+++ branches/electron/pages/media/pages/javascript/pages_list.js Tue May
5
03:15:20 2009
@@ -2,7 +2,6 @@
/*
TODO:
- Show the whole language list on the pages, even the languages in which
the page doesn't exist
-- Manage better the display of the table for narrow windows
- Test & debug for IE
*/
@@ -14,8 +13,7 @@
function reset_states() {
action = selected_page = '';
$('#changelist').removeClass('insert-add insert-move');
- $('#changelist .action-cell a').removeClass('selected');
- $('#changelist tr').removeClass('insertable highlighted');
+ $('#changelist tr').removeClass('insertable highlighted selected');
}
// Get an array of the TR elements that are children of the given page
id
@@ -39,7 +37,7 @@
page_row.after(submenu_cache[id]);
link.removeClass('loading');
var expanded = get_expanded();
- var children = $('.child-of-'+id).each(function() {
+ var children = $('#changelist .child-of-'+id).each(function() {
var i = this.id.substring(9);
if ($.inArray(i, expanded) != -1) {
$('#c'+i).addClass('expanded loading');
@@ -54,7 +52,7 @@
// Remove the children of the given page id from the table
function rem_children(id) {
- $('.child-of-'+id).each(function () {
+ $('#changelist .child-of-'+id).each(function () {
rem_children(this.id.substring(9));
$(this).remove();
});
@@ -96,40 +94,42 @@
// let's start event delegation
$('#changelist').click(function (e) {
var link = $(e.target).parents('a').andSelf().filter('a');
+
if (link.length) {
// Toggles a previous action to come back to the initial state
- if (link.hasClass('selected')) {
+ if (link.hasClass('cancellink')) {
reset_states();
return false;
-
+ }
// Ask where to move the page to
- } else if (link.hasClass('movelink')) {
+ else if (link.hasClass('movelink')) {
reset_states();
action = 'move';
- selected_page =
link.addClass('selected').attr('id').split('move-link-')[1];
+ selected_page = link.attr('id').split('move-link-')[1];
$('#changelist').addClass('insert-move');
-
$('#page-row-'+selected_page).add(get_children(selected_page)).addClass('highlighted');
+
$('#page-row-'+selected_page).addClass('selected').add(get_children(selected_page)).addClass('highlighted');
$('#changelist
tr:not(.highlighted)').addClass('insertable');
return false;
-
+ }
// Ask where to insert the new page
- } else if (link.hasClass('addlink')) {
+ else if (link.hasClass('addlink')) {
reset_states();
action = 'add';
- selected_page =
link.addClass('selected').attr('id').split('add-link-')[1];
+ selected_page = link.attr('id').split('add-link-')[1];
$('#changelist').addClass('insert-add');
- $('#page-row-'+selected_page).addClass('highlighted
insertable');
+
$('#page-row-'+selected_page).addClass('selected').addClass('highlighted
insertable');
return false;
-
+ }
// Move or add the page and come back to the initial state
- } else if (link.hasClass('move-target')) {
+ else if (link.hasClass('move-target')) {
var position = link.attr('class').match(/left|right|
first-child/)[0];
var id = link.parent().attr('id').split('move-target-')[1];
+ var row = $('#page-row-'+selected_page);
$('#changelist').removeClass('insert-add insert-move');
- $('#changelist .action-cell a').removeClass('selected');
- $('#changelist tr').removeClass('insertable');
- $('#page-row-'+selected_page+' .insert').after('<img
class="insert-loading" src="/media/pages/images/loading.gif" alt="Loading"
/>');
+ $('#changelist tr').removeClass('selected insertable');
+ $('.expand-collapse', row).remove();
+ $('.insert', row).after('<img class="insert-loading"
src="/media/pages/images/loading.gif" alt="Loading" />');
if (action == 'move') {
$.post(selected_page+'/move-page/', { position:
position, target: id },
@@ -143,9 +143,9 @@
window.location.href += 'add/'+$.query.set('target',
id).set('position', position).toString();
}
return false;
-
+ }
// Expand or collapse pages
- } else if (link.hasClass('expand-collapse')) {
+ else if (link.hasClass('expand-collapse')) {
var id = link.attr('id').substring(1);
if (link.toggleClass('expanded').hasClass('expanded')) {
add_expanded(id);
Modified: branches/electron/pages/models.py
==============================================================================
--- branches/electron/pages/models.py (original)
+++ branches/electron/pages/models.py Tue May 5 03:15:20 2009
@@ -26,9 +26,9 @@
EXPIRED = 2
HIDDEN = 3
STATUSES = (
- (DRAFT, _('Draft')),
(PUBLISHED, _('Published')),
(HIDDEN, _('Hidden')),
+ (DRAFT, _('Draft')),
)
PAGE_LANGUAGES_KEY = "page_%d_languages"
Modified:
branches/electron/pages/templates/admin/pages/page/change_list_table.html
==============================================================================
---
branches/electron/pages/templates/admin/pages/page/change_list_table.html
(original)
+++
branches/electron/pages/templates/admin/pages/page/change_list_table.html
Tue May 5 03:15:20 2009
@@ -3,7 +3,7 @@
<thead>
<tr>
<th class="title-cell">{% trans "title" %}</th>
- <th class="action-cell">{% trans "quick actions" %}</th>
+ <th class="language-cell">{% trans "languages" %}</th>
<th class="publish-cell">{% trans "published" %}</th>
<th class="template-cell">{% trans "template" %}</th>
<th class="author-cell">{% trans "author" %}</th>
Modified: branches/electron/pages/templates/admin/pages/page/menu.html
==============================================================================
--- branches/electron/pages/templates/admin/pages/page/menu.html
(original)
+++ branches/electron/pages/templates/admin/pages/page/menu.html Tue May
5
03:15:20 2009
@@ -11,28 +11,29 @@
<img class="expand-loading"
src="/media/pages/images/loading.gif" alt="loading" />
</a>
{% endif %}
- <a href="{{ url }}{{ page.id }}/" class="changelink">{%
show_content page "slug" %}</a>
+ <a href="{{ url }}{{ page.id }}/" class="title
changelink">{% show_content page "slug" %}</a>
- <ul class="translation popup">
- {% for lang in page.get_languages %}
- <li class="{% if not forloop.last %}last{%
endif %}">
- <a href="{{ url }}{{ page.id }}/?language={{
lang }}" class="changelink">{{ lang }} <span class="help">{% trans "edit
the page in this language" %}</span></a>
- </li>
- {% endfor %}
- </ul>
+
+ <div class="actions popup">
+ <a class="viewlink" href="{{ page.get_absolute_url }}"
target="_blank"><span class="help">{% trans "view this page" %}</span></a>
+ <a class="movelink" id="move-link-{{ page.id }}"
href="#"><span class="help">{% trans "move this page" %}</span></a>
+ <a class="addlink" id="add-link-{{ page.id }}"
href="#"><span class="help">{% trans "insert a new page here" %}</span></a>
+ <a class="deletelink" href="{{ page.id
}}/delete/"><span class="help">{% trans "delete this page" %}</span></a>
+ <a class="cancellink popup" href="#">{%
trans "cancel" %}<span class="help">{% trans "don't move this
page" %}</span></a>
+ </div>
<div id="move-target-{{ page.id }}" class="insert popup
container">
+ <a class="cancellink popup" href="#">{%
trans "cancel" %}<span class="help">{% trans "don't insert a new page
here" %}</span></a>
<a href="#" class="move-target left"><span
class="help">{% trans "insert above" %}</span></a>
<a href="#" class="move-target right"><span
class="help">{% trans "insert below" %}</span></a>
<a href="#" class="move-target first-child"><span
class="help">{% trans "insert as child" %}</span></a>
</div>
</div>
</th>
- <td class="action-cell popup">
- <a class="viewlink" href="{{ page.get_absolute_url }}"
target="_blank"><span class="help">{% trans "view this page" %}</span></a>
- <a class="movelink" id="move-link-{{ page.id }}"
href="#"><span class="help">{% trans "move this page" %}</span></a>
- <a class="addlink" id="add-link-{{ page.id }}" href="#"><span
class="help">{% trans "insert a new page here" %}</span></a>
- <a class="deletelink" href="{{ page.id }}/delete/"><span
class="help">{% trans "delete this page" %}</span></a>
+ <td class="language-cell">
+ <ul class="popup">
+ {% for lang in page.get_languages %}<li class="{% if not
forloop.last %}last{% endif %}"><a href="{{ url }}{{ page.id
}}/?language={{ lang }}" class="changelink">{{ lang }}<span class="help">{%
trans "edit the page in this language" %}</span></a></li>{% endfor %}
+ </ul>
</td>
<td class="publish-cell">
{% ifequal page.status page.DRAFT %}
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"pinax-updates" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/pinax-updates?hl=en
-~----------~----~----~----~------~----~------~--~---
