mirror of
https://github.com/silverstripe/silverstripe-framework
synced 2024-09-06 09:41:36 +02:00
The main benefit of this is so that authors who make use of .editorconfig don't end up with whitespace changes in their PRs. Spaces vs. tabs has been left alone, although that could do with a tidy-up in SS4 after the switch to PSR-1/2. The command used was this: for match in '*.ss' '*.css' '*.scss' '*.html' '*.yml' '*.php' '*.js' '*.csv' '*.inc' '*.php5'; do find . -path ./thirdparty -not -prune -o -path ./admin/thirdparty -not -prune -o -type f -name "$match" -exec sed -E -i '' 's/[[:space:]]+$//' {} \+ find . -path ./thirdparty -not -prune -o -path ./admin/thirdparty -not -prune -o -type f -name "$match" | xargs perl -pi -e 's/ +$//' done
181 lines
6.3 KiB
JavaScript
181 lines
6.3 KiB
JavaScript
/**
|
|
* File: LeftAndMain.Layout.js
|
|
*/
|
|
|
|
(function($) {
|
|
|
|
$.fn.layout.defaults.resize = false;
|
|
|
|
/**
|
|
* Acccess the global variable in the same way the plugin does it.
|
|
*/
|
|
jLayout = (typeof jLayout === 'undefined') ? {} : jLayout;
|
|
|
|
/**
|
|
* Factory function for generating new type of algorithm for our CMS.
|
|
*
|
|
* Spec requires a definition of three column elements:
|
|
* - `menu` on the left
|
|
* - `content` area in the middle (includes the EditForm, side tool panel, actions, breadcrumbs and tabs)
|
|
* - `preview` on the right (will be shown if there is enough space)
|
|
*
|
|
* Required options:
|
|
* - `minContentWidth`: minimum size for the content display as long as the preview is visible
|
|
* - `minPreviewWidth`: preview will not be displayed below this size
|
|
* - `mode`: one of "split", "content" or "preview"
|
|
*
|
|
* The algorithm first checks which columns are to be visible and which hidden.
|
|
*
|
|
* In the case where both preview and content should be shown it first tries to assign half of non-menu space to
|
|
* preview and the other half to content. Then if there is not enough space for either content or preview, it tries
|
|
* to allocate the minimum acceptable space to that column, and the rest to the other one. If the minimum
|
|
* requirements are still not met, it falls back to showing content only.
|
|
*
|
|
* @param spec A structure defining columns and parameters as per above.
|
|
*/
|
|
jLayout.threeColumnCompressor = function (spec, options) {
|
|
// Spec sanity checks.
|
|
if (typeof spec.menu==='undefined' ||
|
|
typeof spec.content==='undefined' ||
|
|
typeof spec.preview==='undefined') {
|
|
throw 'Spec is invalid. Please provide "menu", "content" and "preview" elements.';
|
|
}
|
|
if (typeof options.minContentWidth==='undefined' ||
|
|
typeof options.minPreviewWidth==='undefined' ||
|
|
typeof options.mode==='undefined') {
|
|
throw 'Spec is invalid. Please provide "minContentWidth", "minPreviewWidth", "mode"';
|
|
}
|
|
if (options.mode!=='split' && options.mode!=='content' && options.mode!=='preview') {
|
|
throw 'Spec is invalid. "mode" should be either "split", "content" or "preview"';
|
|
}
|
|
|
|
// Instance of the algorithm being produced.
|
|
var obj = {
|
|
options: options
|
|
};
|
|
|
|
// Internal column handles, also implementing layout.
|
|
var menu = $.jLayoutWrap(spec.menu),
|
|
content = $.jLayoutWrap(spec.content),
|
|
preview = $.jLayoutWrap(spec.preview);
|
|
|
|
/**
|
|
* Required interface implementations follow.
|
|
* Refer to https://github.com/bramstein/jlayout#layout-algorithms for the interface spec.
|
|
*/
|
|
obj.layout = function (container) {
|
|
var size = container.bounds(),
|
|
insets = container.insets(),
|
|
top = insets.top,
|
|
bottom = size.height - insets.bottom,
|
|
left = insets.left,
|
|
right = size.width - insets.right;
|
|
|
|
var menuWidth = spec.menu.width(),
|
|
contentWidth = 0,
|
|
previewWidth = 0;
|
|
|
|
if (this.options.mode==='preview') {
|
|
// All non-menu space allocated to preview.
|
|
contentWidth = 0;
|
|
previewWidth = right - left - menuWidth;
|
|
} else if (this.options.mode==='content') {
|
|
// All non-menu space allocated to content.
|
|
contentWidth = right - left - menuWidth;
|
|
previewWidth = 0;
|
|
} else { // ==='split'
|
|
// Split view - first try 50-50 distribution.
|
|
contentWidth = (right - left - menuWidth) / 2;
|
|
previewWidth = right - left - (menuWidth + contentWidth);
|
|
|
|
// If violating one of the minima, try to readjust towards satisfying it.
|
|
if (contentWidth < this.options.minContentWidth) {
|
|
contentWidth = this.options.minContentWidth;
|
|
previewWidth = right - left - (menuWidth + contentWidth);
|
|
} else if (previewWidth < this.options.minPreviewWidth) {
|
|
previewWidth = this.options.minPreviewWidth;
|
|
contentWidth = right - left - (menuWidth + previewWidth);
|
|
}
|
|
|
|
// If still violating one of the (other) minima, remove the preview and allocate everything to content.
|
|
if (contentWidth < this.options.minContentWidth || previewWidth < this.options.minPreviewWidth) {
|
|
contentWidth = right - left - menuWidth;
|
|
previewWidth = 0;
|
|
}
|
|
}
|
|
|
|
// Calculate what columns are already hidden pre-layout
|
|
var prehidden = {
|
|
content: spec.content.hasClass('column-hidden'),
|
|
preview: spec.preview.hasClass('column-hidden')
|
|
};
|
|
|
|
// Calculate what columns will be hidden (zero width) post-layout
|
|
var posthidden = {
|
|
content: contentWidth === 0,
|
|
preview: previewWidth === 0
|
|
};
|
|
|
|
// Apply classes for elements that might not be visible at all.
|
|
spec.content.toggleClass('column-hidden', posthidden.content);
|
|
spec.preview.toggleClass('column-hidden', posthidden.preview);
|
|
|
|
// Apply the widths to columns, and call subordinate layouts to arrange the children.
|
|
menu.bounds({'x': left, 'y': top, 'height': bottom - top, 'width': menuWidth});
|
|
menu.doLayout();
|
|
|
|
left += menuWidth;
|
|
|
|
content.bounds({'x': left, 'y': top, 'height': bottom - top, 'width': contentWidth});
|
|
if (!posthidden.content) content.doLayout();
|
|
|
|
left += contentWidth;
|
|
|
|
preview.bounds({'x': left, 'y': top, 'height': bottom - top, 'width': previewWidth});
|
|
if (!posthidden.preview) preview.doLayout();
|
|
|
|
if (posthidden.content !== prehidden.content) spec.content.trigger('columnvisibilitychanged');
|
|
if (posthidden.preview !== prehidden.preview) spec.preview.trigger('columnvisibilitychanged');
|
|
|
|
// Calculate whether preview is possible in split mode
|
|
if (contentWidth + previewWidth < options.minContentWidth + options.minPreviewWidth) {
|
|
spec.preview.trigger('disable');
|
|
} else {
|
|
spec.preview.trigger('enable');
|
|
}
|
|
|
|
return container;
|
|
};
|
|
|
|
/**
|
|
* Helper to generate the required `preferred`, `minimum` and `maximum` interface functions.
|
|
*/
|
|
function typeLayout(type) {
|
|
var func = type + 'Size';
|
|
|
|
return function (container) {
|
|
var menuSize = menu[func](),
|
|
contentSize = content[func](),
|
|
previewSize = preview[func](),
|
|
insets = container.insets();
|
|
|
|
width = menuSize.width + contentSize.width + previewSize.width;
|
|
height = Math.max(menuSize.height, contentSize.height, previewSize.height);
|
|
|
|
return {
|
|
'width': insets.left + insets.right + width,
|
|
'height': insets.top + insets.bottom + height
|
|
};
|
|
};
|
|
}
|
|
|
|
// Generate interface functions.
|
|
obj.preferred = typeLayout('preferred');
|
|
obj.minimum = typeLayout('minimum');
|
|
obj.maximum = typeLayout('maximum');
|
|
|
|
return obj;
|
|
};
|
|
|
|
}(jQuery));
|