/*
* pettanR peta.apps.js
- * version 0.5.25
+ * version 0.5.26
*
* author:
* itozyun
delete o[ p ];
};
};
-
- var Module = {
- abstractModule: {
- init: function(){
-
- },
- open: function(){
-
- },
- close: function(){
-
- },
- destroy: function(){
- this.kill = kill;
- this.kill();
- }
- },
- register: function( _class ){
- _class.prototype = TMP.abstractModule;
- var ret = _class();
- MODULE_ARRAY.push( ret );
- return ret;
- }
- };
/* ----------------------------------------
* MENU BAR
* - mouseEventListener
SAVE_CONTROL.panelUpdated( true );
};
var RecordClass = function( callback, argBack, argForword, destroy, opt_thisObject ){
- this.callback = callback;
+ this.callback = callback;
this.argBack = argBack;
this.argForword = argForword;
- this.destroy = destroy;
+ this.destroy = !!destroy;
this.thisObj = opt_thisObject;
};
RecordClass.prototype.kill = function( _callDestroy ){
})();
/* --------------------------------------------------------------------------------------------
- * TAIL_OPERATOR
+ * TailOperator
* - panelElementOperator
*/
- var TAIL_OPERATOR = ( function(){
+ var TailOperator = ( function(){
var styleMover,
SIZE,
SIN = Math.sin,
RAD_TO_DEG = 1 / DEG_TO_RAD,
currentText = null,
tailX, tailY,
- x, y, w, h,
+ w, h,
balloonW, balloonH, balloonA, radA,
visible = false,
startA;
var elm = document.getElementById( 'balloon-tail-mover' );
SIZE = Util.getElementSize( elm ).width;
styleMover = elm.style;
- delete TAIL_OPERATOR.init;
+ delete TailOperator.init;
},
update: function ( _w, _h, _a ){
balloonW = _w !== undefined ? _w : balloonW;
* visibilityのほうがいい, display:none だと ie で描画が狂う
*/
styleMover.visibility = '';
- TAIL_OPERATOR.update( _currentText.w, _currentText.h, _currentText.a );
+ TailOperator.update( _currentText.w, _currentText.h, _currentText.a );
currentText = _currentText;
},
hitTest: function( _mouseX, _mouseY ){
styleMover.visibility = 'hidden';
currentText = null;
},
- onStart: function( _currentText, _mouseX, _mouseY ){
- if( _currentText.type !== PANEL_ELEMENT_TYPE_TEXT ) return false;
- x = _currentText.x;
- y = _currentText.y;
- if( TAIL_OPERATOR.hitTest( _mouseX -x, _mouseY -y ) === true ){
- w = _currentText.w;
- h = _currentText.h;
- currentText = _currentText;
- startA = _currentText.a;
+ onStart: function( _mouseX, _mouseY ){
+ if( currentText.type !== PANEL_ELEMENT_TYPE_TEXT ) return false;
+ if( TailOperator.hitTest( _mouseX, _mouseY ) === true ){
+ w = currentText.w;
+ h = currentText.h;
+ currentText = currentText;
+ startA = currentText.a;
return true;
- }
+ };
return false;
},
onDrag: function( _mouseX, _mouseY ){
- _mouseX = _mouseX - x - w / 2;
- _mouseY = _mouseY - y - h / 2; //Balloonの中心を0,0とする座標系に変換
- TAIL_OPERATOR.update( w, h,
+ _mouseX = _mouseX - w / 2;
+ _mouseY = _mouseY - h / 2; //Balloonの中心を0,0とする座標系に変換
+ TailOperator.update( w, h,
_mouseX !== 0 ?
ATAN( _mouseY / _mouseX ) * RAD_TO_DEG + ( _mouseX > 0 ? 90 : 270 ) :
_mouseY > 0 ? 180 : 0
CONSOLE_CONTROLER.update( currentText );
},
onFinish: function(){
- 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 );
+ startA !== currentText.a && PanelElementOperatorManager.saveStatus( undefined, undefined, w, h, startA );
+ startA !== currentText.a && PanelElementOperatorManager.resize( undefined, undefined, w, h, currentText.a );
currentText = null;
},
onCancel: function(){
currentText.angle( startA );
- PANEL_ELEMENT_OPERATION_MANAGER.resize( x, y, w, h, startA );
+ PanelElementOperatorManager.resize( undefined, undefined, w, h, startA );
currentText = null;
}
}
})();
/* --------------------------------------------------------------------------------------------
- * RESIZE_OPERATOR
+ * ResizeOperator
* - panelElementOperator
*/
- var RESIZE_OPERATOR = ( function(){
+ var ResizeOperator = ( function(){
var HIT_AREA = MOUSE_HIT_AREA,
POSITION_ARRAY = [],
FLOOR = Math.floor,
{ cursor: 'ne-resize', h: 7, v: 4, vh: 5 },
{ cursor: 'nw-resize', h: 6, v: 5, vh: 4 }
],
- elmResizerContainer,
- elmResizerContainerStyle,
- elmResizerTopStyle,
- elmResizerLeftStyle,
- elmResizerRightStyle,
- elmResizerBottomStyle,
+ styleInner,
+ elmInner,
+ styleResizerTop,
+ styleResizerLeft,
+ styleResizerRight,
+ styleResizerBottom,
x, y, w, h,
currentIndex = -1,
currentElement,
- currentIsTextElement = false;
+ isSpeach = false;
var RESIZE_WORK_ARRAY = [
{ x: 0, w: 0, y: 1, h: -1}, //top
offsetX, offsetY,
error = 0;
- function draw( _x, _y, _w, _h ){
- x = _x = _x !== undefined ? _x : x;
- y = _y = _y !== undefined ? _y : y;
- w = _w = _w !== undefined ? _w : w;
- h = _h = _h !== undefined ? _h : h;
-
- 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';
- elmResizerLeftStyle.top = elmResizerRightStyle.top = FLOOR( _h / 2 - 5 ) + 'px';
-
- POSITION_ARRAY.splice( 0, POSITION_ARRAY.length );
- POSITION_ARRAY.push(
- {x: _x +5, y: _y -HIT_AREA, w: _w -5 *2, h: HIT_AREA +5},
- {x: _x -HIT_AREA, y: _y +HIT_AREA +5, w: HIT_AREA +5, h: _h -5 *2},
- {x: _x + _w -5, y: _y +HIT_AREA +5, w: HIT_AREA +5, h: _h -5 *2},
- {x: _x +5, y: _y +_h -5, w: _w -5 *2, h: HIT_AREA +5},
- {x: _x -HIT_AREA, y: _y -HIT_AREA, w: HIT_AREA +5, h: HIT_AREA +5},
- {x: _x + _w -HIT_AREA, y: _y -HIT_AREA, w: HIT_AREA +5, h: HIT_AREA +5},
- {x: _x -HIT_AREA, y: _y +_h -5, w: HIT_AREA +5, h: HIT_AREA +5},
- {x: _x +_w -5, y: _y +_h -5, w: HIT_AREA +5, h: HIT_AREA +5}
- );
- };
-
function update( _x, _y, _w, _h ){
var __w, __h;
_x = _x !== undefined ? _x : currentX;
_w = _w !== undefined ? _w : currentW;
_h = _h !== undefined ? _h : currentH;
- if( currentIsTextElement === false && currentIndex > 3 && app.shiftEnabled() === true){
+ if( isSpeach === false && currentIndex > 3 && app.shiftEnabled() === true ){
if( startAspect >= 1 ){
__w = _w;
_w = FLOOR( startAspect * _h );
- _x = _x +( currentIndex % 2 === 0 ? __w - _w : 0);
+ _x = _x + ( currentIndex % 2 === 0 ? __w - _w : 0 );
} else {
__h = _h;
_h = FLOOR( _w / startAspect );
- _y = _y + ( currentIndex <= 5 ? __h - _h : 0);
+ _y = _y + ( currentIndex <= 5 ? __h - _h : 0 );
};
};
- draw( x = _x, y = _y, w = _w, h = _h );
+ ResizeOperator.update( x = _x, y = _y, w = _w, h = _h );
currentElement.resize( _x, _y, _w, _h );
- currentIsTextElement === true && TAIL_OPERATOR.update( _w, _h );
+ isSpeach === true && TailOperator.update( _w, _h );
CONSOLE_CONTROLER.show( currentElement, _w, _h );
- CONSOLE_CONTROLER.update( currentElement );
+ // CONSOLE_CONTROLER.update( currentElement );
};
function flip( _flipH, _flipV ){
_flipH === true && _flipV === true ? 'vh' : ( _flipH === true ? 'h' : 'v' )
] : currentIndex;
app.updateCoursor( CURSOR_AND_FLIP[ currentIndex ].cursor );
- elmResizerContainer.className = 'current-resizer-is-' + currentIndex;
+ elmInner.className = 'current-resizer-is-' + currentIndex;
currentElement.flip( _flipH, _flipV );
};
return {
init: function(){
- elmResizerContainer = document.getElementById( 'comic-element-resizer-container');
- elmResizerContainerStyle = elmResizerContainer.style;
- elmResizerContainerStyle.display = 'none';
+ elmInner = document.getElementById( 'comic-element-resizer-container-inner' );
+ styleInner = elmInner.style;
- elmResizerTopStyle = document.getElementById( 'comic-element-resizer-top').style;
- elmResizerLeftStyle = document.getElementById( 'comic-element-resizer-left').style;
- elmResizerRightStyle = document.getElementById( 'comic-element-resizer-right').style;
- elmResizerBottomStyle = document.getElementById( 'comic-element-resizer-bottom').style;
+ styleResizerTop = document.getElementById( 'comic-element-resizer-top' ).style;
+ styleResizerLeft = document.getElementById( 'comic-element-resizer-left' ).style;
+ styleResizerRight = document.getElementById( 'comic-element-resizer-right' ).style;
+ styleResizerBottom = document.getElementById( 'comic-element-resizer-bottom' ).style;
- delete RESIZE_OPERATOR.init;
+ delete ResizeOperator.init;
+ },
+ update: function( _x, _y, _w, _h ){
+ x = _x = _x !== undefined ? _x : x;
+ y = _y = _y !== undefined ? _y : y;
+ w = _w = _w !== undefined ? _w : w;
+ h = _h = _h !== undefined ? _h : h;
+
+ PanelElementOperatorManager.resizeElement( _x, _y, _w, _h );
+
+ styleInner.width = _w + 'px';
+ styleInner.height = _h + 'px';
+
+ styleResizerTop.left = styleResizerBottom.left = FLOOR( _w / 2 - 5 ) + 'px';
+ styleResizerLeft.top = styleResizerRight.top = FLOOR( _h / 2 - 5 ) + 'px';
+
+ POSITION_ARRAY.length = 0;
+ POSITION_ARRAY.push(
+ {x: 5, y: -HIT_AREA, w: _w - 5, h: HIT_AREA * 2 }, // top
+ {x: -HIT_AREA, y: 5, w: HIT_AREA * 2, h: _h - 5 }, // left
+ {x: _w - 5, y: HIT_AREA + 5, w: HIT_AREA * 2, h: _h - 5 }, // right
+ {x: 5, y: _h - 5, w: _w - 5, h: HIT_AREA * 2 }, // bottom
+ {x: -HIT_AREA, y: -HIT_AREA, w: HIT_AREA + 5, h: HIT_AREA + 5}, // top left
+ {x: _w - 5, y: -HIT_AREA, w: HIT_AREA + 5, h: HIT_AREA + 5}, // top right
+ {x: -HIT_AREA, y: _h - 5, w: HIT_AREA + 5, h: HIT_AREA + 5}, // bottom left
+ {x: _w - 5, y: _h - 5, w: HIT_AREA + 5, h: HIT_AREA + 5} // bottom right
+ );
},
- update: draw,
index: function( _mouseX, _mouseY ){
var p, i;
- for( i=4; i<8; i++ ){
+ for( i = 4; i < 8; ++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;
+ if( p.x <= _mouseX && p.y <= _mouseY && p.x + p.w >= _mouseX && p.y + p.h >= _mouseY ){
+ app.updateCoursor( CURSOR_AND_FLIP[ i ].cursor );
+ elmInner.className = 'current-resizer-is-' + i;
return currentIndex = i;
};
};
- for( i=0; i<4; 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;
+ if( p.x <= _mouseX && _mouseX <= p.x + p.w && p.y <= _mouseY && _mouseY <= p.y + p.h ){
+ app.updateCoursor( CURSOR_AND_FLIP[ i ].cursor );
+ elmInner.className = 'current-resizer-is-' + i;
return currentIndex = i;
};
};
app.updateCoursor( '' );
- elmResizerContainer.className = '';
+ elmInner.className = '';
return -1;
},
show: function( _currentElement ){
currentElement = _currentElement;
- currentIsTextElement = _currentElement.type === PANEL_ELEMENT_TYPE_TEXT;
- elmResizerContainerStyle.display = '';
+ isSpeach = _currentElement.type === PANEL_ELEMENT_TYPE_TEXT;
+ ResizeOperator.update( _currentElement.x, _currentElement.y, _currentElement.w, _currentElement.h );
},
hide: function(){
currentElement = null;
- elmResizerContainerStyle.display = 'none';
},
- onStart: function( _currentElement, _mouseX, _mouseY ){
- currentElement = _currentElement;
- currentIsTextElement = _currentElement.type === PANEL_ELEMENT_TYPE_TEXT;
- if( _currentElement.keepSize === true ) return false;
+ onStart: function( _mouseX, _mouseY ){
+ isSpeach = currentElement.type === PANEL_ELEMENT_TYPE_TEXT;
+ if( currentElement.keepSize === true ) return false;
currentIndex = this.index( _mouseX, _mouseY );
if( currentIndex === -1 ) return false;
offsetX = _mouseX;
offsetY = _mouseY;
- startX = baseX = _currentElement.x;
- startY = baseY = _currentElement.y;
- startW = baseW = _currentElement.w;
- startH = baseH = _currentElement.h;
- if( _currentElement.type === PANEL_ELEMENT_TYPE_IMAGE ){
- startFilpV = _currentElement.flipV;
- startFilpH = _currentElement.flipH;
- };
- startAspect = startW /startH;
+ startX = baseX = currentElement.x;
+ startY = baseY = currentElement.y;
+ startW = baseW = currentElement.w;
+ startH = baseH = currentElement.h;
+ 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;
/*
* Opera 11+ often forget values, why ??
*/
- while( _x === undefined || _y === undefined || _w === undefined || _h === undefined){
- _x = _x !== undefined ? _x : baseX +moveX *com.x;
- _y = _y !== undefined ? _y : baseY +moveY *com.y;
- _w = _w !== undefined ? _w : baseW +moveX *com.w;
- _h = _h !== undefined ? _h : baseH +moveY *com.h;
+ while( _x === undefined || _y === undefined || _w === undefined || _h === undefined ){
+ _x = _x !== undefined ? _x : baseX + moveX * com.x;
+ _y = _y !== undefined ? _y : baseY + moveY * com.y;
+ _w = _w !== undefined ? _w : baseW + moveX * com.w;
+ _h = _h !== undefined ? _h : baseH + moveY * com.h;
error += _thisError === 0 ? 0 : 1;
++_thisError;
if( _thisError > 9999 ){
};
};
- if( _w >= MIN_ELEMENT_SIZE && _h >= MIN_ELEMENT_SIZE){
+ if( _w >= MIN_ELEMENT_SIZE && _h >= MIN_ELEMENT_SIZE ){
} else
- if( _w >= -MIN_ELEMENT_SIZE && _h >= -MIN_ELEMENT_SIZE){
+ if( _w >= -MIN_ELEMENT_SIZE && _h >= -MIN_ELEMENT_SIZE ){
//return;
if( _w < MIN_ELEMENT_SIZE){
//_x += Math.abs( MIN_ELEMENT_SIZE -_w);
_h = MIN_ELEMENT_SIZE;
}
} else
- if( currentElement.type === PANEL_ELEMENT_TYPE_TEXT){
+ if( currentElement.type === PANEL_ELEMENT_TYPE_TEXT ){
return;
} else
- if( _w < -MIN_ELEMENT_SIZE || _h < -MIN_ELEMENT_SIZE){
+ if( _w < -MIN_ELEMENT_SIZE || _h < -MIN_ELEMENT_SIZE ){
- if( _w < -MIN_ELEMENT_SIZE && _h > MIN_ELEMENT_SIZE){
+ if( _w < -MIN_ELEMENT_SIZE && _h > MIN_ELEMENT_SIZE ){
// flipH
_memoryX = _x;
- baseX = _x = _x +_w;
- baseY = _y;
- baseW = _w = _memoryX -_x;
- baseH = _h;
- flip( true, false);
- flipV = currentElement.flipV;
+ baseX = _x = _x +_w;
+ baseY = _y;
+ baseW = _w = _memoryX -_x;
+ baseH = _h;
+ flip( true, false );
+ flipV = currentElement.flipV;
} else
- if( _w > MIN_ELEMENT_SIZE && _h < -MIN_ELEMENT_SIZE){
+ if( _w > MIN_ELEMENT_SIZE && _h < -MIN_ELEMENT_SIZE ){
// flipV
_memoryY = _y;
- baseX = _x;
- baseY = _y = _y +_h;
- baseW = _w;
- baseH = _h = _memoryY -_y;
+ baseX = _x;
+ baseY = _y = _y +_h;
+ baseW = _w;
+ baseH = _h = _memoryY -_y;
flip( false, true);
- flipH = currentElement.flipH();
+ flipH = currentElement.flipH();
} else {
// flipVH
_memoryX = _x;
_memoryY = _y;
- baseX = _x = _x +_w;
- baseY = _y = _y +_h;
- baseW = _w = _memoryX -_x;
- baseH = _h = _memoryY -_y;
- flip( true, true);
- flipV = currentElement.flipV;
- flipH = currentElement.flipH;
+ baseX = _x = _x + _w;
+ baseY = _y = _y + _h;
+ baseW = _w = _memoryX - _x;
+ baseH = _h = _memoryY - _y;
+ flip( true, true );
+ flipV = currentElement.flipV;
+ flipH = currentElement.flipH;
};
_updated = true;
- offsetX = _mouseX;
- offsetY = _mouseY;
+ offsetX = _mouseX;
+ offsetY = _mouseY;
};
currentX = _x;
currentY = _y;
].join( ' , ')); */
},
onFinish: function(){
- app.updateCoursor( '');
+ app.updateCoursor( '' );
if( w === startW && h === startH && x === startX && y === startY ) return;
- PANEL_ELEMENT_OPERATION_MANAGER.resize( x, y, w, h );
- currentElement.resize( x, y, w, h);
- PANEL_ELEMENT_OPERATION_MANAGER.saveStatus( startX, startY, startW, startH, undefined, startFilpV, startFilpH );
+ PanelElementOperatorManager.resize( x, y, w, h );
+ currentElement.resize( x, y, w, h );
+ PanelElementOperatorManager.saveStatus( startX, startY, startW, startH, undefined, startFilpV, startFilpH );
},
onCancel: function(){
- app.updateCoursor( '');
- PANEL_ELEMENT_OPERATION_MANAGER.resize( startX, startY, startW, startH );
+ app.updateCoursor( '' );
+ PanelElementOperatorManager.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, startFilpV, startFilpH ) :
currentElement.animate( startX, startY, startW, startH, angle );
},
onShiftUpdate: update,
})();
/* --------------------------------------------------------------------------------------------
- * POSITION_OPERATOR
+ * PositionOperator
* - panelElementOperator
*/
- var POSITION_OPERATOR = ( function(){
- var currentElement,
+ var PositionOperator = ( function(){
+ var HIT_AREA = MOUSE_HIT_AREA,
+ currentElement,
startX, startY,
x, y,
offsetX, offsetY,
function update( _x, _y ){
x = _x !== undefined ? _x : x;
y = _y !== undefined ? _y : y;
- RESIZE_OPERATOR.update( x, y );
+ // ResizeOperator.update( x, y );
+
+ PanelElementOperatorManager.resizeElement( x, y );
+
currentElement.resize( x, y );
- CONSOLE_CONTROLER.update( currentElement );
+ // CONSOLE_CONTROLER.update( currentElement );
};
return {
init: function(){
- delete POSITION_OPERATOR.init;
+ delete PositionOperator.init;
},
- onStart: function( _currentElement, _mouseX, _mouseY ){
+ show : function( _currentElement ){
currentElement = _currentElement;
+ },
+ onStart: function( _mouseX, _mouseY ){
offsetX = _mouseX;
offsetY = _mouseY;
- startX = x = _currentElement.x;
- startY = y = _currentElement.y;
+ startX = x = currentElement.x;
+ startY = y = currentElement.y;
app.updateCoursor( 'move' );
},
onDrag: function( _mouseX, _mouseY ){
onFinish: function(){
app.updateCoursor( '' );
if( x === startX && y === startY ) return;
- PANEL_ELEMENT_OPERATION_MANAGER.resize( x, y );
+ PanelElementOperatorManager.resize( x, y );
currentElement.resize( x, y );
- PANEL_ELEMENT_OPERATION_MANAGER.saveStatus( startX, startY );
+ PanelElementOperatorManager.saveStatus( startX, startY );
},
onCancel: function(){
app.updateCoursor( '' );
- PANEL_ELEMENT_OPERATION_MANAGER.resize( startX, startY );
+ PanelElementOperatorManager.resize( startX, startY );
currentElement.animate( startX, startY );
},
onShiftUpdate: update,
/* --------------------------------------------------------------------------------------------
- * PANEL_ELEMENT_OPERATION_MANAGER
+ * PanelElementOperatorManager
*/
- var PANEL_ELEMENT_OPERATION_MANAGER = ( function(){
- var HIT_AREA = MOUSE_HIT_AREA,
- currentIsTextElement = false,
- currentOperator = null,
- currentElement = null,
- node = null,
+ var PanelElementOperatorManager = ( function(){
+ var HIT_AREA = MOUSE_HIT_AREA,
+ isSpeach = false,
+ currentOperator = null,
+ currentElement = null,
+ node = null,
+ styleContainer = 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.a : 0
- );
+
+ function mousedown( e ){
+ var x = e.layerX - HIT_AREA / 2 - 5,
+ y = e.layerY - HIT_AREA / 2 - 5;
+ if( isSpeach === true && TailOperator.onStart( x, y ) === true ){
+ currentOperator = TailOperator;
+ } else
+ if( ResizeOperator.onStart( x, y ) === true ){
+ currentOperator = ResizeOperator;
+ } else {
+ PositionOperator.onStart( x, y );
+ currentOperator = PositionOperator;
};
+ return true;
};
-
+ function mousemove( e ){
+ var x = e.layerX - HIT_AREA / 2 - 5,
+ y = e.layerY - HIT_AREA / 2 - 5;
+ if( currentOperator !== null ){
+ currentOperator.onDrag( x, y );
+ return true;
+ } else
+ if( currentElement !== null ){
+ ( isSpeach === false || TailOperator.hitTest( x, y ) === false ) && ResizeOperator.index( x, y );
+ };
+ };
+ function mouseup( e ){
+ currentOperator !== null && currentOperator.onFinish();
+ currentOperator = null;
+ };
+
return {
- init: function(){
- TAIL_OPERATOR.init();
- RESIZE_OPERATOR.init();
- POSITION_OPERATOR.init();
+ elm : null,
+ node : null,
+ init : function(){
+ TailOperator.init();
+ ResizeOperator.init();
+ PositionOperator.init();
CONSOLE_CONTROLER.init();
app.addKeyEventListener( 'keychange', function( e ){
return false;
}, 27, false, false );
- delete PANEL_ELEMENT_OPERATION_MANAGER.init;
+ delete PanelElementOperatorManager.init;
},
open: function(){
+ var elm = document.getElementById( 'comic-element-resizer-container' );
+ PanelElementOperatorManager.elm = elm;
+ PanelElementOperatorManager.node = eventRoot.createNode( elm, false, false );
+ PanelElementOperatorManager.node.addEventListener( 'mouseout', PanelElementOperatorManager.hide, PanelElementOperatorManager );
+ styleContainer = elm.style;
+ PanelElementOperatorManager.node.disabled( true );
+ PanelElementOperatorManager.node.addEventListener( 'mousemove', mousemove );
+ PanelElementOperatorManager.node.addEventListener( 'mousedown', mousedown );
+ PanelElementOperatorManager.node.addEventListener( 'mouseup', mouseup );
+
CONSOLE_CONTROLER.open();
- PANEL_ELEMENT_OPERATION_MANAGER.hide();
+ PanelElementOperatorManager.hide();
- delete PANEL_ELEMENT_OPERATION_MANAGER.open;
+ delete PanelElementOperatorManager.open;
},
close: function(){
},
+ show : function( _currentElement ){
+ if( currentElement === null ){
+ styleContainer.display = '';
+ PanelElementOperatorManager.node.disabled( false );
+ };
+ if( currentElement !== _currentElement ){
+ currentElement = _currentElement;
+
+ ResizeOperator.show( _currentElement );
+ PositionOperator.show( _currentElement );
+
+ isSpeach = ( _currentElement.type === PANEL_ELEMENT_TYPE_TEXT );
+ isSpeach === true ? TailOperator.show( _currentElement ) : TailOperator.hide();
+
+ flipV = _currentElement.flipV;
+ flipH = _currentElement.flipH;
+
+ PanelElementOperatorManager.resize(
+ _currentElement.x, _currentElement.y, _currentElement.w, _currentElement.h,
+ isSpeach === true ? _currentElement.a : 0
+ );
+ };
+ },
hide: function(){
- currentElement !== null && RESIZE_OPERATOR.hide();
+ if( currentElement !== null ){
+ styleContainer.display = 'none';
+ PanelElementOperatorManager.node.disabled( true );
+ };
currentElement = null;
app.updateCoursor( '' );
- TAIL_OPERATOR.hide();
+ TailOperator.hide();
+ ResizeOperator.hide();
CONSOLE_CONTROLER.hide();
- //CONSOLE_CONTROLER.update( null );
+ },
+ resizeElement : function( _x, _y, _w, _h, _angle ){
+ _x = _x !== undefined ? _x : currentX;
+ _y = _y !== undefined ? _y : currentY;
+ _w = _w !== undefined ? _w : currentW;
+ _h = _h !== undefined ? _h : currentH;
+
+ var style = PanelElementOperatorManager.elm.style;
+ style.left = ( PANEL_CONTROL.x + _x - HIT_AREA / 2 - 5 ) + 'px';
+ style.top = ( PANEL_CONTROL.y + _y - HIT_AREA / 2 - 5 ) + 'px';
+ style.width = ( _w + HIT_AREA + 5 ) + 'px';
+ style.heught = ( _h + HIT_AREA + 5 ) + 'px';
+
+ // ResizeOperator.update( _x, _y, _w, _h );
+ isSpeach === true && TailOperator.update( _w, _h, angle );
+ CONSOLE_CONTROLER.show( currentElement, _w, _h );
},
resize: function( _x, _y, _w, _h, _angle ){
currentX = _x = _x !== undefined ? _x : currentX;
currentH = _h = _h !== undefined ? _h : currentH;
angle = _angle = _angle !== undefined ? _angle : angle;
- RESIZE_OPERATOR.update( _x, _y, _w, _h );
- currentIsTextElement === true && TAIL_OPERATOR.update( _w, _h, angle );
+ // ResizeOperator.update( _x, _y, _w, _h );
+ isSpeach === true && TailOperator.update( _w, _h, angle );
CONSOLE_CONTROLER.show( currentElement, _w, _h );
//CONSOLE_CONTROLER.update( currentElement );
+ PanelElementOperatorManager.node.update( PANEL_CONTROL.x + _x - HIT_AREA / 2 - 5, PANEL_CONTROL.y + _y - HIT_AREA / 2 - 5, _w + HIT_AREA + 5, _h + HIT_AREA + 5 );
},
/* history */
restoreState: function( _currentElement, _x, _y, _w, _h, _a, _flipV, _flipH ){
_currentElement.animate( _x, _y, _w, _h, _a );
currentOperator !== null && currentOperator.onCancel && currentOperator.onCancel();
currentOperator = null;
- currentElement === _currentElement ? PANEL_ELEMENT_OPERATION_MANAGER.resize( _x, _y, _w, _h, _a ) : show( _currentElement );
+ currentElement === _currentElement ? PanelElementOperatorManager.resize( _x, _y, _w, _h, _a ) : PanelElementOperatorManager.show( _currentElement );
},
saveStatus: function( startX, startY, startW, startH, startA, startFilpV, startFilpH ){
startX = startX !== undefined ? startX : currentX;
startA = startA !== undefined ? startA : angle;
startFilpV = startFilpV !== undefined ? startFilpV : flipV;
startFilpH = startFilpH !== undefined ? startFilpH : flipH;
- currentElement && HISTORY_CONTROL.saveState( PANEL_ELEMENT_OPERATION_MANAGER.restoreState,
+ currentElement && HISTORY_CONTROL.saveState( PanelElementOperatorManager.restoreState,
[ currentElement, startX, startY, startW, startH, startA, startFilpV, startFilpH ],
[ currentElement, currentX, currentY, currentW, currentH, angle, flipV, flipH ]
);
- },
- busy: function(){
- return currentOperator !== null;
- },
- hitTest: function( _mouseX, _mouseY, _panelElement ){
- var _x, _y, _w, _h;
- if( _panelElement === currentElement ){
- var _consoleX = CONSOLE_CONTROLER.x;
- _x = currentX +( _consoleX < 0 ? _consoleX : 0 ) - HIT_AREA;
- _y = currentY - HIT_AREA;
- var _consoleW = CONSOLE_CONTROLER.w;
- _w = ( _consoleW < currentW ? currentW : _consoleW ) + HIT_AREA * 2;
- var _consoleY = CONSOLE_CONTROLER.y;
- _h = ( _consoleY < currentH ? currentH : _consoleY + CONSOLE_CONTROLER.h ) + HIT_AREA * 2;
- } else {
- _x = _panelElement.x - HIT_AREA;
- _y = _panelElement.y - HIT_AREA;
- _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 ){
- currentOperator = TAIL_OPERATOR;
- } else
- if( RESIZE_OPERATOR.onStart( _currentElement, _mouseX, _mouseY ) === true ){
- currentOperator = RESIZE_OPERATOR;
- } else {
- POSITION_OPERATOR.onStart( _currentElement, _mouseX, _mouseY );
- currentOperator = POSITION_OPERATOR;
- };
- },
- mousemove: function( _currentElement, _mouseX, _mouseY ){
- show( _currentElement);
- 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 );
- };
- };
- },
- mouseup: function( _currentElement, _mouseX, _mouseY ){
- currentOperator !== null && currentOperator.onFinish();
- currentOperator = null;
}
- }
+ };
})();
/*
- * // PANEL_ELEMENT_OPERATION_MANAGER
+ * // PanelElementOperatorManager
*/
/* --------------------------------------------------------------------------------------------
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 ] );
+ HISTORY_CONTROL.saveState( PANEL_ELEMENT_CONTROL.replace, [ 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 del(){
if( currentElement === null ) return;
HISTORY_CONTROL.saveState( PANEL_ELEMENT_CONTROL.restore, [ true, currentElement ], [ false, currentElement ], false ); // true
+ PanelElementOperatorManager.hide();
PANEL_ELEMENT_CONTROL.remove( currentElement );
- PANEL_ELEMENT_OPERATION_MANAGER.hide();
};
function edit(){
if( currentElement === null || currentElement.type !== PANEL_ELEMENT_TYPE_TEXT ) return;
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;
node.mesureChildren();
//node.mesure();
},
- onMousemove : function( e ){
- // 無理やりな実装になってしまうけど
- return true;
- },
show: function( _currentElement, w, h ){
if( node === null ){
- node = eventRoot.createNode( elmContainer, false, false, 'comic-element-consol-container-hover' );
+ node = CONSOLE_CONTROLER.node = PanelElementOperatorManager.node.createNode( elmContainer, false, false, 'comic-element-consol-container-hover' );
node.addEventListener( 'mouseover', CONSOLE_CONTROLER.onMouseover, CONSOLE_CONTROLER );
- node.addEventListener( 'mousemove', CONSOLE_CONTROLER.onMousemove, CONSOLE_CONTROLER );
ui = app.createUIGroup( node );
inputX = ui.createInputText( document.getElementById( 'comic-element-x' ), null );
inputY = ui.createInputText( document.getElementById( 'comic-element-y' ), null );
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;
}
};
})();
AbstractPanelElement.prototype = {
$ : null,
data : null,
+ node : null,
x : 0,
y : 0,
w : 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();
- },
- 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 );
+ mouseover : function( e ){
+ console.log( 'w:' + this.node.width() + ' h:' + this.node.height() + ' x:' + this.node.x() + ' y:' + this.node.y() )
+ PanelElementOperatorManager.show( this );
}
};
this.flipH = data.width < 0 ? -1 : 1;
this.rPicture = data.resource_picture;
this.artistID = this.rPicture.artist_id || this.rPicture.artist.id || -1;
+
+ var self = this;
+ function animeComplete(){
+ self.node.mesure();
+ self._flipReversibleImage();
+ };
+ this.animeComplete = animeComplete;
};
ImageElementClass.prototype = Util.extend(
new AbstractPanelElement( PANEL_ELEMENT_TYPE_IMAGE ),
reversibleImage : null,
init : function(){
this._updateResourcePicture( this.rPicture );
+ this.node = PANEL_ELEMENT_CONTROL.node.createNode( this.$.get( 0 ), false, true );
+ this.node.addEventListener( 'mouseover', this.mouseover, this );
this.resize( this.data.x, this.data.y, Math.abs( this.data.width ), Math.abs( this.data.height ) );
this.init = null;
},
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();
+ if( animate === true ){
+ this.$.animate( {
+ left: x,
+ top: y,
+ width: w,
+ height: h
+ }, 250 , this.animeComplete );
+ } else {
+ this.node.update( x, y, w, h );
+ this._flipReversibleImage();
+ };
},
animate : function ( x, y, w, h, flipH, flipV ){
this.flipH = flipH !== undefined ? flipH : this.flipH;
destroy : function(){
this.reversibleImage.destroy();
this.$.stop().remove();
+ this.node.remove();
+
+ this.destroy = null;
},
_updateResourcePicture : function( _rPicture ){
this.rPicture = _rPicture;
this.timing = data.t || PANEL_ELEMENT_ARRAY.length + 1;
this.$.find( 'img' ).eq( 0 ).replaceWith( this.balloon.elm );
+
+ var self = this;
+ function animeComplete(){
+ self.node.mesure();
+ self._resizeBalloon();
+ };
+ this.animeComplete = animeComplete;
};
TextElementClass.prototype = Util.extend(
new AbstractPanelElement( PANEL_ELEMENT_TYPE_TEXT ),
{
init : function(){
this._updateText();
+ this.node = PANEL_ELEMENT_CONTROL.node.createNode( this.$.get( 0 ), false, true );
+ this.node.addEventListener( 'mouseover', this.mouseover, this );
this.resize( this.data.x, this.data.y, this.data.width, this.data.height, this.data.tail );
this.init = null;
},
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();
+ if( animate === true ){
+ this.$.animate( {
+ left: x,
+ top: y,
+ width: w,
+ height: h
+ }, 250 , this.animeComplete );
+ } else {
+ this.node.update( x, y, w, h );
+ 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();
+ this.node.remove();
}
}
);
var PANEL_ELEMENT_CONTROL = ( function(){
var elmContainer = null,
currentElement = null,
- nodeWorkarea = null,
+ node = null,
panelX, panelY, panelW, panelH,
startX, startY;
/*
* 1. remove
* 2. renumber z
*/
- function appendPanelElement( _panelElement ){
- var z = Type.isFinite( _panelElement.z ) === true ? _panelElement.z : -1,
- l = PANEL_ELEMENT_ARRAY.length,
- _jqElm = _panelElement.$.stop().css( {
- filter: '',
- opacity: ''
- });
- if( z < 0 ){
- PANEL_ELEMENT_ARRAY.unshift( _panelElement );
- } else {
- for( var i = 0; i < l; ++i ){
- if( PANEL_ELEMENT_ARRAY[ i ].z < z ) break;
- };
- if( i === l ){
- PANEL_ELEMENT_ARRAY.push( _panelElement );
- } else {
- PANEL_ELEMENT_ARRAY.splice( i, 0, _panelElement );
- };
- };
- renumber();
- _jqElm.fadeIn();
- };
-
function onFadeOut(){
this.parentNode.removeChild( this );
};
* jqElmの並び替え。
*/
function renumber(){
- var _panelElement, jqElm, jqNext;
- for( var i = 0, l = PANEL_ELEMENT_ARRAY.length; i < l; ++i ){
- _panelElement = PANEL_ELEMENT_ARRAY[ i ];
+ var _panelElement, jqElm, jqAfter,
+ i = PANEL_ELEMENT_ARRAY.length;
+ for( ; i; ){
+ _panelElement = PANEL_ELEMENT_ARRAY[ --i ];
jqElm = _panelElement.$;
- i === 0 && elmContainer.appendChild( jqElm.get( 0 ) );
- jqNext && jqNext.before( jqElm );
- if( phase === 1 ) _panelElement.z = l - i - 1;
- jqNext = jqElm;
+ !jqAfter && elmContainer.appendChild( jqElm.get( 0 ) );
+ jqAfter && jqAfter.before( jqElm );
+ if( phase === 1 ){
+ _panelElement.z = i;
+ _panelElement.node.nodeIndex( i );
+ };
+ jqAfter = jqElm;
};
};
function onTextInput( _panelElement ){
- appendPanelElement( _panelElement );
+ PANEL_ELEMENT_CONTROL.add( _panelElement );
+ _panelElement.animate( undefined, undefined, _panelElement.w, _panelElement.h );
HISTORY_CONTROL.saveState( PANEL_ELEMENT_CONTROL.restore, [ false, _panelElement ], [ true, _panelElement ], true, PANEL_ELEMENT_CONTROL );
};
-
+
return {
id : 'PANEL_ELEMENT_CONTROL',
+ node : null,
init : function(){
- elmContainer = document.getElementById( 'comic-element-container' );
- nodeWorkarea = eventRoot.createNode( { x: 0, y:0, w:9999, h:9999 }, false, true );
- nodeWorkarea.addEventListener( 'mousemove', PANEL_ELEMENT_CONTROL.mousemove, PANEL_ELEMENT_CONTROL );
- nodeWorkarea.addEventListener( 'mousedown', PANEL_ELEMENT_CONTROL.mousedown, PANEL_ELEMENT_CONTROL );
- nodeWorkarea.addEventListener( 'mouseup', PANEL_ELEMENT_CONTROL.mouseup, PANEL_ELEMENT_CONTROL );
- //eventRoot.addEventListener( 'mousemove', PANEL_ELEMENT_CONTROL.mousemove, PANEL_ELEMENT_CONTROL );
- //eventRoot.addEventListener( 'mousedown', PANEL_ELEMENT_CONTROL.mousedown, PANEL_ELEMENT_CONTROL );
- //eventRoot.addEventListener( 'mouseup', PANEL_ELEMENT_CONTROL.mouseup, PANEL_ELEMENT_CONTROL );
+ elmContainer = document.getElementById( 'comic-element-container' );
+ node = PANEL_ELEMENT_CONTROL.node = eventRoot.createNode( elmContainer, true, false );
+ node.nodeIndex( 0 );
delete PANEL_ELEMENT_CONTROL.init;
},
open : function(){
-
+ delete PANEL_ELEMENT_CONTROL.open;
},
close : function(){
var panelElm;
while( panelElm = PANEL_ELEMENT_ARRAY.shift() ){
- panelElm.destroy();
+ panelElm.destroy && panelElm.destroy();
};
},
+ add : function( _panelElement ){
+ var z = Type.isFinite( _panelElement.z ) === true ? _panelElement.z : -1,
+ i = PANEL_ELEMENT_ARRAY.length,
+ _jqElm = _panelElement.$.stop().css( {
+ filter: '',
+ opacity: ''
+ }),
+ j;
+ if( z < 0 ){
+ PANEL_ELEMENT_ARRAY.push( _panelElement );
+ } else {
+ for( ; i; ){
+ if( PANEL_ELEMENT_ARRAY[ --i ].z < z ){
+ j = i;
+ break;
+ };
+ };
+ if( j !== i ){
+ PANEL_ELEMENT_ARRAY.unshift( _panelElement );
+ } else {
+ PANEL_ELEMENT_ARRAY.splice( i + 1, 0, _panelElement );
+ };
+ };
+ renumber();
+ _jqElm.fadeIn();
+ _panelElement.node.disabled( false );
+ },
remove : function( _panelElement ){
- var l = PANEL_ELEMENT_ARRAY.length;
- for( var i=0; i<l; ++i ){
- if( PANEL_ELEMENT_ARRAY[ i ] === _panelElement ){
+ for( var i = PANEL_ELEMENT_ARRAY.length; i; ){
+ if( PANEL_ELEMENT_ARRAY[ --i ] === _panelElement ){
+ console.log( PANEL_ELEMENT_ARRAY.length );
PANEL_ELEMENT_ARRAY.splice( i, 1 );
+ _panelElement.node.disabled( true );
+ _panelElement.node.nodeIndex( PANEL_ELEMENT_ARRAY.length );
renumber();
_panelElement.$.stop().css( {
filter: '',
},
/* history */
restore : function( isAppend, panelElement ){
- isAppend === true ? appendPanelElement( panelElement ) : PANEL_ELEMENT_CONTROL.remove( panelElement );
+ PANEL_ELEMENT_CONTROL[ isAppend === true ? 'add' : 'remove' ]( panelElement );
},
replace: function( _panelElement, goForward ){
// PANEL_ELEMENT_ARRAYの再構築
var l = PANEL_ELEMENT_ARRAY.length,
- i = -1;
- for( var j = 0; j < l; ++j ){
- if( PANEL_ELEMENT_ARRAY[ j ] === _panelElement ){
+ i,
+ j = l;
+ for( ; j; ){
+ if( PANEL_ELEMENT_ARRAY[ --j ] === _panelElement ){
i = j;
break;
};
};
- if( i === -1) return false;
+ if( i !== j ) return false;
if( goForward === true ){
if( i === 0 ) return false;
PANEL_ELEMENT_ARRAY.splice( i, 1 );
- PANEL_ELEMENT_ARRAY.splice( i - 1, 0, _panelElement );
+ PANEL_ELEMENT_ARRAY.splice( i + 1, 0, _panelElement );
} else {
if( i === l - 1 ) return false;
PANEL_ELEMENT_ARRAY.splice( i, 1 );
- PANEL_ELEMENT_ARRAY.splice( i + 1, 0, _panelElement );
+ PANEL_ELEMENT_ARRAY.splice( i - 1, 0, _panelElement );
};
renumber( true );
return true;
PANEL_ELEMENT_ARRAY[ --i ].shift( _shiftX, _shiftY );
};
};
- elmContainer.style.cssText = [
- 'width:', panelW = _panelW, 'px;',
- 'height:', panelH = _panelH, 'px;',
- 'left:', panelX = _panelX, 'px;',
- 'top:', panelY = _panelY, 'px'
- ].join( '' );
+ node.update( panelX = _panelX, panelY = _panelY, panelW = _panelW, panelH = _panelH );
},
- mousemove : function( e ){
- var l = PANEL_ELEMENT_ARRAY.length,
- mX = e.layerX,
- mY = e.layerY,
- _x = mX - panelX,
- _y = mY - panelY,
- _elm = currentElement,
- i;
- console.log( 'x:' + _x + ' y:' + _y )
- // mouse が コンソールに乗ったらフォーカスを外す．
- //if( CONSOLE_CONTROLER.hitTest( _x, _y ) === true ) return false;
-
- if( _elm !== null ){
- if( _elm.busy() === true ){
- _elm.mousemove( _x, _y );
- return true;
- };
- if( _elm.hitTest( _x, _y ) === true ){
- _elm.mousemove( _x, _y ); // cursor
- return false;
- };
- };
- for( i = 0; i < l; ++i ){
- _elm = PANEL_ELEMENT_ARRAY[ i ];
- // hitTest
- if( _elm.hitTest( _x, _y ) === true ){
- _elm.mousemove( _x, _y ); // cursor
- currentElement = _elm;
- return false;
- };
- };
- currentElement = null;
- PANEL_ELEMENT_OPERATION_MANAGER.hide();
- return false;
- },
- mouseup: function( e ){
- var x = e.layerX,
- y = e.layerY,
- ret = currentElement !== null && currentElement.busy() === true;
- ret === true && currentElement.mouseup( x - startX || panelX, y - startY || panelY );
- return ret;
- },
- mousedown: function( e ){
- var x = e.layerX,
- y = e.layerY;
- if( currentElement === null ) return false;
- startX = panelX;
- startY = panelY;
- currentElement.mousedown( x - startX, y - startY );
- return true;
- },
- /*
- busy: function(){
- return currentElement !== null;
- }, */
createImageElement: function( data ){
if( Type.isObject( data ) === false ){
PremiumSatge.boot( 1, PANEL_ELEMENT_CONTROL.onImageSelect );
height: 1
});
_panelElement.init();
- appendPanelElement( _panelElement );
+ PANEL_ELEMENT_CONTROL.add( _panelElement );
_panelElement.animate( undefined, undefined, Math.abs( data.width ), Math.abs( data.height ) );
} else {
_panelElement = new ImageElementClass( data );
_panelElement.init();
- appendPanelElement( _panelElement );
+ PANEL_ELEMENT_CONTROL.add( _panelElement );
};
- HISTORY_CONTROL.saveState( PANEL_ELEMENT_CONTROL.restore, [ false, _panelElement], [ true, _panelElement ], true );
+ HISTORY_CONTROL.saveState( PANEL_ELEMENT_CONTROL.restore, [ false, _panelElement ], [ true, _panelElement ], true );
},
createTextElement: function( data ){
var _panelElement;
'</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 id="comic-element-resizer-container-inner">',
+ '<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 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 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>',
- '<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 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 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 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 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>',
- '<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 class="comic-element-consol-item-small">',
+ '<div class="button" id="change-image-button">change</div>',
'</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 class="comic-element-consol-item-small">',
+ '<div class="button" id="layer-back-button">back</div>',
'</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 class="comic-element-consol-item-small">',
+ '<div class="button" id="delete-button">delete</div>',
'</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 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 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 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 id="comic-element-consol-pushout-inner"></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 id="comic-element-consol-pushout-inner"></div>',
- '</div>',
+ '<div id="balloon-tail-mover"></div>',
+ '</div>',
'</div>',
'<div id="menu-bar"></div>',
SAVE_CONTROL.init();
GRID_CONTROL.init();
WHITE_GLASS_CONTROL.init();
- PANEL_ELEMENT_OPERATION_MANAGER.init();
+ PanelElementOperatorManager.init();
comicID = -1;
panelID = -1;
GRID_CONTROL.open();
PANEL_CONTROL.open( panelW, panelH, borderSize );
- PANEL_ELEMENT_OPERATION_MANAGER.open();
+ PanelElementOperatorManager.open();
PANEL_ELEMENT_CONTROL.open();
// last
GRID_CONTROL.close();
PANEL_CONTROL.close();
- PANEL_ELEMENT_OPERATION_MANAGER.close();
+ PanelElementOperatorManager.close();
PANEL_ELEMENT_CONTROL.close();
// last
OSDN Git Service
