diff --git a/admin/code/LeftAndMain.php b/admin/code/LeftAndMain.php
index 79241a516..55a5e9605 100755
--- a/admin/code/LeftAndMain.php
+++ b/admin/code/LeftAndMain.php
@@ -256,6 +256,7 @@ class LeftAndMain extends Controller {
Requirements::javascript(SAPPHIRE_ADMIN_DIR . '/javascript/LeftAndMain.js');
Requirements::javascript(SAPPHIRE_ADMIN_DIR . '/javascript/LeftAndMain.Panel.js');
Requirements::javascript(SAPPHIRE_ADMIN_DIR . '/javascript/LeftAndMain.Tree.js');
+ Requirements::javascript(SAPPHIRE_ADMIN_DIR . '/javascript/LeftAndMain.Content.js');
Requirements::javascript(SAPPHIRE_ADMIN_DIR . '/javascript/LeftAndMain.EditForm.js');
Requirements::javascript(SAPPHIRE_ADMIN_DIR . '/javascript/LeftAndMain.Menu.js');
Requirements::javascript(SAPPHIRE_ADMIN_DIR . '/javascript/LeftAndMain.AddForm.js');
@@ -314,6 +315,7 @@ class LeftAndMain extends Controller {
SAPPHIRE_ADMIN_DIR . '/javascript/LeftAndMain.js',
SAPPHIRE_ADMIN_DIR . '/javascript/LeftAndMain.Panel.js',
SAPPHIRE_ADMIN_DIR . '/javascript/LeftAndMain.Tree.js',
+ SAPPHIRE_ADMIN_DIR . '/javascript/LeftAndMain.Content.js',
SAPPHIRE_ADMIN_DIR . '/javascript/LeftAndMain.EditForm.js',
SAPPHIRE_ADMIN_DIR . '/javascript/LeftAndMain.Menu.js',
SAPPHIRE_ADMIN_DIR . '/javascript/LeftAndMain.AddForm.js',
diff --git a/admin/css/screen.css b/admin/css/screen.css
index 06e3d7c45..ed8e576c8 100755
--- a/admin/css/screen.css
+++ b/admin/css/screen.css
@@ -144,7 +144,7 @@ li.jstree-closed > ul { display: none; }
.cms-menu-list li { background-color: #b0bfc6; background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(0%, #b0bfc6), color-stop(100%, #758f9b)); background-image: -moz-linear-gradient(top, #b0bfc6 0%, #758f9b 100%); background-image: linear-gradient(top, #b0bfc6 0%, #758f9b 100%); border-bottom: 1px solid #aaaaaa; }
.cms-menu-list li a { display: block; height: 32px; vertical-align: middle; font-size: 14px; text-shadow: #aaaaaa 1px 1px 1px; color: #333333; padding: 5px; }
-.cms-menu-list li a .icon { display: block; float: left; margin-right: 5px; background: url('../images/icons-32.png?1305262748') no-repeat; width: 32px; height: 32px; overflow: hidden; background-position: 0px 0px; }
+.cms-menu-list li a .icon { display: block; float: left; margin-right: 5px; background: url('../images/icons-32.png?1305837920') no-repeat; width: 32px; height: 32px; overflow: hidden; background-position: 0px 0px; }
.cms-menu-list li a:hover .icon { background-position: -32px 0px; }
.cms-menu-list li a .text { display: block; padding-top: 10px; }
.cms-menu-list li.current { background-color: #338dc1; background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(0%, #338dc1), color-stop(100%, #1e5270)); background-image: -moz-linear-gradient(top, #338dc1 0%, #1e5270 100%); background-image: linear-gradient(top, #338dc1 0%, #1e5270 100%); }
@@ -240,10 +240,10 @@ strong { font-weight: bold; }
.cms-content-tools { background-color: #dce3e6; }
-/** ------------------------------------------------------- Top Left Header and logo area -------------------------------------------------------- */
-.cms-header { background-color: #00111d; position: relative; padding: 16px 8px 8px; line-height: 24px; background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(0%, #00111d), color-stop(50%, #003050), color-stop(100%, #00111d)); background-image: -moz-linear-gradient(top, #00111d 0%, #003050 50%, #00111d 100%); background-image: linear-gradient(top, #00111d 0%, #003050 50%, #00111d 100%); }
-.cms-header span { color: white; white-space: no-wrap; text-overflow: ellipsis; display: block; }
-.cms-header span a { color: #3ebae0; display: inline; }
+.cms-content.loading { background: url(../images/spinner.gif) no-repeat 50% 50%; }
+
+.cms-header { background-color: #00111d; background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(0%, #00111d), color-stop(50%, #003050), color-stop(100%, #00111d)); background-image: -moz-linear-gradient(top, #00111d 0%, #003050 50%, #00111d 100%); background-image: linear-gradient(top, #00111d 0%, #003050 50%, #00111d 100%); }
+.cms-header * { color: white; }
.cms-logo { border-bottom: 1px solid #03090c; height: 31px; overflow: hidden; padding: 0 4px; vertical-align: middle; }
.cms-logo .version { display: none; }
diff --git a/admin/javascript/LeftAndMain.Content.js b/admin/javascript/LeftAndMain.Content.js
new file mode 100644
index 000000000..529dedd87
--- /dev/null
+++ b/admin/javascript/LeftAndMain.Content.js
@@ -0,0 +1,40 @@
+(function($) {
+
+ $.entwine('ss', function($){
+
+ $('.LeftAndMain .cms-content').entwine({
+
+ redraw: function() {
+ },
+
+ cleanup: function() {
+ this.empty();
+ },
+
+ loadPanel: function(url, callback, ajaxOptions) {
+ var self = this;
+
+ this.trigger('load', {url: url, args: arguments});
+
+ this.cleanup();
+
+ // TODO Add browser history support
+ return $.ajax($.extend({
+ url: url,
+ complete: function(xmlhttp, status) {
+ self.loadPanel_onSuccess(xmlhttp.responseText, status, xmlhttp);
+ self.removeClass('loading');
+
+ if(callback) callback.apply(self, arguments);
+ },
+ dataType: 'html'
+ }, ajaxOptions));
+ },
+
+ loadPanel_onSuccess: function(html, status, xmlhttp) {
+ this.html(html);
+ this.redraw();
+ }
+ });
+ });
+})(jQuery);
\ No newline at end of file
diff --git a/admin/javascript/LeftAndMain.Menu.js b/admin/javascript/LeftAndMain.Menu.js
index 401c71b6f..04af4cd52 100644
--- a/admin/javascript/LeftAndMain.Menu.js
+++ b/admin/javascript/LeftAndMain.Menu.js
@@ -2,8 +2,12 @@
$.entwine('ss', function($){
- $('.cms-menu').entwine({
-
+ $('.cms-menu li a').entwine({
+ onclick: function(e) {
+ e.preventDefault();
+ console.debug($('.LeftAndMain .cms-content'));
+ $('.LeftAndMain .cms-content').entwine('ss').loadPanel(this.attr('href'));
+ }
});
$('.cms-menu.collapsed li').entwine({
diff --git a/admin/javascript/LeftAndMain.Preview.js b/admin/javascript/LeftAndMain.Preview.js
index c4507a300..d4423c8d3 100755
--- a/admin/javascript/LeftAndMain.Preview.js
+++ b/admin/javascript/LeftAndMain.Preview.js
@@ -54,9 +54,9 @@
if(!container.hasClass('CMSMain')) return;
// Load this page in the admin interface if appropriate
- var id = $(doc).find('meta[name=x-page-id]').attr('content'), form = $('.cms-edit-form');
+ var id = $(doc).find('meta[name=x-page-id]').attr('content'), contentPanel = $('.cms-content');
// TODO Remove hardcoding
- if(id && form.find(':input[name=ID]').val() != id) form.loadForm('admin/page/edit/show/' + id);
+ if(id && contentPanel.find(':input[name=ID]').val() != id) contentPanel.loadPanel('admin/page/edit/show/' + id);
},
_fixIframeLinks: function() {
diff --git a/admin/scss/_style.scss b/admin/scss/_style.scss
index bfae6200b..c36c6411c 100755
--- a/admin/scss/_style.scss
+++ b/admin/scss/_style.scss
@@ -130,6 +130,13 @@ strong {
}
}
+.cms-content {
+ &.loading {
+ background: url(../images/spinner.gif) no-repeat 50% 50%;
+ }
+}
+
+// ######################### Header and Logo #########################
/** -------------------------------------------------------
* Top Left Header and logo area
diff --git a/admin/templates/Includes/LeftAndMain_Content.ss b/admin/templates/Includes/LeftAndMain_Content.ss
index 40443e046..c74f54b0a 100755
--- a/admin/templates/Includes/LeftAndMain_Content.ss
+++ b/admin/templates/Includes/LeftAndMain_Content.ss
@@ -1 +1,3 @@
-$EditForm
\ No newline at end of file
+
+$EditForm
+
\ No newline at end of file
diff --git a/admin/templates/Includes/LeftAndMain_EditForm.ss b/admin/templates/Includes/LeftAndMain_EditForm.ss
index d42c8bca2..93c09d44d 100755
--- a/admin/templates/Includes/LeftAndMain_EditForm.ss
+++ b/admin/templates/Includes/LeftAndMain_EditForm.ss
@@ -1,10 +1,6 @@
-<% if IncludeFormTag %>
-