Index: branches/5.1.x/core/admin_templates/js/template_manager.js
===================================================================
diff -u -r12127 -r12657
--- branches/5.1.x/core/admin_templates/js/template_manager.js (.../template_manager.js) (revision 12127)
+++ branches/5.1.x/core/admin_templates/js/template_manager.js (.../template_manager.js) (revision 12657)
@@ -2,11 +2,11 @@
this._editUrl = $edit_url;
this.browseUrl = $browse_url;
this._saveLayoutUrl = $save_layout_url;
- this.editingMode = $edting_mode; // from 1 to 4
+ this.editingMode = $edting_mode; // from {1 - browse, 2 - content, 3 - design}
this._blocks = {};
-
this._blockOrder = Array ();
+ this.inDrag = false; // don't process mouse over/out events while in drag mode
var $template_manager = this;
@@ -18,7 +18,7 @@
return ;
}
- // show special toolbar when in any of 4 browse modes
+ // show special toolbar when in any of 3 browse modes
var $head_frame = getFrame('head');
var $extra_toolbar = $head_frame.$('div.front-extra-toolbar').clone(); // clone to keep original untouched
@@ -38,9 +38,25 @@
$head_frame.$('#extra_toolbar').html( $extra_toolbar.html() );
+ var $hover_effect = [];
+
+ if ($template_manager.editingMode > 1) {
+ // all modes except for "Browse Mode"
+ $hover_effect.push('div.cms-section-properties-btn:first');
+ }
+
if ($template_manager.editingMode == 2) {
- // Layout Mode
+ // Content Mode
+ $hover_effect.push('div.cms-edit-btn');
+ // make all spans with phrases clickable
+ $template_manager.setupEditTranslationButtons(document);
+ }
+
+ if ($template_manager.editingMode == 3) {
+ // Design Mode
+// $hover_effect.push('div.cms-save-layout-btn:first, div.cms-cancel-layout-btn:first');
+
$template_manager.renumberMovableElements();
$('div.movable-area').sortable(
@@ -51,13 +67,25 @@
connectWith: ['div.movable-area'],
tolerance: 'pointer',
start: function(e, ui) {
+ $template_manager.inDrag = true;
ui.placeholder.height( ui.item.height() );
+ },
+ stop: function(e, ui) {
+ $template_manager.inDrag = false;
+
+ // mouseout doesn't happen while in drag, so compensate it here
+ var $header = $('.movable-header', ui.item);
+ $('div.block-edit-block-btn-container', $header).mouseout();
+ },
+ change: function(e, ui) {
+ $('div.cms-layout-btn-container').show();
}
}
);
}
- $('div.cms-edit-btn')
+ // make requested elements fully visible on mouseover
+ $($hover_effect.join(', '))
.mouseover(
function(e) {
$(this).css('opacity', 1);
@@ -72,6 +100,69 @@
);
}
+TemplateManager.prototype.setupEditTranslationButtons = function ($container) {
+ $("span[name='cms-translate-phrase']", $container).each(
+ function() {
+ var $me = $(this);
+ var $parent_link = $me.parents('a:first');
+
+ if ($parent_link.length == 0) {
+ // span in not inside "a" tag
+
+ $me.prepend('
');
+ $('div.cms-edit-btn:first', $me).click(TemplateManager.prototype.translatePhrase);
+ $me.dblclick(
+ function ($e) {
+ $('div.cms-edit-btn:first', this).click();
+ return false;
+ }
+ );
+
+ var $effect_element = $me;
+ }
+ else {
+ // span is inside "a" tag
+ var $clone = $me.clone();
+ $clone.empty().attr('title', '');
+
+ // in case if "a" tag is "display: block", then make "span" the same
+ $clone.css('display', $parent_link.css('display'));
+
+ $parent_link.html( $me.html() ).wrap($clone);
+ $parent_link.before('');
+ $parent_link.prev('div.cms-edit-btn:first').click(TemplateManager.prototype.translatePhrase);
+
+ var $effect_element = $parent_link.parents("span[name='cms-translate-phrase']:first");
+ }
+
+ $effect_element
+ .mouseover(
+ function($e) {
+ $('div.cms-edit-btn', this).css('display', 'inline');
+ }
+ )
+ .mouseout(
+ function($e) {
+ $('div.cms-edit-btn', this).hide();
+ }
+ );
+ }
+ );
+}
+
+TemplateManager.prototype.translatePhrase = function ($e) {
+ var $translate_url = $(this).parents("span[name='cms-translate-phrase']:first").attr('href');
+
+ if ($translate_url.match(/javascript:(.*)/)) {
+ eval(RegExp.$1);
+ }
+ else {
+ window.location.href = $translate_url;
+ }
+
+ return false;
+}
+
TemplateManager.prototype.renumberMovableElements = function () {
var $area_index = 0;
// 1. dynamically assign IDs to all movable elements
@@ -114,6 +205,7 @@
if ($data == 'OK') {
$message = 'New Layout Saved';
+ $('div.cms-layout-btn-container').hide();
$me.renumberMovableElements();
}
else {
@@ -130,42 +222,126 @@
TB.show($settings);
}
+TemplateManager.prototype.cancelLayout = function () {
+ window.location.href = window.location.href;
+}
+
TemplateManager.prototype.onBtnClick = function ($e, $element) {
var $id = $element.id.replace(/_btn$/, '');
var $block_info = this._blocks[$id];
var $url = this._editUrl.replace('#BLOCK#', $block_info.block_name + ':' + $block_info.function_name).replace('#EVENT#', 'OnLoadBlock');
- openSelector('theme-file', $url);
+ direct_edit('theme-file', $url);
$e.stopPropagation();
}
TemplateManager.prototype.onMouseOver = function ($e, $element) {
- $($element).addClass('block-edit-btn-container-over');
+ if (this.inDrag) {
+ return ;
+ }
+
+ $element = $($element);
+
+ if ($element.hasClass('block-edit-design-btn-container')) {
+ $($element).addClass('block-edit-design-btn-container-over');
+
+ var $button_group = $('div.cms-edit-design-btn-container:first', $element);
+ if ($button_group.length) {
+ $button_group.show();
+ }
+ else {
+ $('div.cms-edit-design-btn:first', $element).show();
+ }
+ }
+ else {
+ $($element).addClass('block-edit-block-btn-container-over');
+ $('div.cms-edit-block-btn:first', $element).show();
+ }
+
$e.stopPropagation();
}
TemplateManager.prototype.onMouseOut = function ($e, $element) {
- $($element).removeClass('block-edit-btn-container-over');
+ if (this.inDrag) {
+ return ;
+ }
+
+ $element = $($element);
+
+ if ($element.hasClass('block-edit-design-btn-container')) {
+ $($element).removeClass('block-edit-design-btn-container-over');
+
+ var $button_group = $('div.cms-edit-design-btn-container:first', $element);
+ if ($button_group.length) {
+ $button_group.hide();
+ }
+ else {
+ $('div.cms-edit-design-btn:first', $element).hide();
+ }
+ }
+ else {
+ $($element).removeClass('block-edit-block-btn-container-over');
+ $('div.cms-edit-block-btn:first', $element).hide();
+ }
+
$e.stopPropagation();
}
TemplateManager.prototype.searchBlocks = function () {
- $('div').each (
- function () {
- var $id = $(this).attr('id');
+ var $design_containers = $('div.block-edit-design-btn-container');
+ var $block_containers = $('div.block-edit-block-btn-container');
- if (!$id || $id.match(/parser_block\[.*\].*_btn$/) || !$id.match(/parser_block\[.*\]/)) {
- // skip other divs
- return true;
+ $design_containers.each(
+ function() {
+ var $block_container = $('div.block-edit-block-btn-container:first', this);
+
+ if ($block_container.length) {
+ $block_containers = $block_containers.not($block_container);
+
+ // place "Edit Block" button near "Edit Design" button
+ var $edit_design_btn = $('div.cms-edit-design-btn:first', this);
+ var $edit_block_btn = $('div.cms-edit-block-btn:first', $block_container);
+
+ $edit_design_btn
+ .wrap('')
+ .before( $edit_block_btn.clone() );
+
+ $edit_block_btn.remove();
+
+ // make "hint" from "Edit Block" button container main
+ $(this).attr('title', $block_container.attr('title'));
+ $block_container.attr('title', '');
+
+ TemplateManager.prototype.registerBlock.call(aTemplateManager, $block_container.get(0), ['hover']);
}
+ TemplateManager.prototype.registerBlock.call(aTemplateManager, this, ['dblclick']);
+ }
+ );
+
+ $block_containers.each(
+ function() {
TemplateManager.prototype.registerBlock.call(aTemplateManager, this);
}
);
+
+// $('div').each (
+// function () {
+// /*var $id = $(this).attr('id');
+//
+// if (!$id || $id.match(/parser_block\[.*\].*_btn$/) || !$id.match(/parser_block\[.*\]/)) {
+// // skip other divs
+// return true;
+// }*/
+//
+//
+// TemplateManager.prototype.registerBlock.call(aTemplateManager, this);
+// }
+// );
}
-TemplateManager.prototype.registerBlock = function ($element) {
+TemplateManager.prototype.registerBlock = function ($element, $skip_events) {
var $params = $element.getAttribute('params').split(':');
this._blocks[$element.id] = {
@@ -175,26 +351,38 @@
var $btn = document.getElementById($element.id + '_btn');
- $($btn).bind(
- 'click',
+ $($btn).click(
function(ev) {
TemplateManager.prototype.onBtnClick.call(aTemplateManager, ev, this);
}
);
- $($element).bind(
- 'mouseover',
- function(ev) {
- TemplateManager.prototype.onMouseOver.call(aTemplateManager, ev, this);
- }
- );
+ if ($skip_events === undefined) {
+ $skip_events = [];
+ }
- $($element).bind(
- 'mouseout',
- function(ev) {
- TemplateManager.prototype.onMouseOut.call(aTemplateManager, ev, this);
- }
- );
+ if (!in_array('dblclick', $skip_events)) {
+ $($element)
+ .dblclick(
+ function(ev) {
+ TemplateManager.prototype.onBtnClick.call(aTemplateManager, ev, this);
+ }
+ )
+ }
+ if (!in_array('hover', $skip_events)) {
+ $($element)
+ .mouseover(
+ function(ev) {
+ TemplateManager.prototype.onMouseOver.call(aTemplateManager, ev, this);
+ }
+ )
+ .mouseout(
+ function(ev) {
+ TemplateManager.prototype.onMouseOut.call(aTemplateManager, ev, this);
+ }
+ );
+ }
+
this._blockOrder.push($element.id);
}
\ No newline at end of file