/*
* pettanR peta.apps.js
- * version 0.5.22
+ * version 0.5.23
*
* author:
* itozyun
itemW, itemH, buttonW,
onUpdate = null,
onUpdateData = null,
+ onUpdateContext = null,
artistID = -1;
var ImageGroupIconClass = function( index, data ){
while( ICON_ARRAY.length > 0 ){
ICON_ARRAY.shift().destroy();
}
- onUpdate !== null && onUpdateData !== null && onUpdate( onUpdateData );
- onUpdate = onUpdateData = null;
+ onUpdate !== null && onUpdateData !== null && onUpdate.call( onUpdateContext, onUpdateData );
+ onUpdate = onUpdateData = onUpdateContext = null;
PremiumSatge.shutdown();
}
tree = FileAPI.createTree( FILE_DATA_ARTIST_ROOT );
rootFile = tree.getRootFile();
};
- this.onOpen = function( _windowW, _windowH, _ARTISTIDorFILE, _onUpdate ){
+ this.onOpen = function( _windowW, _windowH, _ARTISTIDorFILE, _onUpdate, opt_thisObj ){
elmContainer = document.getElementById( 'image-group-icon-container' );
containerH = Util.getElementSize( elmContainer ).height;
}
onUpdate = _onUpdate || null;
+ onUpdateContext = opt_thisObj || null;
onUpdateData = null;
drawIcons();
if( tree === null ) return true;
$( elmContainer ).stop().animate( {
height: 0,
- top: Math.floor( winH /2 )
+ top: Math.floor( winH / 2 )
}, onFadeout );
// onEnterInterval !== null && window.clearTimeout( onEnterInterval );
// onEnterInterval = null;
onUpdate = _onUpdate || null;
self.onPaneResize( _w, _h );
- elmTextarea.value = _textElement.text()
+ elmTextarea.value = _textElement.content;
elmTextarea.focus();
/*
* - window
*/
var INFOMATION_WINDOW = ( function(){
- var FADE_EFFECT_ENABLED = true, //UA.isIE === false || UA.ieVersion >= 8,
- FADE_IN_EFFECT = FADE_EFFECT_ENABLED === true ? 'fadeIn' : 'show',
- FADE_OUT_EFFECT = FADE_EFFECT_ENABLED === true ? 'fadeOut' : 'hide',
- backgroundInfomationElm,
- jqPanelElementInformation,
- ui, inputX, inputY, inputZ, inputA, inputW, inputH, inputAspectRatio,
- inputPercentW, inputPercentH,
- currentPanelElement = null,
- currentElementType = -1;
+ var backgroundInfomationElm;
return WINDOWS_CONTROL.createWindow(
{
onFirstOpen: function( _w, _h ){
backgroundInfomationElm = $( '#panel-background-information');
-
- jqPanelElementInformation = $( '#comic-element-infomation').hide().css( {
- height: _h
- });
- ui = app.createUIGroup();
- inputX = ui.createInputText( document.getElementById( 'comic-element-x' ), null );
- inputY = ui.createInputText( document.getElementById( 'comic-element-y' ), null );
- inputZ = ui.createInputText( document.getElementById( 'comic-element-z' ), null );
- inputA = ui.createInputText( document.getElementById( 'comic-element-a' ), null );
- inputW = ui.createInputText( document.getElementById( 'comic-element-w' ), null );
- inputH = ui.createInputText( document.getElementById( 'comic-element-h' ), null );
- inputPercentW = ui.createInputText( document.getElementById( 'comic-element-w-percent' ), null );
- inputPercentH = ui.createInputText( document.getElementById( 'comic-element-h-percent' ), null );
- inputAspectRatio = $( '#comic-element-keep-aspect' );
},
onResize: function( _w, _h ){
- jqPanelElementInformation.css( {
- height: _h
- });
},
update: function( currentElement ){
- var _elementType = currentElement === null ? -1 : currentElement.type,
- x = currentElement !== null ? currentElement.x : 0,
- y = currentElement !== null ? currentElement.y : 0,
- z = currentElement !== null ? currentElement.z : 0,
- a = _elementType === PANEL_ELEMENT_TYPE_TEXT ? Math.floor( currentElement.angle() ) : 0,
- w = currentElement !== null ? currentElement.w : 0,
- h = currentElement !== null ? currentElement.h : 0,
- actualW = _elementType === PANEL_ELEMENT_TYPE_IMAGE ? currentElement.actualW() : 1,
- actualH = _elementType === PANEL_ELEMENT_TYPE_IMAGE ? currentElement.actualH() : 1,
- wPercent = _elementType === PANEL_ELEMENT_TYPE_IMAGE ? Math.floor( w / actualW *100 ) : 0,
- hPercent = _elementType === PANEL_ELEMENT_TYPE_IMAGE ? Math.floor( h / actualH *100 ) : 0,
- keepAspect = currentElement !== null && currentElement.keepAspect === true;
-
- if( currentElementType !== _elementType ){
- if( _elementType !== -1 ){
- if( _elementType === 1 ){
- inputA.visible( true );
- inputPercentW.visible( false );
- inputPercentH.visible( false );
- inputAspectRatio.hide();
- } else {
- inputA.visible( false );
- inputPercentW.visible( true );
- inputPercentH.visible( true );
- inputAspectRatio.show();
- };
- currentElementType === -1 && jqPanelElementInformation.stop().css( {
- filter: '',
- opacity: ''
- })[ FADE_IN_EFFECT ]();
- } else {
- currentElementType !== -1 && jqPanelElementInformation.stop().css({
- filter: '',
- opacity: ''
- })[ FADE_OUT_EFFECT ]();
- };
- currentElementType = _elementType;
- };
- if( currentElementType !== -1){
- inputX.value( x );
- inputY.value( y );
- inputZ.value( z );
- _elementType === 1 && inputA.value( a );
- inputW.value( w );
- inputH.value( h );
- _elementType === 0 && inputPercentW.value( wPercent );
- _elementType === 0 && inputPercentH.value( hPercent );
- } else {
-
- };
+
}
},
'infomation-window', 'Infomation', 0, 30, 200, 180, true
mousemove: function( _mouseX, _mouseY ){
if( isDraggable === true && isDragging === true ){
PANEL_CONTROL.resize( false, startX + _mouseX - offsetX, startY + _mouseY - offsetY );
- }
+ };
},
mouseup: function( _mouseX, _mouseY ){
if( isDraggable === true ){
isDragging = false;
app.updateCoursor( '' );
- }
+ };
},
mousedown: function( _mouseX, _mouseY ){
if( isDraggable === true ){
isDragging = true;
app.updateCoursor( 'move' );
return true;
- }
+ };
},
busy: function(){
return isDragging === true;
}
- }
- })();
-
-
-/* --------------------------------------------------------------------------------------------
- * CONSOLE_CONTROLER
- */
- var CONSOLE_CONTROLER = ( function(){
- var LAYER_BACK_BUTTON, LAYER_FORWARD_BUTTON, DELETE_BUTTON, EDIT_BUTTON, CHANGE_BUTTON,
- elmConsoleWrapper, styleConsoleWrapper,
- layerWrapper,
- // elmConsoleParent,
- styleImgConsole, styleTextConsole,
- currentElement = null,
- currentType = -1,
- visible = false,
- imgConsoleWidth, imgConsoleHeight,
- textConsoleWidth, textConsoleHeight,
- tailSize = 10;
-
- function layerBack(){
- if( currentElement === null ) return;
- if( PANEL_ELEMENT_CONTROL.replace( currentElement, false ) === false ) return;
- INFOMATION_WINDOW.update( currentElement );
- HISTORY_CONTROL.saveState( PANEL_ELEMENT_CONTROL.resplace, [ currentElement, true ], [ currentElement, false ] );
- var _z = currentElement.z;
- LAYER_BACK_BUTTON.visible( _z > 0 );
- LAYER_FORWARD_BUTTON.visible( _z < PANEL_ELEMENT_ARRAY.length - 1 );
- };
- function layerForward(){
- if( currentElement === null ) return;
- if( PANEL_ELEMENT_CONTROL.replace( currentElement, true ) === false ) return;
- INFOMATION_WINDOW.update( currentElement );
- HISTORY_CONTROL.saveState( PANEL_ELEMENT_CONTROL.replace, [ currentElement, false ], [ currentElement, true ] );
- var _z = currentElement.z;
- LAYER_BACK_BUTTON.visible( _z > 0 );
- LAYER_FORWARD_BUTTON.visible( _z < PANEL_ELEMENT_ARRAY.length - 1 );
- };
- function del(){
- if( currentElement === null ) return;
- // buttonBackOrForward( true );
- HISTORY_CONTROL.saveState( PANEL_ELEMENT_CONTROL.restore, [ true, currentElement ], [ false, currentElement ], false ); // true
- PANEL_ELEMENT_CONTROL.remove( currentElement );
- PANEL_ELEMENT_OPERATION_MANAGER.hide();
- };
- function edit(){
- if( currentElement === null || currentElement.type !== PANEL_ELEMENT_TYPE_TEXT ) return;
- TextEditor.boot( PANEL_CONTROL.x, PANEL_CONTROL.y, currentElement );
- // buttonBackOrForward( true );
- };
- function change(){
- if( currentElement === null) return;
- // buttonBackOrForward( true );
- PremiumSatge.boot( currentElement.getArtistID(), currentElement.resourcePicture );
};
- function onImageSelect( resourcePicture ){
- currentElement.resourcePicture( resourcePicture );
- };
- return {
- x: 0,
- y: 0,
- w: 0,
- h: 0,
- init: function(){
- app.addKeyEventListener( 'keydown', layerBack, 66, false, true );
- app.addKeyEventListener( 'keydown', layerForward, 70, false, true );
- app.addKeyEventListener( 'keydown', del, 68, false, true );
- app.addKeyEventListener( 'keydown', edit, 69, false, true );
- app.addKeyEventListener( 'keydown', change, 85, false, true );
-
- var elmImgConsole = document.getElementById( 'image-element-consol' ),
- imgConsoleSize = Util.getElementSize( elmImgConsole );
- imgConsoleWidth = imgConsoleSize.width;
- imgConsoleHeight = imgConsoleSize.height;
- styleImgConsole = elmImgConsole.style;
-
- var elmTextConsole = document.getElementById( 'text-element-consol' ),
- textConsoleSize = Util.getElementSize( elmTextConsole );
- textConsoleWidth = textConsoleSize.width;
- textConsoleHeight = textConsoleSize.height;
- styleTextConsole = elmTextConsole.style;
-
- elmConsoleWrapper = document.getElementById( 'comic-element-consol-wrapper' );
- styleConsoleWrapper = elmConsoleWrapper.style;
- // elmConsoleParent = elmConsoleWrapper.parentNode;
-
- elmImgConsole.style.display = styleTextConsole.display = styleConsoleWrapper.display = 'none';
-
- delete CONSOLE_CONTROLER.init;
- },
- open: function(){
- // layerWrapper = app.createInteractContainer( elmConsoleWrapper );
-
- LAYER_BACK_BUTTON = MENU_BAR_CONTROL.EDIT.createOption( 'layer back', 'ctrl + B', layerBack, false, true, false );
- LAYER_FORWARD_BUTTON = MENU_BAR_CONTROL.EDIT.createOption( 'layer forward', 'ctrl + F', layerForward, false, false, false );
- DELETE_BUTTON = MENU_BAR_CONTROL.EDIT.createOption( 'delete', 'ctrl + D', del, false, true, true );
- EDIT_BUTTON = MENU_BAR_CONTROL.EDIT.createOption( 'Edit Text', 'ctrl + E', edit, false, true, false );
- CHANGE_BUTTON = MENU_BAR_CONTROL.EDIT.createOption( 'change', 'ctrl + U', change, false, false, true );
-
- delete CONSOLE_CONTROLER.open;
- },
- show: function( _currentElement, _w, _h ){
- if( visible === false ) styleConsoleWrapper.display = '';
- visible = true;
- currentElement = _currentElement;
- var _currentType = _currentElement.type,
- _z = _currentElement.z,
- imgEvent, txtEvent;
- if( currentType !== _currentType ){
- currentType = _currentType;
- styleImgConsole.display = _currentType === PANEL_ELEMENT_TYPE_IMAGE ? '' : 'none';
- styleTextConsole.display = _currentType === PANEL_ELEMENT_TYPE_TEXT ? '' : 'none';
- CONSOLE_CONTROLER.w = _currentType === PANEL_ELEMENT_TYPE_IMAGE ? imgConsoleWidth : textConsoleWidth;
- CONSOLE_CONTROLER.h = _currentType === PANEL_ELEMENT_TYPE_IMAGE ? imgConsoleHeight : textConsoleHeight;
-
- imgEvent = _currentType === PANEL_ELEMENT_TYPE_IMAGE ? 'addEventListener' : 'removeEventListener';
- txtEvent = _currentType === PANEL_ELEMENT_TYPE_TEXT ? 'addEventListener' : 'removeEventListener';
-
- app[ imgEvent ]( document.getElementById( 'change-image-button' ), 'click', change );
- app[ imgEvent ]( document.getElementById( 'layer-forward-button' ), 'click', layerForward );
- app[ imgEvent ]( document.getElementById( 'layer-back-button' ), 'click', layerBack );
- app[ imgEvent ]( document.getElementById( 'delete-image-button' ), 'click', del );
-
- app[ txtEvent ]( document.getElementById( 'edit-text-button' ), 'click', edit );
- app[ txtEvent ]( document.getElementById( 'forward-text-button' ), 'click', layerForward );
- app[ txtEvent ]( document.getElementById( 'back-text-button' ), 'click', layerBack );
- app[ txtEvent ]( document.getElementById( 'delete-text-button' ), 'click', del );
- };
- CONSOLE_CONTROLER.x = Math.floor( ( _w - CONSOLE_CONTROLER.w ) / 2 );
-
- LAYER_BACK_BUTTON.visible( _z > 0 );
- LAYER_FORWARD_BUTTON.visible( _z < PANEL_ELEMENT_ARRAY.length - 1 );
- DELETE_BUTTON.visible( true );
- EDIT_BUTTON.visible( _currentType === PANEL_ELEMENT_TYPE_TEXT );
- CHANGE_BUTTON.visible( false );
-
- if( _w > CONSOLE_CONTROLER.w * 1.5 && _h > CONSOLE_CONTROLER.h * 1.5 ){
- CONSOLE_CONTROLER.y = Math.floor( ( _h - CONSOLE_CONTROLER.h ) / 2 );
- elmConsoleWrapper.className = '';
- } else {
- CONSOLE_CONTROLER.y = _h + tailSize;
- elmConsoleWrapper.className = 'console-out';
- };
- styleConsoleWrapper.left = CONSOLE_CONTROLER.x + 'px';
- styleConsoleWrapper.top = CONSOLE_CONTROLER.y + 'px';
-
- // layerWrapper.mesure();
- },
- hide: function(){
- if( visible === true ) styleConsoleWrapper.display = 'none';
- visible = false;
- currentElement = null;
- LAYER_BACK_BUTTON.visible( false );
- LAYER_FORWARD_BUTTON.visible( false );
- DELETE_BUTTON.visible( false );
- EDIT_BUTTON.visible( false );
- CHANGE_BUTTON.visible( false );
- },
- hitTest : function( _mouseX, _mouseY ){
- if( currentElement === null ) return false;
- _mouseX -= currentElement.x;
- _mouseY -= currentElement.y;
- return visible === true &&
- CONSOLE_CONTROLER.x <= _mouseX && _mouseX <= CONSOLE_CONTROLER.x + CONSOLE_CONTROLER.w &&
- CONSOLE_CONTROLER.y <= _mouseY && _mouseY <= CONSOLE_CONTROLER.y + CONSOLE_CONTROLER.h;
- },
- mousemove: function(){
- /*
- if( CONSOLE_CONTROLER.x > _mouseX || CONSOLE_CONTROLER.y > _mouseY || CONSOLE_CONTROLER.x + CONSOLE_CONTROLER.w < _mouseX || CONSOLE_CONTROLER.y + CONSOLE_CONTROLER.h < _mouseY ){
- // buttonClickable === true && buttonBackOrForward( true );
- return false;
- }
- // buttonClickable === false && buttonBackOrForward( false ); */
- // layerWrapper.mesure();
- return false;
- }
- }
})();
/* --------------------------------------------------------------------------------------------
* visibilityのほうがいい, display:none だと ie で描画が狂う
*/
styleMover.visibility = '';
- TAIL_OPERATOR.update( _currentText.w, _currentText.h, _currentText.angle() );
+ TAIL_OPERATOR.update( _currentText.w, _currentText.h, _currentText.a );
currentText = _currentText;
},
hitTest: function( _mouseX, _mouseY ){
w = _currentText.w;
h = _currentText.h;
currentText = _currentText;
- startA = _currentText.angle();
+ startA = _currentText.a;
return true;
}
return false;
ATAN( _mouseY / _mouseX ) * RAD_TO_DEG + ( _mouseX > 0 ? 90 : 270 ) :
_mouseY > 0 ? 180 : 0
);
- currentText && currentText.angle( FLOOR( balloonA + 0.5 ));
- INFOMATION_WINDOW.update( currentText );
+ currentText && currentText.angle( FLOOR( balloonA + 0.5 ) );
+ CONSOLE_CONTROLER.update( currentText );
},
onFinish: function(){
- startA !== currentText.angle() && PANEL_ELEMENT_OPERATION_MANAGER.saveStatus( x, y, w, h, startA );
- startA !== currentText.angle() && PANEL_ELEMENT_OPERATION_MANAGER.resize( x, y, w, h, currentText.angle() );
+ startA !== currentText.a && PANEL_ELEMENT_OPERATION_MANAGER.saveStatus( x, y, w, h, startA );
+ startA !== currentText.a && PANEL_ELEMENT_OPERATION_MANAGER.resize( x, y, w, h, currentText.a );
currentText = null;
},
onCancel: function(){
- currentText.angle( startA);
+ currentText.angle( startA );
PANEL_ELEMENT_OPERATION_MANAGER.resize( x, y, w, h, startA );
currentText = null;
}
w = _w = _w !== undefined ? _w : w;
h = _h = _h !== undefined ? _h : h;
- elmResizerContainerStyle.left = _x + 'px';
- elmResizerContainerStyle.top = _y + 'px';
+ elmResizerContainerStyle.left = ( PANEL_CONTROL.x + _x ) + 'px';
+ elmResizerContainerStyle.top = ( PANEL_CONTROL.y + _y ) + 'px';
elmResizerContainerStyle.width = _w + 'px';
elmResizerContainerStyle.height = _h + 'px';
elmResizerTopStyle.left = elmResizerBottomStyle.left = FLOOR( _w / 2 - 5 ) + 'px';
__h = _h;
_h = FLOOR( _w / startAspect );
_y = _y + ( currentIndex <= 5 ? __h - _h : 0);
- }
- }
+ };
+ };
draw( x = _x, y = _y, w = _w, h = _h );
currentElement.resize( _x, _y, _w, _h );
currentIsTextElement === true && TAIL_OPERATOR.update( _w, _h );
CONSOLE_CONTROLER.show( currentElement, _w, _h );
- INFOMATION_WINDOW.update( currentElement);
- }
+ CONSOLE_CONTROLER.update( currentElement );
+ };
function flip( _flipH, _flipV ){
var p = CURSOR_AND_FLIP[ currentIndex ];
app.updateCoursor( CURSOR_AND_FLIP[ currentIndex ].cursor );
elmResizerContainer.className = 'current-resizer-is-' + currentIndex;
currentElement.flip( _flipH, _flipV );
- }
+ };
return {
init: function(){
elmResizerContainer = document.getElementById( 'comic-element-resizer-container');
app.updateCoursor( CURSOR_AND_FLIP[ i].cursor );
elmResizerContainer.className = 'current-resizer-is-' +i;
return currentIndex = i;
- }
- }
+ };
+ };
for( i=0; i<4; i++ ){
p = POSITION_ARRAY[ i ];
if( p.x <= _mouseX && p.y <= _mouseY && p.x + p.w >= _mouseX && p.y +p.h >= _mouseY){
app.updateCoursor( CURSOR_AND_FLIP[ i].cursor);
elmResizerContainer.className = 'current-resizer-is-' +i;
return currentIndex = i;
- }
- }
+ };
+ };
app.updateCoursor( '' );
elmResizerContainer.className = '';
return -1;
startW = baseW = _currentElement.w;
startH = baseH = _currentElement.h;
if( _currentElement.type === PANEL_ELEMENT_TYPE_IMAGE){
- startFilpV = _currentElement.flipV();
- startFilpH = _currentElement.flipH();
- }
+ startFilpV = _currentElement.flipV;
+ startFilpH = _currentElement.flipH;
+ };
startAspect = startW /startH;
return true;
},
onDrag: function( _mouseX, _mouseY ){
- var com = RESIZE_WORK_ARRAY[ currentIndex],
- moveX = _mouseX -offsetX,
- moveY = _mouseY -offsetY,
+ var com = RESIZE_WORK_ARRAY[ currentIndex ],
+ moveX = _mouseX - offsetX,
+ moveY = _mouseY - offsetY,
_updated = moveX !== 0 || moveY !== 0,
_x, _y, _w, _h,
_thisError = 0;
//alert( 'opera error' +error);
this.onCancel();
return;
- }
- }
+ };
+ };
if( _w >= MIN_ELEMENT_SIZE && _h >= MIN_ELEMENT_SIZE){
baseW = _w = _memoryX -_x;
baseH = _h;
flip( true, false);
- flipV = currentElement.flipV();
+ flipV = currentElement.flipV;
} else
if( _w > MIN_ELEMENT_SIZE && _h < -MIN_ELEMENT_SIZE){
// flipV
baseW = _w = _memoryX -_x;
baseH = _h = _memoryY -_y;
flip( true, true);
- flipV = currentElement.flipV();
- flipH = currentElement.flipH();
- }
+ flipV = currentElement.flipV;
+ flipH = currentElement.flipH;
+ };
_updated = true;
offsetX = _mouseX;
offsetY = _mouseY;
- }
+ };
currentX = _x;
currentY = _y;
currentW = _w;
PANEL_ELEMENT_OPERATION_MANAGER.resize( startX, startY, startW, startH );
currentElement.type === PANEL_ELEMENT_TYPE_IMAGE ?
currentElement.animate( startX, startY, startW, startH, startFilpV, startFilpH) :
- currentElement.animate( startX, startY, startW, startH, angle);
+ currentElement.animate( startX, startY, startW, startH, angle );
},
onShiftUpdate: update,
onCtrlUpdate: update
y = _y !== undefined ? _y : y;
RESIZE_OPERATOR.update( x, y );
currentElement.resize( x, y );
- INFOMATION_WINDOW.update( currentElement );
+ CONSOLE_CONTROLER.update( currentElement );
};
return {
init: function(){
},
onShiftUpdate: update,
onCtrlUpdate: update
- }
+ };
})();
currentIsTextElement = false,
currentOperator = null,
currentElement = null,
+ node = null,
currentX, currentY, currentW, currentH, angle, flipV, flipH;
- function show( _currentElement ){
- currentElement === null && RESIZE_OPERATOR.show( _currentElement );
- if( currentElement !== _currentElement ){
- currentElement = _currentElement;
-
- currentIsTextElement = ( _currentElement.type === PANEL_ELEMENT_TYPE_TEXT );
- currentIsTextElement === true ? TAIL_OPERATOR.show( _currentElement ) : TAIL_OPERATOR.hide();
-
- flipV = currentIsTextElement === false ? _currentElement.flipV() : 0;
- flipH = currentIsTextElement === false ? _currentElement.flipH() : 0;
-
- PANEL_ELEMENT_OPERATION_MANAGER.resize(
- _currentElement.x, _currentElement.y, _currentElement.w, _currentElement.h,
- currentIsTextElement === true ? _currentElement.angle() : 0
- );
- };
+ function show( _currentElement ){
+ currentElement === null && RESIZE_OPERATOR.show( _currentElement );
+ if( currentElement !== _currentElement ){
+ currentElement = _currentElement;
+
+ currentIsTextElement = ( _currentElement.type === PANEL_ELEMENT_TYPE_TEXT );
+ currentIsTextElement === true ? TAIL_OPERATOR.show( _currentElement ) : TAIL_OPERATOR.hide();
+
+ flipV = currentIsTextElement === false ? _currentElement.flipV : 0;
+ flipH = currentIsTextElement === false ? _currentElement.flipH : 0;
+
+ PANEL_ELEMENT_OPERATION_MANAGER.resize(
+ _currentElement.x, _currentElement.y, _currentElement.w, _currentElement.h,
+ currentIsTextElement === true ? _currentElement.a : 0
+ );
};
+ };
return {
init: function(){
app.updateCoursor( '' );
TAIL_OPERATOR.hide();
CONSOLE_CONTROLER.hide();
- INFOMATION_WINDOW.update( null );
+ //CONSOLE_CONTROLER.update( null );
},
resize: function( _x, _y, _w, _h, _angle ){
currentX = _x = _x !== undefined ? _x : currentX;
RESIZE_OPERATOR.update( _x, _y, _w, _h );
currentIsTextElement === true && TAIL_OPERATOR.update( _w, _h, angle );
CONSOLE_CONTROLER.show( currentElement, _w, _h );
- INFOMATION_WINDOW.update( currentElement );
+ //CONSOLE_CONTROLER.update( currentElement );
},
/* history */
restoreState: function( _currentElement, _x, _y, _w, _h, _a, _flipV, _flipH ){
startFilpV = startFilpV !== undefined ? startFilpV : flipV;
startFilpH = startFilpH !== undefined ? startFilpH : flipH;
currentElement && HISTORY_CONTROL.saveState( PANEL_ELEMENT_OPERATION_MANAGER.restoreState,
- [ currentElement, startX, startY, startW, startH, startA, startFilpV, startFilpH],
- [ currentElement, currentX, currentY, currentW, currentH, angle, flipV, flipH]
+ [ currentElement, startX, startY, startW, startH, startA, startFilpV, startFilpH ],
+ [ currentElement, currentX, currentY, currentW, currentH, angle, flipV, flipH ]
);
},
busy: function(){
} else {
_x = _panelElement.x - HIT_AREA;
_y = _panelElement.y - HIT_AREA;
- _w = _panelElement.w + HIT_AREA *2;
- _h = _panelElement.h + HIT_AREA *2;
- }
+ _w = _panelElement.w + HIT_AREA * 2;
+ _h = _panelElement.h + HIT_AREA * 2;
+ };
return _x <= _mouseX && _mouseX <= _x + _w && _y <= _mouseY && _mouseY <= _y + _h;
},
mousedown: function( _currentElement, _mouseX, _mouseY ){
//show( _currentElement);
- if( currentIsTextElement === true && TAIL_OPERATOR.onStart( _currentElement, _mouseX, _mouseY) === true){
+ if( currentIsTextElement === true && TAIL_OPERATOR.onStart( _currentElement, _mouseX, _mouseY ) === true ){
currentOperator = TAIL_OPERATOR;
} else
- if( RESIZE_OPERATOR.onStart( _currentElement, _mouseX, _mouseY) === true){
+ if( RESIZE_OPERATOR.onStart( _currentElement, _mouseX, _mouseY ) === true ){
currentOperator = RESIZE_OPERATOR;
} else {
- POSITION_OPERATOR.onStart( _currentElement, _mouseX, _mouseY)
+ POSITION_OPERATOR.onStart( _currentElement, _mouseX, _mouseY );
currentOperator = POSITION_OPERATOR;
- }
+ };
},
mousemove: function( _currentElement, _mouseX, _mouseY ){
show( _currentElement);
- if( currentOperator !== null){
+ if( currentOperator !== null ){
currentOperator.onDrag( _mouseX, _mouseY );
} else
- if( currentElement !== null){
- CONSOLE_CONTROLER.mousemove( _mouseX - currentX, _mouseY - currentY );
- if( currentIsTextElement === false || TAIL_OPERATOR.hitTest( _mouseX -currentX, _mouseY -currentY) === false){
- RESIZE_OPERATOR.index( _mouseX, _mouseY);
- }
- }
+ if( currentElement !== null ){
+ // CONSOLE_CONTROLER.mousemove( _mouseX - currentX, _mouseY - currentY );
+ if( currentIsTextElement === false || TAIL_OPERATOR.hitTest( _mouseX - currentX, _mouseY - currentY ) === false ){
+ RESIZE_OPERATOR.index( _mouseX, _mouseY );
+ };
+ };
},
mouseup: function( _currentElement, _mouseX, _mouseY ){
currentOperator !== null && currentOperator.onFinish();
* // PANEL_ELEMENT_OPERATION_MANAGER
*/
+/* --------------------------------------------------------------------------------------------
+ * CONSOLE_CONTROLER
+ */
+ var CONSOLE_CONTROLER = ( function(){
+ var LAYER_BACK_BUTTON, LAYER_FORWARD_BUTTON, DELETE_BUTTON, EDIT_BUTTON, CHANGE_BUTTON,
+ PUSH_OUT_RATIO = 0.5,
+ tailSize = 10,
+ elmRoot, elmContainer, elmPushout, elmTail,
+ pushoutW = 0,
+ pushoutH = 0,
+ pushout = false,
+ currentType = -1,
+ visible = false,
+ node = null,
+ ui, inputX, inputY, inputZ, inputA, inputW, inputH, inputAspectRatio,
+ buttonBack, buttonForward, buttonDel, buttonEdit, butonChange;
+
+ function layerBack(){
+ if( currentElement === null ) return;
+ if( PANEL_ELEMENT_CONTROL.replace( currentElement, false ) === false ) return;
+ CONSOLE_CONTROLER.update( currentElement );
+ HISTORY_CONTROL.saveState( PANEL_ELEMENT_CONTROL.resplace, [ currentElement, true ], [ currentElement, false ] );
+ var _z = currentElement.z;
+ LAYER_BACK_BUTTON.visible( _z > 0 );
+ LAYER_FORWARD_BUTTON.visible( _z < PANEL_ELEMENT_ARRAY.length - 1 );
+ };
+ function layerForward(){
+ if( currentElement === null ) return;
+ if( PANEL_ELEMENT_CONTROL.replace( currentElement, true ) === false ) return;
+ CONSOLE_CONTROLER.update( currentElement );
+ HISTORY_CONTROL.saveState( PANEL_ELEMENT_CONTROL.replace, [ currentElement, false ], [ currentElement, true ] );
+ var _z = currentElement.z;
+ LAYER_BACK_BUTTON.visible( _z > 0 );
+ LAYER_FORWARD_BUTTON.visible( _z < PANEL_ELEMENT_ARRAY.length - 1 );
+ };
+ function del(){
+ if( currentElement === null ) return;
+ HISTORY_CONTROL.saveState( PANEL_ELEMENT_CONTROL.restore, [ true, currentElement ], [ false, currentElement ], false ); // true
+ PANEL_ELEMENT_CONTROL.remove( currentElement );
+ PANEL_ELEMENT_OPERATION_MANAGER.hide();
+ };
+ function edit(){
+ if( currentElement === null || currentElement.type !== PANEL_ELEMENT_TYPE_TEXT ) return;
+ TextEditor.boot( PANEL_CONTROL.x, PANEL_CONTROL.y, currentElement );
+ };
+ function change(){
+ if( currentElement === null ) return;
+ PremiumSatge.boot( currentElement.artistID, currentElement.resourcePicture, currentElement );
+ };
+
+ return {
+ x: 0,
+ y: 0,
+ w: 0,
+ h: 0,
+ init: function(){
+ app.addKeyEventListener( 'keydown', layerBack, 66, false, true );
+ app.addKeyEventListener( 'keydown', layerForward, 70, false, true );
+ app.addKeyEventListener( 'keydown', del, 68, false, true );
+ app.addKeyEventListener( 'keydown', edit, 69, false, true );
+ app.addKeyEventListener( 'keydown', change, 85, false, true );
+
+ elmContainer = document.getElementById( 'comic-element-consol-container' );
+ elmRoot = elmContainer.parentNode;
+ elmPushout = document.getElementById( 'comic-element-consol-pushout-wrapper' );
+ elmTail = document.getElementById( 'comic-element-consol-pushout-tail' );
+ delete CONSOLE_CONTROLER.init;
+ },
+ open: function(){
+ // layerWrapper = app.createInteractContainer( elmConsoleWrapper );
+
+ LAYER_BACK_BUTTON = MENU_BAR_CONTROL.EDIT.createOption( 'layer back', 'ctrl + B', layerBack, false, true, false );
+ LAYER_FORWARD_BUTTON = MENU_BAR_CONTROL.EDIT.createOption( 'layer forward', 'ctrl + F', layerForward, false, false, false );
+ DELETE_BUTTON = MENU_BAR_CONTROL.EDIT.createOption( 'delete', 'ctrl + D', del, false, true, true );
+ EDIT_BUTTON = MENU_BAR_CONTROL.EDIT.createOption( 'Edit Text', 'ctrl + E', edit, false, true, false );
+ CHANGE_BUTTON = MENU_BAR_CONTROL.EDIT.createOption( 'change', 'ctrl + U', change, false, false, true );
+
+
+ // inputAspectRatio = $( '#comic-element-keep-aspect' );
+
+ delete CONSOLE_CONTROLER.open;
+ },
+ onMouseover : function( e ){
+ node.mesureChildren();
+ //node.mesure();
+ },
+ show: function( _currentElement, w, h ){
+ if( node === null ){
+ node = PANEL_CONTROL.node.createNode( elmContainer, false, false, 'comic-element-consol-container-hover' );
+ node.addEventListener( 'mouseover', CONSOLE_CONTROLER.onMouseover, CONSOLE_CONTROLER );
+ ui = app.createUIGroup( node );
+ inputX = ui.createInputText( document.getElementById( 'comic-element-x' ), null );
+ inputY = ui.createInputText( document.getElementById( 'comic-element-y' ), null );
+ inputZ = ui.createInputText( document.getElementById( 'comic-element-z' ), null );
+ inputA = ui.createInputText( document.getElementById( 'comic-element-a' ), null );
+ inputW = ui.createInputText( document.getElementById( 'comic-element-w' ), null );
+ inputH = ui.createInputText( document.getElementById( 'comic-element-h' ), null );
+ inputPercentW = ui.createInputText( document.getElementById( 'comic-element-w-percent' ), null );
+ inputPercentH = ui.createInputText( document.getElementById( 'comic-element-h-percent' ), null );
+ butonChange = ui.createButton( document.getElementById( 'change-image-button' ), change ),
+ buttonBack = ui.createButton( document.getElementById( 'layer-back-button' ), layerBack ),
+ buttonDel = ui.createButton( document.getElementById( 'delete-button' ), del ),
+ buttonForward = ui.createButton( document.getElementById( 'layer-forward-button' ), layerForward ),
+ buttonEdit = ui.createButton( document.getElementById( 'edit-text-button' ), edit );
+ };
+
+ currentElement = _currentElement;
+
+ var type = currentElement.type,
+ z = currentElement.z;
+
+ LAYER_BACK_BUTTON.visible( z > 0 );
+ buttonBack.enabled( z > 0 );
+ LAYER_FORWARD_BUTTON.visible( z < PANEL_ELEMENT_ARRAY.length - 1 );
+ buttonForward.enabled( z < PANEL_ELEMENT_ARRAY.length - 1 )
+ DELETE_BUTTON.visible( true );
+ EDIT_BUTTON.visible( type === PANEL_ELEMENT_TYPE_TEXT );
+ CHANGE_BUTTON.visible( false );
+
+ //CONSOLE_CONTROLER.x = Math.floor( ( _w - CONSOLE_CONTROLER.w ) / 2 );
+ CONSOLE_CONTROLER.w = w;
+ CONSOLE_CONTROLER.h = elmContainer.offsetHeight;
+ CONSOLE_CONTROLER.y = h - CONSOLE_CONTROLER.h;
+
+ if( h * PUSH_OUT_RATIO < CONSOLE_CONTROLER.h ){
+ if( pushout === false ){
+ pushout = true;
+ elmPushout.appendChild( elmContainer );
+ elmPushout.style.display = 'block';
+ pushoutW = elmPushout.offsetWidth;
+ pushoutH = elmPushout.offsetHeight;
+ elmTail.style.top = ( pushoutH / 2 - tailSize / 2 ) + 'px';
+ };
+ elmPushout.style.left = ( - pushoutW - tailSize ) + 'px';
+ elmPushout.style.top = ( h / 2 - pushoutH / 2 ) + 'px';
+ elmPushout.className = 'satellite-left';
+ } else
+ if( pushout === true ){
+ pushout = false;
+ elmRoot.insertBefore( elmContainer, elmRoot.firstChild );
+ elmPushout.style.cssText = '';
+ };
+
+ CONSOLE_CONTROLER.update( currentElement );
+ ui.visible( true );
+ node.mesure();
+ },
+ update : function( _currentElement ){
+ if( _currentElement === null ){
+ visible = false;
+ return;
+ };
+ currentElement = _currentElement;
+ var type = currentElement.type,
+ x = currentElement.x,
+ y = currentElement.y,
+ z = currentElement.z,
+ a = type === PANEL_ELEMENT_TYPE_TEXT ? Math.floor( currentElement.a ) : 0,
+ w = currentElement.w,
+ h = currentElement.h,
+ actualW = type === PANEL_ELEMENT_TYPE_IMAGE ? currentElement.actualW : 1,
+ actualH = type === PANEL_ELEMENT_TYPE_IMAGE ? currentElement.actualH : 1,
+ wPercent = type === PANEL_ELEMENT_TYPE_IMAGE ? Math.floor( w / actualW * 100 ) : 0,
+ hPercent = type === PANEL_ELEMENT_TYPE_IMAGE ? Math.floor( h / actualH * 100 ) : 0,
+ keepAspect = currentElement.keepAspect;
+
+ if( currentType !== type ){
+ if( type === PANEL_ELEMENT_TYPE_TEXT ){
+ inputA.visible( true );
+ inputPercentW.visible( false );
+ inputPercentH.visible( false );
+ buttonEdit.enabled( true );
+ //inputAspectRatio.hide();
+ } else {
+ inputA.visible( false );
+ inputPercentW.visible( true );
+ inputPercentH.visible( true );
+ buttonEdit.enabled( false );
+ //inputAspectRatio.show();
+ };
+ currentType = type;
+ };
+
+ inputX.value( x );
+ inputY.value( y );
+ inputZ.value( z );
+ type === 1 && inputA.value( a );
+ inputW.value( w );
+ inputH.value( h );
+ type === 0 && inputPercentW.value( wPercent );
+ type === 0 && inputPercentH.value( hPercent );
+ },
+ hide: function(){
+ // if( visible === true ) styleConsoleWrapper.display = 'none';
+ ui && ui.visible( false );
+ visible = false;
+ currentElement = null;
+ LAYER_BACK_BUTTON.visible( false );
+ LAYER_FORWARD_BUTTON.visible( false );
+ DELETE_BUTTON.visible( false );
+ EDIT_BUTTON.visible( false );
+ CHANGE_BUTTON.visible( false );
+ },
+ hitTest : function( x, y ){
+ if( visible === false ) return false;
+ x -= currentElement.x;
+ y -= currentElement.y;
+ if( pushout ){
+ return CONSOLE_CONTROLER.x <= x && x <= CONSOLE_CONTROLER.x + CONSOLE_CONTROLER.w &&
+ CONSOLE_CONTROLER.y <= y && y <= CONSOLE_CONTROLER.y + CONSOLE_CONTROLER.h;
+ };
+ return CONSOLE_CONTROLER.x <= x && x <= CONSOLE_CONTROLER.x + CONSOLE_CONTROLER.w &&
+ CONSOLE_CONTROLER.y <= y && y <= CONSOLE_CONTROLER.y + CONSOLE_CONTROLER.h;
+ }
+ };
+ })();
+
+
+
var AbstractPanelElement = function( COMIC_ELM_TYPE ){
this.type = COMIC_ELM_TYPE;
- this.hitTest = function( _mouseX, _mouseY ){
- return PANEL_ELEMENT_OPERATION_MANAGER.hitTest( _mouseX, _mouseY, this );
- }
- this.shift = function( _shiftX, _shiftY ){
- this.resize( this.x + _shiftX, this.y + _shiftY);
- }
- this.busy = function(){
+ };
+ AbstractPanelElement.prototype = {
+ $ : null,
+ data : null,
+ x : 0,
+ y : 0,
+ w : 0,
+ h : 0,
+ z : 0,
+ timing : 0,
+ actualW : 0,
+ actualH : 0,
+ flipV : 0,
+ flipH : 0,
+ hitTest : function( mouseX, mouseY ){
+ return PANEL_ELEMENT_OPERATION_MANAGER.hitTest( mouseX, mouseY, this );
+ },
+ shift : function( shiftX, shiftY ){
+ this.resize( this.x + shiftX, this.y + shiftY );
+ },
+ busy : function(){
return PANEL_ELEMENT_OPERATION_MANAGER.busy();
- }
- this.mousemove = function( _mouseX, _mouseY ){
- PANEL_ELEMENT_OPERATION_MANAGER.mousemove( this, _mouseX, _mouseY );
- }
- this.mouseup = function( _mouseX, _mouseY ){
- PANEL_ELEMENT_OPERATION_MANAGER.mouseup( this, _mouseX, _mouseY );
- }
- this.mousedown = function( _mouseX, _mouseY ){
- PANEL_ELEMENT_OPERATION_MANAGER.mousedown( this, _mouseX, _mouseY );
+ },
+ mousemove : function( mouseX, mouseY ){
+ PANEL_ELEMENT_OPERATION_MANAGER.mousemove( this, mouseX, mouseY );
+ },
+ mouseup : function( mouseX, mouseY ){
+ PANEL_ELEMENT_OPERATION_MANAGER.mouseup( this, mouseX, mouseY );
+ },
+ mousedown : function( mouseX, mouseY ){
+ PANEL_ELEMENT_OPERATION_MANAGER.mousedown( this, mouseX, mouseY );
}
};
var ImageElementClass = function( data ){
jqImageElementOrigin = jqImageElementOrigin || $( app.fetchHTMLElement( 'imgElementTemplete' ) );
- var jqWrap = jqImageElementOrigin.clone( true ),
- flipH = data.width < 0 ? -1 : 1,
- flipV = data.height < 0 ? -1 : 1,
- resourcePicture = data.resource_picture,
- actualW = data.resource_picture.width,
- actualH = data.resource_picture.height,
- reversibleImage = null,
- self = this,
- x, y, z, w, h;
- function flipReversibleImage(){
- reversibleImage && reversibleImage.resize( flipH * w, flipV * h );
- };
- /* history */
- function updateResourcePicture( _resourcePicture ){
- resourcePicture = _resourcePicture;
-
- actualW = _resourcePicture.width;
- actualH = _resourcePicture.height;
-
- var _reversibleImage = pettanr.image.createReversibleImage(
- [ pettanr.CONST.RESOURCE_PICTURE_PATH, _resourcePicture.id, '.', _resourcePicture.ext ].join(''),
- flipH * w, flipV * h
- );
- if( reversibleImage !== null ){
- jqWrap.children( reversibleImage.elm ).replaceWith( _reversibleImage.elm );
- reversibleImage.destroy();
- } else {
- jqWrap.append( _reversibleImage.elm );
- }
- reversibleImage = _reversibleImage;
- };
- /* global methods */
- this.$ = jqWrap;
- //this.x = x;
- //this.y = y;
- //this.w = w;
- //this.h = h;
- this.z = data.z;
- this.timing = data.t || PANEL_ELEMENT_ARRAY.length + 1;
+ this.$ = jqImageElementOrigin.clone( true );
+ this.data = data;
+ this.z = data.z;
+ this.timing = data.t || PANEL_ELEMENT_ARRAY.length + 1;
this.keepSize = false;
- this.init = function(){
- updateResourcePicture( data.resource_picture );
- self.resize( data.x, data.y, Math.abs( data.width ), Math.abs( data.height ) );
- delete self.init;
- };
- this.flip = function( _updateH, _updateV ){
- if( _updateH !== true && _updateV !== true ) return;
- flipH = _updateH === true ? -flipH : flipH;
- flipV = _updateV === true ? -flipV : flipV;
- reversibleImage.resize( flipH * w, flipV * h );
- };
- this.flipV = function(){ return flipV;}
- this.flipH = function(){ return flipH;}
- this.resourcePicture = function( _resourcePicture ){
- if( _resourcePicture && _resourcePicture !== resourcePicture ){
- HISTORY_CONTROL.saveState( updateResourcePicture, resourcePicture, _resourcePicture );
- updateResourcePicture( _resourcePicture );
- };
- return resourcePicture;
- };
- this.getArtistID = function(){
- return resourcePicture.artist_id || resourcePicture.artist.id || -1;
- };
- this.actualW = function(){ return actualW;}
- this.actualH = function(){ return actualH;}
- this.resize = function( _x, _y, _w, _h, animate ){
- self.x = x = Type.isFinite( _x ) === true ? _x : x;
- self.y = y = Type.isFinite( _y ) === true ? _y : y;
- self.w = w = Type.isFinite( _w ) === true ? _w : w;
- self.h = h = Type.isFinite( _h ) === true ? _h : h;
- jqWrap[ animate === true ? 'animate' : 'css' ]( {
- left: x,
- top: y,
- width: w,
- height: h
- }, 250, flipReversibleImage );
- animate !== true && flipReversibleImage();
- };
- this.animate = function ( _x, _y, _w, _h, _flipH, _flipV ){
- flipH = _flipH !== undefined ? _flipH : flipH;
- flipV = _flipV !== undefined ? _flipV : flipV;
- self.resize( _x, _y, _w, _h, true );
- };
- this.destroy = function(){
- delete self.destroy;
-
- reversibleImage.destroy();
- jqWrap.stop().remove();
- jqWrap = reversibleImage = resourcePicture = data = self = null;
- };
+ this.flipV = data.height < 0 ? -1 : 1;
+ this.flipH = data.width < 0 ? -1 : 1;
+ this.rPicture = data.resource_picture;
+ this.artistID = this.rPicture.artist_id || this.rPicture.artist.id || -1;
+ this.reversibleImage = null;
};
- ImageElementClass.prototype = new AbstractPanelElement( PANEL_ELEMENT_TYPE_IMAGE );
+ ImageElementClass.prototype = Util.extend(
+ new AbstractPanelElement( PANEL_ELEMENT_TYPE_IMAGE ),
+ {
+ init : function(){
+ this._updateResourcePicture( this.rPicture );
+ this.resize( this.data.x, this.data.y, Math.abs( this.data.width ), Math.abs( this.data.height ) );
+ this.init = null;
+ },
+ flip : function( updateH, updateV ){
+ if( updateH !== true && updateV !== true ) return;
+ this.flipH = updateH === true ? -this.flipH : this.flipH;
+ this.flipV = updateV === true ? -this.flipV : this.flipV;
+ this.reversibleImage.resize( this.flipH * this.w, this.flipV * this.h );
+ },
+ resourcePicture : function( _rPicture ){
+ if( _rPicture && _rPicture !== this.rPicture ){
+ HISTORY_CONTROL.saveState( this._updateResourcePicture, this.rPicture, _rPicture, this );
+ this._updateResourcePicture( _rPicture );
+ };
+ return this.rPicture;
+ },
+ resize : function( x, y, w, h, animate ){
+ this.x = x = Type.isFinite( x ) === true ? x : this.x;
+ this.y = y = Type.isFinite( y ) === true ? y : this.y;
+ this.w = w = Type.isFinite( w ) === true ? w : this.w;
+ this.h = h = Type.isFinite( h ) === true ? h : this.h;
+ this.$[ animate === true ? 'animate' : 'css' ]( {
+ left: x,
+ top: y,
+ width: w,
+ height: h
+ }, 250 /*, flipReversibleImage */ );
+ /*animate !== true && */ this._flipReversibleImage();
+ },
+ animate : function ( x, y, w, h, flipH, flipV ){
+ this.flipH = flipH !== undefined ? flipH : this.flipH;
+ this.flipV = flipV !== undefined ? flipV : this.flipV;
+ this.resize( x, y, w, h, true );
+ },
+ destroy : function(){
+ this.reversibleImage.destroy();
+ this.$.stop().remove();
+ },
+ _updateResourcePicture : function( _rPicture ){
+ this.rPicture = _rPicture;
+
+ this.actualW = _rPicture.width;
+ this.actualH = _rPicture.height;
+
+ var _reversibleImage = pettanr.image.createReversibleImage(
+ [ pettanr.CONST.RESOURCE_PICTURE_PATH, _rPicture.id, '.', _rPicture.ext ].join(''),
+ this.flipH * this.w, this.flipV * this.h
+ );
+ if( this.reversibleImage !== null ){
+ this.$.children( this.reversibleImage.elm ).replaceWith( _reversibleImage.elm );
+ this.reversibleImage.destroy();
+ } else {
+ this.$.append( _reversibleImage.elm );
+ };
+ this.reversibleImage = _reversibleImage;
+ },
+ _flipReversibleImage : function(){
+ this.reversibleImage && this.reversibleImage.resize( this.flipH * this.w, this.flipV * this.h );
+ }
+ }
+ );
+
+
/*
* / ImageElementClass
* --------------------------------------------------------------------------------------------
return UA.isIE === true && UA.ieRenderingVersion < 8 ? _OLD_IE : _MODERN;
})();
- var JQ_WRAPPER = jqTextElementOrigin.clone( true ),
- elmText = JQ_WRAPPER.find( 'td,.speach-inner' ).get( 0 ),
- type = data.balloon_template_id,
- text = ( function(){
- var _speachs = data.speeches_attributes;
- for( var k in _speachs ){
- return _speachs[ k ].content || '';
- }
- return '';
- })(),
- balloon = pettanr.balloon.createBalloon( data.width, data.height, data.tail, type ),
- x, y, w, h, a,
- self = this;
-
- JQ_WRAPPER.find( 'img' ).eq( 0 ).replaceWith( balloon.elm );
-
- function updateType( _type ){
- if( type !== _type ){
- type = _type || type;
- balloon.type( type );
- };
- };
- function updateAngle( _a ){
- if( _a !== undefined && a !== _a ){
- a = _a !== undefined ? _a : a;
- balloon.angle( a );
- };
- };
- /* history */
- function updateText( _text ){
- text = _text || text || '';
- elmText.firstChild.data = text;
- };
- function resizeBalloon(){
- balloon && balloon.resize( a, w, h );
- };
+ this.$ = jqTextElementOrigin.clone( true );
+ this.data = data;
+ this.elmText = this.$.find( 'td,.speach-inner' ).get( 0 );
+ this.type = data.balloon_template_id;
+ this.content = ( function(){
+ var _speachs = data.speeches_attributes;
+ for( var k in _speachs ){
+ return _speachs[ k ].content || '';
+ }
+ return '';
+ })();
+ this.balloon = pettanr.balloon.createBalloon( data.width, data.height, data.tail, this.type );
+ this.z = data.z;
+ this.timing = data.t || PANEL_ELEMENT_ARRAY.length + 1;
- /* global methods */
- this.$ = JQ_WRAPPER;
- //this.x = x;
- //this.y = y;
- //this.w = w;
- //this.h = h;
- this.z = data.z;
- this.timing = data.t || PANEL_ELEMENT_ARRAY.length + 1;
- this.init = function(){
- updateText();
- self.resize( data.x, data.y, data.width, data.height, data.tail );
- delete self.init;
- };
- this.angle = function( _a ){
- _a !== undefined && self.resize( x, y, w, h, _a );
- return a;
- };
- this.text = function( _text ){
- if( _text && text !== _text) {
- HISTORY_CONTROL.saveState( updateText, text || '', _text );
- updateText( _text );
+ this.$.find( 'img' ).eq( 0 ).replaceWith( this.balloon.elm );
+ };
+ TextElementClass.prototype = Util.extend(
+ new AbstractPanelElement( PANEL_ELEMENT_TYPE_TEXT ),
+ {
+ init : function(){
+ this._updateText();
+ this.resize( this.data.x, this.data.y, this.data.width, this.data.height, this.data.tail );
+ this.init = null;
+ },
+ _updateType : function( _type ){
+ if( this.type !== _type ){
+ this.type = _type || this.type;
+ this.balloon.type( this.type );
+ };
+ },
+ _updateAngle : function( _a ){
+ if( _a !== undefined && a !== _a ){
+ this.a = _a !== undefined ? _a : this.a;
+ this.balloon.angle( this.a );
+ };
+ },
+ /* history */
+ _updateText : function( _text ){
+ this.content = _text || this.content || '';
+ this.elmText.firstChild.data = this.content;
+ },
+ _resizeBalloon : function(){
+ this.balloon && this.balloon.resize( this.a, this.w, this.h );
+ },
+ angle : function( _a ){
+ _a !== undefined && this.resize( this.x, this.y, this.w, this.h, _a );
+ return this.a;
+ },
+ text : function( _text ){
+ if( _text && this.content !== _text ){
+ HISTORY_CONTROL.saveState( this._updateText, this.content || '', _text, this );
+ this._updateText( _text );
+ };
+ return this.content;
+ },
+ resize : function( x, y, w, h, a, animate ){
+ this.x = x = x !== undefined ? x : this.x;
+ this.y = y = y !== undefined ? y : this.y;
+ this.w = w = w !== undefined ? w : this.w;
+ this.h = h = h !== undefined ? h : this.h;
+ this.a = a !== undefined ? a : this.a;
+
+ this.$[ animate === true ? 'animate' : 'css']( {
+ left: x,
+ top: y,
+ width: w,
+ height: h
+ }, 250/*, resizeBalloon */
+ );
+ /*animate !== true && */ this._resizeBalloon();
+ },
+ animate : function ( _x, _y, _w, _h, _a ){
+ this.resize( _x, _y, _w, _h, _a, true );
+ },
+ destroy : function(){
+ this.$.stop().remove();
+ this.balloon.destroy();
}
- return text;
- };
- this.resize = function( _x, _y, _w, _h, _a, animate ){
- self.x = x = _x !== undefined ? _x : x;
- self.y = y = _y !== undefined ? _y : y;
- self.w = w = _w !== undefined ? _w : w;
- self.h = h = _h !== undefined ? _h : h;
- a = _a !== undefined ? _a : a;
-
- JQ_WRAPPER[ animate === true ? 'animate' : 'css']( {
- left: x,
- top: y,
- width: w,
- height: h
- }, 250, resizeBalloon
- );
- animate !== true && resizeBalloon();
- };
- this.animate = function ( _x, _y, _w, _h, _a ){
- self.resize( _x, _y, _w, _h, _a, true );
- };
- this.destroy = function(){
- delete self.destroy;
-
- JQ_WRAPPER.stop().remove();
- balloon.destroy();
- JQ_WRAPPER = elmText = data = balloon = self = null;
- };
- }
- TextElementClass.prototype = new AbstractPanelElement( PANEL_ELEMENT_TYPE_TEXT );
+ }
+ );
/* --------------------------------------------------------------------------------------------
* PANEL_ELEMENT_CONTROL
* 1. remove
* 2. renumber z
*/
- function appendPanelElement( _panelElement ) {
+ function appendPanelElement( _panelElement ){
var z = Type.isFinite( _panelElement.z ) === true ? _panelElement.z : -1,
l = PANEL_ELEMENT_ARRAY.length,
_jqElm = _panelElement.$.stop().css( {
},
close: function(){
var _comicElm;
- while( PANEL_ELEMENT_ARRAY.length > 0 ){
- _comicElm = PANEL_ELEMENT_ARRAY.shift();
- _comicElm.destroy && _comicElm.destroy();
- }
+ while( _comicElm = PANEL_ELEMENT_ARRAY.shift() ){
+ _comicElm.destroy();
+ };
},
remove: function( _panelElement ){
var l = PANEL_ELEMENT_ARRAY.length;
i = j;
break;
};
- }
+ };
if( i === -1) return false;
if( goForward === true ){
if( i === 0 ) return false;
if( i === l - 1 ) return false;
PANEL_ELEMENT_ARRAY.splice( i, 1 );
PANEL_ELEMENT_ARRAY.splice( i + 1, 0, _panelElement );
- }
+ };
renumber( true );
return true;
},
};
if( _elm.hitTest( _x, _y ) === true ){
_elm.mousemove( _x, _y ); // cursor
- return true;
+ return false;
};
};
for( i = 0; i < l; ++i ){
if( _elm.hitTest( _x, _y ) === true ){
_elm.mousemove( _x, _y ); // cursor
currentElement = _elm;
- return true;
+ return false;
};
};
currentElement = null;
PremiumSatge.boot( 1, PANEL_ELEMENT_CONTROL.onImageSelect );
} else {
PANEL_ELEMENT_CONTROL.onImageSelect( data, true );
- }
+ };
},
onImageSelect: function( data, isPanelPictureData ){
var _panelElement;
_panelElement = new ImageElementClass( data );
_panelElement.init();
appendPanelElement( _panelElement );
- }
+ };
HISTORY_CONTROL.saveState( PANEL_ELEMENT_CONTROL.restore, [ false, _panelElement], [ true, _panelElement ], true );
},
createTextElement: function( data ){
content: 'Hello'
}
}
- }
+ };
_panelElement = new TextElementClass( data );
_panelElement.init();
TextEditor.boot( PANEL_CONTROL.x, PANEL_CONTROL.y, _panelElement, onTextInput );
_panelElement = new TextElementClass( data );
_panelElement.init();
onTextInput( _panelElement );
- }
+ };
}
};
})();
'<div id="panel-tools-container">',
'<div id="panel-resizer-top">▲</div>',
'<div id="panel-resizer-bottom">▼</div>',
- '<div id="comic-element-resizer-container">',
- '<div class="comic-element-resizer" id="comic-element-resizer-top"></div>',
- '<div class="comic-element-resizer" id="comic-element-resizer-left"></div>',
- '<div class="comic-element-resizer" id="comic-element-resizer-right"></div>',
- '<div class="comic-element-resizer" id="comic-element-resizer-bottom"></div>',
- '<div class="comic-element-resizer" id="comic-element-resizer-top-left"></div>',
- '<div class="comic-element-resizer" id="comic-element-resizer-top-right"></div>',
- '<div class="comic-element-resizer" id="comic-element-resizer-bottom-left"></div>',
- '<div class="comic-element-resizer" id="comic-element-resizer-bottom-right"></div>',
- '<div id="balloon-tail-mover"></div>',
- '<div id="comic-element-consol-wrapper">',
- '<div id="comic-element-consol-tail"></div>',
- '<div id="comic-element-consol-wrapper-when-out">',
- '<div id="image-element-consol">',
- '<div id="change-image-button"></div>',
- '<div id="layer-back-button"></div>',
- '<div id="delete-image-button"></div>',
- '<div id="layer-forward-button"></div>',
+ '</div>',
+ '<div id="window-container"></div>',
+ '<div id="comic-element-resizer-container">',
+ '<div id="balloon-tail-mover"></div>',
+ '<div id="comic-element-consol-wrapper">',
+ '<div id="comic-element-consol-container" class="clearfix">',
+ '<div class="comic-element-consol-item">',
+ '<div id="comic-element-x">',
+ '<span class="comic-element-attribute-label">x:</span>',
+ '<span id="comic-element-x-value" class="comic-element-attribute-value editable-value">0</span>',
+ '</div>',
+ '<div id="comic-element-y">',
+ '<span class="comic-element-attribute-label">y:</span>',
+ '<span id="comic-element-y-value" class="comic-element-attribute-value editable-value">0</span>',
+ '</div>',
+ '</div>',
+ '<div class="comic-element-consol-item">',
+ '<div id="comic-element-z">',
+ '<span class="comic-element-attribute-label">z:</span>',
+ '<span id="comic-element-z-value" class="comic-element-attribute-value editable-value">0</span>',
+ '</div>',
+ '<div id="comic-element-a">',
+ '<span id="comic-element-a-value" class="comic-element-attribute-value editable-value">0</span>',
+ '<span class="comic-element-attribute-label">°</span>',
+ '</div>',
+ '</div>',
+ '<div class="comic-element-consol-item">',
+ '<div id="comic-element-w">',
+ '<span class="comic-element-attribute-label">w:</span>',
+ '<span id="comic-element-w-value" class="comic-element-attribute-value editable-value">0</span>',
+ '</div>',
+ '<div id="comic-element-h">',
+ '<span class="comic-element-attribute-label">h:</span>',
+ '<span id="comic-element-h-value" class="comic-element-attribute-value editable-value">0</span>',
+ '</div>',
+ '</div>',
+ '<div class="comic-element-consol-item">',
+ '<!-- <div id="comic-element-keep-aspect"></div> -->',
+ '<div id="comic-element-w-percent">',
+ '<span id="comic-element-w-percent-value" class="comic-element-attribute-value editable-value">0</span>',
+ '<span class="comic-element-attribute-label">%</span>',
'</div>',
- '<div id="text-element-consol">',
- '<div id="edit-text-button"></div>',
- '<div id="change-text-style-button"></div>',
- '<div id="back-text-button"></div>',
- '<div id="delete-text-button"></div>',
- '<div id="hide-text-tail-button"></div>',
- '<div id="forward-text-button"></div>',
+ '<div class="comic-element-consol-item" id="comic-element-h-percent">',
+ '<span id="comic-element-h-percent-value" class="comic-element-attribute-value editable-value">0</span>',
+ '<span class="comic-element-attribute-label">%</span>',
'</div>',
'</div>',
+ '<div class="comic-element-consol-item-small">',
+ '<div class="button" id="change-image-button">change</div>',
+ '</div>',
+ '<div class="comic-element-consol-item-small">',
+ '<div class="button" id="layer-back-button">back</div>',
+ '</div>',
+ '<div class="comic-element-consol-item-small">',
+ '<div class="button" id="delete-button">delete</div>',
+ '</div>',
+ '<div class="comic-element-consol-item-small">',
+ '<div class="button" id="layer-forward-button">forward</div>',
+ '</div>',
+ '<div class="comic-element-consol-item-small">',
+ '<div class="button" id="edit-text-button">edit</div>',
+ '</div>',
+ '<!-- <div class="comic-element-consol-item-small">',
+ '<div class="button" id="hide-text-tail-button">tail</div>',
+ '</div> -->',
'</div>',
- '</div>',
+ '</div>',
+ '<div class="comic-element-resizer" id="comic-element-resizer-top"></div>',
+ '<div class="comic-element-resizer" id="comic-element-resizer-left"></div>',
+ '<div class="comic-element-resizer" id="comic-element-resizer-right"></div>',
+ '<div class="comic-element-resizer" id="comic-element-resizer-bottom"></div>',
+ '<div class="comic-element-resizer" id="comic-element-resizer-top-left"></div>',
+ '<div class="comic-element-resizer" id="comic-element-resizer-top-right"></div>',
+ '<div class="comic-element-resizer" id="comic-element-resizer-bottom-left"></div>',
+ '<div class="comic-element-resizer" id="comic-element-resizer-bottom-right"></div>',
+ '<div id="comic-element-consol-pushout-wrapper">',
+ '<div id="comic-element-consol-pushout-tail"></div>',
+ '</div>',
'</div>',
- '<div id="window-container"></div>',
'<div id="menu-bar"></div>',
'<div id="templete-container" style="display: none;">',
+
'<div id="imgElementTemplete" class="comic-element-wrapper image-element"></div>',
'<div id="textElementTemplete" class="comic-element-wrapper text-element">',
'<div id="bg-pattern-repeat-x"></div>',
'<div id="bg-pattern-repeat-y"></div> -->',
'</div>',
-
- '<div id="comic-element-infomation">',
- '<div id="comic-element-x">',
- '<span class="comic-element-attribute-label">x:</span>',
- '<span id="comic-element-x-value" class="comic-element-attribute-value editable-value">0</span>',
- '</div>',
- '<div id="comic-element-y">',
- '<span class="comic-element-attribute-label">y:</span>',
- '<span id="comic-element-y-value" class="comic-element-attribute-value editable-value">0</span>',
- '</div>',
- '<div id="comic-element-z">',
- '<span class="comic-element-attribute-label">z:</span>',
- '<span id="comic-element-z-value" class="comic-element-attribute-value editable-value">0</span>',
- '</div>',
- '<div id="comic-element-a">',
- '<span id="comic-element-a-value" class="comic-element-attribute-value editable-value">0</span>',
- '<span class="comic-element-attribute-label">°</span>',
- '</div>',
- '<div id="comic-element-w">',
- '<span class="comic-element-attribute-label">w:</span>',
- '<span id="comic-element-w-value" class="comic-element-attribute-value editable-value">0</span>',
- '</div>',
- '<div id="comic-element-h">',
- '<span class="comic-element-attribute-label">h:</span>',
- '<span id="comic-element-h-value" class="comic-element-attribute-value editable-value">0</span>',
- '</div>',
- '<div id="comic-element-w-percent">',
- '<span id="comic-element-w-percent-value" class="comic-element-attribute-value editable-value">0</span>',
- '<span class="comic-element-attribute-label">%</span>',
- '</div>',
- '<div id="comic-element-h-percent">',
- '<span id="comic-element-h-percent-value" class="comic-element-attribute-value editable-value">0</span>',
- '<span class="comic-element-attribute-label">%</span>',
- '</div>',
- '<div id="comic-element-keep-aspect"></div>',
- '</div>',
'</div>',
'<div id="toolbox-window">',
isXHTML !== true ? '>' : ' \/>'
].join( '');
} else {
- url = pettanr.balloon.getBalloonUrl( _panelElement.w, _panelElement.h, _panelElement.angle() );
+ url = pettanr.balloon.getBalloonUrl( _panelElement.w, _panelElement.h, _panelElement.a );
return [
'<img ',
'src="', isAbsoluteUrl !== true ? url : Util.getAbsolutePath( url ), '" ',
'width:', _panelElement.w, 'px;',
'height:', _panelElement.h, 'px;',
'z-index:', _panelElement.z,
- '"><span>', _panelElement.text(), '<\/span>', '<\/div>'
+ '"><span>', _panelElement.content, '<\/span>', '<\/div>'
].join( '');
};
'"x": ', _imageElement.x, ',', cr,
'"y": ', _imageElement.y, ',', cr,
'"z": ', _imageElement.z, ',', cr,
- '"width": ', _imageElement.flipH() * _imageElement.w, ',', cr,
- '"height": ', _imageElement.flipV() * _imageElement.h, ',', cr,
+ '"width": ', _imageElement.flipH * _imageElement.w, ',', cr,
+ '"height": ', _imageElement.flipV * _imageElement.h, ',', cr,
'"t": ', timing, cr,
'}'
].join( '');
'"y": ', _imageElement.y, ',', cr,
'"z": ', _imageElement.z + 1, ',', cr,
'"t": ', _timing, ',', cr,
- '"width": ', _imageElement.flipH() * _imageElement.w, ',', cr,
- '"height": ', _imageElement.flipV() * _imageElement.h, cr,
+ '"width": ', _imageElement.flipH * _imageElement.w, ',', cr,
+ '"height": ', _imageElement.flipV * _imageElement.h, cr,
'}'
].join( '');
};
'"balloon_template_id": ', 1, ',', cr,
'"system_picture_id": ', 1, ',', cr,
'"size": ', 1, ',', cr,
- '"tail": ', _textElement.angle(), ',', cr,
+ '"tail": ', _textElement.a, ',', cr,
'"x": ', _textElement.x, ',', cr,
'"y": ', _textElement.y, ',', cr,
'"z": ', _textElement.z + 1, ',', cr,
'"height": ', _textElement.h, ',', cr,
'"speeches_attributes": {', cr,
'"newf', timing, '": {', cr,
- '"content": "', _textElement.text(), '",', cr,
+ '"content": "', _textElement.content, '",', cr,
'"x": ', _textElement.x, ',', cr,
'"y": ', _textElement.y, ',', cr,
'"t": ', timing, ',', cr,
/*
* pettanR system.js
- * version 0.5.22
+ * version 0.5.23
*
* gadgetOS
* author:
var list = ApplicationPrivateData.list;
list.splice( Util.getIndex( list, data ), 1 );
},
- createUIGroup : function(){
+ createUIGroup : function( node ){
var data = ApplicationPrivateData.get( this ),
- ui = UI.createUIGroup( this );
+ ui = UI.createUIGroup( this, node );
if( data.uiList === null ) data.uiList = [];
data.uiList.push( ui );
return ui;
mesure : function(){
NodePrivateData.get( this ).mesure();
},
+ mesureChildren : function(){
+ NodePrivateData.get( this ).mesureChildren();
+ },
update : function( x, y, w, h ){
NodePrivateData.get( this ).update( x, y, w, h );
},
this.node = node;
this.through = through;
this.clip = !!clip;
- this._cursor = cursor;
+ if( cursor ) this._cursor = cursor;
if( Type.isHTMLElement( rangeOrElm ) === true ){
this.elm = rangeOrElm;
NodePrivateData.dataList.push( this );
},
mesure : function(){
- var x, y, w, h, _this, _parent;
+ var x, y, w, h, parent, _this, _parent;
if( this.elm ){
w = this.elm.offsetWidth;
h = this.elm.offsetHeight;
this.w = w;
this.h = h;
console.log( ' ---- mesure' + this.elm.id + ' x:' + this.x + ' y:' + this.y + ' w:' + w + ' h:' + h )
+ parent = this.parentData;
+ parent && this._updateAbsoluteXY( parent.absoluteX, parent.absoluteY, parent.scrollingX, parent.scrollingY );
this._updateRectangle();
};
} else {
this._updateRectangle();
};
},
+ mesureChildren : function(){
+ var nodes, i;
+ if( nodes = this.childData ){
+ for( i = nodes.length; i; ){
+ nodes[ --i ].mesure();
+ };
+ };
+ },
update : function( x, y, w, h ){
var updateXY = false,
_this, _parent,
var CLASSNAME_COMBOBOX_OPTION = 'combobox-option',
CLASSNAME_COMBOBOX_OPTION_CURRENT = CLASSNAME_COMBOBOX_OPTION + ' combobox-option-current',
- ELM_A_ORIGIN = ( function(){
- var ret = document.createElement( 'a' );
- ret.href = '#';
- return ret;
- })(),
- ELM_INPUT_TEXT = ( function(){
- var ret = document.createElement( 'input' );
- ret.type = 'text';
- return ret;
- })(),
ELM_COMBOBOX = ( function(){
var ret = document.createElement( 'a' ),
elmToggle = document.createElement( 'span' ),
elmValue.appendChild( document.createTextNode( 'null' ));
return ret;
})();
+
+ var UIItemPrivateData = function(){};
+ UIItemPrivateData.prototype = {
+ groupData : null,
+ item : null,
+ elm : null,
+ node : null,
+ focus : false,
+ visible : true,
+ enabled : true,
+ value : null,
+ onUpdate : null,
+ validator : null,
+ elmValue : null,
+ elmBox : null,
+ elmA : null,
+ elmToggle : null,
+ elmValue : null,
+ selectIndex : 0,
+ optionList : null,
+ init : function( groupData, item, elm, value, onUpdate, validator, focus, visible, enabled ){
+ this.groupData = groupData;
+ this.item = item;
+ this.elm = elm;
+ this.value = value;
+ this.onUpdate = onUpdate;
+ this.validator = validator;
+ this.focus = !!focus;
+ this.visible = !!visible;
+ this.enabled = !!enabled;
+ UIItemPrivateData.list.push( this );
+ },
+ destroy : function(){
+ var list = UIItemPrivateData.list;
+ list.splice( Util.getIndex( list, this ), 1 );
+
+ this.node && this.node.remove();
+ }
+ };
+ UIItemPrivateData.list = [];
+ UIItemPrivateData.get = function( item ){
+ var list = UIItemPrivateData.list;
+ for( i = list.length; i; ){
+ if( list[ --i ].item === item ) return list[ i ];
+ };
+ return null;
+ };
+
+/* --------------------------------
+ * TextInputManager
+ */
+ var TextInputManager = ( function(){
+ var elmInput = ( function(){
+ var ret = document.createElement( 'input' );
+ ret.type = 'text';
+ ret.id = 'ui-textinput';
+ return ret;
+ })();
- var InputTextClass = function( apiuser, uiGroup, elmWrapper, elmValue, onUpdate, validater ){
- var elmA = ELM_A_ORIGIN.cloneNode( true ),
- instance = this,
- focus = false,
- visible = true,
- enabled = true,
- value = elmValue.innerHTML;
- elmValue.innerHTML = '';
- elmValue.className += ' editable-text';
- elmValue.appendChild( elmA );
-
- this.value = function( _value ){
- if( Type.isString( _value ) === true || Type.isNumber( _value ) === true ){
- value = '' + _value;
- elmA.innerHTML = '' + _value;
- if( focus === true ){
- ELM_INPUT_TEXT.value = '' + value;
- };
- };
- focus === true && instance.blur();
- return value;
+ return {
+ show: function( data ){
+ // this.groupData.node.addEventListener( 'mouseout' );
+ var p = Position.cumulativeOffset( data.elmValue ),
+ w = data.elmValue.offsetWidth - 2,
+ _w;
+ elmInput.style.cssText = [
+ 'left:', p[ 0 ], 'px;',
+ 'top:', p[ 1 ], 'px;',//,
+ 'width:', w, 'px;'//,
+ //'height:', data.elmValue.offsetHeight, 'px;',
+ //'position:absolute;'
+ ].join( '' );
+ elmInput.value = data.value;
+ body.appendChild( elmInput );
+ _w = elmInput.offsetWidth;
+ if( w !== _w ) elmInput.style.width = ( w - ( _w - w ) ) + 'px;';
+
+ elmInput.focus();
+ elmInput.select();
+ },
+ hide : function( data ){
+ body.removeChild( elmInput );
+ var ret = elmInput.value;
+ elmInput.value = '';
+ return ret;
+ },
+ update : function( data ){
+ elmInput.value = data.value;
+ }
};
- this.focus = function( e ){
- focus = true;
- start( apiuser, uiGroup, instance );
- elmA.style.display = 'none';
-
- elmValue.appendChild( ELM_INPUT_TEXT );
- ELM_INPUT_TEXT.value = value;
- ELM_INPUT_TEXT.focus();
- ELM_INPUT_TEXT.select();
-
+ })();
+
+ var InputTextClass = function( groupData, elmWrapper, elmValue, onUpdate, validater ){
+ var data = new UIItemPrivateData();
+ data.init( groupData, this, elmWrapper, elmValue.innerHTML, onUpdate, validater, false, true, true );
+ Util.addClass( elmValue, 'editable-text' );
+ data.elmValue = elmValue;
+ this.value( data.value );
+ data.node = groupData.node.createNode( elmWrapper, false, true, 'ui-inpittext-hover', 'pointer' );
+ data.node.addEventListener( 'click', this.focus, this );
+ //MouseEvent.add( groupData.apiuser, elmWrapper, 'click', instance.focus );
+ };
+ InputTextClass.prototype = {
+ value : function( value ){
+ var data = UIItemPrivateData.get( this );
+ if( Type.isString( value ) === true || Type.isNumber( value ) === true ){
+ data.elmValue.innerHTML = data.value = '' + value;
+ data.focus === true && TextInputManager.update( data );
+ };
+ data.focus === true && this.blur();
+ return data.value;
+ },
+ focus : function( e ){
+ var data = UIItemPrivateData.get( this );
+ data.focus = true;
+ start( data );
+ TextInputManager.show( data );
return false;
- };
- this.blur = function( keep ){
- var _newValue = ELM_INPUT_TEXT.value,
- _validated = Type.isFunction( validater ) === true ? '' + validater( _newValue ) : _newValue;
- _newValue = keep !== 27 ? _validated : value; // 27:ESC
+ },
+ blur : function( keep ){
+ var data = UIItemPrivateData.get( this ),
+ newValue;
+ if( data.focus === false ) return;
+ newValue = TextInputManager.hide( data );
+ newValue = keep !== 27 ? ( data.validater ? '' + data.validater( newValue ) : newValue ) : value; // 27:ESC
- elmValue.removeChild( ELM_INPUT_TEXT );
-
- elmA.innerHTML = _newValue;
- elmA.style.display = 'block';
+ data.elmValue.innerHTML = newValue;
- onUpdate && _newValue !== value && AsyncCall.add( apiuser, onUpdate, [ _newValue, value ], instance );
+ data.onUpdate && newValue !== data.value && AsyncCall.add( data.groupData.apiuser, data.onUpdate, [ newValue, data.value ], this );
- value = _newValue;
- focus = false;
- finish( apiuser, uiGroup, instance );
- };
- this.enabled = function(){
- return enabled;
- };
- this.visible = function( _visible ){
+ data.value = newValue;
+ data.focus = false;
+ finish( data );
+ },
+ enabled : function(){
+ var data = UIItemPrivateData.get( this );
+ return data.enabled;
+ },
+ visible : function( _visible ){
+ var data = UIItemPrivateData.get( this );
if( Type.isBoolean( _visible ) === true ){
- elmWrapper.style.display = _visible ? '' : 'none';
- visible = _visible;
- }
- return visible;
- };
- this.destroy = function(){
- if( focus === true ){
- elmValue.removeChild( ELM_INPUT_TEXT );
- }
- MouseEvent.remove( apiuser, elmWrapper );
-
- apiuser = uiGroup = elmWrapper = elmValue = elmA = onUpdate = validater = instance = null;
- };
- instance.value( value );
- MouseEvent.add( apiuser, elmWrapper, 'click', instance.focus );
+ data.elm.style.display = _visible ? '' : 'none';
+ data.visible = _visible;
+ };
+ return data.visible;
+ },
+ destroy : function(){
+ var data = UIItemPrivateData.get( this );
+ if( data.focus === true ){
+ data.elmValue.removeChild( ELM_INPUT_TEXT );
+ };
+ data.destroy();
+ }
};
- var ButtonClass = function( apiuser, uiGroup, elmWrapper, onUpdate ){
- var instance = this,
- focus = false,
- visible = true,
- enabled = true;
- MouseEvent.add( apiuser, elmWrapper, 'click', onClick );
-
- function onClick(){
- focus = true;
- // onUpdate();
- AsyncCall.add( apiuser, onUpdate, null, instance );
- return false;
- };
- this.focus = function(){
- focus = true;
- Util.addClass( elmWrapper, 'button-has-focus' );
- start( apiuser, uiGroup, instance );
- };
- this.blur = function( keyCode ){
- keyCode === 13 && onClick();
- Util.removeClass( elmWrapper, 'button-has-focus' );
- focus = false;
- finish( apiuser, uiGroup, instance );
- };
- this.enabled = function( _enabled ){
- if( Type.isBoolean( _enabled ) === true && enabled !== _enabled ){
- _enabled === true ? Util.removeClass( elmWrapper, 'button-disabled' ) : Util.addClass( elmWrapper, 'button-disabled' );
- enabled = _enabled;
+ var ButtonClass = function( groupData, elmWrapper, onUpdate ){
+ var data = new UIItemPrivateData();
+ data.init( groupData, this, elmWrapper, null, onUpdate, null, false, true, true );
+ data.node = groupData.node.createNode( elmWrapper, false, true, 'ui-inpittext-hover', 'pointer' );
+ data.node.addEventListener( 'click', onUpdate );
+ //MouseEvent.add( groupData.apiuser, elmWrapper, 'click', onUpdate );
+ };
+ ButtonClass.prototype = {
+ focus : function(){
+ var data = UIItemPrivateData.get( this );
+ data.focus = true;
+ Util.addClass( data.elm, 'button-has-focus' );
+ start( data );
+ },
+ blur : function( keyCode ){
+ var data = UIItemPrivateData.get( this );
+ keyCode === 13 && data.onUpdate && data.onUpdate();
+ Util.removeClass( data.elm, 'button-has-focus' );
+ data.focus = false;
+ finish( data );
+ },
+ enabled : function( _enabled ){
+ var data = UIItemPrivateData.get( this );
+ if( Type.isBoolean( _enabled ) === true && data.enabled !== _enabled ){
+ _enabled === true ? Util.removeClass( data.elm, 'button-disabled' ) : Util.addClass( data.elm, 'button-disabled' );
+ data.enabled = _enabled;
};
- return enabled;
- };
- this.visible = function( _visible ){
+ return data.enabled;
+ },
+ visible : function( _visible ){
+ var data = UIItemPrivateData.get( this );
if( Type.isBoolean( _visible ) === true ){
- elmWrapper.style.display = _visible ? '' : 'none';
- visible = _visible;
+ data.elm.style.display = _visible ? '' : 'none';
+ data.visible = _visible;
};
- return visible;
- };
- this.destroy = function(){
- MouseEvent.remove( apiuser, elmWrapper );
- apiuser = uiGroup = elmWrapper = onUpdate = instance = null;
- };
+ return data.visible;
+ },
+ destroy : function(){
+ var data = UIItemPrivateData.get( this );
+ // MouseEvent.remove( data.groupData.apiuser, data.elm );
+ data.destroy();
+ }
};
- var ComboBoxClass = function( apiuser, uiGroup, elmWrapper, onUpdate ){
- var elmBox = Util.getElementsByClassName( elmWrapper, 'combobox' )[ 0 ],
- elmA = ELM_COMBOBOX.cloneNode( true ),
- elmToggle = Util.getElementsByClassName( elmA, 'combobox-toggle' )[ 0 ],
- elmValue = Util.getElementsByClassName( elmA, 'combobox-value' )[ 0 ].firstChild,
- index = 0,
- optionList = [],
- instance = this,
- focus = false,
- visible = true,
- enabled = true,
- value;
- elmBox.appendChild( elmA );
+ var ComboBoxClass = function( groupData, elmWrapper, onUpdate ){
+ var elmA = ELM_COMBOBOX.cloneNode( true ),
+ data = new UIItemPrivateData();
+ data.init( groupData, this, elmWrapper, null, onUpdate, null, false, true, true );
+
+ data.elmBox = Util.getElementsByClassName( elmWrapper, 'combobox' )[ 0 ];
+ data.elmBox.appendChild( elmA );
+ data.elmA = elmA;
+ data.elmToggle = Util.getElementsByClassName( elmA, 'combobox-toggle' )[ 0 ];
+ data.elmValue = Util.getElementsByClassName( elmA, 'combobox-value' )[ 0 ].firstChild;
+ data.selectIndex = 0;
+ data.optionList = [];
- this.elm = elmBox;
- this.focus = function( e ){
- MouseEvent.remove( apiuser, elmWrapper, 'click', instance.focus );
- focus = true;
- elmA.className = 'combobox-has-focus';
- start( apiuser, uiGroup, instance );
- OptionControl.show( apiuser, instance, optionList );
+ data.node = groupData.node.createNode( elmWrapper, false, true, 'ui-inpittext-hover', 'pointer' );
+ data.node.addEventListener( 'click', this.focus, this );
+ // MouseEvent.add( groupData.apiuser, data.elm, 'click', this.focus );
+ };
+ ComboBoxClass.prototype = {
+ focus : function( e ){
+ var data = UIItemPrivateData.get( this );
+ // MouseEvent.remove( data.groupData.apiuser, data.elm, 'click', this.focus );
+ data.node.removeEventListener( 'click', this.focus );
+ data.focus = true;
+ data.elmA.className = 'combobox-has-focus';
+ start( data );
+ OptionControl.show( data.groupData.apiuser, this, data.optionList );
return false;
- };
- this.blur = function( keyCode ){
- OptionControl.hide( instance );
- focus = false;
- elmA.className = '';
- finish( apiuser, uiGroup, instance );
- MouseEvent.add( apiuser, elmWrapper, 'click', instance.focus );
- };
- this.enabled = function(){
- return enabled;
- };
- this.visible = function( _visible ){
+ },
+ blur : function( keyCode ){
+ var data = UIItemPrivateData.get( this );
+ OptionControl.hide( this );
+ data.focus = false;
+ data.elmA.className = '';
+ finish( data );
+ data.node.addEventListener( 'click', this.focus, this );
+ // MouseEvent.add( data.groupData.apiuser, data.elm, 'click', this.focus );
+ },
+ enabled : function(){
+ var data = UIItemPrivateData.get( this );
+ return data.enabled;
+ },
+ visible : function( _visible ){
+ var data = UIItemPrivateData.get( this );
if( Type.isBoolean( _visible ) === true ){
- elmWrapper.style.display = _visible ? '' : 'none';
- visible = _visible;
+ data.elm.style.display = _visible ? '' : 'none';
+ data.visible = _visible;
};
- return visible;
- };
- this.value = function( _value ){
- if( Type.isString( _value ) === true && value !== _value ){
- for( var i=0, l = optionList.length, _option; i<l; ++i ){
- _option = optionList[ i ];
+ return data.visible;
+ },
+ value : function( _value ){
+ var data = UIItemPrivateData.get( this ),
+ i = 0,
+ list = data.optionList,
+ l = list.length,
+ _option;
+ if( Type.isString( _value ) === true && data.value !== _value ){
+ for( ; i < l; ++i ){
+ _option = list[ i ];
if( _value === _option.value ){
- value = _value;
- index = i;
- elmValue.data = _option.displayValue;
- if( focus === true ){
- OptionControl.update( instance, _value );
+ data.value = _value;
+ data.index = i;
+ data.elmValue.data = _option.displayValue;
+ if( data.focus === true ){
+ OptionControl.update( this, _value );
};
- Type.isFunction( onUpdate ) === true && AsyncCall.add( apiuser, onUpdate, _value, instance );
+ data.onUpdate && AsyncCall.add( data.groupData.apiuser, data.onUpdate, _value, this );
break;
};
};
};
- return value;
- };
- this.selectIndex = function(){
- return index;
- };
- this.createOption = function( _displayValue, _value, _isSelected ){
- var option = null,
+ return data.value;
+ },
+ selectIndex : function(){
+ var data = UIItemPrivateData.get( this );
+ return data.selectIndex;
+ },
+ createOption : function( _displayValue, _value, _isSelected ){
+ var data = UIItemPrivateData.get( this ),
+ option = null,
+ list = data.optionList,
+ i = list.length,
_option, i;
_value = _value || _displayValue;
_isSelected = !!_isSelected;
- for( i = optionList.length; i; ){
- _option = optionList[ --i ];
+ for( ; i; ){
+ _option = list[ --i ];
if( _value === _option.value ){
option = _option;
break;
};
};
if( _isSelected === true ){
- index = optionList.length;
- elmValue.data = _displayValue;
+ data.selectIndex = list.length;
+ data.elmValue.data = _displayValue;
};
- if( option === null ){
- option = new OptionDataClass( _displayValue, _value, _isSelected );
- optionList.push( option );
- };
- };
- this.destroy = function(){
- instance.blur();
- MouseEvent.remove( apiuser, elmWrapper );
- optionList.length = 0;
- apiuser = uiGroup = elmWrapper = onUpdate = elmBox = elmA = elmToggle = elmValue = optionList = instance = null;
- };
- MouseEvent.add( apiuser, elmWrapper, 'click', instance.focus );
+ option === null && list.push( new OptionDataClass( _displayValue, _value, _isSelected ) );
+ },
+ destroy : function(){
+ var data = UIItemPrivateData.get( this );
+ this.blur();
+ // MouseEvent.remove( data.groupData.apiuser, data.elm );
+ data.optionList.length = 0;
+ data.destroy();
+ }
};
var OptionDataClass = function( displayValue, value, isCurrent ){
this.displayValue = displayValue;
};
function onOptionSelect( e ){
- for( var i = 0, l = OPTION_LIST.length, _option; i < l; ++i){
+ var i = 0,
+ l = OPTION_LIST.length,
+ _option;
+ for( ; i < l; ++i ){
_option = OPTION_LIST[ i ];
if( this === _option.elm ){
- updateCurrrentOption( _option.data.value, true );
+ updateCurrrentOption( _option.data.value, true );
currentCombobox.blur();
break;
};
currentIndex;
function updateCurrrentOption( _value, _updateCombobox ){
- var _option;
- for( var i = OPTION_LIST.length; i; ){
+ var _option,
+ i = OPTION_LIST.length;
+ for( ; i; ){
_option = OPTION_LIST[ --i ];
if( _value === _option.data.value ){
currentOption && currentOption.current( false );
currentOption = _option;
currentIndex = i;
_updateCombobox === true && currentCombobox.value( _value );
-
break;
};
};
var position = Util.getAbsolutePosition( elm );
ELM_OPTION_WRAPPER.style.cssText = [
- 'width:', elm.offsetWidth - 2, 'px;',
- 'left:', position.x, 'px;',
- 'top:', position.y + elm.offsetHeight, 'px;'
- ].join( '' );
+ 'width:', elm.offsetWidth - 2, 'px;',
+ 'left:', position.x, 'px;',
+ 'top:', position.y + elm.offsetHeight, 'px;'
+ ].join( '' );
};
function change( e ){
var l = OPTION_LIST.length,
return false;
};
return {
- show: function( _apiuser, _combobox, _optionList ){
- if( currentItem !== _combobox || currentCombobox === _combobox ) return;
+ show: function( data ){
+ var combobox = data.item,
+ list = data.optionList,
+ i = 0,
+ l = list.length;
+ if( currentItem !== combobox || currentCombobox === combobox ) return;
currentCombobox && currentCombobox.blur();
- apiuser = _apiuser;
- currentCombobox = _combobox;
- elm = _combobox.elm;
+ apiuser = data.groupData.apiuser;
+ currentCombobox = combobox;
+ elm = data.elmBox;
- for( var i = 0, l = _optionList.length; i<l; ++i ){
- OPTION_LIST.unshift( new OptionClass( _optionList[ i ] ) );
+ for( ; i < l; ++i ){
+ OPTION_LIST.unshift( new OptionClass( list[ i ] ) );
};
MouseEvent.add( SUPER_USER_KEY, document, 'mouseup', bodyMouseupHandler );
KeyEvent.add( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, change, 38 );
body.appendChild( ELM_OPTION_WRAPPER );
- updateCurrrentOption( _combobox.value(), false );
+ updateCurrrentOption( combobox.value(), false );
updateWrapperPosition();
SystemTimer.add( SUPER_USER_KEY, updateWrapperPosition, 500 );
},
hide: function( _combobox ){
- if( currentCombobox !== _combobox || currentCombobox === null ) return;
+ if( currentCombobox !== data.item || currentCombobox === null ) return;
var _option;
while( _option = OPTION_LIST.shift() ){
//currentCombobox.blur();
//OptionControl.hide( currentCombobox );
},
- update: function( _combobox, _value ){
- if( currentCombobox !== _combobox || currentItem !== _combobox ) return;
+ update: function( data, _value ){
+ if( currentCombobox !== data.item || currentItem !== data.item ) return;
if( currentOption.data.value === _value ) return;
updateCurrrentOption( _value, true );
},
}
};
})();
-
- var UIGroupClass = function( apiuser ){
- var self = this,
- itemList = [],
- windowW, windowH;
-
- this.focus = function( _value ){
+
+ var UIGroupPrivateData = function(){};
+ UIGroupPrivateData.prototype = {
+ apiuser : null,
+ node : null,
+ uigroup : null,
+ itemList : null,
+ visible : true,
+ enabled : true,
+ init : function( apiuser, node, uigroup ){
+ this.apiuser = apiuser;
+ this.node = node;
+ this.uigroup = uigroup;
+ this.itemList = [];
+ UIGroupPrivateData.list.push( this );
+ },
+ destroy : function(){
+
+ }
+ };
+ UIGroupPrivateData.list = [];
+ UIGroupPrivateData.get = function( uigroup ){
+ var list = UIGroupPrivateData.list,
+ i = list.length;
+ for( ; i; ){
+ if( list[ --i ].uigroup === uigroup ) return list[ i ];
+ };
+ return null;
+ };
+
+ var UIGroupClass = function( apiuser, node ){
+ ( new UIGroupPrivateData() ).init( apiuser, node, this );
+ };
+ UIGroupClass.prototype = {
+ focus : function( _value ){
+ var data = UIGroupPrivateData.get( this );
/*
if( _value === true ){
if( currentItem ){
finish( apiuser, self, currentItem );
} else
*/
- if( _value && Util.getIndex( itemList, _value ) !== -1 ){
+ if( _value && Util.getIndex( data.itemList, _value ) !== -1 ){
// currentItem = _value;
- currentList = itemList;
+ currentList = data.itemList;
};
- return currentUi === self;
- };
- this.blur = function(){
- if( currentList === itemList ){
+ return currentUi === this;
+ },
+ blur : function(){
+ var data = UIGroupPrivateData.get( this );
+ if( currentList === data.itemList ){
currentList = null;
};
- };
- this.createInputText = function( _elmWrapper, _onUpdate, _validater ){
- var _elmValue = Util.getElementsByClassName( _elmWrapper, 'editable-value' )[ 0 ];
- if( _elmValue ){
- var ret = new InputTextClass( apiuser, self, _elmWrapper, _elmValue, _onUpdate, _validater );
- itemList.push( ret );
+ },
+ createInputText : function( elmWrapper, onUpdate, validater ){
+ var data = UIGroupPrivateData.get( this ),
+ elmValue = Util.getElementsByClassName( elmWrapper, 'editable-value' )[ 0 ],
+ ret;
+ if( elmValue ){
+ ret = new InputTextClass( data, elmWrapper, elmValue, onUpdate, validater );
+ data.itemList.push( ret );
return ret;
- }
+ };
alert( 'error createInputText' );
- };
- this.createButton = function( _elm, _onClick ){
- var ret = new ButtonClass( apiuser, self, _elm, _onClick );
- itemList.push( ret );
+ },
+ createButton : function( elm, onClick ){
+ var data = UIGroupPrivateData.get( this ),
+ ret = new ButtonClass( data, elm, onClick );
+ data.itemList.push( ret );
return ret;
- };
- this.createFileInput = function( _elm, _onUpdate, _validater, _elmFileInput ){
- var ret = FileInputClass( apiuser, self, _elm, _onUpdate, _validater, _elmFileInput );
- itemList.push( ret );
+ },
+ createFileInput : function( elm, onUpdate, validater, elmFileInput ){
+ var data = UIGroupPrivateData.get( this ),
+ ret = new FileInputClass( data, elm, onUpdate, validater, elmFileInput );
+ data.itemList.push( ret );
return ret;
- };
- this.createCombobox = function( _elm, _onUpdate, _optionList ){
- var ret = new ComboBoxClass( apiuser, self, _elm, _onUpdate, _optionList );
- itemList.push( ret );
+ },
+ createCombobox : function( elm, onUpdate, optionList ){
+ var data = UIGroupPrivateData.get( this ),
+ ret = new ComboBoxClass( data, elm, onUpdate, optionList );
+ data.itemList.push( ret );
return ret;
- };
- this.createCheckBox = function(){
+ },
+ createCheckBox : function(){
- };
- this.createRadio = function(){
+ },
+ createRadio : function(){
- };
- this.createSlider = function(){
+ },
+ createSlider : function(){
- };
- this.destroy = function(){
- var _item;
- while( _item = itemList.shift() ){
+ },
+ visible : function( v ){
+ var data = UIGroupPrivateData.get( this );
+ if( Type.isBoolean( v ) === true && data.visible !== v ){
+ data.node.disabled( !v );
+ data.visible = v;
+ if( v === false && currentUi === this ){
+ currentItem.blur();
+ // finish( UIItemPrivateData.get( currentItem ) );
+ };
+ };
+ return data.visible;
+ },
+ enabled : function( v ){
+
+ },
+ destroy : function(){
+ var data = UIGroupPrivateData.get( this ),
+ _item;
+ while( _item = data.itemList.shift() ){
_item.destroy();
};
if( currentUi === this ){
- currentItem = null;
- currentUi = null;
- currentUser = null;
- currentList = null;
+ currentItem.blur();
+ // finish( UIItemPrivateData.get( currentItem ) );
};
- apiuser = self = null;
- };
+ data.destroy();
+ }
};
- function start( _apiuser, _uigroup, _item ){
- if( currentItem !== _item ){
- currentUi !== _uigroup && currentUi && currentUi.blur();
+ function start( data ){
+ if( currentItem !== data.item ){
+ currentUi !== data.groupData.uigroup && currentUi && currentUi.blur();
currentItem !== null && currentItem.blur();
- currentUser = _apiuser;
- currentUi = _uigroup;
- currentItem = _item;
+ currentUser = data.groupData.apiuser;
+ currentUi = data.groupData.uigroup;
+ currentItem = data.item;
- _uigroup.focus( _item );
+ currentUi.focus( currentItem );
// if( currentUser !== _apiuser ) {
KeyEvent.add( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, onKeyDown, 13 );
// };
};
}
- function finish( _apiuser, _uigroup, _item ){
- if( currentItem === _item ){
- _uigroup.blur();
+ function finish( data ){
+ if( currentItem === data.item ){
+ currentUi.blur();
currentUser = null;
currentUi = null;
KeyEvent.remove( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, onKeyDown, 13 );
KeyEvent.remove( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, onKeyDown, 27 );
KeyEvent.remove( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, onKeyDown, 9 );
- KeyEvent.updateCurrentListener( _apiuser );
+ KeyEvent.updateCurrentListener( data.groupData.apiuser );
};
};
function onKeyDown( e ){
if( currentItem === null ) return true;
var keyCode = e.keyCode,
- _index = Util.getIndex( currentList, currentItem );
+ index = Util.getIndex( currentList, currentItem );
if( keyCode === 13 || keyCode === 27 || keyCode === 9 || keyCode === 18 || e.altKey === true ){ // 13.return 27.esc 9.tab 18.alt
- keyCode === 9 && tabShift( _index, e.shiftKey === true ? -1 : 1 );
+ keyCode === 9 && tabShift( index, e.shiftKey === true ? -1 : 1 );
keyCode === 13 && currentItem instanceof ComboBoxClass && OptionControl.onEnter();
- keyCode === 13 && tabShift( _index, 1 );
+ keyCode === 13 && tabShift( index, 1 );
currentItem && currentItem.blur( keyCode );
};
return false;
};
- function tabShift( _index, _way ){
+ function tabShift( index, way ){
var l = currentList.length,
- i = _index + _way,
- _item;
+ i = index + way,
+ item;
if( l < 2 ) return;
- while( i !== _index ){
+ while( i !== index ){
i = i < 0 ?
l - 1 :
i < l ? i : 0; // 0 < i < l
- _item = currentList[ i ];
- if( _item.enabled() === true && _item.visible() === true ){
- AsyncCall.add( currentUser, _item.focus, null, _item );
+ item = currentList[ i ];
+ if( item.enabled() === true && item.visible() === true ){
+ AsyncCall.add( currentUser, item.focus, null, item );
return;
};
- i += _way;
+ i += way;
};
};
return {
- createUIGroup: function( _apiuser ){
- var _uid = _apiuser.getUID(),
- _list = UI_LIST[ _uid ],
- _ui = new UIGroupClass( _apiuser );
- if( Type.isArray( _list ) === false ){
- _list = UI_LIST[ _uid ] = [];
- }
- _list.push( _ui );
- return _ui;
+ createUIGroup: function( apiuser, node ){
+ var uid = apiuser.getUID(),
+ list = UI_LIST[ uid ],
+ ui = new UIGroupClass( apiuser, node );
+ if( Type.isArray( list ) === false ){
+ list = UI_LIST[ uid ] = [];
+ };
+ list.push( ui );
+ return ui;
},
onWindowResize: function( w, h ){
windowW = w;