API Improve sizing of blog sidebar

This commit is contained in:
Damian Mooyman 2015-04-23 14:27:30 +12:00
parent 7f5bf0cda9
commit 8edc079e92
5 changed files with 120 additions and 95 deletions

View File

@ -80,8 +80,7 @@ class Blog extends Page implements PermissionProvider {
public function getCMSFields() { public function getCMSFields() {
Requirements::css(BLOGGER_DIR . '/css/cms.css'); Requirements::css(BLOGGER_DIR . '/css/cms.css');
Requirements::javascript(BLOGGER_DIR . '/js/expandable-help-text.js'); Requirements::javascript(BLOGGER_DIR . '/js/cms.js');
Requirements::javascript(BLOGGER_DIR . '/js/merge-action.js');
$self =& $this; $self =& $this;

View File

@ -108,6 +108,7 @@ class BlogPost extends Page {
public function getCMSFields() { public function getCMSFields() {
Requirements::css(BLOGGER_DIR . '/css/cms.css'); Requirements::css(BLOGGER_DIR . '/css/cms.css');
Requirements::javascript(BLOGGER_DIR . '/js/cms.js');
$self =& $this; $self =& $this;
$this->beforeUpdateCMSFields(function($fields) use ($self) { $this->beforeUpdateCMSFields(function($fields) use ($self) {

118
js/cms.js Normal file
View File

@ -0,0 +1,118 @@
(function ($) {
$.entwine('ss', function ($) {
/**
* Register expandable help text functions with fields.
*/
$('.toggle-description').entwine({
'onadd': function () {
var $this = $(this);
/**
* Prevent multiple events being added.
*/
if ($this.hasClass('toggle-description-enabled')) {
return;
}
$this.addClass('toggle-description-enabled');
/**
* Toggle next description when button is clicked.
*/
var shown = false;
$this.on('click', function() {
$this.parent().next('.description')[shown ? 'hide' : 'show']();
$this.toggleClass('toggle-description-shown');
shown = !shown;
});
/**
* Hide next description by default.
*/
$this.parent().next('.description').hide();
/**
* Add classes to correct inherited layout issues in a small context.
*/
$this.parent().addClass('toggle-description-correct-right');
$this.parent().prev('.middleColumn').addClass('toggle-description-correct-middle');
$this.parent().next('.description').addClass('toggle-description-correct-description');
}
});
/**
* Custom merge actions for tags and categories
*/
$('.MergeAction').entwine({
'onadd': function() {
var $this = $(this);
$this.on('click', 'select', function() {
return false;
});
$this.children('button').each(function(i, button) {
var $button = $(button);
var $select = $button.prev('select');
$button.before('<input type="hidden" name="' + $button.attr('data-target') + '" value="' + $select.val() + '" />');
});
$this.on('change', 'select', function(e) {
var $target = $(e.target);
$target.next('input').val($target.val());
});
$this.children('button, select').hide();
$this.on('click', '.MergeActionReveal', function(e) {
var $target = $(e.target);
$target.parent().children('button, select').show();
$target.hide();
return false;
});
}
});
/**
* Customise the cms-panel behaviour for blog sidebar
*
* see LeftAndMain.Panel.js for base behaviour
*/
$('.blog-admin-sidebar.cms-panel').entwine({
minInnerWidth: 620,
onadd: function() {
this._super();
this.updateLayout();
// If this panel is open and the left hand column is smaller than the minimum, contract it instead
if(!this.hasClass('collapsed') && ($(".blog-admin-outer").width() < this.getminInnerWidth())) {
this.collapsePanel();
}
},
togglePanel: function(bool, silent) {
this._super(bool, silent);
this.updateLayout();
},
/**
* Adjust minimum width of content to account for extra panel
*
* @returns {undefined}
*/
updateLayout: function() {
$('.cms-container').updateLayoutOptions({
minContentWidth: 820 + this.width()
});
}
});
});
})(jQuery);

View File

@ -1,49 +0,0 @@
/**
* Register expandable help text functions with fields.
*/
(function ($) {
$.entwine('ss', function ($) {
$('.toggle-description').entwine({
'onadd': function () {
var $this = $(this);
/**
* Prevent multiple events being added.
*/
if ($this.hasClass('toggle-description-enabled')) {
return;
}
$this.addClass('toggle-description-enabled');
/**
* Toggle next description when button is clicked.
*/
var shown = false;
$this.on('click', function() {
$this.parent().next('.description')[shown ? 'hide' : 'show']();
$this.toggleClass('toggle-description-shown');
shown = !shown;
});
/**
* Hide next description by default.
*/
$this.parent().next('.description').hide();
/**
* Add classes to correct inherited layout issues in a small context.
*/
$this.parent().addClass('toggle-description-correct-right');
$this.parent().prev('.middleColumn').addClass('toggle-description-correct-middle');
$this.parent().next('.description').addClass('toggle-description-correct-description');
}
});
});
})(jQuery);

View File

@ -1,44 +0,0 @@
/**
* Register expandable help text functions with fields.
*/
(function ($) {
$.entwine('ss', function ($) {
$('.MergeAction').entwine({
'onadd': function() {
var $this = $(this);
$this.on('click', 'select', function() {
return false;
});
$this.children('button').each(function(i, button) {
var $button = $(button);
var $select = $button.prev('select');
$button.before('<input type="hidden" name="' + $button.attr('data-target') + '" value="' + $select.val() + '" />');
});
$this.on('change', 'select', function(e) {
var $target = $(e.target);
$target.next('input').val($target.val());
});
$this.children('button, select').hide();
$this.on('click', '.MergeActionReveal', function(e) {
var $target = $(e.target);
$target.parent().children('button, select').show();
$target.hide();
return false;
});
}
})
});
}(jQuery));