Fixed Redactor toolbar styling in Fancy layout, minor fix in Inspector.

This commit is contained in:
alekseybobkov 2015-10-15 20:17:50 -07:00
parent a5b217ff0b
commit 61acdf9f46
8 changed files with 74 additions and 36 deletions

View File

@ -868,7 +868,7 @@ html.csstransitions body.outer.preload .outer-form-container{-webkit-transform:s
.fancy-layout .field-richeditor{border:none;border-left:1px solid #e0e0e0 !important}
.fancy-layout .field-richeditor,.fancy-layout .field-richeditor .redactor_box,.fancy-layout .field-richeditor .redactor_toolbar{-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;border-top-right-radius:0;border-top-left-radius:0}
.fancy-layout .field-richeditor .redactor-box textarea{background:white;padding:20px !important;color:#333333;font-size:14px}
.fancy-layout .secondary-content-tabs .field-richeditor .redactor-box .redactor-toolbar{margin:20px 20px 0 20px !important;-webkit-border-radius:3px !important;-moz-border-radius:3px !important;border-radius:3px !important}
.fancy-layout .secondary-content-tabs .field-richeditor .redactor-box .redactor-toolbar{margin:20px 0 0 0!important;left:20px;right:20px;width:auto;-webkit-border-radius:3px !important;-moz-border-radius:3px !important;border-radius:3px !important}
body.side-panel-not-fixed .fancy-layout .field-richeditor{border-left:none}
html.cssanimations .fancy-layout .form-tabless-fields .loading-indicator-container .loading-indicator > span{-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite;background-image:url('../../../system/assets/ui/images/loader-white.svg');background-size:20px 20px}
.flyout-container > .flyout{overflow:hidden;width:0;left:0 !important;-webkit-transition:width 0.1s;transition:width 0.1s}

View File

@ -562,7 +562,10 @@
.secondary-content-tabs .field-richeditor {
.redactor-box .redactor-toolbar {
margin: 20px 20px 0 20px !important;
margin: 20px 0 0 0!important;
left: 20px;
right: 20px;
width: auto;
.border-radius(3px) !important;
}
}

View File

@ -35,45 +35,70 @@
return $container
}
InspectorManager.prototype.loadElementOptions = function($element) {
var options = {}
// Only specific options are allowed, don't load all options with data()
//
if ($element.data('inspector-css-class')) {
options.inspectorCssClass = $element.data('inspector-css-class')
}
return options
}
InspectorManager.prototype.createInspectorPopup = function($element, containerSupported) {
new $.oc.inspector.wrappers.popup($element, null, {
containerSupported: containerSupported
})
var options = $.extend(this.loadElementOptions($element), {
containerSupported: containerSupported
})
new $.oc.inspector.wrappers.popup($element, null, options)
}
InspectorManager.prototype.createInspectorContainer = function($element, $container) {
new $.oc.inspector.wrappers.container($element, null, {
containerSupported: true,
container: $container
})
var options = $.extend(this.loadElementOptions($element), {
containerSupported: true,
container: $container
})
new $.oc.inspector.wrappers.container($element, null, options)
}
InspectorManager.prototype.switchToPopup = function(wrapper) {
new $.oc.inspector.wrappers.popup(wrapper.$element, wrapper, {
containerSupported: true
})
var options = $.extend(this.loadElementOptions(wrapper.$element), {
containerSupported: true
})
new $.oc.inspector.wrappers.popup(wrapper.$element, wrapper, options)
wrapper.cleanupAfterSwitch()
this.setContainerPreference(false)
}
InspectorManager.prototype.switchToContainer = function(wrapper) {
var $container = this.getContainerElement(wrapper.$element)
var $container = this.getContainerElement(wrapper.$element),
options = $.extend(this.loadElementOptions(wrapper.$element), {
containerSupported: true,
container: $container
})
if (!$container) {
throw new Error('Cannot switch to container: a container element is not found')
}
new $.oc.inspector.wrappers.container(wrapper.$element, wrapper, {
containerSupported: true,
container: $container
})
new $.oc.inspector.wrappers.container(wrapper.$element, wrapper, options)
wrapper.cleanupAfterSwitch()
this.setContainerPreference(true)
}
InspectorManager.prototype.createInspector = function($element) {
InspectorManager.prototype.createInspector = function(element) {
var $element = $(element)
if ($element.data('oc.inspectorVisible')) {
return false
}
var $container = this.getContainerElement($element)
// If there's no container option, create the Inspector popup
@ -142,10 +167,9 @@
InspectorManager.prototype.onInspectableClicked = function(ev) {
var $element = $(ev.currentTarget)
if ($element.data('oc.inspectorVisible'))
if (this.createInspector($element) === false) {
return false
this.createInspector($element)
}
}
$.oc.inspector.manager = new InspectorManager()

View File

@ -45,8 +45,8 @@
this.parsedProperties = $.oc.inspector.engine.processPropertyGroups(properties)
this.container = containerElement
this.inspectorUniqueId = inspectorUniqueId
this.values = values
this.originalValues = $.extend(true, {}, values) // Clone the values hash
this.values = values !== null ? values : {}
this.originalValues = $.extend(true, {}, this.values) // Clone the values hash
this.idCounter = 1
this.popupCounter = 0
this.parentSurface = parentSurface

View File

@ -104,6 +104,10 @@
this.popoverObj = this.$element.data('oc.popover')
this.$popoverContainer = this.popoverObj.$container
if (this.options.inspectorCssClass !== undefined) {
this.$popoverContainer.addClass(this.options.inspectorCssClass)
}
if (this.options.containerSupported) {
var moveToContainerButton = $('<span class="inspector-move-to-container oc-icon-download">')

View File

@ -188,7 +188,7 @@ div.control-popover {
}
&:before {
.transform(~'transform: rotate(270deg)');
.transform(~'rotate(270deg)');
}
}
}

View File

@ -3490,8 +3490,8 @@ this.rawProperties=properties
this.parsedProperties=$.oc.inspector.engine.processPropertyGroups(properties)
this.container=containerElement
this.inspectorUniqueId=inspectorUniqueId
this.values=values
this.originalValues=$.extend(true,{},values)
this.values=values!==null?values:{}
this.originalValues=$.extend(true,{},this.values)
this.idCounter=1
this.popupCounter=0
this.parentSurface=parentSurface
@ -3743,17 +3743,25 @@ if($containerHolder.length===0){return null}
var $container=$containerHolder.find($containerHolder.data('inspector-container'))
if($container.length===0){throw new Error('Inspector container '+$containerHolder.data['inspector-container']+' element is not found.')}
return $container}
InspectorManager.prototype.createInspectorPopup=function($element,containerSupported){new $.oc.inspector.wrappers.popup($element,null,{containerSupported:containerSupported})}
InspectorManager.prototype.createInspectorContainer=function($element,$container){new $.oc.inspector.wrappers.container($element,null,{containerSupported:true,container:$container})}
InspectorManager.prototype.switchToPopup=function(wrapper){new $.oc.inspector.wrappers.popup(wrapper.$element,wrapper,{containerSupported:true})
InspectorManager.prototype.loadElementOptions=function($element){var options={}
if($element.data('inspector-css-class')){options.inspectorCssClass=$element.data('inspector-css-class')}
return options}
InspectorManager.prototype.createInspectorPopup=function($element,containerSupported){var options=$.extend(this.loadElementOptions($element),{containerSupported:containerSupported})
new $.oc.inspector.wrappers.popup($element,null,options)}
InspectorManager.prototype.createInspectorContainer=function($element,$container){var options=$.extend(this.loadElementOptions($element),{containerSupported:true,container:$container})
new $.oc.inspector.wrappers.container($element,null,options)}
InspectorManager.prototype.switchToPopup=function(wrapper){var options=$.extend(this.loadElementOptions(wrapper.$element),{containerSupported:true})
new $.oc.inspector.wrappers.popup(wrapper.$element,wrapper,options)
wrapper.cleanupAfterSwitch()
this.setContainerPreference(false)}
InspectorManager.prototype.switchToContainer=function(wrapper){var $container=this.getContainerElement(wrapper.$element)
InspectorManager.prototype.switchToContainer=function(wrapper){var $container=this.getContainerElement(wrapper.$element),options=$.extend(this.loadElementOptions(wrapper.$element),{containerSupported:true,container:$container})
if(!$container){throw new Error('Cannot switch to container: a container element is not found')}
new $.oc.inspector.wrappers.container(wrapper.$element,wrapper,{containerSupported:true,container:$container})
new $.oc.inspector.wrappers.container(wrapper.$element,wrapper,options)
wrapper.cleanupAfterSwitch()
this.setContainerPreference(true)}
InspectorManager.prototype.createInspector=function($element){var $container=this.getContainerElement($element)
InspectorManager.prototype.createInspector=function(element){var $element=$(element)
if($element.data('oc.inspectorVisible')){return false}
var $container=this.getContainerElement($element)
if(!$container){this.createInspectorPopup($element,false)}
else{if(!this.applyValuesFromContainer($container)||!this.containerHidingAllowed($container)){return}
$.oc.foundation.controlUtils.disposeControls($container.get(0))
@ -3772,9 +3780,7 @@ $container.trigger(allowedEvent)
if(allowedEvent.isDefaultPrevented()){return false}
return true}
InspectorManager.prototype.onInspectableClicked=function(ev){var $element=$(ev.currentTarget)
if($element.data('oc.inspectorVisible'))
return false
this.createInspector($element)}
if(this.createInspector($element)===false){return false}}
$.oc.inspector.manager=new InspectorManager()}(window.jQuery);+function($){"use strict";if($.oc.inspector===undefined)
$.oc.inspector={}
if($.oc.inspector.wrappers===undefined)
@ -3905,6 +3911,7 @@ this.$element.ocPopover({content:this.getPopoverContents(),highlightModalTarget:
this.setInspectorVisibleFlag(true)
this.popoverObj=this.$element.data('oc.popover')
this.$popoverContainer=this.popoverObj.$container
if(this.options.inspectorCssClass!==undefined){this.$popoverContainer.addClass(this.options.inspectorCssClass)}
if(this.options.containerSupported){var moveToContainerButton=$('<span class="inspector-move-to-container oc-icon-download">')
this.$popoverContainer.find('.popover-head').append(moveToContainerButton)}
this.$popoverContainer.find('[data-inspector-title]').text(this.title)

View File

@ -1212,7 +1212,7 @@ div.control-popover .popover-head .close{float:none;position:absolute;right:11px
div.control-popover .popover-head .close:hover{opacity:1;filter:alpha(opacity=100)}
div.control-popover .popover-head .inspector-move-to-container{opacity:0.4;filter:alpha(opacity=40);position:absolute;top:12px;right:26px;float:none;color:#ffffff;cursor:pointer}
div.control-popover .popover-head .inspector-move-to-container:hover{opacity:1;filter:alpha(opacity=100);color:#ffffff}
div.control-popover .popover-head .inspector-move-to-container:before{-webkit-transform:transform:rotate(270deg);-ms-transform:transform:rotate(270deg);transform:transform:rotate(270deg)}
div.control-popover .popover-head .inspector-move-to-container:before{-webkit-transform:rotate(270deg);-ms-transform:rotate(270deg);transform:rotate(270deg)}
div.control-popover.placement-bottom .popover-head:before{content:'';display:block;width:0;height:0;border-left:7.5px solid transparent;border-right:7.5px solid transparent;border-bottom:8px solid #d35400;left:15px;top:-8px}
div.control-popover.placement-left .popover-head:before{content:'';display:block;width:0;height:0;border-top:7.5px solid transparent;border-bottom:7.5px solid transparent;border-left:8px solid #d35400;right:-8px;top:7px}
div.control-popover.placement-right .popover-head:before{content:'';display:block;width:0;height:0;border-top:7.5px solid transparent;border-bottom:7.5px solid transparent;border-right:8px solid #d35400;left:-8px;top:7px}