Browse Source

Add isComponentStylable() to the style manager property view

As isTargetStylable() checks the target (which could be the Component but
also the CSS Rule), I need something to check also the selected component
pull/79/merge
Artur Arseniev 10 years ago
parent
commit
35fb7def80
  1. 2
      index.html
  2. 30
      src/style_manager/view/PropertyView.js

2
index.html

@ -14,7 +14,7 @@
<div id="gjs" style="height:0px; overflow:hidden"> <div id="gjs" style="height:0px; overflow:hidden">
<header class="header-banner"> <header class="header-banner">
<div class="container-width"> <div class="container-width" data-gjs-stylable="width, height">
<!-- <!--
<table> <table>
<thead> <thead>

30
src/style_manager/view/PropertyView.js

@ -12,6 +12,7 @@ define(['backbone', 'text!./../templates/propertyLabel.html', 'text!./../templat
initialize: function(o) { initialize: function(o) {
this.config = o.config || {}; this.config = o.config || {};
this.em = this.config.em;
this.pfx = this.config.stylePrefix || ''; this.pfx = this.config.stylePrefix || '';
this.ppfx = this.config.pStylePrefix || ''; this.ppfx = this.config.pStylePrefix || '';
this.target = o.target || {}; this.target = o.target || {};
@ -157,7 +158,7 @@ define(['backbone', 'text!./../templates/propertyLabel.html', 'text!./../templat
// Check if component is allowed to be styled // Check if component is allowed to be styled
var hideNoStyle = this.config.hideNotStylable; var hideNoStyle = this.config.hideNotStylable;
if (!this.isTargetStylable()) { if (!this.isTargetStylable() || !this.isComponentStylable()) {
if (hideNoStyle) { if (hideNoStyle) {
this.hide(); this.hide();
} }
@ -213,9 +214,10 @@ define(['backbone', 'text!./../templates/propertyLabel.html', 'text!./../templat
/** /**
* Check if target is stylable with this property * Check if target is stylable with this property
* The target could be the Component as the CSS Rule
* @return {Boolean} * @return {Boolean}
*/ */
isTargetStylable: function(){ isTargetStylable: function() {
var stylable = this.getTarget().get('stylable'); var stylable = this.getTarget().get('stylable');
// Stylable could also be an array indicating with which property // Stylable could also be an array indicating with which property
// the target could be styled // the target could be styled
@ -224,6 +226,30 @@ define(['backbone', 'text!./../templates/propertyLabel.html', 'text!./../templat
return stylable; return stylable;
}, },
/**
* Check if the selected component is stylable with this property
* The target could be the Component as the CSS Rule
* @return {Boolean}
*/
isComponentStylable: function() {
var em = this.em;
var component = em && em.get('selectedComponent');
if (!component) {
return true;
}
var stylable = component.get('stylable');
console.log('ST', stylable);
// Stylable could also be an array indicating with which property
// the target could be styled
if(stylable instanceof Array){
stylable = _.indexOf(stylable, this.property) >= 0;
}
return stylable;
},
/** /**
* Set value to the input * Set value to the input
* @param {String} value * @param {String} value

Loading…
Cancel
Save