mirror of
https://github.com/silverstripe/silverstripe-cms
synced 2024-10-22 08:05:56 +02:00
ENHANCEMENT Using jQuery layout manager plugin to size panels in main CMS interface. Removed custom javascript resizing and CSS rules.
API CHANGE Removed custom resizing javascript methods: window.ontabschanged, window.onresize, fixRightWidth(), fixHeight_left() API CHANGE Removed DraggableSeparator, SideTabs, SideTabItem javascript classes API CHANGE Removed Effect.ReSize and Highlighter javascript helper classes API CHANGE Modified template structure in CMSMain_left.ss, CMSMain_right.ss and LeftAndMain.ss API CHANGE Modified markup IDs in LeftAndMain/CMSMain templates, removed "left", "right", "contentPanel", "bottom" ENHANCEMENT Using jquery-latest (currently 1.3) in CMSMain and LeftAndMain ENHANCEMENT Added jQuery UI library and "smoothness" theme to default CMS interface git-svn-id: svn://svn.silverstripe.com/silverstripe/open/modules/cms/trunk@92581 467b73ca-7a2a-4603-9d3b-597d59a354a9
This commit is contained in:
Ingo Schommer
parent
5ff353aa72
commit
ae56eba853
@ -101,6 +101,7 @@ class CMSMain extends LeftAndMain implements CurrentPageIdentifier, PermissionPr
|
||||
$langName = i18n::get_locale_name($this->Locale);
|
||||
HtmlEditorConfig::get('cms')->setOption('spellchecker_languages', "+{$langName}={$this->Locale}");
|
||||
|
||||
Requirements::javascript(CMS_DIR . '/javascript/CMSMain.js');
|
||||
Requirements::javascript(CMS_DIR . '/javascript/CMSMain_left.js');
|
||||
Requirements::javascript(CMS_DIR . '/javascript/CMSMain_right.js');
|
||||
}
|
||||
|
||||
@ -172,14 +172,26 @@ class LeftAndMain extends Controller {
|
||||
}
|
||||
|
||||
Requirements::javascript(THIRDPARTY_DIR . '/prototype.js');
|
||||
Requirements::javascript(THIRDPARTY_DIR . '/jquery/jquery.js');
|
||||
|
||||
Requirements::javascript(THIRDPARTY_DIR . '/jquery/jquery-latest.js');
|
||||
Requirements::javascript(THIRDPARTY_DIR . '/jquery/jquery_improvements.js');
|
||||
Requirements::javascript(THIRDPARTY_DIR . '/jquery/ui/ui.core.js');
|
||||
Requirements::javascript(THIRDPARTY_DIR . '/jquery/ui/ui.datepicker.js');
|
||||
Requirements::javascript(THIRDPARTY_DIR . '/jquery/ui/ui.draggable.js');
|
||||
Requirements::javascript(THIRDPARTY_DIR . '/jquery/ui/ui.droppable.js');
|
||||
Requirements::javascript(THIRDPARTY_DIR . '/jquery/ui/ui.accordion.js');
|
||||
Requirements::javascript(THIRDPARTY_DIR . '/jquery/ui/effects.core.js');
|
||||
Requirements::javascript(THIRDPARTY_DIR . '/jquery/ui/effects.slide.js');
|
||||
Requirements::javascript(THIRDPARTY_DIR . '/jquery/ui/effects.drop.js');
|
||||
Requirements::javascript(THIRDPARTY_DIR . '/jquery/ui/effects.scale.js');
|
||||
Requirements::javascript(THIRDPARTY_DIR . '/jquery/plugins/layout/jquery.layout.js');
|
||||
// @todo Load separately so the CSS files can be inlined
|
||||
Requirements::css(THIRDPARTY_DIR . '/jquery/themes/smoothness/ui.all.css');
|
||||
|
||||
Requirements::javascript(THIRDPARTY_DIR . '/behaviour.js');
|
||||
Requirements::javascript(THIRDPARTY_DIR . '/jquery/plugins/livequery/jquery.livequery.js');
|
||||
Requirements::javascript(SAPPHIRE_DIR . '/javascript/core/jquery.ondemand.js');
|
||||
Requirements::javascript(THIRDPARTY_DIR . '/prototype_improvements.js');
|
||||
Requirements::javascript(THIRDPARTY_DIR . '/loader.js');
|
||||
Requirements::javascript(THIRDPARTY_DIR . '/layout_helpers.js');
|
||||
Requirements::add_i18n_javascript(SAPPHIRE_DIR . '/javascript/lang');
|
||||
Requirements::add_i18n_javascript(CMS_DIR . '/javascript/lang');
|
||||
|
||||
@ -226,7 +238,7 @@ class LeftAndMain extends Controller {
|
||||
'jsparty/prototype.js',
|
||||
'jsparty/behaviour.js',
|
||||
'jsparty/prototype_improvements.js',
|
||||
'jsparty/jquery/jquery.js',
|
||||
'jsparty/jquery/jquery-latest.js',
|
||||
'jsparty/jquery/plugins/livequery/jquery.livequery.js',
|
||||
'jsparty/jquery/plugins/effen/jquery.fn.js',
|
||||
'sapphire/javascript/core/jquery.ondemand.js',
|
||||
@ -240,7 +252,6 @@ class LeftAndMain extends Controller {
|
||||
'assets/leftandmain.js',
|
||||
array(
|
||||
'jsparty/loader.js',
|
||||
'jsparty/layout_helpers.js',
|
||||
'jsparty/scriptaculous/effects.js',
|
||||
'jsparty/scriptaculous/dragdrop.js',
|
||||
'jsparty/scriptaculous/controls.js',
|
||||
@ -250,8 +261,8 @@ class LeftAndMain extends Controller {
|
||||
'cms/javascript/LeftAndMain_left.js',
|
||||
'cms/javascript/LeftAndMain_right.js',
|
||||
'jsparty/tree/tree.js',
|
||||
'jsparty/tabstrip/tabstrip.js',
|
||||
'jsparty/SWFUpload/swfupload.js',
|
||||
'cms/javascript/TinyMCEImageEnhancement.js',
|
||||
'sapphire/thirdparty/swfupload/SWFUpload.js',
|
||||
'cms/javascript/Upload.js',
|
||||
'cms/javascript/TinyMCEImageEnhancement.js',
|
||||
'sapphire/javascript/TreeSelectorField.js',
|
||||
|
||||
@ -196,6 +196,15 @@ ul.tree span.a span.modified,
|
||||
#treepanes {
|
||||
background-color: #fff;
|
||||
}
|
||||
#treepanes .ui-accordion-content {
|
||||
padding: 0;
|
||||
}
|
||||
.ui-layout-pane-west {
|
||||
/* OVERRIDE 'default styles' */
|
||||
padding: 0 !important;
|
||||
overflow: hidden !important;
|
||||
}
|
||||
|
||||
#treepanes h2 {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
@ -233,6 +233,12 @@
|
||||
clear: left;
|
||||
}
|
||||
|
||||
/* Overflow is handled by tabsets inside the panel */
|
||||
.ui-layout-center {
|
||||
overflow: hidden !important;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* RHS Action Parameters boxes
|
||||
*/
|
||||
|
||||
199
css/layout.css
199
css/layout.css
@ -5,22 +5,110 @@
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
}
|
||||
|
||||
html {
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
body {
|
||||
height: 100%;
|
||||
background: #ccdef3;
|
||||
}
|
||||
|
||||
/*
|
||||
* Default Layout Theme
|
||||
*
|
||||
* Created for jquery.layout
|
||||
*
|
||||
* Copyright (c) 2008
|
||||
* Fabrizio Balliano (http://www.fabrizioballiano.net)
|
||||
* Kevin Dalman (http://allpro.net)
|
||||
*
|
||||
* Dual licensed under the GPL (http://www.gnu.org/licenses/gpl.html)
|
||||
* and MIT (http://www.opensource.org/licenses/mit-license.php) licenses.
|
||||
*
|
||||
* Last Updated: 2009-03-04
|
||||
* NOTE: For best code readability, view this with a fixed-space font and tabs equal to 4-chars
|
||||
*/
|
||||
|
||||
/*
|
||||
* PANES
|
||||
*/
|
||||
.ui-layout-pane { /* all 'panes' */
|
||||
background: #FFF;
|
||||
/*border: 1px solid #BBB;*/
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
/*
|
||||
* RESIZER-BARS
|
||||
*/
|
||||
.ui-layout-resizer { /* all 'resizer-bars' */
|
||||
background: #DDD;
|
||||
border: 1px solid #BBB;
|
||||
border-width: 0;
|
||||
opacity: 1; /* on-hover, show the resizer-bar normally */
|
||||
filter: alpha(opacity=100);
|
||||
}
|
||||
|
||||
.ui-layout-resizer-open:hover , /* hover-color to 'resize' */
|
||||
.ui-layout-resizer-dragging { /* resizer beging 'dragging' */
|
||||
background: #EEE;
|
||||
}
|
||||
.ui-layout-resizer-dragging { /* CLONED resizer being dragged */
|
||||
border-left: 1px solid #BBB;
|
||||
border-right: 1px solid #BBB;
|
||||
}
|
||||
.ui-layout-resizer-drag { /* REAL resizer while resize in progress */
|
||||
}
|
||||
|
||||
.ui-layout-resizer-closed:hover { /* hover-color to 'slide open' */
|
||||
background: #EEE;
|
||||
}
|
||||
.ui-layout-resizer-sliding { /* resizer when pane was 'slid open' */
|
||||
opacity: 0.1; /* show only a slight shadow */
|
||||
filter: alpha(opacity=10);
|
||||
}
|
||||
.ui-layout-resizer-sliding:hover { /* sliding resizer - hover */
|
||||
opacity: 1; /* on-hover, show the resizer-bar normally */
|
||||
filter: alpha(opacity=100);
|
||||
}
|
||||
/* sliding resizer - add 'outside-border' to resizer on-hover */
|
||||
.ui-layout-resizer-north-sliding:hover { border-bottom-width: 1px; }
|
||||
.ui-layout-resizer-south-sliding:hover { border-top-width: 1px; }
|
||||
.ui-layout-resizer-west-sliding:hover { border-right-width: 1px; }
|
||||
.ui-layout-resizer-east-sliding:hover { border-left-width: 1px; }
|
||||
|
||||
|
||||
/*
|
||||
* TOGGLER-BUTTONS
|
||||
*/
|
||||
.ui-layout-toggler {
|
||||
color: #666;
|
||||
/*border: 1px solid #BBB;*/ /* match pane-border */
|
||||
background-color: #999;
|
||||
}
|
||||
.ui-layout-toggler:hover {
|
||||
background-color: #FC6;
|
||||
}
|
||||
.ui-layout-toggler-north ,
|
||||
.ui-layout-toggler-south {
|
||||
border-width: 0 1px;
|
||||
}
|
||||
.ui-layout-toggler-west ,
|
||||
.ui-layout-toggler-east {
|
||||
border-width: 1px 0;
|
||||
}
|
||||
/* hide the toggler-button when the pane is 'slid open' */
|
||||
.ui-layout-resizer-sliding ui-layout-toggler {
|
||||
display: none;
|
||||
}
|
||||
/*
|
||||
* style the text we put INSIDE the east/west togglers
|
||||
*/
|
||||
.ui-layout-toggler .content {
|
||||
font: 30px bold Verdana, Arial, Helvetica, sans-serif;
|
||||
padding-bottom: 0.35ex; /* to 'vertically center' text inside text-span */
|
||||
}
|
||||
|
||||
/**
|
||||
* Actions/Buttons
|
||||
*/
|
||||
.ajaxActions {
|
||||
position: absolute;
|
||||
bottom: 5px;
|
||||
right: 8px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
@ -121,43 +209,11 @@ body.stillLoading select {
|
||||
}
|
||||
|
||||
/** 3-PANEL LAYOUT **/
|
||||
#top {
|
||||
.ss-cms-top-menu {
|
||||
font-size: 14px;
|
||||
height: 33px;
|
||||
background: #474855 url(../images/mainmenu/top-bg.gif) top left repeat-x;
|
||||
color: #fff;
|
||||
overflow: hidden;
|
||||
}
|
||||
#left {
|
||||
position: absolute;
|
||||
top: 45px;
|
||||
left: 3px;
|
||||
width: 205px;
|
||||
height: 91%;
|
||||
z-index: 50;
|
||||
border: 1px solid #acbbcc;
|
||||
background: #fff;
|
||||
}
|
||||
#right {
|
||||
position: absolute;
|
||||
left: 208px;
|
||||
top: 45px;
|
||||
height: 91%;
|
||||
width: 600px;
|
||||
overflow: auto;
|
||||
z-index: 50;
|
||||
border: 1px solid #acbbcc;
|
||||
background: #eee;
|
||||
margin-right: 3px;
|
||||
}
|
||||
|
||||
#separator {
|
||||
position: absolute;
|
||||
top: 51px;
|
||||
left: 205px;
|
||||
height: 92%;
|
||||
width: 3px;
|
||||
cursor: e-resize;
|
||||
}
|
||||
|
||||
/**
|
||||
@ -171,10 +227,6 @@ body.stillLoading select {
|
||||
width: 18px;
|
||||
display: block;
|
||||
}
|
||||
#separator.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
#left div.title, #right div.title {
|
||||
border-top: 1px solid #77BBEE;
|
||||
@ -204,17 +256,17 @@ body.stillLoading select {
|
||||
}
|
||||
|
||||
/** TOP PANEL **/
|
||||
#top #MainMenu {
|
||||
.ss-cms-top-menu #MainMenu {
|
||||
margin: 0 0 0 6px;
|
||||
}
|
||||
#top #MainMenu li {
|
||||
.ss-cms-top-menu #MainMenu li {
|
||||
margin: 0 4px;
|
||||
float: left;
|
||||
height: 33px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#top #MainMenu a {
|
||||
.ss-cms-top-menu #MainMenu a {
|
||||
display: block;
|
||||
height: 33px;
|
||||
float: left;
|
||||
@ -227,28 +279,28 @@ body.stillLoading select {
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
}
|
||||
#top #MainMenu a:hover {
|
||||
.ss-cms-top-menu #MainMenu a:hover {
|
||||
text-decoration: none;
|
||||
background: #6a7580 url(../images/mainmenu/hover.gif) repeat-x left top;
|
||||
}
|
||||
|
||||
#top #MainMenu .current {
|
||||
.ss-cms-top-menu #MainMenu .current {
|
||||
background: #ccdef3 url(../images/mainmenu/current.gif) repeat-x left top;
|
||||
border-bottom : none;
|
||||
}
|
||||
#top #MainMenu .current a:hover {
|
||||
.ss-cms-top-menu #MainMenu .current a:hover {
|
||||
background: #cddef3 url(../images/mainmenu/currentHover.gif) repeat-x left top;
|
||||
}
|
||||
|
||||
#top #MainMenu .current a:link,
|
||||
#top #MainMenu .current a:visited {
|
||||
.ss-cms-top-menu #MainMenu .current a:link,
|
||||
.ss-cms-top-menu #MainMenu .current a:visited {
|
||||
color : #2f383f;
|
||||
}
|
||||
|
||||
#top #Logo {
|
||||
.ss-cms-top-menu #Logo {
|
||||
float: right;
|
||||
}
|
||||
#top #Logo a {
|
||||
.ss-cms-top-menu #Logo a {
|
||||
margin: 0;
|
||||
display: block;
|
||||
font-size: 14px;
|
||||
@ -262,61 +314,54 @@ body.stillLoading select {
|
||||
background: url(../images/mainmenu/logo.gif) right top no-repeat;
|
||||
color: #fff;
|
||||
}
|
||||
html > body #top #Logo {
|
||||
html > body .ss-cms-top-menu #Logo {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
#bottom {
|
||||
.ss-cms-bottom-bar {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
height: 23px;
|
||||
overflow: hidden;
|
||||
background: #4d4e5a url(../images/textures/footerBg.gif) repeat-x left top;
|
||||
}
|
||||
|
||||
#bottom .holder {
|
||||
.ss-cms-bottom-bar .holder {
|
||||
text-align: center;
|
||||
padding: 5px 6px 0 3px;
|
||||
font-size: 10px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#bottom #logInStatus {
|
||||
.ss-cms-bottom-bar #logInStatus {
|
||||
float: right;
|
||||
}
|
||||
#bottom a {
|
||||
.ss-cms-bottom-bar a {
|
||||
color: #fff;
|
||||
background: none;
|
||||
}
|
||||
#bottom a:hover {
|
||||
.ss-cms-bottom-bar a:hover {
|
||||
text-decoration: none;
|
||||
color: #ccc;
|
||||
}
|
||||
#bottom #logInStatus #LogoutLink {
|
||||
.ss-cms-bottom-bar #logInStatus #LogoutLink {
|
||||
background: url(../images/logout.gif) no-repeat right top;
|
||||
padding-right: 20px;
|
||||
padding-bottom: 3px;
|
||||
}
|
||||
#bottom #switchView {
|
||||
.ss-cms-bottom-bar #switchView {
|
||||
float: left;
|
||||
}
|
||||
#bottom #switchView a, #bottom #switchView span {
|
||||
.ss-cms-bottom-bar #switchView a, .ss-cms-bottom-bar #switchView span {
|
||||
background: none;
|
||||
padding-left: 8px;
|
||||
padding-right: 8px;
|
||||
display: inline-block;
|
||||
border-left: 1px solid #AAA;
|
||||
}
|
||||
#bottom #switchView span {
|
||||
.ss-cms-bottom-bar #switchView span {
|
||||
border-left: none;
|
||||
}
|
||||
#bottom .bottomTabs a {
|
||||
.ss-cms-bottom-bar .bottomTabs a {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#bottom .bottomTabs div.blank {
|
||||
.ss-cms-bottom-bar .bottomTabs div.blank {
|
||||
display: block;
|
||||
float: left;
|
||||
cursor: pointer;
|
||||
@ -328,10 +373,10 @@ body.stillLoading select {
|
||||
padding-left: 2px;
|
||||
color: #fff;
|
||||
}
|
||||
#bottom .bottomTabs .current {
|
||||
.ss-cms-bottom-bar .bottomTabs .current {
|
||||
color: #ccc;
|
||||
}
|
||||
#bottom .bottomTabs a:hover {
|
||||
.ss-cms-bottom-bar .bottomTabs a:hover {
|
||||
color: #ccc;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
66
javascript/CMSMain.js
Normal file
66
javascript/CMSMain.js
Normal file
@ -0,0 +1,66 @@
|
||||
var outerLayout;
|
||||
var innerLayout;
|
||||
|
||||
jQuery(document).ready(function () {
|
||||
|
||||
// layout containing the tree, CMS menu, the main form etc.
|
||||
outerLayout = jQuery('body').layout({
|
||||
defaults: {
|
||||
// TODO Reactivate once we have localized values
|
||||
togglerTip_open: '',
|
||||
togglerTip_closed: '',
|
||||
resizerTip: '',
|
||||
sliderTip: ''
|
||||
},
|
||||
// contains CMSMenu
|
||||
north: {
|
||||
slidable: false,
|
||||
resizable: false,
|
||||
size: 35,
|
||||
togglerLength_open: 0
|
||||
},
|
||||
// "Page view", "profile" and "logout" links
|
||||
south: {
|
||||
slidable: false,
|
||||
resizable: false,
|
||||
size: 20,
|
||||
togglerLength_open: 0
|
||||
},
|
||||
// "Insert link" etc.
|
||||
east: {
|
||||
initClosed: true,
|
||||
fxName: "none"
|
||||
},
|
||||
// Tree, page version history
|
||||
west: {
|
||||
size: 250,
|
||||
onresize: function () { jQuery("#treepanes").accordion("resize"); },
|
||||
onopen: function () { jQuery("#treepanes").accordion("resize"); },
|
||||
fxName: "none"
|
||||
},
|
||||
// Page forms
|
||||
center: {
|
||||
onresize: "innerLayout.resizeAll"
|
||||
}
|
||||
});
|
||||
|
||||
// Layout for the form and its buttons
|
||||
innerLayout = jQuery('#right').layout({
|
||||
center: {},
|
||||
south: {
|
||||
slidable: false,
|
||||
resizable: false,
|
||||
size: 30,
|
||||
togglerLength_open: 0
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
// Adjust tree accordion etc. in left panel to work correctly
|
||||
// with jQuery.layout (see http://layout.jquery-dev.net/tips.html#Widget_Accordion)
|
||||
jQuery("#treepanes").accordion({
|
||||
fillSpace: true,
|
||||
animated: false
|
||||
});
|
||||
|
||||
});
|
||||
@ -1,92 +1,6 @@
|
||||
var _AJAX_LOADING = false;
|
||||
|
||||
// Resize the tabs once the document is properly loaded
|
||||
// @todo most of this file needs to be tidied up using jQuery
|
||||
if(typeof(jQuery) != 'undefined') {
|
||||
(function($) {
|
||||
$(document).ready(function() {
|
||||
window.onresize(true);
|
||||
});
|
||||
})(jQuery);
|
||||
}
|
||||
|
||||
/**
|
||||
* Code for the separator bar between the two panes
|
||||
*/
|
||||
function DraggableSeparator() {
|
||||
this.onmousedown = this.onmousedown.bindAsEventListener(this);
|
||||
// this.onselectstart = this.onselectstart.bindAsEventListener(this);
|
||||
}
|
||||
DraggableSeparator.prototype = {
|
||||
onmousedown : function(event) {
|
||||
this.leftBase = $('left').offsetWidth - Event.pointerX(event);
|
||||
this.separatorBase = getDimension($('separator'),'left') - Event.pointerX(event);
|
||||
this.rightBase = getDimension($('right'),'left') - Event.pointerX(event);
|
||||
|
||||
document.onmousemove = this.document_mousemove.bindAsEventListener(this);
|
||||
document.onmouseup = this.document_mouseup.bindAsEventListener(this);
|
||||
|
||||
document.body.onselectstart = this.body_selectstart.bindAsEventListener(this);
|
||||
},
|
||||
document_mousemove : function(event) {
|
||||
$('left').style.width = (this.leftBase + Event.pointerX(event)) + 'px';
|
||||
fixRightWidth();
|
||||
},
|
||||
document_mouseup : function(e) {
|
||||
document.onmousemove = null;
|
||||
},
|
||||
|
||||
body_selectstart : function(event) {
|
||||
Event.stop(event);
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
function fixRightWidth() {
|
||||
if(!$('right')) return;
|
||||
|
||||
// Absolutely position all the elements
|
||||
var sep = getDimension($('left'),'width') + getDimension($('left'),'left');
|
||||
$('separator').style.left = (sep + 2) + 'px';
|
||||
$('right').style.left = (sep + 6) + 'px';
|
||||
|
||||
// Give the remaining space to right
|
||||
var bodyWidth = parseInt(document.body.offsetWidth);
|
||||
var leftWidth = parseInt($('left').offsetWidth);
|
||||
var sepWidth = parseInt($('separator').offsetWidth - 8);
|
||||
var rightWidth = bodyWidth - leftWidth - sepWidth -18;
|
||||
|
||||
// Extra pane in right for insert image/flash/link things
|
||||
if($('contentPanel') && $('contentPanel').style.display != "none") {
|
||||
rightWidth -= 210;
|
||||
$('contentPanel').style.left = leftWidth + sepWidth + rightWidth + sepWidth + 23 + 'px';
|
||||
}
|
||||
|
||||
if(rightWidth >= 0) $('right').style.width = rightWidth + 'px';
|
||||
}
|
||||
|
||||
Behaviour.register({
|
||||
'#separator' : DraggableSeparator,
|
||||
|
||||
'#left' : {
|
||||
hide : function() {
|
||||
if(!this.hidden) {
|
||||
this.hidden = true;
|
||||
this.style.width = null;
|
||||
Element.addClassName(this,'hidden');
|
||||
Element.addClassName('separator','hidden');
|
||||
fixRightWidth();
|
||||
}
|
||||
},
|
||||
show : function() {
|
||||
if(this.hidden) {
|
||||
this.hidden = false;
|
||||
Element.removeClassName(this,'hidden');
|
||||
Element.removeClassName('separator','hidden');
|
||||
fixRightWidth();
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
'#MainMenu li' : {
|
||||
onclick : function(event) {
|
||||
@ -122,94 +36,6 @@ Behaviour.register({
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
||||
window.ontabschanged = function() {
|
||||
var formEl = $('Form_EditForm');
|
||||
if( !formEl ) formEl = $('Form_AddForm');
|
||||
|
||||
if( !formEl )
|
||||
return;
|
||||
|
||||
var fs = formEl.getElementsByTagName('fieldset')[0];
|
||||
if(fs) fs.style.height = formEl.style.height;
|
||||
|
||||
// var divs = document.getElementsBySelector('#Form_EditForm div');
|
||||
/*for(i=0;i<divs.length;i++) {
|
||||
if( ( Element.hasClassName(divs[i],'tab') || Element.hasClassName(divs[i],'tabset') ) && isVisible(divs[i]) ) {
|
||||
if(navigator.appName == "Microsoft Internet Explorer")
|
||||
fitToParent(divs[i], i == 0 ? 18 : 0);
|
||||
else
|
||||
fitToParent(divs[i], 3);
|
||||
}
|
||||
}*/
|
||||
|
||||
if(typeof _TAB_DIVS_ON_PAGE != 'undefined') {
|
||||
for(i = 0; i < _TAB_DIVS_ON_PAGE.length; i++ ) {
|
||||
fitToParent(_TAB_DIVS_ON_PAGE[i], 30);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
window.onresize = function(init) {
|
||||
var right = $('right');
|
||||
|
||||
if(typeof fitToParent == 'function') {
|
||||
fitToParent('right', 12);
|
||||
if($('ModelAdminPanel')) {
|
||||
fitToParent('ModelAdminPanel',-60);
|
||||
}
|
||||
if($('contentPanel')) {
|
||||
fitToParent('contentPanel', 12);
|
||||
}
|
||||
}
|
||||
|
||||
if( $('left') && $('separator') && right ) {
|
||||
// #right has padding-bottom to make room for AJAX Action buttons so we need to add that
|
||||
if (navigator.appName == "Microsoft Internet Explorer") {
|
||||
var paddingBottomOffset = 35;
|
||||
} else {
|
||||
var paddingBottomOffset = 20;
|
||||
}
|
||||
var rightH = parseInt(right.style.height) + paddingBottomOffset;
|
||||
$('left').style.height = $('separator').style.height = rightH + 'px';
|
||||
}
|
||||
|
||||
if(typeof fitToParent == 'function') {
|
||||
if($('Form_EditForm')) fitToParent('Form_EditForm', 4);
|
||||
if($('Form_AddForm')) fitToParent('Form_AddForm', 4);
|
||||
|
||||
if($('Form_EditorToolbarImageForm') && $('Form_EditorToolbarImageForm').style.display == "block") {
|
||||
fitToParent('Form_EditorToolbarImageForm', 5);
|
||||
fitToParent($('Form_EditorToolbarImageForm').getElementsByTagName('fieldset')[0]);
|
||||
if(navigator.appName == "Microsoft Internet Explorer") {
|
||||
fitToParent('Image');
|
||||
} else {
|
||||
fitToParent('Image', 250);
|
||||
}
|
||||
}
|
||||
if($('Form_EditorToolbarFlashForm') && $('Form_EditorToolbarFlashForm').style.display == "block") {
|
||||
fitToParent('Form_EditorToolbarFlashForm', 5);
|
||||
fitToParent($('Form_EditorToolbarFlashForm').getElementsByTagName('fieldset')[0]);
|
||||
if(navigator.appName == "Microsoft Internet Explorer") {
|
||||
fitToParent('Flash');
|
||||
} else {
|
||||
fitToParent('Flash', 130);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
if(typeof fixHeight_left == 'function') fixHeight_left();
|
||||
if(typeof fixRightWidth == 'function') fixRightWidth();
|
||||
|
||||
window.ontabschanged();
|
||||
}
|
||||
|
||||
appendLoader(function() {
|
||||
document.body.style.overflow = 'hidden';
|
||||
window.onresize(true);
|
||||
});
|
||||
|
||||
function isVisible(el) {
|
||||
// if(typeof el.isVisible != 'undefined') return el.isVisible;
|
||||
if(el.tagName == "body" || el.tagName == "BODY") return (el.isVisible = true);
|
||||
@ -783,4 +609,4 @@ Behaviour.register({
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
});
|
||||
|
||||
@ -469,7 +469,6 @@ treeactions = {
|
||||
if(li.selected) this.closeSelection(li, true);
|
||||
else this.openSelection(li, true);
|
||||
|
||||
fixHeight_left();
|
||||
return li.selected;
|
||||
},
|
||||
closeSelection : function(li, nested) {
|
||||
@ -480,8 +479,6 @@ treeactions = {
|
||||
li.selected = false;
|
||||
$(_HANDLER_FORMS[li.id]).notify('Close');
|
||||
if(li.onclose) li.onclose();
|
||||
|
||||
if(typeof nested == 'undefined') fixHeight_left();
|
||||
},
|
||||
openSelection: function(li, nested) {
|
||||
li = (li.tagName.toLowerCase() == 'button') ? li.parentNode : li;
|
||||
@ -495,20 +492,9 @@ treeactions = {
|
||||
for(i=0;i<set.length;i++) if(li != set[i] && set[i].selected) {
|
||||
this.closeSelection(set[i], true);
|
||||
}
|
||||
|
||||
if(typeof nested == 'undefined') fixHeight_left();
|
||||
}
|
||||
}
|
||||
|
||||
function fixHeight_left() {
|
||||
if($('treepanes')) {
|
||||
fitToParent('treepanes');
|
||||
var st = $('treepanes');
|
||||
if(st.resize) st.resize();
|
||||
}
|
||||
else fitToParent('sitetree_holder');
|
||||
}
|
||||
|
||||
// Build the site tree
|
||||
SiteTree.applyTo('#sitetree');
|
||||
|
||||
|
||||
@ -1,14 +1,10 @@
|
||||
<!-- <div class="title"><div style="background-image : url(cms/images/panels/MySite.png)">My Site</div></div> -->
|
||||
|
||||
<div id="treepanes">
|
||||
<h2 id="heading_sitetree" class="selected">
|
||||
<img id="sitetree_toggle_closed" src="sapphire/images/toggle-closed.gif" alt="+" style="display:none;" title="<% _t('OPENBOX','click to open this box') %>" />
|
||||
<img id="sitetree_toggle_open" src="sapphire/images/toggle-open.gif" alt="-" title="<% _t('CLOSEBOX','click to close box') %>" />
|
||||
<% _t('SITECONTENT TITLE','Site Content and Structure',PR_HIGH) %>
|
||||
</h2>
|
||||
<h3>
|
||||
<a href="#"><% _t('SITECONTENT TITLE','Site Content and Structure',PR_HIGH) %></a>
|
||||
</h3>
|
||||
<div id="sitetree_holder">
|
||||
<div id="TreeTools">
|
||||
<ul id="TreeActions">
|
||||
<ul id="TreeActions">
|
||||
<li class="action" id="addpage"><button><% _t('CREATE','Create',PR_HIGH) %></button></li>
|
||||
<li class="action" id="search"><button><% _t('SEARCH','Search',PR_HIGH) %></button></li>
|
||||
<li class="action" id="batchactions"><button><% _t('BATCHACTIONS','Batch Actions',PR_HIGH) %></button></li>
|
||||
@ -59,19 +55,18 @@
|
||||
<% end_control %>
|
||||
</select>
|
||||
<div id="searchIndicator"> </div>
|
||||
<input type="submit" id="SiteTreeSearchClearButton" class="action" value="<% _t('CLEAR','Clear') %>" title="<% _t('CLEARTITLE','Clear the search and view all items') %>" />
|
||||
<input type="submit" id="SiteTreeSearchButton" class="action" value="<% _t('SEARCH','Search') %>" title="<% _t('SEARCHTITLE','Search through URL, Title, Menu Title, & Content') %>" />
|
||||
<input type="submit" id="SiteTreeSearchClearButton" class="action" value="<% _t('CLEAR') %>" title="<% _t('CLEARTITLE','Clear the search and view all items') %>" />
|
||||
<input type="submit" id="SiteTreeSearchButton" class="action" value="<% _t('SEARCH') %>" title="<% _t('SEARCHTITLE','Search through URL, Title, Menu Title, & Content') %>" />
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
$BatchActionParameters
|
||||
|
||||
<div id="batchactionsforms" style="display: none">
|
||||
<form class="actionparams" style="border:0" id="batchactions_options" action="">
|
||||
<p><% _t('SELECTPAGESACTIONS','Select the pages that you want to change & then click an action:') %></p>
|
||||
|
||||
<input type="hidden" name="csvIDs" />
|
||||
<div id="actionParams"></div>
|
||||
|
||||
<div>
|
||||
<select id="choose_batch_action">
|
||||
<% control BatchActionList %>
|
||||
@ -82,14 +77,13 @@
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="checkboxAboveTree noBottomBorder">
|
||||
<div class="checkboxAboveTree" style="border-bottom:none">
|
||||
Show: <select id="siteTreeFilterList">
|
||||
<% control SiteTreeFilters %>
|
||||
<option value="$ClassName">$Title</option>
|
||||
<% end_control %>
|
||||
</select> <img id="siteTreeFilterActionIndicator" style="display:none" src="cms/images/network-save.gif">
|
||||
</div>
|
||||
<% if CanOrganiseSitetree %>
|
||||
<div class="checkboxAboveTree">
|
||||
<img id="checkboxActionIndicator" src="cms/images/network-save.gif">
|
||||
<div>
|
||||
@ -97,7 +91,7 @@
|
||||
<label for="sortitems"><% _t('ENABLEDRAGGING','Allow drag & drop reordering', PR_HIGH) %></label>
|
||||
</div>
|
||||
</div>
|
||||
<% end_if %>
|
||||
|
||||
<% if IsTranslatableEnabled %>
|
||||
<div id="LangSelector_holder">
|
||||
Language: $LangSelector
|
||||
@ -108,16 +102,16 @@
|
||||
<div id="sitetree_ul">
|
||||
$SiteTreeAsUL
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="publication_key">
|
||||
<% _t('KEY','Key:') %>
|
||||
<ins style="cursor: help" title="<% _t('ADDEDNOTPUB','Added to the draft site and not published yet') %>"><% _t('NEW','new') %></ins>
|
||||
<del style="cursor: help" title="<% _t('DELETEDSTILLLIVE','Deleted from the draft site but still on the live site') %>"><% _t('DEL','deleted') %></del>
|
||||
<span style="cursor: help" title="<% _t('EDITEDNOTPUB','Edited on the draft site and not published yet') %>" class="modified"><% _t('CHANGED','changed') %></span>
|
||||
<span style="cursor: help" title="<% _t('NOTINMENU','Excluded from navigation menus') %>" class="notinmenu"><% _t('HIDDEN','hidden') %></span>
|
||||
|
||||
</div>
|
||||
<div id="publication_key">
|
||||
<% _t('KEY','Key:') %>
|
||||
<ins style="cursor: help" title="<% _t('ADDEDNOTPUB','Added to the draft site and not published yet') %>"><% _t('NEW','new') %></ins>
|
||||
<del style="cursor: help" title="<% _t('DELETEDSTILLLIVE','Deleted from the draft site but still on the live site') %>"><% _t('DEL','deleted') %></del>
|
||||
<span style="cursor: help" title="<% _t('EDITEDNOTPUB','Edited on the draft site and not published yet') %>" class="modified"><% _t('CHANGED','changed') %></span>
|
||||
<span style="cursor: help" title="<% _t('NOTINMENU','Excluded from navigation menus') %>" class="notinmenu"><% _t('HIDDEN','hidden') %></span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--
|
||||
<div id="search_holder" style="display:none">
|
||||
@ -126,12 +120,10 @@
|
||||
</div>
|
||||
-->
|
||||
|
||||
<h2 id="heading_versions">
|
||||
<img id="versions_toggle_closed" src="sapphire/images/toggle-closed.gif" alt="+" title="<% _t('OPENBOX') %>" />
|
||||
<img id="versions_toggle_open" src="sapphire/images/toggle-open.gif" alt="-" style="display:none;" title="<% _t('CLOSEBOX') %>" />
|
||||
<% _t('PAGEVERSIONH','Page Version History') %>
|
||||
</h2>
|
||||
<div class="listpane" id="versions_holder" style="display:none">
|
||||
<h3>
|
||||
<a href="#"><% _t('PAGEVERSIONH','Page Version History') %></a>
|
||||
</h3>
|
||||
<div id="versions_holder">
|
||||
<p class="pane_actions" id="versions_actions">
|
||||
|
||||
<span class="versionChoice">
|
||||
@ -147,17 +139,12 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h2 id="heading_reports">
|
||||
<img id="reports_toggle_closed" src="sapphire/images/toggle-closed.gif" alt="+" title="<% _t('OPENBOX') %>" />
|
||||
<img id="reports_toggle_open" src="sapphire/images/toggle-open.gif" alt="-" style="display:none;" title="<% _t('CLOSEBOX') %>" />
|
||||
<% _t('SITEREPORTS','Site Reports') %>
|
||||
</h2>
|
||||
$ReportFormParameters
|
||||
<div class="listpane" id="reports_holder" style="display:none">
|
||||
<p id="ReportSelector_holder">
|
||||
$ReportSelector
|
||||
<input class="action" type="submit" id="report_select_go" onclick="$('reports_holder').showreport();" value="<% _t('GO','Go') %>" />
|
||||
</p>
|
||||
<div class="unitBody"></div>
|
||||
<h3>
|
||||
<a href="#"><% _t('SITEREPORTS','Site Reports') %></a>
|
||||
</h3>
|
||||
<div class="listpane" id="reports_holder">
|
||||
<p id="ReportSelector_holder">$ReportSelector <input class="action" type="submit" id="report_select_go" value="<% _t('GO','Go') %>" /></p>
|
||||
<div class="unitBody">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1,14 +1,17 @@
|
||||
<div id="form_actions_right" class="ajaxActions">
|
||||
</div>
|
||||
|
||||
<div class="ui-layout-center">
|
||||
<% if EditForm %>
|
||||
$EditForm
|
||||
<% else %>
|
||||
<form id="Form_EditForm" action="admin?executeForm=EditForm" method="post" enctype="multipart/form-data">
|
||||
<h1>$ApplicationName</h1>
|
||||
|
||||
<p><% _t('WELCOMETO','Welcome to') %> $ApplicationName! <% _t('CHOOSEPAGE','Please choose a page from the left.') %></p>
|
||||
</form>
|
||||
<h1>$ApplicationName</h1>
|
||||
<p>
|
||||
<% _t('WELCOMETO','Welcome to') %> $ApplicationName!
|
||||
<% _t('CHOOSEPAGE','Please choose a page from the left.') %>
|
||||
</p>
|
||||
<% end_if %>
|
||||
</div>
|
||||
|
||||
<p id="statusMessage" style="visibility:hidden"></p>
|
||||
<div class="ui-layout-south">
|
||||
<div id="form_actions_right" class="ajaxActions"></div>
|
||||
</div>
|
||||
|
||||
<!--<p id="statusMessage" style="visibility:hidden"></p>-->
|
||||
|
||||
@ -11,23 +11,19 @@
|
||||
<body class="stillLoading $CSSClasses">
|
||||
<div id="Loading" style="background: #FFF url($LoadingImage) 50% 50% no-repeat; position: absolute;z-index: 100000;height: 100%;width: 100%;margin: 0;padding: 0;z-index: 100000;position: absolute;"><% _t('LOADING','Loading...',PR_HIGH) %><noscript><h1><% _t('REQUIREJS','The CMS requires that you have JavaScript enabled.',PR_HIGH) %></h1></noscript></div>
|
||||
|
||||
<div id="top">
|
||||
<div class="ui-layout-north ss-cms-top-menu">
|
||||
$CMSTopMenu
|
||||
</div>
|
||||
|
||||
<div id="left" style="float:left">
|
||||
<div class="ui-layout-west">
|
||||
$Left
|
||||
</div>
|
||||
|
||||
<div id="separator" style="float:left">
|
||||
|
||||
</div>
|
||||
|
||||
<div class="right" id="right">
|
||||
|
||||
<div class="ui-layout-center" id="right">
|
||||
$Right
|
||||
</div>
|
||||
|
||||
<div id="contentPanel" style="display:none;">
|
||||
<div class="ui-layout-east">
|
||||
<% control EditorToolbar %>
|
||||
$ImageForm
|
||||
$LinkForm
|
||||
@ -35,7 +31,7 @@
|
||||
<% end_control %>
|
||||
</div>
|
||||
|
||||
<div id="bottom">
|
||||
<div class="ui-layout-south ss-cms-bottom-bar">
|
||||
<div class="holder">
|
||||
<div id="logInStatus">
|
||||
<a href="$ApplicationLink" title="<% _t('SSWEB','Silverstripe Website') %>">$ApplicationName</a> -
|
||||
|
||||
Loading…
Reference in New Issue
Block a user