MINOR Clearer CSS classes in CMS controller templates. Fixed JS loading of ModelAdmin panels. Added $BaseCSSClasses to content templates in order to support partial template loads through ajax (instead of relying on stale CSS classes on the <body> tag). Leaving $BaseCSSClasses in LeftAndMain.ss base template for legacy reasons.

This commit is contained in:
Ingo Schommer 2011-07-05 11:34:37 +02:00
parent 1dc9457048
commit 19b9edb170
7 changed files with 54 additions and 23 deletions

View File

@ -1,7 +1,42 @@
(function($) {
$.entwine('ss', function($){
$('.LeftAndMain .cms-content, .LeftAndMain .cms-content *').entwine({
/**
* Triggered before a new URL is loaded, typically via ajax.
* Loading itself is handled by .LeftAndMain and window.history.
*
* @param {String}
*/
beforeLoad: function(url) {
this.addClass('loading');
this.cleanup();
},
/**
* Triggered after an ajax request with new HTML data.
*
* @param {String}
* @param {String}
* @param {XMLHTTPRequest}
*/
afterLoad: function(data, status, xhr) {
this.removeClass('loading');
this.replaceWith(data);
},
cleanup: function() {
this.empty();
}
});
/**
* The "content" area contains all of the section specific UI (excluding the menu).
* This area can be a form itself, as well as contain one or more forms.
* For example, a page edit form might fill the whole area,
* while a ModelAdmin layout shows a search form on the left, and edit form on the right.
*/
$('.LeftAndMain .cms-content').entwine({
onmatch: function() {
@ -32,20 +67,6 @@
onunmatch: function() {
this._super();
},
beforeLoad: function(url) {
this.addClass('loading');
this.cleanup();
},
afterLoad: function(data, status, xhr) {
this.removeClass('loading');
this.replaceWith(data);
},
cleanup: function() {
this.empty();
},
/**
* Function: loadForm
@ -60,7 +81,7 @@
*/
loadForm: function(url, form, callback, ajaxOptions) {
var self = this;
if(!form || !form.length) var form = $('.cms-content-form form:first');
if(!form || !form.length) var form = $('.cms-content-fields form:first');
// Alert when unsaved changes are present
if(form._checkChangeTracker(true) == false) return false;

View File

@ -88,6 +88,16 @@
this._super();
},
beforeLoad: function(url) {
this.addClass('loading');
this.cleanup();
},
afterLoad: function(data, status, xhr) {
this.removeClass('loading');
this.replaceWith(data);
},
/**
* Function: _setupChangeTracker

View File

@ -137,7 +137,7 @@
var firstLink = this.find('a[href]');
if(!firstLink) return;
window.History.pushState({selector: '.cms-edit-form'}, '', firstLink.attr('href'));
window.History.pushState({selector: '.cms-content-fields form:first'}, '', firstLink.attr('href'));
return false;
}
});

View File

@ -51,7 +51,7 @@ body .ui-widget {
.cms-content,
.cms-content-header,
.cms-content-tools,
.cms-content-form,
.cms-content-fields,
.cms-edit-form {
@include inline-block;
}
@ -412,7 +412,7 @@ form.member-profile-form {
}
.cms-content-form {
.cms-content-fields {
overflow: auto;
}

View File

@ -21,7 +21,7 @@
</div>
</div>
<div class="cms-content-form center">
<div class="cms-content-fields center">
<!-- <div class="cms-content-tools west">
$Left

View File

@ -1,4 +1,4 @@
<div class="cms-content center" data-layout="{type: 'border'}">
<div class="cms-content center $BaseCSSClasses" data-layout="{type: 'border'}">
<div class="cms-content-header north">
<div>
@ -41,7 +41,7 @@
</div>
<div class="cms-content-form center ui-widget-content">
<div class="cms-content-fields center ui-widget-content">
$EditForm
</div>

View File

@ -1,4 +1,4 @@
<div class="cms-content center" data-layout="{type: 'border'}">
<div class="cms-content center $BaseCSSClasses" data-layout="{type: 'border'}">
<div class="cms-content-header north">
<div>
@ -31,7 +31,7 @@
</div>
<div class="cms-content-form center ui-widget-content">
<div class="cms-content-fields center ui-widget-content">
$EditForm
</div>