From 8edc079e92ba4626170ef593d524793431c2a4e2 Mon Sep 17 00:00:00 2001 From: Damian Mooyman Date: Thu, 23 Apr 2015 14:27:30 +1200 Subject: [PATCH] API Improve sizing of blog sidebar --- code/model/Blog.php | 3 +- code/model/BlogPost.php | 1 + js/cms.js | 118 +++++++++++++++++++++++++++++++++++++ js/expandable-help-text.js | 49 --------------- js/merge-action.js | 44 -------------- 5 files changed, 120 insertions(+), 95 deletions(-) create mode 100644 js/cms.js delete mode 100644 js/expandable-help-text.js delete mode 100644 js/merge-action.js diff --git a/code/model/Blog.php b/code/model/Blog.php index d3c7e9c..b4f2c8c 100644 --- a/code/model/Blog.php +++ b/code/model/Blog.php @@ -80,8 +80,7 @@ class Blog extends Page implements PermissionProvider { public function getCMSFields() { Requirements::css(BLOGGER_DIR . '/css/cms.css'); - Requirements::javascript(BLOGGER_DIR . '/js/expandable-help-text.js'); - Requirements::javascript(BLOGGER_DIR . '/js/merge-action.js'); + Requirements::javascript(BLOGGER_DIR . '/js/cms.js'); $self =& $this; diff --git a/code/model/BlogPost.php b/code/model/BlogPost.php index 7f05cbb..95634c8 100644 --- a/code/model/BlogPost.php +++ b/code/model/BlogPost.php @@ -108,6 +108,7 @@ class BlogPost extends Page { public function getCMSFields() { Requirements::css(BLOGGER_DIR . '/css/cms.css'); + Requirements::javascript(BLOGGER_DIR . '/js/cms.js'); $self =& $this; $this->beforeUpdateCMSFields(function($fields) use ($self) { diff --git a/js/cms.js b/js/cms.js new file mode 100644 index 0000000..15bae53 --- /dev/null +++ b/js/cms.js @@ -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(''); + }); + + $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); diff --git a/js/expandable-help-text.js b/js/expandable-help-text.js deleted file mode 100644 index e64a3fe..0000000 --- a/js/expandable-help-text.js +++ /dev/null @@ -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); diff --git a/js/merge-action.js b/js/merge-action.js deleted file mode 100644 index 74530b8..0000000 --- a/js/merge-action.js +++ /dev/null @@ -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(''); - }); - - $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));