mirror of
https://github.com/scratchfoundation/paper.js.git
synced 2025-01-19 06:00:56 -05:00
Improve Component layout class name handling.
This commit is contained in:
parent
22d79948a0
commit
ddc7675c13
2 changed files with 14 additions and 11 deletions
|
@ -104,15 +104,14 @@ var Component = Base.extend(Callback, /** @lends Component# */{
|
|||
: undefined,
|
||||
meta = this._meta = this._types[type] || { type: type },
|
||||
create = DomElement.create,
|
||||
element = null;
|
||||
element,
|
||||
className;
|
||||
if (!type) {
|
||||
var columns = props.columns,
|
||||
// On the root element, we need to create the table and row even
|
||||
// if it's a columns layout.
|
||||
table = this._table = !(columns && row) && DomElement.create(
|
||||
'table', {
|
||||
class: 'palettejs-pane' // XXX
|
||||
}),
|
||||
'table', { class: 'palettejs-pane' }),
|
||||
components = this._components = {},
|
||||
currentRow = row,
|
||||
numCells = 0;
|
||||
|
@ -125,7 +124,7 @@ var Component = Base.extend(Callback, /** @lends Component# */{
|
|||
if (table && !(columns && currentRow)) {
|
||||
currentRow = DomElement.addChildren(table, ['tr', {
|
||||
class: 'palettejs-row',
|
||||
id: columns ? null : 'palettejs-row-' + key
|
||||
id: 'palettejs-row-' + key
|
||||
}])[0];
|
||||
// Set _row for the columns root element.
|
||||
if (columns)
|
||||
|
@ -168,6 +167,7 @@ var Component = Base.extend(Callback, /** @lends Component# */{
|
|||
// was passed.
|
||||
Base.set(this, components);
|
||||
element = row && table;
|
||||
className = 'layout-' + (columns ? 'columns' : 'rows');
|
||||
} else {
|
||||
var that = this;
|
||||
element = this._input = create(meta.tag || 'input', {
|
||||
|
@ -184,6 +184,7 @@ var Component = Base.extend(Callback, /** @lends Component# */{
|
|||
}
|
||||
}
|
||||
});
|
||||
className = 'type-' + type;
|
||||
}
|
||||
if (element) {
|
||||
DomElement.addChildren(row, [
|
||||
|
@ -192,7 +193,7 @@ var Component = Base.extend(Callback, /** @lends Component# */{
|
|||
id: 'palettejs-label-' + name
|
||||
}),
|
||||
this._cell = create('td', {
|
||||
class: 'palettejs-component palettejs-type-' + type,
|
||||
class: 'palettejs-component palettejs-' + className,
|
||||
id: 'palettejs-component-' + name
|
||||
}, [ element ])
|
||||
]);
|
||||
|
@ -200,6 +201,7 @@ var Component = Base.extend(Callback, /** @lends Component# */{
|
|||
if (parent)
|
||||
parent._numCells += 2;
|
||||
}
|
||||
this._className = className;
|
||||
|
||||
// Attach default 'change' even that delegates to parent component.
|
||||
this.attach('change', function(value) {
|
||||
|
|
|
@ -45,11 +45,12 @@
|
|||
// so they are exposed and can easily be accessed from the outside.
|
||||
Base.set(components, root._components);
|
||||
var parent = DomElement.find('.palettejs-panel')
|
||||
|| DomElement.find('body').appendChild(
|
||||
DomElement.create('div', { class: 'palettejs-panel' }));
|
||||
this._element = parent.appendChild(
|
||||
DomElement.create('div', { class: 'palettejs-palette' },
|
||||
[root._table]));
|
||||
|| DomElement.find('body').appendChild(DomElement.create('div', {
|
||||
class: 'palettejs-panel'
|
||||
}));
|
||||
this._element = parent.appendChild(DomElement.create('div', {
|
||||
class: 'palettejs-palette palettejs-' + root._className
|
||||
}, [root._table]));
|
||||
if (props)
|
||||
this._set(props, { title: true, components: true, values: true });
|
||||
// Link to the current scope's palettes list.
|
||||
|
|
Loading…
Reference in a new issue