OSDN > ソフトウェアを探す > インターネット > WWW/HTTP > 動的コンテンツ > CMS(コンテンツ管理システム) > ぺったんR > SCM > git > clientJs > コミット

ぺったんR
Fork
pettanr
clientJs

R/O
HTTP
SSH
HTTPS

clientJs: コミット

クライアント側 js 開発用

コミットメタ情報

リビジョン	64e81e7eda1498e30f22ede8d5680f7cc3239fb0 (tree)
日時	2012-11-23 22:58:24
作者	itozyun <itozyun@gmai...>
コミッター	itozyun

ログメッセージ

fixed around UI for PointingDeviceEventTree.

変更サマリ

modified: 0.5.x/javascripts/peta.apps.js (diff)
modified: 0.5.x/javascripts/system.js (diff)
modified: 0.5.x/stylesheets/peta.apps.css (diff)
modified: 0.5.x/stylesheets/system.css (diff)

差分

--- a/0.5.x/javascripts/peta.apps.js

+++ b/0.5.x/javascripts/peta.apps.js

		@@ -1,6 +1,6 @@
1	1	/*
2	2	* pettanR peta.apps.js
3		- * version 0.5.22
	3	+ * version 0.5.23
4	4	*
5	5	* author:
6	6	* itozyun

		@@ -688,6 +688,7 @@ var PremiumSatge = gOS.registerApplication( function(){
688	688	itemW, itemH, buttonW,
689	689	onUpdate = null,
690	690	onUpdateData = null,
	691	+ onUpdateContext = null,
691	692	artistID = -1;
692	693
693	694	var ImageGroupIconClass = function( index, data ){

		@@ -804,8 +805,8 @@ var PremiumSatge = gOS.registerApplication( function(){
804	805	while( ICON_ARRAY.length > 0 ){
805	806	ICON_ARRAY.shift().destroy();
806	807	}
807		- onUpdate !== null && onUpdateData !== null && onUpdate( onUpdateData );
808		- onUpdate = onUpdateData = null;
	808	+ onUpdate !== null && onUpdateData !== null && onUpdate.call( onUpdateContext, onUpdateData );
	809	+ onUpdate = onUpdateData = onUpdateContext = null;
809	810	PremiumSatge.shutdown();
810	811	}
811	812

		@@ -826,7 +827,7 @@ var PremiumSatge = gOS.registerApplication( function(){
826	827	tree = FileAPI.createTree( FILE_DATA_ARTIST_ROOT );
827	828	rootFile = tree.getRootFile();
828	829	};
829		- this.onOpen = function( _windowW, _windowH, _ARTISTIDorFILE, _onUpdate ){
	830	+ this.onOpen = function( _windowW, _windowH, _ARTISTIDorFILE, _onUpdate, opt_thisObj ){
830	831	elmContainer = document.getElementById( 'image-group-icon-container' );
831	832	containerH = Util.getElementSize( elmContainer ).height;
832	833

		@@ -863,6 +864,7 @@ var PremiumSatge = gOS.registerApplication( function(){
863	864	}
864	865
865	866	onUpdate = _onUpdate \|\| null;
	867	+ onUpdateContext = opt_thisObj \|\| null;
866	868	onUpdateData = null;
867	869
868	870	drawIcons();

		@@ -927,7 +929,7 @@ var PremiumSatge = gOS.registerApplication( function(){
927	929	if( tree === null ) return true;
928	930	$( elmContainer ).stop().animate( {
929	931	height: 0,
930		- top: Math.floor( winH /2 )
	932	+ top: Math.floor( winH / 2 )
931	933	}, onFadeout );
932	934	// onEnterInterval !== null && window.clearTimeout( onEnterInterval );
933	935	// onEnterInterval = null;

		@@ -995,7 +997,7 @@ var TextEditor = gOS.registerApplication( function(){
995	997	onUpdate = _onUpdate \|\| null;
996	998
997	999	self.onPaneResize( _w, _h );
998		- elmTextarea.value = _textElement.text()
	1000	+ elmTextarea.value = _textElement.content;
999	1001	elmTextarea.focus();
1000	1002
1001	1003	/*

		@@ -2210,91 +2212,17 @@ var Editor = gOS.registerApplication( function(){
2210	2212	* - window
2211	2213	*/
2212	2214	var INFOMATION_WINDOW = ( function(){
2213		- var FADE_EFFECT_ENABLED = true, //UA.isIE === false \|\| UA.ieVersion >= 8,
2214		- FADE_IN_EFFECT = FADE_EFFECT_ENABLED === true ? 'fadeIn' : 'show',
2215		- FADE_OUT_EFFECT = FADE_EFFECT_ENABLED === true ? 'fadeOut' : 'hide',
2216		- backgroundInfomationElm,
2217		- jqPanelElementInformation,
2218		- ui, inputX, inputY, inputZ, inputA, inputW, inputH, inputAspectRatio,
2219		- inputPercentW, inputPercentH,
2220		- currentPanelElement = null,
2221		- currentElementType = -1;
	2215	+ var backgroundInfomationElm;
2222	2216
2223	2217	return WINDOWS_CONTROL.createWindow(
2224	2218	{
2225	2219	onFirstOpen: function( _w, _h ){
2226	2220	backgroundInfomationElm = $( '#panel-background-information');
2227		-
2228		- jqPanelElementInformation = $( '#comic-element-infomation').hide().css( {
2229		- height: _h
2230		- });
2231		- ui = app.createUIGroup();
2232		- inputX = ui.createInputText( document.getElementById( 'comic-element-x' ), null );
2233		- inputY = ui.createInputText( document.getElementById( 'comic-element-y' ), null );
2234		- inputZ = ui.createInputText( document.getElementById( 'comic-element-z' ), null );
2235		- inputA = ui.createInputText( document.getElementById( 'comic-element-a' ), null );
2236		- inputW = ui.createInputText( document.getElementById( 'comic-element-w' ), null );
2237		- inputH = ui.createInputText( document.getElementById( 'comic-element-h' ), null );
2238		- inputPercentW = ui.createInputText( document.getElementById( 'comic-element-w-percent' ), null );
2239		- inputPercentH = ui.createInputText( document.getElementById( 'comic-element-h-percent' ), null );
2240		- inputAspectRatio = $( '#comic-element-keep-aspect' );
2241	2221	},
2242	2222	onResize: function( _w, _h ){
2243		- jqPanelElementInformation.css( {
2244		- height: _h
2245		- });
2246	2223	},
2247	2224	update: function( currentElement ){
2248		- var _elementType = currentElement === null ? -1 : currentElement.type,
2249		- x = currentElement !== null ? currentElement.x : 0,
2250		- y = currentElement !== null ? currentElement.y : 0,
2251		- z = currentElement !== null ? currentElement.z : 0,
2252		- a = _elementType === PANEL_ELEMENT_TYPE_TEXT ? Math.floor( currentElement.angle() ) : 0,
2253		- w = currentElement !== null ? currentElement.w : 0,
2254		- h = currentElement !== null ? currentElement.h : 0,
2255		- actualW = _elementType === PANEL_ELEMENT_TYPE_IMAGE ? currentElement.actualW() : 1,
2256		- actualH = _elementType === PANEL_ELEMENT_TYPE_IMAGE ? currentElement.actualH() : 1,
2257		- wPercent = _elementType === PANEL_ELEMENT_TYPE_IMAGE ? Math.floor( w / actualW *100 ) : 0,
2258		- hPercent = _elementType === PANEL_ELEMENT_TYPE_IMAGE ? Math.floor( h / actualH *100 ) : 0,
2259		- keepAspect = currentElement !== null && currentElement.keepAspect === true;
2260		-
2261		- if( currentElementType !== _elementType ){
2262		- if( _elementType !== -1 ){
2263		- if( _elementType === 1 ){
2264		- inputA.visible( true );
2265		- inputPercentW.visible( false );
2266		- inputPercentH.visible( false );
2267		- inputAspectRatio.hide();
2268		- } else {
2269		- inputA.visible( false );
2270		- inputPercentW.visible( true );
2271		- inputPercentH.visible( true );
2272		- inputAspectRatio.show();
2273		- };
2274		- currentElementType === -1 && jqPanelElementInformation.stop().css( {
2275		- filter: '',
2276		- opacity: ''
2277		- })[ FADE_IN_EFFECT ]();
2278		- } else {
2279		- currentElementType !== -1 && jqPanelElementInformation.stop().css({
2280		- filter: '',
2281		- opacity: ''
2282		- })[ FADE_OUT_EFFECT ]();
2283		- };
2284		- currentElementType = _elementType;
2285		- };
2286		- if( currentElementType !== -1){
2287		- inputX.value( x );
2288		- inputY.value( y );
2289		- inputZ.value( z );
2290		- _elementType === 1 && inputA.value( a );
2291		- inputW.value( w );
2292		- inputH.value( h );
2293		- _elementType === 0 && inputPercentW.value( wPercent );
2294		- _elementType === 0 && inputPercentH.value( hPercent );
2295		- } else {
2296		-
2297		- };
	2225	+
2298	2226	}
2299	2227	},
2300	2228	'infomation-window', 'Infomation', 0, 30, 200, 180, true

		@@ -2719,13 +2647,13 @@ var Editor = gOS.registerApplication( function(){
2719	2647	mousemove: function( _mouseX, _mouseY ){
2720	2648	if( isDraggable === true && isDragging === true ){
2721	2649	PANEL_CONTROL.resize( false, startX + _mouseX - offsetX, startY + _mouseY - offsetY );
2722		- }
	2650	+ };
2723	2651	},
2724	2652	mouseup: function( _mouseX, _mouseY ){
2725	2653	if( isDraggable === true ){
2726	2654	isDragging = false;
2727	2655	app.updateCoursor( '' );
2728		- }
	2656	+ };
2729	2657	},
2730	2658	mousedown: function( _mouseX, _mouseY ){
2731	2659	if( isDraggable === true ){

		@@ -2736,188 +2664,12 @@ var Editor = gOS.registerApplication( function(){
2736	2664	isDragging = true;
2737	2665	app.updateCoursor( 'move' );
2738	2666	return true;
2739		- }
	2667	+ };
2740	2668	},
2741	2669	busy: function(){
2742	2670	return isDragging === true;
2743	2671	}
2744		- }
2745		- })();
2746		-
2747		-
2748		-/* --------------------------------------------------------------------------------------------
2749		- * CONSOLE_CONTROLER
2750		- */
2751		- var CONSOLE_CONTROLER = ( function(){
2752		- var LAYER_BACK_BUTTON, LAYER_FORWARD_BUTTON, DELETE_BUTTON, EDIT_BUTTON, CHANGE_BUTTON,
2753		- elmConsoleWrapper, styleConsoleWrapper,
2754		- layerWrapper,
2755		- // elmConsoleParent,
2756		- styleImgConsole, styleTextConsole,
2757		- currentElement = null,
2758		- currentType = -1,
2759		- visible = false,
2760		- imgConsoleWidth, imgConsoleHeight,
2761		- textConsoleWidth, textConsoleHeight,
2762		- tailSize = 10;
2763		-
2764		- function layerBack(){
2765		- if( currentElement === null ) return;
2766		- if( PANEL_ELEMENT_CONTROL.replace( currentElement, false ) === false ) return;
2767		- INFOMATION_WINDOW.update( currentElement );
2768		- HISTORY_CONTROL.saveState( PANEL_ELEMENT_CONTROL.resplace, [ currentElement, true ], [ currentElement, false ] );
2769		- var _z = currentElement.z;
2770		- LAYER_BACK_BUTTON.visible( _z > 0 );
2771		- LAYER_FORWARD_BUTTON.visible( _z < PANEL_ELEMENT_ARRAY.length - 1 );
2772		- };
2773		- function layerForward(){
2774		- if( currentElement === null ) return;
2775		- if( PANEL_ELEMENT_CONTROL.replace( currentElement, true ) === false ) return;
2776		- INFOMATION_WINDOW.update( currentElement );
2777		- HISTORY_CONTROL.saveState( PANEL_ELEMENT_CONTROL.replace, [ currentElement, false ], [ currentElement, true ] );
2778		- var _z = currentElement.z;
2779		- LAYER_BACK_BUTTON.visible( _z > 0 );
2780		- LAYER_FORWARD_BUTTON.visible( _z < PANEL_ELEMENT_ARRAY.length - 1 );
2781		- };
2782		- function del(){
2783		- if( currentElement === null ) return;
2784		- // buttonBackOrForward( true );
2785		- HISTORY_CONTROL.saveState( PANEL_ELEMENT_CONTROL.restore, [ true, currentElement ], [ false, currentElement ], false ); // true
2786		- PANEL_ELEMENT_CONTROL.remove( currentElement );
2787		- PANEL_ELEMENT_OPERATION_MANAGER.hide();
2788		- };
2789		- function edit(){
2790		- if( currentElement === null \|\| currentElement.type !== PANEL_ELEMENT_TYPE_TEXT ) return;
2791		- TextEditor.boot( PANEL_CONTROL.x, PANEL_CONTROL.y, currentElement );
2792		- // buttonBackOrForward( true );
2793		- };
2794		- function change(){
2795		- if( currentElement === null) return;
2796		- // buttonBackOrForward( true );
2797		- PremiumSatge.boot( currentElement.getArtistID(), currentElement.resourcePicture );
2798	2672	};
2799		- function onImageSelect( resourcePicture ){
2800		- currentElement.resourcePicture( resourcePicture );
2801		- };
2802		- return {
2803		- x: 0,
2804		- y: 0,
2805		- w: 0,
2806		- h: 0,
2807		- init: function(){
2808		- app.addKeyEventListener( 'keydown', layerBack, 66, false, true );
2809		- app.addKeyEventListener( 'keydown', layerForward, 70, false, true );
2810		- app.addKeyEventListener( 'keydown', del, 68, false, true );
2811		- app.addKeyEventListener( 'keydown', edit, 69, false, true );
2812		- app.addKeyEventListener( 'keydown', change, 85, false, true );
2813		-
2814		- var elmImgConsole = document.getElementById( 'image-element-consol' ),
2815		- imgConsoleSize = Util.getElementSize( elmImgConsole );
2816		- imgConsoleWidth = imgConsoleSize.width;
2817		- imgConsoleHeight = imgConsoleSize.height;
2818		- styleImgConsole = elmImgConsole.style;
2819		-
2820		- var elmTextConsole = document.getElementById( 'text-element-consol' ),
2821		- textConsoleSize = Util.getElementSize( elmTextConsole );
2822		- textConsoleWidth = textConsoleSize.width;
2823		- textConsoleHeight = textConsoleSize.height;
2824		- styleTextConsole = elmTextConsole.style;
2825		-
2826		- elmConsoleWrapper = document.getElementById( 'comic-element-consol-wrapper' );
2827		- styleConsoleWrapper = elmConsoleWrapper.style;
2828		- // elmConsoleParent = elmConsoleWrapper.parentNode;
2829		-
2830		- elmImgConsole.style.display = styleTextConsole.display = styleConsoleWrapper.display = 'none';
2831		-
2832		- delete CONSOLE_CONTROLER.init;
2833		- },
2834		- open: function(){
2835		- // layerWrapper = app.createInteractContainer( elmConsoleWrapper );
2836		-
2837		- LAYER_BACK_BUTTON = MENU_BAR_CONTROL.EDIT.createOption( 'layer back', 'ctrl + B', layerBack, false, true, false );
2838		- LAYER_FORWARD_BUTTON = MENU_BAR_CONTROL.EDIT.createOption( 'layer forward', 'ctrl + F', layerForward, false, false, false );
2839		- DELETE_BUTTON = MENU_BAR_CONTROL.EDIT.createOption( 'delete', 'ctrl + D', del, false, true, true );
2840		- EDIT_BUTTON = MENU_BAR_CONTROL.EDIT.createOption( 'Edit Text', 'ctrl + E', edit, false, true, false );
2841		- CHANGE_BUTTON = MENU_BAR_CONTROL.EDIT.createOption( 'change', 'ctrl + U', change, false, false, true );
2842		-
2843		- delete CONSOLE_CONTROLER.open;
2844		- },
2845		- show: function( _currentElement, _w, _h ){
2846		- if( visible === false ) styleConsoleWrapper.display = '';
2847		- visible = true;
2848		- currentElement = _currentElement;
2849		- var _currentType = _currentElement.type,
2850		- _z = _currentElement.z,
2851		- imgEvent, txtEvent;
2852		- if( currentType !== _currentType ){
2853		- currentType = _currentType;
2854		- styleImgConsole.display = _currentType === PANEL_ELEMENT_TYPE_IMAGE ? '' : 'none';
2855		- styleTextConsole.display = _currentType === PANEL_ELEMENT_TYPE_TEXT ? '' : 'none';
2856		- CONSOLE_CONTROLER.w = _currentType === PANEL_ELEMENT_TYPE_IMAGE ? imgConsoleWidth : textConsoleWidth;
2857		- CONSOLE_CONTROLER.h = _currentType === PANEL_ELEMENT_TYPE_IMAGE ? imgConsoleHeight : textConsoleHeight;
2858		-
2859		- imgEvent = _currentType === PANEL_ELEMENT_TYPE_IMAGE ? 'addEventListener' : 'removeEventListener';
2860		- txtEvent = _currentType === PANEL_ELEMENT_TYPE_TEXT ? 'addEventListener' : 'removeEventListener';
2861		-
2862		- app[ imgEvent ]( document.getElementById( 'change-image-button' ), 'click', change );
2863		- app[ imgEvent ]( document.getElementById( 'layer-forward-button' ), 'click', layerForward );
2864		- app[ imgEvent ]( document.getElementById( 'layer-back-button' ), 'click', layerBack );
2865		- app[ imgEvent ]( document.getElementById( 'delete-image-button' ), 'click', del );
2866		-
2867		- app[ txtEvent ]( document.getElementById( 'edit-text-button' ), 'click', edit );
2868		- app[ txtEvent ]( document.getElementById( 'forward-text-button' ), 'click', layerForward );
2869		- app[ txtEvent ]( document.getElementById( 'back-text-button' ), 'click', layerBack );
2870		- app[ txtEvent ]( document.getElementById( 'delete-text-button' ), 'click', del );
2871		- };
2872		- CONSOLE_CONTROLER.x = Math.floor( ( _w - CONSOLE_CONTROLER.w ) / 2 );
2873		-
2874		- LAYER_BACK_BUTTON.visible( _z > 0 );
2875		- LAYER_FORWARD_BUTTON.visible( _z < PANEL_ELEMENT_ARRAY.length - 1 );
2876		- DELETE_BUTTON.visible( true );
2877		- EDIT_BUTTON.visible( _currentType === PANEL_ELEMENT_TYPE_TEXT );
2878		- CHANGE_BUTTON.visible( false );
2879		-
2880		- if( _w > CONSOLE_CONTROLER.w * 1.5 && _h > CONSOLE_CONTROLER.h * 1.5 ){
2881		- CONSOLE_CONTROLER.y = Math.floor( ( _h - CONSOLE_CONTROLER.h ) / 2 );
2882		- elmConsoleWrapper.className = '';
2883		- } else {
2884		- CONSOLE_CONTROLER.y = _h + tailSize;
2885		- elmConsoleWrapper.className = 'console-out';
2886		- };
2887		- styleConsoleWrapper.left = CONSOLE_CONTROLER.x + 'px';
2888		- styleConsoleWrapper.top = CONSOLE_CONTROLER.y + 'px';
2889		-
2890		- // layerWrapper.mesure();
2891		- },
2892		- hide: function(){
2893		- if( visible === true ) styleConsoleWrapper.display = 'none';
2894		- visible = false;
2895		- currentElement = null;
2896		- LAYER_BACK_BUTTON.visible( false );
2897		- LAYER_FORWARD_BUTTON.visible( false );
2898		- DELETE_BUTTON.visible( false );
2899		- EDIT_BUTTON.visible( false );
2900		- CHANGE_BUTTON.visible( false );
2901		- },
2902		- hitTest : function( _mouseX, _mouseY ){
2903		- if( currentElement === null ) return false;
2904		- _mouseX -= currentElement.x;
2905		- _mouseY -= currentElement.y;
2906		- return visible === true &&
2907		- CONSOLE_CONTROLER.x <= _mouseX && _mouseX <= CONSOLE_CONTROLER.x + CONSOLE_CONTROLER.w &&
2908		- CONSOLE_CONTROLER.y <= _mouseY && _mouseY <= CONSOLE_CONTROLER.y + CONSOLE_CONTROLER.h;
2909		- },
2910		- mousemove: function(){
2911		- /*
2912		- if( CONSOLE_CONTROLER.x > _mouseX \|\| CONSOLE_CONTROLER.y > _mouseY \|\| CONSOLE_CONTROLER.x + CONSOLE_CONTROLER.w < _mouseX \|\| CONSOLE_CONTROLER.y + CONSOLE_CONTROLER.h < _mouseY ){
2913		- // buttonClickable === true && buttonBackOrForward( true );
2914		- return false;
2915		- }
2916		- // buttonClickable === false && buttonBackOrForward( false ); */
2917		- // layerWrapper.mesure();
2918		- return false;
2919		- }
2920		- }
2921	2673	})();
2922	2674
2923	2675	/* --------------------------------------------------------------------------------------------

		@@ -2962,7 +2714,7 @@ var Editor = gOS.registerApplication( function(){
2962	2714	* visibilityのほうがいい, display:none だと ie で描画が狂う
2963	2715	*/
2964	2716	styleMover.visibility = '';
2965		- TAIL_OPERATOR.update( _currentText.w, _currentText.h, _currentText.angle() );
	2717	+ TAIL_OPERATOR.update( _currentText.w, _currentText.h, _currentText.a );
2966	2718	currentText = _currentText;
2967	2719	},
2968	2720	hitTest: function( _mouseX, _mouseY ){

		@@ -2984,7 +2736,7 @@ var Editor = gOS.registerApplication( function(){
2984	2736	w = _currentText.w;
2985	2737	h = _currentText.h;
2986	2738	currentText = _currentText;
2987		- startA = _currentText.angle();
	2739	+ startA = _currentText.a;
2988	2740	return true;
2989	2741	}
2990	2742	return false;

		@@ -2997,16 +2749,16 @@ var Editor = gOS.registerApplication( function(){
2997	2749	ATAN( _mouseY / _mouseX ) * RAD_TO_DEG + ( _mouseX > 0 ? 90 : 270 ) :
2998	2750	_mouseY > 0 ? 180 : 0
2999	2751	);
3000		- currentText && currentText.angle( FLOOR( balloonA + 0.5 ));
3001		- INFOMATION_WINDOW.update( currentText );
	2752	+ currentText && currentText.angle( FLOOR( balloonA + 0.5 ) );
	2753	+ CONSOLE_CONTROLER.update( currentText );
3002	2754	},
3003	2755	onFinish: function(){
3004		- startA !== currentText.angle() && PANEL_ELEMENT_OPERATION_MANAGER.saveStatus( x, y, w, h, startA );
3005		- startA !== currentText.angle() && PANEL_ELEMENT_OPERATION_MANAGER.resize( x, y, w, h, currentText.angle() );
	2756	+ startA !== currentText.a && PANEL_ELEMENT_OPERATION_MANAGER.saveStatus( x, y, w, h, startA );
	2757	+ startA !== currentText.a && PANEL_ELEMENT_OPERATION_MANAGER.resize( x, y, w, h, currentText.a );
3006	2758	currentText = null;
3007	2759	},
3008	2760	onCancel: function(){
3009		- currentText.angle( startA);
	2761	+ currentText.angle( startA );
3010	2762	PANEL_ELEMENT_OPERATION_MANAGER.resize( x, y, w, h, startA );
3011	2763	currentText = null;
3012	2764	}

		@@ -3064,8 +2816,8 @@ var Editor = gOS.registerApplication( function(){
3064	2816	w = _w = _w !== undefined ? _w : w;
3065	2817	h = _h = _h !== undefined ? _h : h;
3066	2818
3067		- elmResizerContainerStyle.left = _x + 'px';
3068		- elmResizerContainerStyle.top = _y + 'px';
	2819	+ elmResizerContainerStyle.left = ( PANEL_CONTROL.x + _x ) + 'px';
	2820	+ elmResizerContainerStyle.top = ( PANEL_CONTROL.y + _y ) + 'px';
3069	2821	elmResizerContainerStyle.width = _w + 'px';
3070	2822	elmResizerContainerStyle.height = _h + 'px';
3071	2823	elmResizerTopStyle.left = elmResizerBottomStyle.left = FLOOR( _w / 2 - 5 ) + 'px';

		@@ -3100,14 +2852,14 @@ var Editor = gOS.registerApplication( function(){
3100	2852	__h = _h;
3101	2853	_h = FLOOR( _w / startAspect );
3102	2854	_y = _y + ( currentIndex <= 5 ? __h - _h : 0);
3103		- }
3104		- }
	2855	+ };
	2856	+ };
3105	2857	draw( x = _x, y = _y, w = _w, h = _h );
3106	2858	currentElement.resize( _x, _y, _w, _h );
3107	2859	currentIsTextElement === true && TAIL_OPERATOR.update( _w, _h );
3108	2860	CONSOLE_CONTROLER.show( currentElement, _w, _h );
3109		- INFOMATION_WINDOW.update( currentElement);
3110		- }
	2861	+ CONSOLE_CONTROLER.update( currentElement );
	2862	+ };
3111	2863
3112	2864	function flip( _flipH, _flipV ){
3113	2865	var p = CURSOR_AND_FLIP[ currentIndex ];

		@@ -3117,7 +2869,7 @@ var Editor = gOS.registerApplication( function(){
3117	2869	app.updateCoursor( CURSOR_AND_FLIP[ currentIndex ].cursor );
3118	2870	elmResizerContainer.className = 'current-resizer-is-' + currentIndex;
3119	2871	currentElement.flip( _flipH, _flipV );
3120		- }
	2872	+ };
3121	2873	return {
3122	2874	init: function(){
3123	2875	elmResizerContainer = document.getElementById( 'comic-element-resizer-container');

		@@ -3140,16 +2892,16 @@ var Editor = gOS.registerApplication( function(){
3140	2892	app.updateCoursor( CURSOR_AND_FLIP[ i].cursor );
3141	2893	elmResizerContainer.className = 'current-resizer-is-' +i;
3142	2894	return currentIndex = i;
3143		- }
3144		- }
	2895	+ };
	2896	+ };
3145	2897	for( i=0; i<4; i++ ){
3146	2898	p = POSITION_ARRAY[ i ];
3147	2899	if( p.x <= _mouseX && p.y <= _mouseY && p.x + p.w >= _mouseX && p.y +p.h >= _mouseY){
3148	2900	app.updateCoursor( CURSOR_AND_FLIP[ i].cursor);
3149	2901	elmResizerContainer.className = 'current-resizer-is-' +i;
3150	2902	return currentIndex = i;
3151		- }
3152		- }
	2903	+ };
	2904	+ };
3153	2905	app.updateCoursor( '' );
3154	2906	elmResizerContainer.className = '';
3155	2907	return -1;

		@@ -3176,16 +2928,16 @@ var Editor = gOS.registerApplication( function(){
3176	2928	startW = baseW = _currentElement.w;
3177	2929	startH = baseH = _currentElement.h;
3178	2930	if( _currentElement.type === PANEL_ELEMENT_TYPE_IMAGE){
3179		- startFilpV = _currentElement.flipV();
3180		- startFilpH = _currentElement.flipH();
3181		- }
	2931	+ startFilpV = _currentElement.flipV;
	2932	+ startFilpH = _currentElement.flipH;
	2933	+ };
3182	2934	startAspect = startW /startH;
3183	2935	return true;
3184	2936	},
3185	2937	onDrag: function( _mouseX, _mouseY ){
3186		- var com = RESIZE_WORK_ARRAY[ currentIndex],
3187		- moveX = _mouseX -offsetX,
3188		- moveY = _mouseY -offsetY,
	2938	+ var com = RESIZE_WORK_ARRAY[ currentIndex ],
	2939	+ moveX = _mouseX - offsetX,
	2940	+ moveY = _mouseY - offsetY,
3189	2941	_updated = moveX !== 0 \|\| moveY !== 0,
3190	2942	_x, _y, _w, _h,
3191	2943	_thisError = 0;

		@@ -3207,8 +2959,8 @@ var Editor = gOS.registerApplication( function(){
3207	2959	//alert( 'opera error' +error);
3208	2960	this.onCancel();
3209	2961	return;
3210		- }
3211		- }
	2962	+ };
	2963	+ };
3212	2964
3213	2965	if( _w >= MIN_ELEMENT_SIZE && _h >= MIN_ELEMENT_SIZE){
3214	2966

		@@ -3239,7 +2991,7 @@ var Editor = gOS.registerApplication( function(){
3239	2991	baseW = _w = _memoryX -_x;
3240	2992	baseH = _h;
3241	2993	flip( true, false);
3242		- flipV = currentElement.flipV();
	2994	+ flipV = currentElement.flipV;
3243	2995	} else
3244	2996	if( _w > MIN_ELEMENT_SIZE && _h < -MIN_ELEMENT_SIZE){
3245	2997	// flipV

		@@ -3259,13 +3011,13 @@ var Editor = gOS.registerApplication( function(){
3259	3011	baseW = _w = _memoryX -_x;
3260	3012	baseH = _h = _memoryY -_y;
3261	3013	flip( true, true);
3262		- flipV = currentElement.flipV();
3263		- flipH = currentElement.flipH();
3264		- }
	3014	+ flipV = currentElement.flipV;
	3015	+ flipH = currentElement.flipH;
	3016	+ };
3265	3017	_updated = true;
3266	3018	offsetX = _mouseX;
3267	3019	offsetY = _mouseY;
3268		- }
	3020	+ };
3269	3021	currentX = _x;
3270	3022	currentY = _y;
3271	3023	currentW = _w;

		@@ -3296,7 +3048,7 @@ var Editor = gOS.registerApplication( function(){
3296	3048	PANEL_ELEMENT_OPERATION_MANAGER.resize( startX, startY, startW, startH );
3297	3049	currentElement.type === PANEL_ELEMENT_TYPE_IMAGE ?
3298	3050	currentElement.animate( startX, startY, startW, startH, startFilpV, startFilpH) :
3299		- currentElement.animate( startX, startY, startW, startH, angle);
	3051	+ currentElement.animate( startX, startY, startW, startH, angle );
3300	3052	},
3301	3053	onShiftUpdate: update,
3302	3054	onCtrlUpdate: update

		@@ -3318,7 +3070,7 @@ var Editor = gOS.registerApplication( function(){
3318	3070	y = _y !== undefined ? _y : y;
3319	3071	RESIZE_OPERATOR.update( x, y );
3320	3072	currentElement.resize( x, y );
3321		- INFOMATION_WINDOW.update( currentElement );
	3073	+ CONSOLE_CONTROLER.update( currentElement );
3322	3074	};
3323	3075	return {
3324	3076	init: function(){

		@@ -3357,7 +3109,7 @@ var Editor = gOS.registerApplication( function(){
3357	3109	},
3358	3110	onShiftUpdate: update,
3359	3111	onCtrlUpdate: update
3360		- }
	3112	+ };
3361	3113	})();
3362	3114
3363	3115

		@@ -3369,25 +3121,26 @@ var Editor = gOS.registerApplication( function(){
3369	3121	currentIsTextElement = false,
3370	3122	currentOperator = null,
3371	3123	currentElement = null,
	3124	+ node = null,
3372	3125	currentX, currentY, currentW, currentH, angle, flipV, flipH;
3373	3126
3374		- function show( _currentElement ){
3375		- currentElement === null && RESIZE_OPERATOR.show( _currentElement );
3376		- if( currentElement !== _currentElement ){
3377		- currentElement = _currentElement;
3378		-
3379		- currentIsTextElement = ( _currentElement.type === PANEL_ELEMENT_TYPE_TEXT );
3380		- currentIsTextElement === true ? TAIL_OPERATOR.show( _currentElement ) : TAIL_OPERATOR.hide();
3381		-
3382		- flipV = currentIsTextElement === false ? _currentElement.flipV() : 0;
3383		- flipH = currentIsTextElement === false ? _currentElement.flipH() : 0;
3384		-
3385		- PANEL_ELEMENT_OPERATION_MANAGER.resize(
3386		- _currentElement.x, _currentElement.y, _currentElement.w, _currentElement.h,
3387		- currentIsTextElement === true ? _currentElement.angle() : 0
3388		- );
3389		- };
	3127	+ function show( _currentElement ){
	3128	+ currentElement === null && RESIZE_OPERATOR.show( _currentElement );
	3129	+ if( currentElement !== _currentElement ){
	3130	+ currentElement = _currentElement;
	3131	+
	3132	+ currentIsTextElement = ( _currentElement.type === PANEL_ELEMENT_TYPE_TEXT );
	3133	+ currentIsTextElement === true ? TAIL_OPERATOR.show( _currentElement ) : TAIL_OPERATOR.hide();
	3134	+
	3135	+ flipV = currentIsTextElement === false ? _currentElement.flipV : 0;
	3136	+ flipH = currentIsTextElement === false ? _currentElement.flipH : 0;
	3137	+
	3138	+ PANEL_ELEMENT_OPERATION_MANAGER.resize(
	3139	+ _currentElement.x, _currentElement.y, _currentElement.w, _currentElement.h,
	3140	+ currentIsTextElement === true ? _currentElement.a : 0
	3141	+ );
3390	3142	};
	3143	+ };
3391	3144
3392	3145	return {
3393	3146	init: function(){

		@@ -3425,7 +3178,7 @@ var Editor = gOS.registerApplication( function(){
3425	3178	app.updateCoursor( '' );
3426	3179	TAIL_OPERATOR.hide();
3427	3180	CONSOLE_CONTROLER.hide();
3428		- INFOMATION_WINDOW.update( null );
	3181	+ //CONSOLE_CONTROLER.update( null );
3429	3182	},
3430	3183	resize: function( _x, _y, _w, _h, _angle ){
3431	3184	currentX = _x = _x !== undefined ? _x : currentX;

		@@ -3437,7 +3190,7 @@ var Editor = gOS.registerApplication( function(){
3437	3190	RESIZE_OPERATOR.update( _x, _y, _w, _h );
3438	3191	currentIsTextElement === true && TAIL_OPERATOR.update( _w, _h, angle );
3439	3192	CONSOLE_CONTROLER.show( currentElement, _w, _h );
3440		- INFOMATION_WINDOW.update( currentElement );
	3193	+ //CONSOLE_CONTROLER.update( currentElement );
3441	3194	},
3442	3195	/* history */
3443	3196	restoreState: function( _currentElement, _x, _y, _w, _h, _a, _flipV, _flipH ){

		@@ -3459,8 +3212,8 @@ var Editor = gOS.registerApplication( function(){
3459	3212	startFilpV = startFilpV !== undefined ? startFilpV : flipV;
3460	3213	startFilpH = startFilpH !== undefined ? startFilpH : flipH;
3461	3214	currentElement && HISTORY_CONTROL.saveState( PANEL_ELEMENT_OPERATION_MANAGER.restoreState,
3462		- [ currentElement, startX, startY, startW, startH, startA, startFilpV, startFilpH],
3463		- [ currentElement, currentX, currentY, currentW, currentH, angle, flipV, flipH]
	3215	+ [ currentElement, startX, startY, startW, startH, startA, startFilpV, startFilpH ],
	3216	+ [ currentElement, currentX, currentY, currentW, currentH, angle, flipV, flipH ]
3464	3217	);
3465	3218	},
3466	3219	busy: function(){

		@@ -3479,34 +3232,34 @@ var Editor = gOS.registerApplication( function(){
3479	3232	} else {
3480	3233	_x = _panelElement.x - HIT_AREA;
3481	3234	_y = _panelElement.y - HIT_AREA;
3482		- _w = _panelElement.w + HIT_AREA *2;
3483		- _h = _panelElement.h + HIT_AREA *2;
3484		- }
	3235	+ _w = _panelElement.w + HIT_AREA * 2;
	3236	+ _h = _panelElement.h + HIT_AREA * 2;
	3237	+ };
3485	3238	return _x <= _mouseX && _mouseX <= _x + _w && _y <= _mouseY && _mouseY <= _y + _h;
3486	3239	},
3487	3240	mousedown: function( _currentElement, _mouseX, _mouseY ){
3488	3241	//show( _currentElement);
3489		- if( currentIsTextElement === true && TAIL_OPERATOR.onStart( _currentElement, _mouseX, _mouseY) === true){
	3242	+ if( currentIsTextElement === true && TAIL_OPERATOR.onStart( _currentElement, _mouseX, _mouseY ) === true ){
3490	3243	currentOperator = TAIL_OPERATOR;
3491	3244	} else
3492		- if( RESIZE_OPERATOR.onStart( _currentElement, _mouseX, _mouseY) === true){
	3245	+ if( RESIZE_OPERATOR.onStart( _currentElement, _mouseX, _mouseY ) === true ){
3493	3246	currentOperator = RESIZE_OPERATOR;
3494	3247	} else {
3495		- POSITION_OPERATOR.onStart( _currentElement, _mouseX, _mouseY)
	3248	+ POSITION_OPERATOR.onStart( _currentElement, _mouseX, _mouseY );
3496	3249	currentOperator = POSITION_OPERATOR;
3497		- }
	3250	+ };
3498	3251	},
3499	3252	mousemove: function( _currentElement, _mouseX, _mouseY ){
3500	3253	show( _currentElement);
3501		- if( currentOperator !== null){
	3254	+ if( currentOperator !== null ){
3502	3255	currentOperator.onDrag( _mouseX, _mouseY );
3503	3256	} else
3504		- if( currentElement !== null){
3505		- CONSOLE_CONTROLER.mousemove( _mouseX - currentX, _mouseY - currentY );
3506		- if( currentIsTextElement === false \|\| TAIL_OPERATOR.hitTest( _mouseX -currentX, _mouseY -currentY) === false){
3507		- RESIZE_OPERATOR.index( _mouseX, _mouseY);
3508		- }
3509		- }
	3257	+ if( currentElement !== null ){
	3258	+ // CONSOLE_CONTROLER.mousemove( _mouseX - currentX, _mouseY - currentY );
	3259	+ if( currentIsTextElement === false \|\| TAIL_OPERATOR.hitTest( _mouseX - currentX, _mouseY - currentY ) === false ){
	3260	+ RESIZE_OPERATOR.index( _mouseX, _mouseY );
	3261	+ };
	3262	+ };
3510	3263	},
3511	3264	mouseup: function( _currentElement, _mouseX, _mouseY ){
3512	3265	currentOperator !== null && currentOperator.onFinish();

		@@ -3518,25 +3271,258 @@ var Editor = gOS.registerApplication( function(){
3518	3271	* // PANEL_ELEMENT_OPERATION_MANAGER
3519	3272	*/
3520	3273
	3274	+/* --------------------------------------------------------------------------------------------
	3275	+ * CONSOLE_CONTROLER
	3276	+ */
	3277	+ var CONSOLE_CONTROLER = ( function(){
	3278	+ var LAYER_BACK_BUTTON, LAYER_FORWARD_BUTTON, DELETE_BUTTON, EDIT_BUTTON, CHANGE_BUTTON,
	3279	+ PUSH_OUT_RATIO = 0.5,
	3280	+ tailSize = 10,
	3281	+ elmRoot, elmContainer, elmPushout, elmTail,
	3282	+ pushoutW = 0,
	3283	+ pushoutH = 0,
	3284	+ pushout = false,
	3285	+ currentType = -1,
	3286	+ visible = false,
	3287	+ node = null,
	3288	+ ui, inputX, inputY, inputZ, inputA, inputW, inputH, inputAspectRatio,
	3289	+ buttonBack, buttonForward, buttonDel, buttonEdit, butonChange;
	3290	+
	3291	+ function layerBack(){
	3292	+ if( currentElement === null ) return;
	3293	+ if( PANEL_ELEMENT_CONTROL.replace( currentElement, false ) === false ) return;
	3294	+ CONSOLE_CONTROLER.update( currentElement );
	3295	+ HISTORY_CONTROL.saveState( PANEL_ELEMENT_CONTROL.resplace, [ currentElement, true ], [ currentElement, false ] );
	3296	+ var _z = currentElement.z;
	3297	+ LAYER_BACK_BUTTON.visible( _z > 0 );
	3298	+ LAYER_FORWARD_BUTTON.visible( _z < PANEL_ELEMENT_ARRAY.length - 1 );
	3299	+ };
	3300	+ function layerForward(){
	3301	+ if( currentElement === null ) return;
	3302	+ if( PANEL_ELEMENT_CONTROL.replace( currentElement, true ) === false ) return;
	3303	+ CONSOLE_CONTROLER.update( currentElement );
	3304	+ HISTORY_CONTROL.saveState( PANEL_ELEMENT_CONTROL.replace, [ currentElement, false ], [ currentElement, true ] );
	3305	+ var _z = currentElement.z;
	3306	+ LAYER_BACK_BUTTON.visible( _z > 0 );
	3307	+ LAYER_FORWARD_BUTTON.visible( _z < PANEL_ELEMENT_ARRAY.length - 1 );
	3308	+ };
	3309	+ function del(){
	3310	+ if( currentElement === null ) return;
	3311	+ HISTORY_CONTROL.saveState( PANEL_ELEMENT_CONTROL.restore, [ true, currentElement ], [ false, currentElement ], false ); // true
	3312	+ PANEL_ELEMENT_CONTROL.remove( currentElement );
	3313	+ PANEL_ELEMENT_OPERATION_MANAGER.hide();
	3314	+ };
	3315	+ function edit(){
	3316	+ if( currentElement === null \|\| currentElement.type !== PANEL_ELEMENT_TYPE_TEXT ) return;
	3317	+ TextEditor.boot( PANEL_CONTROL.x, PANEL_CONTROL.y, currentElement );
	3318	+ };
	3319	+ function change(){
	3320	+ if( currentElement === null ) return;
	3321	+ PremiumSatge.boot( currentElement.artistID, currentElement.resourcePicture, currentElement );
	3322	+ };
	3323	+
	3324	+ return {
	3325	+ x: 0,
	3326	+ y: 0,
	3327	+ w: 0,
	3328	+ h: 0,
	3329	+ init: function(){
	3330	+ app.addKeyEventListener( 'keydown', layerBack, 66, false, true );
	3331	+ app.addKeyEventListener( 'keydown', layerForward, 70, false, true );
	3332	+ app.addKeyEventListener( 'keydown', del, 68, false, true );
	3333	+ app.addKeyEventListener( 'keydown', edit, 69, false, true );
	3334	+ app.addKeyEventListener( 'keydown', change, 85, false, true );
	3335	+
	3336	+ elmContainer = document.getElementById( 'comic-element-consol-container' );
	3337	+ elmRoot = elmContainer.parentNode;
	3338	+ elmPushout = document.getElementById( 'comic-element-consol-pushout-wrapper' );
	3339	+ elmTail = document.getElementById( 'comic-element-consol-pushout-tail' );
	3340	+ delete CONSOLE_CONTROLER.init;
	3341	+ },
	3342	+ open: function(){
	3343	+ // layerWrapper = app.createInteractContainer( elmConsoleWrapper );
	3344	+
	3345	+ LAYER_BACK_BUTTON = MENU_BAR_CONTROL.EDIT.createOption( 'layer back', 'ctrl + B', layerBack, false, true, false );
	3346	+ LAYER_FORWARD_BUTTON = MENU_BAR_CONTROL.EDIT.createOption( 'layer forward', 'ctrl + F', layerForward, false, false, false );
	3347	+ DELETE_BUTTON = MENU_BAR_CONTROL.EDIT.createOption( 'delete', 'ctrl + D', del, false, true, true );
	3348	+ EDIT_BUTTON = MENU_BAR_CONTROL.EDIT.createOption( 'Edit Text', 'ctrl + E', edit, false, true, false );
	3349	+ CHANGE_BUTTON = MENU_BAR_CONTROL.EDIT.createOption( 'change', 'ctrl + U', change, false, false, true );
	3350	+
	3351	+
	3352	+ // inputAspectRatio = $( '#comic-element-keep-aspect' );
	3353	+
	3354	+ delete CONSOLE_CONTROLER.open;
	3355	+ },
	3356	+ onMouseover : function( e ){
	3357	+ node.mesureChildren();
	3358	+ //node.mesure();
	3359	+ },
	3360	+ show: function( _currentElement, w, h ){
	3361	+ if( node === null ){
	3362	+ node = PANEL_CONTROL.node.createNode( elmContainer, false, false, 'comic-element-consol-container-hover' );
	3363	+ node.addEventListener( 'mouseover', CONSOLE_CONTROLER.onMouseover, CONSOLE_CONTROLER );
	3364	+ ui = app.createUIGroup( node );
	3365	+ inputX = ui.createInputText( document.getElementById( 'comic-element-x' ), null );
	3366	+ inputY = ui.createInputText( document.getElementById( 'comic-element-y' ), null );
	3367	+ inputZ = ui.createInputText( document.getElementById( 'comic-element-z' ), null );
	3368	+ inputA = ui.createInputText( document.getElementById( 'comic-element-a' ), null );
	3369	+ inputW = ui.createInputText( document.getElementById( 'comic-element-w' ), null );
	3370	+ inputH = ui.createInputText( document.getElementById( 'comic-element-h' ), null );
	3371	+ inputPercentW = ui.createInputText( document.getElementById( 'comic-element-w-percent' ), null );
	3372	+ inputPercentH = ui.createInputText( document.getElementById( 'comic-element-h-percent' ), null );
	3373	+ butonChange = ui.createButton( document.getElementById( 'change-image-button' ), change ),
	3374	+ buttonBack = ui.createButton( document.getElementById( 'layer-back-button' ), layerBack ),
	3375	+ buttonDel = ui.createButton( document.getElementById( 'delete-button' ), del ),
	3376	+ buttonForward = ui.createButton( document.getElementById( 'layer-forward-button' ), layerForward ),
	3377	+ buttonEdit = ui.createButton( document.getElementById( 'edit-text-button' ), edit );
	3378	+ };
	3379	+
	3380	+ currentElement = _currentElement;
	3381	+
	3382	+ var type = currentElement.type,
	3383	+ z = currentElement.z;
	3384	+
	3385	+ LAYER_BACK_BUTTON.visible( z > 0 );
	3386	+ buttonBack.enabled( z > 0 );
	3387	+ LAYER_FORWARD_BUTTON.visible( z < PANEL_ELEMENT_ARRAY.length - 1 );
	3388	+ buttonForward.enabled( z < PANEL_ELEMENT_ARRAY.length - 1 )
	3389	+ DELETE_BUTTON.visible( true );
	3390	+ EDIT_BUTTON.visible( type === PANEL_ELEMENT_TYPE_TEXT );
	3391	+ CHANGE_BUTTON.visible( false );
	3392	+
	3393	+ //CONSOLE_CONTROLER.x = Math.floor( ( _w - CONSOLE_CONTROLER.w ) / 2 );
	3394	+ CONSOLE_CONTROLER.w = w;
	3395	+ CONSOLE_CONTROLER.h = elmContainer.offsetHeight;
	3396	+ CONSOLE_CONTROLER.y = h - CONSOLE_CONTROLER.h;
	3397	+
	3398	+ if( h * PUSH_OUT_RATIO < CONSOLE_CONTROLER.h ){
	3399	+ if( pushout === false ){
	3400	+ pushout = true;
	3401	+ elmPushout.appendChild( elmContainer );
	3402	+ elmPushout.style.display = 'block';
	3403	+ pushoutW = elmPushout.offsetWidth;
	3404	+ pushoutH = elmPushout.offsetHeight;
	3405	+ elmTail.style.top = ( pushoutH / 2 - tailSize / 2 ) + 'px';
	3406	+ };
	3407	+ elmPushout.style.left = ( - pushoutW - tailSize ) + 'px';
	3408	+ elmPushout.style.top = ( h / 2 - pushoutH / 2 ) + 'px';
	3409	+ elmPushout.className = 'satellite-left';
	3410	+ } else
	3411	+ if( pushout === true ){
	3412	+ pushout = false;
	3413	+ elmRoot.insertBefore( elmContainer, elmRoot.firstChild );
	3414	+ elmPushout.style.cssText = '';
	3415	+ };
	3416	+
	3417	+ CONSOLE_CONTROLER.update( currentElement );
	3418	+ ui.visible( true );
	3419	+ node.mesure();
	3420	+ },
	3421	+ update : function( _currentElement ){
	3422	+ if( _currentElement === null ){
	3423	+ visible = false;
	3424	+ return;
	3425	+ };
	3426	+ currentElement = _currentElement;
	3427	+ var type = currentElement.type,
	3428	+ x = currentElement.x,
	3429	+ y = currentElement.y,
	3430	+ z = currentElement.z,
	3431	+ a = type === PANEL_ELEMENT_TYPE_TEXT ? Math.floor( currentElement.a ) : 0,
	3432	+ w = currentElement.w,
	3433	+ h = currentElement.h,
	3434	+ actualW = type === PANEL_ELEMENT_TYPE_IMAGE ? currentElement.actualW : 1,
	3435	+ actualH = type === PANEL_ELEMENT_TYPE_IMAGE ? currentElement.actualH : 1,
	3436	+ wPercent = type === PANEL_ELEMENT_TYPE_IMAGE ? Math.floor( w / actualW * 100 ) : 0,
	3437	+ hPercent = type === PANEL_ELEMENT_TYPE_IMAGE ? Math.floor( h / actualH * 100 ) : 0,
	3438	+ keepAspect = currentElement.keepAspect;
	3439	+
	3440	+ if( currentType !== type ){
	3441	+ if( type === PANEL_ELEMENT_TYPE_TEXT ){
	3442	+ inputA.visible( true );
	3443	+ inputPercentW.visible( false );
	3444	+ inputPercentH.visible( false );
	3445	+ buttonEdit.enabled( true );
	3446	+ //inputAspectRatio.hide();
	3447	+ } else {
	3448	+ inputA.visible( false );
	3449	+ inputPercentW.visible( true );
	3450	+ inputPercentH.visible( true );
	3451	+ buttonEdit.enabled( false );
	3452	+ //inputAspectRatio.show();
	3453	+ };
	3454	+ currentType = type;
	3455	+ };
	3456	+
	3457	+ inputX.value( x );
	3458	+ inputY.value( y );
	3459	+ inputZ.value( z );
	3460	+ type === 1 && inputA.value( a );
	3461	+ inputW.value( w );
	3462	+ inputH.value( h );
	3463	+ type === 0 && inputPercentW.value( wPercent );
	3464	+ type === 0 && inputPercentH.value( hPercent );
	3465	+ },
	3466	+ hide: function(){
	3467	+ // if( visible === true ) styleConsoleWrapper.display = 'none';
	3468	+ ui && ui.visible( false );
	3469	+ visible = false;
	3470	+ currentElement = null;
	3471	+ LAYER_BACK_BUTTON.visible( false );
	3472	+ LAYER_FORWARD_BUTTON.visible( false );
	3473	+ DELETE_BUTTON.visible( false );
	3474	+ EDIT_BUTTON.visible( false );
	3475	+ CHANGE_BUTTON.visible( false );
	3476	+ },
	3477	+ hitTest : function( x, y ){
	3478	+ if( visible === false ) return false;
	3479	+ x -= currentElement.x;
	3480	+ y -= currentElement.y;
	3481	+ if( pushout ){
	3482	+ return CONSOLE_CONTROLER.x <= x && x <= CONSOLE_CONTROLER.x + CONSOLE_CONTROLER.w &&
	3483	+ CONSOLE_CONTROLER.y <= y && y <= CONSOLE_CONTROLER.y + CONSOLE_CONTROLER.h;
	3484	+ };
	3485	+ return CONSOLE_CONTROLER.x <= x && x <= CONSOLE_CONTROLER.x + CONSOLE_CONTROLER.w &&
	3486	+ CONSOLE_CONTROLER.y <= y && y <= CONSOLE_CONTROLER.y + CONSOLE_CONTROLER.h;
	3487	+ }
	3488	+ };
	3489	+ })();
	3490	+
	3491	+
	3492	+
3521	3493	var AbstractPanelElement = function( COMIC_ELM_TYPE ){
3522	3494	this.type = COMIC_ELM_TYPE;
3523		- this.hitTest = function( _mouseX, _mouseY ){
3524		- return PANEL_ELEMENT_OPERATION_MANAGER.hitTest( _mouseX, _mouseY, this );
3525		- }
3526		- this.shift = function( _shiftX, _shiftY ){
3527		- this.resize( this.x + _shiftX, this.y + _shiftY);
3528		- }
3529		- this.busy = function(){
	3495	+ };
	3496	+ AbstractPanelElement.prototype = {
	3497	+ $ : null,
	3498	+ data : null,
	3499	+ x : 0,
	3500	+ y : 0,
	3501	+ w : 0,
	3502	+ h : 0,
	3503	+ z : 0,
	3504	+ timing : 0,
	3505	+ actualW : 0,
	3506	+ actualH : 0,
	3507	+ flipV : 0,
	3508	+ flipH : 0,
	3509	+ hitTest : function( mouseX, mouseY ){
	3510	+ return PANEL_ELEMENT_OPERATION_MANAGER.hitTest( mouseX, mouseY, this );
	3511	+ },
	3512	+ shift : function( shiftX, shiftY ){
	3513	+ this.resize( this.x + shiftX, this.y + shiftY );
	3514	+ },
	3515	+ busy : function(){
3530	3516	return PANEL_ELEMENT_OPERATION_MANAGER.busy();
3531		- }
3532		- this.mousemove = function( _mouseX, _mouseY ){
3533		- PANEL_ELEMENT_OPERATION_MANAGER.mousemove( this, _mouseX, _mouseY );
3534		- }
3535		- this.mouseup = function( _mouseX, _mouseY ){
3536		- PANEL_ELEMENT_OPERATION_MANAGER.mouseup( this, _mouseX, _mouseY );
3537		- }
3538		- this.mousedown = function( _mouseX, _mouseY ){
3539		- PANEL_ELEMENT_OPERATION_MANAGER.mousedown( this, _mouseX, _mouseY );
	3517	+ },
	3518	+ mousemove : function( mouseX, mouseY ){
	3519	+ PANEL_ELEMENT_OPERATION_MANAGER.mousemove( this, mouseX, mouseY );
	3520	+ },
	3521	+ mouseup : function( mouseX, mouseY ){
	3522	+ PANEL_ELEMENT_OPERATION_MANAGER.mouseup( this, mouseX, mouseY );
	3523	+ },
	3524	+ mousedown : function( mouseX, mouseY ){
	3525	+ PANEL_ELEMENT_OPERATION_MANAGER.mousedown( this, mouseX, mouseY );
3540	3526	}
3541	3527	};
3542	3528

		@@ -3547,98 +3533,85 @@ var Editor = gOS.registerApplication( function(){
3547	3533	var ImageElementClass = function( data ){
3548	3534	jqImageElementOrigin = jqImageElementOrigin \|\| $( app.fetchHTMLElement( 'imgElementTemplete' ) );
3549	3535
3550		- var jqWrap = jqImageElementOrigin.clone( true ),
3551		- flipH = data.width < 0 ? -1 : 1,
3552		- flipV = data.height < 0 ? -1 : 1,
3553		- resourcePicture = data.resource_picture,
3554		- actualW = data.resource_picture.width,
3555		- actualH = data.resource_picture.height,
3556		- reversibleImage = null,
3557		- self = this,
3558		- x, y, z, w, h;
3559		- function flipReversibleImage(){
3560		- reversibleImage && reversibleImage.resize( flipH * w, flipV * h );
3561		- };
3562		- /* history */
3563		- function updateResourcePicture( _resourcePicture ){
3564		- resourcePicture = _resourcePicture;
3565		-
3566		- actualW = _resourcePicture.width;
3567		- actualH = _resourcePicture.height;
3568		-
3569		- var _reversibleImage = pettanr.image.createReversibleImage(
3570		- [ pettanr.CONST.RESOURCE_PICTURE_PATH, _resourcePicture.id, '.', _resourcePicture.ext ].join(''),
3571		- flipH * w, flipV * h
3572		- );
3573		- if( reversibleImage !== null ){
3574		- jqWrap.children( reversibleImage.elm ).replaceWith( _reversibleImage.elm );
3575		- reversibleImage.destroy();
3576		- } else {
3577		- jqWrap.append( _reversibleImage.elm );
3578		- }
3579		- reversibleImage = _reversibleImage;
3580		- };
3581		- /* global methods */
3582		- this.$ = jqWrap;
3583		- //this.x = x;
3584		- //this.y = y;
3585		- //this.w = w;
3586		- //this.h = h;
3587		- this.z = data.z;
3588		- this.timing = data.t \|\| PANEL_ELEMENT_ARRAY.length + 1;
	3536	+ this.$ = jqImageElementOrigin.clone( true );
	3537	+ this.data = data;
	3538	+ this.z = data.z;
	3539	+ this.timing = data.t \|\| PANEL_ELEMENT_ARRAY.length + 1;
3589	3540	this.keepSize = false;
3590		- this.init = function(){
3591		- updateResourcePicture( data.resource_picture );
3592		- self.resize( data.x, data.y, Math.abs( data.width ), Math.abs( data.height ) );
3593		- delete self.init;
3594		- };
3595		- this.flip = function( _updateH, _updateV ){
3596		- if( _updateH !== true && _updateV !== true ) return;
3597		- flipH = _updateH === true ? -flipH : flipH;
3598		- flipV = _updateV === true ? -flipV : flipV;
3599		- reversibleImage.resize( flipH * w, flipV * h );
3600		- };
3601		- this.flipV = function(){ return flipV;}
3602		- this.flipH = function(){ return flipH;}
3603		- this.resourcePicture = function( _resourcePicture ){
3604		- if( _resourcePicture && _resourcePicture !== resourcePicture ){
3605		- HISTORY_CONTROL.saveState( updateResourcePicture, resourcePicture, _resourcePicture );
3606		- updateResourcePicture( _resourcePicture );
3607		- };
3608		- return resourcePicture;
3609		- };
3610		- this.getArtistID = function(){
3611		- return resourcePicture.artist_id \|\| resourcePicture.artist.id \|\| -1;
3612		- };
3613		- this.actualW = function(){ return actualW;}
3614		- this.actualH = function(){ return actualH;}
3615		- this.resize = function( _x, _y, _w, _h, animate ){
3616		- self.x = x = Type.isFinite( _x ) === true ? _x : x;
3617		- self.y = y = Type.isFinite( _y ) === true ? _y : y;
3618		- self.w = w = Type.isFinite( _w ) === true ? _w : w;
3619		- self.h = h = Type.isFinite( _h ) === true ? _h : h;
3620		- jqWrap[ animate === true ? 'animate' : 'css' ]( {
3621		- left: x,
3622		- top: y,
3623		- width: w,
3624		- height: h
3625		- }, 250, flipReversibleImage );
3626		- animate !== true && flipReversibleImage();
3627		- };
3628		- this.animate = function ( _x, _y, _w, _h, _flipH, _flipV ){
3629		- flipH = _flipH !== undefined ? _flipH : flipH;
3630		- flipV = _flipV !== undefined ? _flipV : flipV;
3631		- self.resize( _x, _y, _w, _h, true );
3632		- };
3633		- this.destroy = function(){
3634		- delete self.destroy;
3635		-
3636		- reversibleImage.destroy();
3637		- jqWrap.stop().remove();
3638		- jqWrap = reversibleImage = resourcePicture = data = self = null;
3639		- };
	3541	+ this.flipV = data.height < 0 ? -1 : 1;
	3542	+ this.flipH = data.width < 0 ? -1 : 1;
	3543	+ this.rPicture = data.resource_picture;
	3544	+ this.artistID = this.rPicture.artist_id \|\| this.rPicture.artist.id \|\| -1;
	3545	+ this.reversibleImage = null;
3640	3546	};
3641		- ImageElementClass.prototype = new AbstractPanelElement( PANEL_ELEMENT_TYPE_IMAGE );
	3547	+ ImageElementClass.prototype = Util.extend(
	3548	+ new AbstractPanelElement( PANEL_ELEMENT_TYPE_IMAGE ),
	3549	+ {
	3550	+ init : function(){
	3551	+ this._updateResourcePicture( this.rPicture );
	3552	+ this.resize( this.data.x, this.data.y, Math.abs( this.data.width ), Math.abs( this.data.height ) );
	3553	+ this.init = null;
	3554	+ },
	3555	+ flip : function( updateH, updateV ){
	3556	+ if( updateH !== true && updateV !== true ) return;
	3557	+ this.flipH = updateH === true ? -this.flipH : this.flipH;
	3558	+ this.flipV = updateV === true ? -this.flipV : this.flipV;
	3559	+ this.reversibleImage.resize( this.flipH * this.w, this.flipV * this.h );
	3560	+ },
	3561	+ resourcePicture : function( _rPicture ){
	3562	+ if( _rPicture && _rPicture !== this.rPicture ){
	3563	+ HISTORY_CONTROL.saveState( this._updateResourcePicture, this.rPicture, _rPicture, this );
	3564	+ this._updateResourcePicture( _rPicture );
	3565	+ };
	3566	+ return this.rPicture;
	3567	+ },
	3568	+ resize : function( x, y, w, h, animate ){
	3569	+ this.x = x = Type.isFinite( x ) === true ? x : this.x;
	3570	+ this.y = y = Type.isFinite( y ) === true ? y : this.y;
	3571	+ this.w = w = Type.isFinite( w ) === true ? w : this.w;
	3572	+ this.h = h = Type.isFinite( h ) === true ? h : this.h;
	3573	+ this.$[ animate === true ? 'animate' : 'css' ]( {
	3574	+ left: x,
	3575	+ top: y,
	3576	+ width: w,
	3577	+ height: h
	3578	+ }, 250 /, flipReversibleImage / );
	3579	+ /animate !== true && / this._flipReversibleImage();
	3580	+ },
	3581	+ animate : function ( x, y, w, h, flipH, flipV ){
	3582	+ this.flipH = flipH !== undefined ? flipH : this.flipH;
	3583	+ this.flipV = flipV !== undefined ? flipV : this.flipV;
	3584	+ this.resize( x, y, w, h, true );
	3585	+ },
	3586	+ destroy : function(){
	3587	+ this.reversibleImage.destroy();
	3588	+ this.$.stop().remove();
	3589	+ },
	3590	+ _updateResourcePicture : function( _rPicture ){
	3591	+ this.rPicture = _rPicture;
	3592	+
	3593	+ this.actualW = _rPicture.width;
	3594	+ this.actualH = _rPicture.height;
	3595	+
	3596	+ var _reversibleImage = pettanr.image.createReversibleImage(
	3597	+ [ pettanr.CONST.RESOURCE_PICTURE_PATH, _rPicture.id, '.', _rPicture.ext ].join(''),
	3598	+ this.flipH * this.w, this.flipV * this.h
	3599	+ );
	3600	+ if( this.reversibleImage !== null ){
	3601	+ this.$.children( this.reversibleImage.elm ).replaceWith( _reversibleImage.elm );
	3602	+ this.reversibleImage.destroy();
	3603	+ } else {
	3604	+ this.$.append( _reversibleImage.elm );
	3605	+ };
	3606	+ this.reversibleImage = _reversibleImage;
	3607	+ },
	3608	+ _flipReversibleImage : function(){
	3609	+ this.reversibleImage && this.reversibleImage.resize( this.flipH * this.w, this.flipV * this.h );
	3610	+ }
	3611	+ }
	3612	+ );
	3613	+
	3614	+
3642	3615	/*
3643	3616	* / ImageElementClass
3644	3617	* --------------------------------------------------------------------------------------------

		@@ -3665,95 +3638,87 @@ var Editor = gOS.registerApplication( function(){
3665	3638	return UA.isIE === true && UA.ieRenderingVersion < 8 ? _OLD_IE : _MODERN;
3666	3639	})();
3667	3640
3668		- var JQ_WRAPPER = jqTextElementOrigin.clone( true ),
3669		- elmText = JQ_WRAPPER.find( 'td,.speach-inner' ).get( 0 ),
3670		- type = data.balloon_template_id,
3671		- text = ( function(){
3672		- var _speachs = data.speeches_attributes;
3673		- for( var k in _speachs ){
3674		- return _speachs[ k ].content \|\| '';
3675		- }
3676		- return '';
3677		- })(),
3678		- balloon = pettanr.balloon.createBalloon( data.width, data.height, data.tail, type ),
3679		- x, y, w, h, a,
3680		- self = this;
3681		-
3682		- JQ_WRAPPER.find( 'img' ).eq( 0 ).replaceWith( balloon.elm );
3683		-
3684		- function updateType( _type ){
3685		- if( type !== _type ){
3686		- type = _type \|\| type;
3687		- balloon.type( type );
3688		- };
3689		- };
3690		- function updateAngle( _a ){
3691		- if( _a !== undefined && a !== _a ){
3692		- a = _a !== undefined ? _a : a;
3693		- balloon.angle( a );
3694		- };
3695		- };
3696		- /* history */
3697		- function updateText( _text ){
3698		- text = _text \|\| text \|\| '';
3699		- elmText.firstChild.data = text;
3700		- };
3701		- function resizeBalloon(){
3702		- balloon && balloon.resize( a, w, h );
3703		- };
	3641	+ this.$ = jqTextElementOrigin.clone( true );
	3642	+ this.data = data;
	3643	+ this.elmText = this.$.find( 'td,.speach-inner' ).get( 0 );
	3644	+ this.type = data.balloon_template_id;
	3645	+ this.content = ( function(){
	3646	+ var _speachs = data.speeches_attributes;
	3647	+ for( var k in _speachs ){
	3648	+ return _speachs[ k ].content \|\| '';
	3649	+ }
	3650	+ return '';
	3651	+ })();
	3652	+ this.balloon = pettanr.balloon.createBalloon( data.width, data.height, data.tail, this.type );
	3653	+ this.z = data.z;
	3654	+ this.timing = data.t \|\| PANEL_ELEMENT_ARRAY.length + 1;
3704	3655
3705		- /* global methods */
3706		- this.$ = JQ_WRAPPER;
3707		- //this.x = x;
3708		- //this.y = y;
3709		- //this.w = w;
3710		- //this.h = h;
3711		- this.z = data.z;
3712		- this.timing = data.t \|\| PANEL_ELEMENT_ARRAY.length + 1;
3713		- this.init = function(){
3714		- updateText();
3715		- self.resize( data.x, data.y, data.width, data.height, data.tail );
3716		- delete self.init;
3717		- };
3718		- this.angle = function( _a ){
3719		- _a !== undefined && self.resize( x, y, w, h, _a );
3720		- return a;
3721		- };
3722		- this.text = function( _text ){
3723		- if( _text && text !== _text) {
3724		- HISTORY_CONTROL.saveState( updateText, text \|\| '', _text );
3725		- updateText( _text );
	3656	+ this.$.find( 'img' ).eq( 0 ).replaceWith( this.balloon.elm );
	3657	+ };
	3658	+ TextElementClass.prototype = Util.extend(
	3659	+ new AbstractPanelElement( PANEL_ELEMENT_TYPE_TEXT ),
	3660	+ {
	3661	+ init : function(){
	3662	+ this._updateText();
	3663	+ this.resize( this.data.x, this.data.y, this.data.width, this.data.height, this.data.tail );
	3664	+ this.init = null;
	3665	+ },
	3666	+ _updateType : function( _type ){
	3667	+ if( this.type !== _type ){
	3668	+ this.type = _type \|\| this.type;
	3669	+ this.balloon.type( this.type );
	3670	+ };
	3671	+ },
	3672	+ _updateAngle : function( _a ){
	3673	+ if( _a !== undefined && a !== _a ){
	3674	+ this.a = _a !== undefined ? _a : this.a;
	3675	+ this.balloon.angle( this.a );
	3676	+ };
	3677	+ },
	3678	+ /* history */
	3679	+ _updateText : function( _text ){
	3680	+ this.content = _text \|\| this.content \|\| '';
	3681	+ this.elmText.firstChild.data = this.content;
	3682	+ },
	3683	+ _resizeBalloon : function(){
	3684	+ this.balloon && this.balloon.resize( this.a, this.w, this.h );
	3685	+ },
	3686	+ angle : function( _a ){
	3687	+ _a !== undefined && this.resize( this.x, this.y, this.w, this.h, _a );
	3688	+ return this.a;
	3689	+ },
	3690	+ text : function( _text ){
	3691	+ if( _text && this.content !== _text ){
	3692	+ HISTORY_CONTROL.saveState( this._updateText, this.content \|\| '', _text, this );
	3693	+ this._updateText( _text );
	3694	+ };
	3695	+ return this.content;
	3696	+ },
	3697	+ resize : function( x, y, w, h, a, animate ){
	3698	+ this.x = x = x !== undefined ? x : this.x;
	3699	+ this.y = y = y !== undefined ? y : this.y;
	3700	+ this.w = w = w !== undefined ? w : this.w;
	3701	+ this.h = h = h !== undefined ? h : this.h;
	3702	+ this.a = a !== undefined ? a : this.a;
	3703	+
	3704	+ this.$[ animate === true ? 'animate' : 'css']( {
	3705	+ left: x,
	3706	+ top: y,
	3707	+ width: w,
	3708	+ height: h
	3709	+ }, 250/, resizeBalloon /
	3710	+ );
	3711	+ /animate !== true && / this._resizeBalloon();
	3712	+ },
	3713	+ animate : function ( _x, _y, _w, _h, _a ){
	3714	+ this.resize( _x, _y, _w, _h, _a, true );
	3715	+ },
	3716	+ destroy : function(){
	3717	+ this.$.stop().remove();
	3718	+ this.balloon.destroy();
3726	3719	}
3727		- return text;
3728		- };
3729		- this.resize = function( _x, _y, _w, _h, _a, animate ){
3730		- self.x = x = _x !== undefined ? _x : x;
3731		- self.y = y = _y !== undefined ? _y : y;
3732		- self.w = w = _w !== undefined ? _w : w;
3733		- self.h = h = _h !== undefined ? _h : h;
3734		- a = _a !== undefined ? _a : a;
3735		-
3736		- JQ_WRAPPER[ animate === true ? 'animate' : 'css']( {
3737		- left: x,
3738		- top: y,
3739		- width: w,
3740		- height: h
3741		- }, 250, resizeBalloon
3742		- );
3743		- animate !== true && resizeBalloon();
3744		- };
3745		- this.animate = function ( _x, _y, _w, _h, _a ){
3746		- self.resize( _x, _y, _w, _h, _a, true );
3747		- };
3748		- this.destroy = function(){
3749		- delete self.destroy;
3750		-
3751		- JQ_WRAPPER.stop().remove();
3752		- balloon.destroy();
3753		- JQ_WRAPPER = elmText = data = balloon = self = null;
3754		- };
3755		- }
3756		- TextElementClass.prototype = new AbstractPanelElement( PANEL_ELEMENT_TYPE_TEXT );
	3720	+ }
	3721	+ );
3757	3722
3758	3723	/* --------------------------------------------------------------------------------------------
3759	3724	* PANEL_ELEMENT_CONTROL

		@@ -3786,7 +3751,7 @@ var Editor = gOS.registerApplication( function(){
3786	3751	* 1. remove
3787	3752	* 2. renumber z
3788	3753	*/
3789		- function appendPanelElement( _panelElement ) {
	3754	+ function appendPanelElement( _panelElement ){
3790	3755	var z = Type.isFinite( _panelElement.z ) === true ? _panelElement.z : -1,
3791	3756	l = PANEL_ELEMENT_ARRAY.length,
3792	3757	_jqElm = _panelElement.$.stop().css( {

		@@ -3850,10 +3815,9 @@ var Editor = gOS.registerApplication( function(){
3850	3815	},
3851	3816	close: function(){
3852	3817	var _comicElm;
3853		- while( PANEL_ELEMENT_ARRAY.length > 0 ){
3854		- _comicElm = PANEL_ELEMENT_ARRAY.shift();
3855		- _comicElm.destroy && _comicElm.destroy();
3856		- }
	3818	+ while( _comicElm = PANEL_ELEMENT_ARRAY.shift() ){
	3819	+ _comicElm.destroy();
	3820	+ };
3857	3821	},
3858	3822	remove: function( _panelElement ){
3859	3823	var l = PANEL_ELEMENT_ARRAY.length;

		@@ -3883,7 +3847,7 @@ var Editor = gOS.registerApplication( function(){
3883	3847	i = j;
3884	3848	break;
3885	3849	};
3886		- }
	3850	+ };
3887	3851	if( i === -1) return false;
3888	3852	if( goForward === true ){
3889	3853	if( i === 0 ) return false;

		@@ -3893,7 +3857,7 @@ var Editor = gOS.registerApplication( function(){
3893	3857	if( i === l - 1 ) return false;
3894	3858	PANEL_ELEMENT_ARRAY.splice( i, 1 );
3895	3859	PANEL_ELEMENT_ARRAY.splice( i + 1, 0, _panelElement );
3896		- }
	3860	+ };
3897	3861	renumber( true );
3898	3862	return true;
3899	3863	},

		@@ -3934,7 +3898,7 @@ var Editor = gOS.registerApplication( function(){
3934	3898	};
3935	3899	if( _elm.hitTest( _x, _y ) === true ){
3936	3900	_elm.mousemove( _x, _y ); // cursor
3937		- return true;
	3901	+ return false;
3938	3902	};
3939	3903	};
3940	3904	for( i = 0; i < l; ++i ){

		@@ -3943,7 +3907,7 @@ var Editor = gOS.registerApplication( function(){
3943	3907	if( _elm.hitTest( _x, _y ) === true ){
3944	3908	_elm.mousemove( _x, _y ); // cursor
3945	3909	currentElement = _elm;
3946		- return true;
	3910	+ return false;
3947	3911	};
3948	3912	};
3949	3913	currentElement = null;

		@@ -3975,7 +3939,7 @@ var Editor = gOS.registerApplication( function(){
3975	3939	PremiumSatge.boot( 1, PANEL_ELEMENT_CONTROL.onImageSelect );
3976	3940	} else {
3977	3941	PANEL_ELEMENT_CONTROL.onImageSelect( data, true );
3978		- }
	3942	+ };
3979	3943	},
3980	3944	onImageSelect: function( data, isPanelPictureData ){
3981	3945	var _panelElement;

		@@ -3996,7 +3960,7 @@ var Editor = gOS.registerApplication( function(){
3996	3960	_panelElement = new ImageElementClass( data );
3997	3961	_panelElement.init();
3998	3962	appendPanelElement( _panelElement );
3999		- }
	3963	+ };
4000	3964	HISTORY_CONTROL.saveState( PANEL_ELEMENT_CONTROL.restore, [ false, _panelElement], [ true, _panelElement ], true );
4001	3965	},
4002	3966	createTextElement: function( data ){

		@@ -4017,7 +3981,7 @@ var Editor = gOS.registerApplication( function(){
4017	3981	content: 'Hello'
4018	3982	}
4019	3983	}
4020		- }
	3984	+ };
4021	3985	_panelElement = new TextElementClass( data );
4022	3986	_panelElement.init();
4023	3987	TextEditor.boot( PANEL_CONTROL.x, PANEL_CONTROL.y, _panelElement, onTextInput );

		@@ -4025,7 +3989,7 @@ var Editor = gOS.registerApplication( function(){
4025	3989	_panelElement = new TextElementClass( data );
4026	3990	_panelElement.init();
4027	3991	onTextInput( _panelElement );
4028		- }
	3992	+ };
4029	3993	}
4030	3994	};
4031	3995	})();

		@@ -4056,42 +4020,90 @@ var Editor = gOS.registerApplication( function(){
4056	4020	'<div id="panel-tools-container">',
4057	4021	'<div id="panel-resizer-top">▲</div>',
4058	4022	'<div id="panel-resizer-bottom">▼</div>',
4059		- '<div id="comic-element-resizer-container">',
4060		- '<div class="comic-element-resizer" id="comic-element-resizer-top"></div>',
4061		- '<div class="comic-element-resizer" id="comic-element-resizer-left"></div>',
4062		- '<div class="comic-element-resizer" id="comic-element-resizer-right"></div>',
4063		- '<div class="comic-element-resizer" id="comic-element-resizer-bottom"></div>',
4064		- '<div class="comic-element-resizer" id="comic-element-resizer-top-left"></div>',
4065		- '<div class="comic-element-resizer" id="comic-element-resizer-top-right"></div>',
4066		- '<div class="comic-element-resizer" id="comic-element-resizer-bottom-left"></div>',
4067		- '<div class="comic-element-resizer" id="comic-element-resizer-bottom-right"></div>',
4068		- '<div id="balloon-tail-mover"></div>',
4069		- '<div id="comic-element-consol-wrapper">',
4070		- '<div id="comic-element-consol-tail"></div>',
4071		- '<div id="comic-element-consol-wrapper-when-out">',
4072		- '<div id="image-element-consol">',
4073		- '<div id="change-image-button"></div>',
4074		- '<div id="layer-back-button"></div>',
4075		- '<div id="delete-image-button"></div>',
4076		- '<div id="layer-forward-button"></div>',
	4023	+ '</div>',
	4024	+ '<div id="window-container"></div>',
	4025	+ '<div id="comic-element-resizer-container">',
	4026	+ '<div id="balloon-tail-mover"></div>',
	4027	+ '<div id="comic-element-consol-wrapper">',
	4028	+ '<div id="comic-element-consol-container" class="clearfix">',
	4029	+ '<div class="comic-element-consol-item">',
	4030	+ '<div id="comic-element-x">',
	4031	+ '<span class="comic-element-attribute-label">x:</span>',
	4032	+ '<span id="comic-element-x-value" class="comic-element-attribute-value editable-value">0</span>',
	4033	+ '</div>',
	4034	+ '<div id="comic-element-y">',
	4035	+ '<span class="comic-element-attribute-label">y:</span>',
	4036	+ '<span id="comic-element-y-value" class="comic-element-attribute-value editable-value">0</span>',
	4037	+ '</div>',
	4038	+ '</div>',
	4039	+ '<div class="comic-element-consol-item">',
	4040	+ '<div id="comic-element-z">',
	4041	+ '<span class="comic-element-attribute-label">z:</span>',
	4042	+ '<span id="comic-element-z-value" class="comic-element-attribute-value editable-value">0</span>',
	4043	+ '</div>',
	4044	+ '<div id="comic-element-a">',
	4045	+ '<span id="comic-element-a-value" class="comic-element-attribute-value editable-value">0</span>',
	4046	+ '<span class="comic-element-attribute-label">°</span>',
	4047	+ '</div>',
	4048	+ '</div>',
	4049	+ '<div class="comic-element-consol-item">',
	4050	+ '<div id="comic-element-w">',
	4051	+ '<span class="comic-element-attribute-label">w:</span>',
	4052	+ '<span id="comic-element-w-value" class="comic-element-attribute-value editable-value">0</span>',
	4053	+ '</div>',
	4054	+ '<div id="comic-element-h">',
	4055	+ '<span class="comic-element-attribute-label">h:</span>',
	4056	+ '<span id="comic-element-h-value" class="comic-element-attribute-value editable-value">0</span>',
	4057	+ '</div>',
	4058	+ '</div>',
	4059	+ '<div class="comic-element-consol-item">',
	4060	+ '<!-- <div id="comic-element-keep-aspect"></div> -->',
	4061	+ '<div id="comic-element-w-percent">',
	4062	+ '<span id="comic-element-w-percent-value" class="comic-element-attribute-value editable-value">0</span>',
	4063	+ '<span class="comic-element-attribute-label">%</span>',
4077	4064	'</div>',
4078		- '<div id="text-element-consol">',
4079		- '<div id="edit-text-button"></div>',
4080		- '<div id="change-text-style-button"></div>',
4081		- '<div id="back-text-button"></div>',
4082		- '<div id="delete-text-button"></div>',
4083		- '<div id="hide-text-tail-button"></div>',
4084		- '<div id="forward-text-button"></div>',
	4065	+ '<div class="comic-element-consol-item" id="comic-element-h-percent">',
	4066	+ '<span id="comic-element-h-percent-value" class="comic-element-attribute-value editable-value">0</span>',
	4067	+ '<span class="comic-element-attribute-label">%</span>',
4085	4068	'</div>',
4086	4069	'</div>',
	4070	+ '<div class="comic-element-consol-item-small">',
	4071	+ '<div class="button" id="change-image-button">change</div>',
	4072	+ '</div>',
	4073	+ '<div class="comic-element-consol-item-small">',
	4074	+ '<div class="button" id="layer-back-button">back</div>',
	4075	+ '</div>',
	4076	+ '<div class="comic-element-consol-item-small">',
	4077	+ '<div class="button" id="delete-button">delete</div>',
	4078	+ '</div>',
	4079	+ '<div class="comic-element-consol-item-small">',
	4080	+ '<div class="button" id="layer-forward-button">forward</div>',
	4081	+ '</div>',
	4082	+ '<div class="comic-element-consol-item-small">',
	4083	+ '<div class="button" id="edit-text-button">edit</div>',
	4084	+ '</div>',
	4085	+ '<!-- <div class="comic-element-consol-item-small">',
	4086	+ '<div class="button" id="hide-text-tail-button">tail</div>',
	4087	+ '</div> -->',
4087	4088	'</div>',
4088		- '</div>',
	4089	+ '</div>',
	4090	+ '<div class="comic-element-resizer" id="comic-element-resizer-top"></div>',
	4091	+ '<div class="comic-element-resizer" id="comic-element-resizer-left"></div>',
	4092	+ '<div class="comic-element-resizer" id="comic-element-resizer-right"></div>',
	4093	+ '<div class="comic-element-resizer" id="comic-element-resizer-bottom"></div>',
	4094	+ '<div class="comic-element-resizer" id="comic-element-resizer-top-left"></div>',
	4095	+ '<div class="comic-element-resizer" id="comic-element-resizer-top-right"></div>',
	4096	+ '<div class="comic-element-resizer" id="comic-element-resizer-bottom-left"></div>',
	4097	+ '<div class="comic-element-resizer" id="comic-element-resizer-bottom-right"></div>',
	4098	+ '<div id="comic-element-consol-pushout-wrapper">',
	4099	+ '<div id="comic-element-consol-pushout-tail"></div>',
	4100	+ '</div>',
4089	4101	'</div>',
4090		- '<div id="window-container"></div>',
4091	4102	'<div id="menu-bar"></div>',
4092	4103
4093	4104	'<div id="templete-container" style="display: none;">',
4094	4105
	4106	+
4095	4107	'<div id="imgElementTemplete" class="comic-element-wrapper image-element"></div>',
4096	4108
4097	4109	'<div id="textElementTemplete" class="comic-element-wrapper text-element">',

		@@ -4136,42 +4148,6 @@ var Editor = gOS.registerApplication( function(){
4136	4148	'<div id="bg-pattern-repeat-x"></div>',
4137	4149	'<div id="bg-pattern-repeat-y"></div> -->',
4138	4150	'</div>',
4139		-
4140		- '<div id="comic-element-infomation">',
4141		- '<div id="comic-element-x">',
4142		- '<span class="comic-element-attribute-label">x:</span>',
4143		- '<span id="comic-element-x-value" class="comic-element-attribute-value editable-value">0</span>',
4144		- '</div>',
4145		- '<div id="comic-element-y">',
4146		- '<span class="comic-element-attribute-label">y:</span>',
4147		- '<span id="comic-element-y-value" class="comic-element-attribute-value editable-value">0</span>',
4148		- '</div>',
4149		- '<div id="comic-element-z">',
4150		- '<span class="comic-element-attribute-label">z:</span>',
4151		- '<span id="comic-element-z-value" class="comic-element-attribute-value editable-value">0</span>',
4152		- '</div>',
4153		- '<div id="comic-element-a">',
4154		- '<span id="comic-element-a-value" class="comic-element-attribute-value editable-value">0</span>',
4155		- '<span class="comic-element-attribute-label">°</span>',
4156		- '</div>',
4157		- '<div id="comic-element-w">',
4158		- '<span class="comic-element-attribute-label">w:</span>',
4159		- '<span id="comic-element-w-value" class="comic-element-attribute-value editable-value">0</span>',
4160		- '</div>',
4161		- '<div id="comic-element-h">',
4162		- '<span class="comic-element-attribute-label">h:</span>',
4163		- '<span id="comic-element-h-value" class="comic-element-attribute-value editable-value">0</span>',
4164		- '</div>',
4165		- '<div id="comic-element-w-percent">',
4166		- '<span id="comic-element-w-percent-value" class="comic-element-attribute-value editable-value">0</span>',
4167		- '<span class="comic-element-attribute-label">%</span>',
4168		- '</div>',
4169		- '<div id="comic-element-h-percent">',
4170		- '<span id="comic-element-h-percent-value" class="comic-element-attribute-value editable-value">0</span>',
4171		- '<span class="comic-element-attribute-label">%</span>',
4172		- '</div>',
4173		- '<div id="comic-element-keep-aspect"></div>',
4174		- '</div>',
4175	4151	'</div>',
4176	4152
4177	4153	'<div id="toolbox-window">',

		@@ -4781,7 +4757,7 @@ var Model = ( function(){
4781	4757	isXHTML !== true ? '>' : ' \/>'
4782	4758	].join( '');
4783	4759	} else {
4784		- url = pettanr.balloon.getBalloonUrl( _panelElement.w, _panelElement.h, _panelElement.angle() );
	4760	+ url = pettanr.balloon.getBalloonUrl( _panelElement.w, _panelElement.h, _panelElement.a );
4785	4761	return [
4786	4762	'<img ',
4787	4763	'src="', isAbsoluteUrl !== true ? url : Util.getAbsolutePath( url ), '" ',

		@@ -4800,7 +4776,7 @@ var Model = ( function(){
4800	4776	'width:', _panelElement.w, 'px;',
4801	4777	'height:', _panelElement.h, 'px;',
4802	4778	'z-index:', _panelElement.z,
4803		- '"><span>', _panelElement.text(), '<\/span>', '<\/div>'
	4779	+ '"><span>', _panelElement.content, '<\/span>', '<\/div>'
4804	4780
4805	4781	].join( '');
4806	4782	};

		@@ -4816,8 +4792,8 @@ var Model = ( function(){
4816	4792	'"x": ', _imageElement.x, ',', cr,
4817	4793	'"y": ', _imageElement.y, ',', cr,
4818	4794	'"z": ', _imageElement.z, ',', cr,
4819		- '"width": ', _imageElement.flipH() * _imageElement.w, ',', cr,
4820		- '"height": ', _imageElement.flipV() * _imageElement.h, ',', cr,
	4795	+ '"width": ', _imageElement.flipH * _imageElement.w, ',', cr,
	4796	+ '"height": ', _imageElement.flipV * _imageElement.h, ',', cr,
4821	4797	'"t": ', timing, cr,
4822	4798	'}'
4823	4799	].join( '');

		@@ -4831,8 +4807,8 @@ var Model = ( function(){
4831	4807	'"y": ', _imageElement.y, ',', cr,
4832	4808	'"z": ', _imageElement.z + 1, ',', cr,
4833	4809	'"t": ', _timing, ',', cr,
4834		- '"width": ', _imageElement.flipH() * _imageElement.w, ',', cr,
4835		- '"height": ', _imageElement.flipV() * _imageElement.h, cr,
	4810	+ '"width": ', _imageElement.flipH * _imageElement.w, ',', cr,
	4811	+ '"height": ', _imageElement.flipV * _imageElement.h, cr,
4836	4812	'}'
4837	4813	].join( '');
4838	4814	};

		@@ -4844,7 +4820,7 @@ var Model = ( function(){
4844	4820	'"balloon_template_id": ', 1, ',', cr,
4845	4821	'"system_picture_id": ', 1, ',', cr,
4846	4822	'"size": ', 1, ',', cr,
4847		- '"tail": ', _textElement.angle(), ',', cr,
	4823	+ '"tail": ', _textElement.a, ',', cr,
4848	4824	'"x": ', _textElement.x, ',', cr,
4849	4825	'"y": ', _textElement.y, ',', cr,
4850	4826	'"z": ', _textElement.z + 1, ',', cr,

		@@ -4853,7 +4829,7 @@ var Model = ( function(){
4853	4829	'"height": ', _textElement.h, ',', cr,
4854	4830	'"speeches_attributes": {', cr,
4855	4831	'"newf', timing, '": {', cr,
4856		- '"content": "', _textElement.text(), '",', cr,
	4832	+ '"content": "', _textElement.content, '",', cr,
4857	4833	'"x": ', _textElement.x, ',', cr,
4858	4834	'"y": ', _textElement.y, ',', cr,
4859	4835	'"t": ', timing, ',', cr,

--- a/0.5.x/javascripts/system.js

+++ b/0.5.x/javascripts/system.js

		@@ -1,6 +1,6 @@
1	1	/*
2	2	* pettanR system.js
3		- * version 0.5.22
	3	+ * version 0.5.23
4	4	*
5	5	* gadgetOS
6	6	* author:

		@@ -1185,9 +1185,9 @@ AbstractApplication.prototype = {
1185	1185	var list = ApplicationPrivateData.list;
1186	1186	list.splice( Util.getIndex( list, data ), 1 );
1187	1187	},
1188		- createUIGroup : function(){
	1188	+ createUIGroup : function( node ){
1189	1189	var data = ApplicationPrivateData.get( this ),
1190		- ui = UI.createUIGroup( this );
	1190	+ ui = UI.createUIGroup( this, node );
1191	1191	if( data.uiList === null ) data.uiList = [];
1192	1192	data.uiList.push( ui );
1193	1193	return ui;

		@@ -1367,6 +1367,9 @@ var PointingDeviceEventTree = ( function(){
1367	1367	mesure : function(){
1368	1368	NodePrivateData.get( this ).mesure();
1369	1369	},
	1370	+ mesureChildren : function(){
	1371	+ NodePrivateData.get( this ).mesureChildren();
	1372	+ },
1370	1373	update : function( x, y, w, h ){
1371	1374	NodePrivateData.get( this ).update( x, y, w, h );
1372	1375	},

		@@ -1474,7 +1477,7 @@ var PointingDeviceEventTree = ( function(){
1474	1477	this.node = node;
1475	1478	this.through = through;
1476	1479	this.clip = !!clip;
1477		- this._cursor = cursor;
	1480	+ if( cursor ) this._cursor = cursor;
1478	1481
1479	1482	if( Type.isHTMLElement( rangeOrElm ) === true ){
1480	1483	this.elm = rangeOrElm;

		@@ -1490,7 +1493,7 @@ var PointingDeviceEventTree = ( function(){
1490	1493	NodePrivateData.dataList.push( this );
1491	1494	},
1492	1495	mesure : function(){
1493		- var x, y, w, h, _this, _parent;
	1496	+ var x, y, w, h, parent, _this, _parent;
1494	1497	if( this.elm ){
1495	1498	w = this.elm.offsetWidth;
1496	1499	h = this.elm.offsetHeight;

		@@ -1504,12 +1507,22 @@ var PointingDeviceEventTree = ( function(){
1504	1507	this.w = w;
1505	1508	this.h = h;
1506	1509	console.log( ' ---- mesure' + this.elm.id + ' x:' + this.x + ' y:' + this.y + ' w:' + w + ' h:' + h )
	1510	+ parent = this.parentData;
	1511	+ parent && this._updateAbsoluteXY( parent.absoluteX, parent.absoluteY, parent.scrollingX, parent.scrollingY );
1507	1512	this._updateRectangle();
1508	1513	};
1509	1514	} else {
1510	1515	this._updateRectangle();
1511	1516	};
1512	1517	},
	1518	+ mesureChildren : function(){
	1519	+ var nodes, i;
	1520	+ if( nodes = this.childData ){
	1521	+ for( i = nodes.length; i; ){
	1522	+ nodes[ --i ].mesure();
	1523	+ };
	1524	+ };
	1525	+ },
1513	1526	update : function( x, y, w, h ){
1514	1527	var updateXY = false,
1515	1528	_this, _parent,

		@@ -3786,16 +3799,6 @@ var UI = ( function(){
3786	3799
3787	3800	var CLASSNAME_COMBOBOX_OPTION = 'combobox-option',
3788	3801	CLASSNAME_COMBOBOX_OPTION_CURRENT = CLASSNAME_COMBOBOX_OPTION + ' combobox-option-current',
3789		- ELM_A_ORIGIN = ( function(){
3790		- var ret = document.createElement( 'a' );
3791		- ret.href = '#';
3792		- return ret;
3793		- })(),
3794		- ELM_INPUT_TEXT = ( function(){
3795		- var ret = document.createElement( 'input' );
3796		- ret.type = 'text';
3797		- return ret;
3798		- })(),
3799	3802	ELM_COMBOBOX = ( function(){
3800	3803	var ret = document.createElement( 'a' ),
3801	3804	elmToggle = document.createElement( 'span' ),

		@@ -3810,212 +3813,309 @@ var UI = ( function(){
3810	3813	elmValue.appendChild( document.createTextNode( 'null' ));
3811	3814	return ret;
3812	3815	})();
	3816	+
	3817	+ var UIItemPrivateData = function(){};
	3818	+ UIItemPrivateData.prototype = {
	3819	+ groupData : null,
	3820	+ item : null,
	3821	+ elm : null,
	3822	+ node : null,
	3823	+ focus : false,
	3824	+ visible : true,
	3825	+ enabled : true,
	3826	+ value : null,
	3827	+ onUpdate : null,
	3828	+ validator : null,
	3829	+ elmValue : null,
	3830	+ elmBox : null,
	3831	+ elmA : null,
	3832	+ elmToggle : null,
	3833	+ elmValue : null,
	3834	+ selectIndex : 0,
	3835	+ optionList : null,
	3836	+ init : function( groupData, item, elm, value, onUpdate, validator, focus, visible, enabled ){
	3837	+ this.groupData = groupData;
	3838	+ this.item = item;
	3839	+ this.elm = elm;
	3840	+ this.value = value;
	3841	+ this.onUpdate = onUpdate;
	3842	+ this.validator = validator;
	3843	+ this.focus = !!focus;
	3844	+ this.visible = !!visible;
	3845	+ this.enabled = !!enabled;
	3846	+ UIItemPrivateData.list.push( this );
	3847	+ },
	3848	+ destroy : function(){
	3849	+ var list = UIItemPrivateData.list;
	3850	+ list.splice( Util.getIndex( list, this ), 1 );
	3851	+
	3852	+ this.node && this.node.remove();
	3853	+ }
	3854	+ };
	3855	+ UIItemPrivateData.list = [];
	3856	+ UIItemPrivateData.get = function( item ){
	3857	+ var list = UIItemPrivateData.list;
	3858	+ for( i = list.length; i; ){
	3859	+ if( list[ --i ].item === item ) return list[ i ];
	3860	+ };
	3861	+ return null;
	3862	+ };
	3863	+
	3864	+/* --------------------------------
	3865	+ * TextInputManager
	3866	+ */
	3867	+ var TextInputManager = ( function(){
	3868	+ var elmInput = ( function(){
	3869	+ var ret = document.createElement( 'input' );
	3870	+ ret.type = 'text';
	3871	+ ret.id = 'ui-textinput';
	3872	+ return ret;
	3873	+ })();
3813	3874
3814		- var InputTextClass = function( apiuser, uiGroup, elmWrapper, elmValue, onUpdate, validater ){
3815		- var elmA = ELM_A_ORIGIN.cloneNode( true ),
3816		- instance = this,
3817		- focus = false,
3818		- visible = true,
3819		- enabled = true,
3820		- value = elmValue.innerHTML;
3821		- elmValue.innerHTML = '';
3822		- elmValue.className += ' editable-text';
3823		- elmValue.appendChild( elmA );
3824		-
3825		- this.value = function( _value ){
3826		- if( Type.isString( _value ) === true \|\| Type.isNumber( _value ) === true ){
3827		- value = '' + _value;
3828		- elmA.innerHTML = '' + _value;
3829		- if( focus === true ){
3830		- ELM_INPUT_TEXT.value = '' + value;
3831		- };
3832		- };
3833		- focus === true && instance.blur();
3834		- return value;
	3875	+ return {
	3876	+ show: function( data ){
	3877	+ // this.groupData.node.addEventListener( 'mouseout' );
	3878	+ var p = Position.cumulativeOffset( data.elmValue ),
	3879	+ w = data.elmValue.offsetWidth - 2,
	3880	+ _w;
	3881	+ elmInput.style.cssText = [
	3882	+ 'left:', p[ 0 ], 'px;',
	3883	+ 'top:', p[ 1 ], 'px;',//,
	3884	+ 'width:', w, 'px;'//,
	3885	+ //'height:', data.elmValue.offsetHeight, 'px;',
	3886	+ //'position:absolute;'
	3887	+ ].join( '' );
	3888	+ elmInput.value = data.value;
	3889	+ body.appendChild( elmInput );
	3890	+ _w = elmInput.offsetWidth;
	3891	+ if( w !== _w ) elmInput.style.width = ( w - ( _w - w ) ) + 'px;';
	3892	+
	3893	+ elmInput.focus();
	3894	+ elmInput.select();
	3895	+ },
	3896	+ hide : function( data ){
	3897	+ body.removeChild( elmInput );
	3898	+ var ret = elmInput.value;
	3899	+ elmInput.value = '';
	3900	+ return ret;
	3901	+ },
	3902	+ update : function( data ){
	3903	+ elmInput.value = data.value;
	3904	+ }
3835	3905	};
3836		- this.focus = function( e ){
3837		- focus = true;
3838		- start( apiuser, uiGroup, instance );
3839		- elmA.style.display = 'none';
3840		-
3841		- elmValue.appendChild( ELM_INPUT_TEXT );
3842		- ELM_INPUT_TEXT.value = value;
3843		- ELM_INPUT_TEXT.focus();
3844		- ELM_INPUT_TEXT.select();
3845		-
	3906	+ })();
	3907	+
	3908	+ var InputTextClass = function( groupData, elmWrapper, elmValue, onUpdate, validater ){
	3909	+ var data = new UIItemPrivateData();
	3910	+ data.init( groupData, this, elmWrapper, elmValue.innerHTML, onUpdate, validater, false, true, true );
	3911	+ Util.addClass( elmValue, 'editable-text' );
	3912	+ data.elmValue = elmValue;
	3913	+ this.value( data.value );
	3914	+ data.node = groupData.node.createNode( elmWrapper, false, true, 'ui-inpittext-hover', 'pointer' );
	3915	+ data.node.addEventListener( 'click', this.focus, this );
	3916	+ //MouseEvent.add( groupData.apiuser, elmWrapper, 'click', instance.focus );
	3917	+ };
	3918	+ InputTextClass.prototype = {
	3919	+ value : function( value ){
	3920	+ var data = UIItemPrivateData.get( this );
	3921	+ if( Type.isString( value ) === true \|\| Type.isNumber( value ) === true ){
	3922	+ data.elmValue.innerHTML = data.value = '' + value;
	3923	+ data.focus === true && TextInputManager.update( data );
	3924	+ };
	3925	+ data.focus === true && this.blur();
	3926	+ return data.value;
	3927	+ },
	3928	+ focus : function( e ){
	3929	+ var data = UIItemPrivateData.get( this );
	3930	+ data.focus = true;
	3931	+ start( data );
	3932	+ TextInputManager.show( data );
3846	3933	return false;
3847		- };
3848		- this.blur = function( keep ){
3849		- var _newValue = ELM_INPUT_TEXT.value,
3850		- _validated = Type.isFunction( validater ) === true ? '' + validater( _newValue ) : _newValue;
3851		- _newValue = keep !== 27 ? _validated : value; // 27:ESC
	3934	+ },
	3935	+ blur : function( keep ){
	3936	+ var data = UIItemPrivateData.get( this ),
	3937	+ newValue;
	3938	+ if( data.focus === false ) return;
	3939	+ newValue = TextInputManager.hide( data );
	3940	+ newValue = keep !== 27 ? ( data.validater ? '' + data.validater( newValue ) : newValue ) : value; // 27:ESC
3852	3941
3853		- elmValue.removeChild( ELM_INPUT_TEXT );
3854		-
3855		- elmA.innerHTML = _newValue;
3856		- elmA.style.display = 'block';
	3942	+ data.elmValue.innerHTML = newValue;
3857	3943
3858		- onUpdate && _newValue !== value && AsyncCall.add( apiuser, onUpdate, [ _newValue, value ], instance );
	3944	+ data.onUpdate && newValue !== data.value && AsyncCall.add( data.groupData.apiuser, data.onUpdate, [ newValue, data.value ], this );
3859	3945
3860		- value = _newValue;
3861		- focus = false;
3862		- finish( apiuser, uiGroup, instance );
3863		- };
3864		- this.enabled = function(){
3865		- return enabled;
3866		- };
3867		- this.visible = function( _visible ){
	3946	+ data.value = newValue;
	3947	+ data.focus = false;
	3948	+ finish( data );
	3949	+ },
	3950	+ enabled : function(){
	3951	+ var data = UIItemPrivateData.get( this );
	3952	+ return data.enabled;
	3953	+ },
	3954	+ visible : function( _visible ){
	3955	+ var data = UIItemPrivateData.get( this );
3868	3956	if( Type.isBoolean( _visible ) === true ){
3869		- elmWrapper.style.display = _visible ? '' : 'none';
3870		- visible = _visible;
3871		- }
3872		- return visible;
3873		- };
3874		- this.destroy = function(){
3875		- if( focus === true ){
3876		- elmValue.removeChild( ELM_INPUT_TEXT );
3877		- }
3878		- MouseEvent.remove( apiuser, elmWrapper );
3879		-
3880		- apiuser = uiGroup = elmWrapper = elmValue = elmA = onUpdate = validater = instance = null;
3881		- };
3882		- instance.value( value );
3883		- MouseEvent.add( apiuser, elmWrapper, 'click', instance.focus );
	3957	+ data.elm.style.display = _visible ? '' : 'none';
	3958	+ data.visible = _visible;
	3959	+ };
	3960	+ return data.visible;
	3961	+ },
	3962	+ destroy : function(){
	3963	+ var data = UIItemPrivateData.get( this );
	3964	+ if( data.focus === true ){
	3965	+ data.elmValue.removeChild( ELM_INPUT_TEXT );
	3966	+ };
	3967	+ data.destroy();
	3968	+ }
3884	3969	};
3885	3970
3886		- var ButtonClass = function( apiuser, uiGroup, elmWrapper, onUpdate ){
3887		- var instance = this,
3888		- focus = false,
3889		- visible = true,
3890		- enabled = true;
3891		- MouseEvent.add( apiuser, elmWrapper, 'click', onClick );
3892		-
3893		- function onClick(){
3894		- focus = true;
3895		- // onUpdate();
3896		- AsyncCall.add( apiuser, onUpdate, null, instance );
3897		- return false;
3898		- };
3899		- this.focus = function(){
3900		- focus = true;
3901		- Util.addClass( elmWrapper, 'button-has-focus' );
3902		- start( apiuser, uiGroup, instance );
3903		- };
3904		- this.blur = function( keyCode ){
3905		- keyCode === 13 && onClick();
3906		- Util.removeClass( elmWrapper, 'button-has-focus' );
3907		- focus = false;
3908		- finish( apiuser, uiGroup, instance );
3909		- };
3910		- this.enabled = function( _enabled ){
3911		- if( Type.isBoolean( _enabled ) === true && enabled !== _enabled ){
3912		- _enabled === true ? Util.removeClass( elmWrapper, 'button-disabled' ) : Util.addClass( elmWrapper, 'button-disabled' );
3913		- enabled = _enabled;
	3971	+ var ButtonClass = function( groupData, elmWrapper, onUpdate ){
	3972	+ var data = new UIItemPrivateData();
	3973	+ data.init( groupData, this, elmWrapper, null, onUpdate, null, false, true, true );
	3974	+ data.node = groupData.node.createNode( elmWrapper, false, true, 'ui-inpittext-hover', 'pointer' );
	3975	+ data.node.addEventListener( 'click', onUpdate );
	3976	+ //MouseEvent.add( groupData.apiuser, elmWrapper, 'click', onUpdate );
	3977	+ };
	3978	+ ButtonClass.prototype = {
	3979	+ focus : function(){
	3980	+ var data = UIItemPrivateData.get( this );
	3981	+ data.focus = true;
	3982	+ Util.addClass( data.elm, 'button-has-focus' );
	3983	+ start( data );
	3984	+ },
	3985	+ blur : function( keyCode ){
	3986	+ var data = UIItemPrivateData.get( this );
	3987	+ keyCode === 13 && data.onUpdate && data.onUpdate();
	3988	+ Util.removeClass( data.elm, 'button-has-focus' );
	3989	+ data.focus = false;
	3990	+ finish( data );
	3991	+ },
	3992	+ enabled : function( _enabled ){
	3993	+ var data = UIItemPrivateData.get( this );
	3994	+ if( Type.isBoolean( _enabled ) === true && data.enabled !== _enabled ){
	3995	+ _enabled === true ? Util.removeClass( data.elm, 'button-disabled' ) : Util.addClass( data.elm, 'button-disabled' );
	3996	+ data.enabled = _enabled;
3914	3997	};
3915		- return enabled;
3916		- };
3917		- this.visible = function( _visible ){
	3998	+ return data.enabled;
	3999	+ },
	4000	+ visible : function( _visible ){
	4001	+ var data = UIItemPrivateData.get( this );
3918	4002	if( Type.isBoolean( _visible ) === true ){
3919		- elmWrapper.style.display = _visible ? '' : 'none';
3920		- visible = _visible;
	4003	+ data.elm.style.display = _visible ? '' : 'none';
	4004	+ data.visible = _visible;
3921	4005	};
3922		- return visible;
3923		- };
3924		- this.destroy = function(){
3925		- MouseEvent.remove( apiuser, elmWrapper );
3926		- apiuser = uiGroup = elmWrapper = onUpdate = instance = null;
3927		- };
	4006	+ return data.visible;
	4007	+ },
	4008	+ destroy : function(){
	4009	+ var data = UIItemPrivateData.get( this );
	4010	+ // MouseEvent.remove( data.groupData.apiuser, data.elm );
	4011	+ data.destroy();
	4012	+ }
3928	4013	};
3929	4014
3930		- var ComboBoxClass = function( apiuser, uiGroup, elmWrapper, onUpdate ){
3931		- var elmBox = Util.getElementsByClassName( elmWrapper, 'combobox' )[ 0 ],
3932		- elmA = ELM_COMBOBOX.cloneNode( true ),
3933		- elmToggle = Util.getElementsByClassName( elmA, 'combobox-toggle' )[ 0 ],
3934		- elmValue = Util.getElementsByClassName( elmA, 'combobox-value' )[ 0 ].firstChild,
3935		- index = 0,
3936		- optionList = [],
3937		- instance = this,
3938		- focus = false,
3939		- visible = true,
3940		- enabled = true,
3941		- value;
3942		- elmBox.appendChild( elmA );
	4015	+ var ComboBoxClass = function( groupData, elmWrapper, onUpdate ){
	4016	+ var elmA = ELM_COMBOBOX.cloneNode( true ),
	4017	+ data = new UIItemPrivateData();
	4018	+ data.init( groupData, this, elmWrapper, null, onUpdate, null, false, true, true );
	4019	+
	4020	+ data.elmBox = Util.getElementsByClassName( elmWrapper, 'combobox' )[ 0 ];
	4021	+ data.elmBox.appendChild( elmA );
	4022	+ data.elmA = elmA;
	4023	+ data.elmToggle = Util.getElementsByClassName( elmA, 'combobox-toggle' )[ 0 ];
	4024	+ data.elmValue = Util.getElementsByClassName( elmA, 'combobox-value' )[ 0 ].firstChild;
	4025	+ data.selectIndex = 0;
	4026	+ data.optionList = [];
3943	4027
3944		- this.elm = elmBox;
3945		- this.focus = function( e ){
3946		- MouseEvent.remove( apiuser, elmWrapper, 'click', instance.focus );
3947		- focus = true;
3948		- elmA.className = 'combobox-has-focus';
3949		- start( apiuser, uiGroup, instance );
3950		- OptionControl.show( apiuser, instance, optionList );
	4028	+ data.node = groupData.node.createNode( elmWrapper, false, true, 'ui-inpittext-hover', 'pointer' );
	4029	+ data.node.addEventListener( 'click', this.focus, this );
	4030	+ // MouseEvent.add( groupData.apiuser, data.elm, 'click', this.focus );
	4031	+ };
	4032	+ ComboBoxClass.prototype = {
	4033	+ focus : function( e ){
	4034	+ var data = UIItemPrivateData.get( this );
	4035	+ // MouseEvent.remove( data.groupData.apiuser, data.elm, 'click', this.focus );
	4036	+ data.node.removeEventListener( 'click', this.focus );
	4037	+ data.focus = true;
	4038	+ data.elmA.className = 'combobox-has-focus';
	4039	+ start( data );
	4040	+ OptionControl.show( data.groupData.apiuser, this, data.optionList );
3951	4041	return false;
3952		- };
3953		- this.blur = function( keyCode ){
3954		- OptionControl.hide( instance );
3955		- focus = false;
3956		- elmA.className = '';
3957		- finish( apiuser, uiGroup, instance );
3958		- MouseEvent.add( apiuser, elmWrapper, 'click', instance.focus );
3959		- };
3960		- this.enabled = function(){
3961		- return enabled;
3962		- };
3963		- this.visible = function( _visible ){
	4042	+ },
	4043	+ blur : function( keyCode ){
	4044	+ var data = UIItemPrivateData.get( this );
	4045	+ OptionControl.hide( this );
	4046	+ data.focus = false;
	4047	+ data.elmA.className = '';
	4048	+ finish( data );
	4049	+ data.node.addEventListener( 'click', this.focus, this );
	4050	+ // MouseEvent.add( data.groupData.apiuser, data.elm, 'click', this.focus );
	4051	+ },
	4052	+ enabled : function(){
	4053	+ var data = UIItemPrivateData.get( this );
	4054	+ return data.enabled;
	4055	+ },
	4056	+ visible : function( _visible ){
	4057	+ var data = UIItemPrivateData.get( this );
3964	4058	if( Type.isBoolean( _visible ) === true ){
3965		- elmWrapper.style.display = _visible ? '' : 'none';
3966		- visible = _visible;
	4059	+ data.elm.style.display = _visible ? '' : 'none';
	4060	+ data.visible = _visible;
3967	4061	};
3968		- return visible;
3969		- };
3970		- this.value = function( _value ){
3971		- if( Type.isString( _value ) === true && value !== _value ){
3972		- for( var i=0, l = optionList.length, _option; i<l; ++i ){
3973		- _option = optionList[ i ];
	4062	+ return data.visible;
	4063	+ },
	4064	+ value : function( _value ){
	4065	+ var data = UIItemPrivateData.get( this ),
	4066	+ i = 0,
	4067	+ list = data.optionList,
	4068	+ l = list.length,
	4069	+ _option;
	4070	+ if( Type.isString( _value ) === true && data.value !== _value ){
	4071	+ for( ; i < l; ++i ){
	4072	+ _option = list[ i ];
3974	4073	if( _value === _option.value ){
3975		- value = _value;
3976		- index = i;
3977		- elmValue.data = _option.displayValue;
3978		- if( focus === true ){
3979		- OptionControl.update( instance, _value );
	4074	+ data.value = _value;
	4075	+ data.index = i;
	4076	+ data.elmValue.data = _option.displayValue;
	4077	+ if( data.focus === true ){
	4078	+ OptionControl.update( this, _value );
3980	4079	};
3981		- Type.isFunction( onUpdate ) === true && AsyncCall.add( apiuser, onUpdate, _value, instance );
	4080	+ data.onUpdate && AsyncCall.add( data.groupData.apiuser, data.onUpdate, _value, this );
3982	4081	break;
3983	4082	};
3984	4083	};
3985	4084	};
3986		- return value;
3987		- };
3988		- this.selectIndex = function(){
3989		- return index;
3990		- };
3991		- this.createOption = function( _displayValue, _value, _isSelected ){
3992		- var option = null,
	4085	+ return data.value;
	4086	+ },
	4087	+ selectIndex : function(){
	4088	+ var data = UIItemPrivateData.get( this );
	4089	+ return data.selectIndex;
	4090	+ },
	4091	+ createOption : function( _displayValue, _value, _isSelected ){
	4092	+ var data = UIItemPrivateData.get( this ),
	4093	+ option = null,
	4094	+ list = data.optionList,
	4095	+ i = list.length,
3993	4096	_option, i;
3994	4097	_value = _value \|\| _displayValue;
3995	4098	_isSelected = !!_isSelected;
3996		- for( i = optionList.length; i; ){
3997		- _option = optionList[ --i ];
	4099	+ for( ; i; ){
	4100	+ _option = list[ --i ];
3998	4101	if( _value === _option.value ){
3999	4102	option = _option;
4000	4103	break;
4001	4104	};
4002	4105	};
4003	4106	if( _isSelected === true ){
4004		- index = optionList.length;
4005		- elmValue.data = _displayValue;
	4107	+ data.selectIndex = list.length;
	4108	+ data.elmValue.data = _displayValue;
4006	4109	};
4007		- if( option === null ){
4008		- option = new OptionDataClass( _displayValue, _value, _isSelected );
4009		- optionList.push( option );
4010		- };
4011		- };
4012		- this.destroy = function(){
4013		- instance.blur();
4014		- MouseEvent.remove( apiuser, elmWrapper );
4015		- optionList.length = 0;
4016		- apiuser = uiGroup = elmWrapper = onUpdate = elmBox = elmA = elmToggle = elmValue = optionList = instance = null;
4017		- };
4018		- MouseEvent.add( apiuser, elmWrapper, 'click', instance.focus );
	4110	+ option === null && list.push( new OptionDataClass( _displayValue, _value, _isSelected ) );
	4111	+ },
	4112	+ destroy : function(){
	4113	+ var data = UIItemPrivateData.get( this );
	4114	+ this.blur();
	4115	+ // MouseEvent.remove( data.groupData.apiuser, data.elm );
	4116	+ data.optionList.length = 0;
	4117	+ data.destroy();
	4118	+ }
4019	4119	};
4020	4120	var OptionDataClass = function( displayValue, value, isCurrent ){
4021	4121	this.displayValue = displayValue;

		@@ -4064,10 +4164,13 @@ var UI = ( function(){
4064	4164	};
4065	4165
4066	4166	function onOptionSelect( e ){
4067		- for( var i = 0, l = OPTION_LIST.length, _option; i < l; ++i){
	4167	+ var i = 0,
	4168	+ l = OPTION_LIST.length,
	4169	+ _option;
	4170	+ for( ; i < l; ++i ){
4068	4171	_option = OPTION_LIST[ i ];
4069	4172	if( this === _option.elm ){
4070		- updateCurrrentOption( _option.data.value, true );
	4173	+ updateCurrrentOption( _option.data.value, true );
4071	4174	currentCombobox.blur();
4072	4175	break;
4073	4176	};

		@@ -4083,8 +4186,9 @@ var UI = ( function(){
4083	4186	currentIndex;
4084	4187
4085	4188	function updateCurrrentOption( _value, _updateCombobox ){
4086		- var _option;
4087		- for( var i = OPTION_LIST.length; i; ){
	4189	+ var _option,
	4190	+ i = OPTION_LIST.length;
	4191	+ for( ; i; ){
4088	4192	_option = OPTION_LIST[ --i ];
4089	4193	if( _value === _option.data.value ){
4090	4194	currentOption && currentOption.current( false );

		@@ -4092,7 +4196,6 @@ var UI = ( function(){
4092	4196	currentOption = _option;
4093	4197	currentIndex = i;
4094	4198	_updateCombobox === true && currentCombobox.value( _value );
4095		-
4096	4199	break;
4097	4200	};
4098	4201	};

		@@ -4105,10 +4208,10 @@ var UI = ( function(){
4105	4208	var position = Util.getAbsolutePosition( elm );
4106	4209
4107	4210	ELM_OPTION_WRAPPER.style.cssText = [
4108		- 'width:', elm.offsetWidth - 2, 'px;',
4109		- 'left:', position.x, 'px;',
4110		- 'top:', position.y + elm.offsetHeight, 'px;'
4111		- ].join( '' );
	4211	+ 'width:', elm.offsetWidth - 2, 'px;',
	4212	+ 'left:', position.x, 'px;',
	4213	+ 'top:', position.y + elm.offsetHeight, 'px;'
	4214	+ ].join( '' );
4112	4215	};
4113	4216	function change( e ){
4114	4217	var l = OPTION_LIST.length,

		@@ -4121,16 +4224,20 @@ var UI = ( function(){
4121	4224	return false;
4122	4225	};
4123	4226	return {
4124		- show: function( _apiuser, _combobox, _optionList ){
4125		- if( currentItem !== _combobox \|\| currentCombobox === _combobox ) return;
	4227	+ show: function( data ){
	4228	+ var combobox = data.item,
	4229	+ list = data.optionList,
	4230	+ i = 0,
	4231	+ l = list.length;
	4232	+ if( currentItem !== combobox \|\| currentCombobox === combobox ) return;
4126	4233	currentCombobox && currentCombobox.blur();
4127	4234
4128		- apiuser = _apiuser;
4129		- currentCombobox = _combobox;
4130		- elm = _combobox.elm;
	4235	+ apiuser = data.groupData.apiuser;
	4236	+ currentCombobox = combobox;
	4237	+ elm = data.elmBox;
4131	4238
4132		- for( var i = 0, l = _optionList.length; i<l; ++i ){
4133		- OPTION_LIST.unshift( new OptionClass( _optionList[ i ] ) );
	4239	+ for( ; i < l; ++i ){
	4240	+ OPTION_LIST.unshift( new OptionClass( list[ i ] ) );
4134	4241	};
4135	4242	MouseEvent.add( SUPER_USER_KEY, document, 'mouseup', bodyMouseupHandler );
4136	4243	KeyEvent.add( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, change, 38 );

		@@ -4140,13 +4247,13 @@ var UI = ( function(){
4140	4247
4141	4248	body.appendChild( ELM_OPTION_WRAPPER );
4142	4249
4143		- updateCurrrentOption( _combobox.value(), false );
	4250	+ updateCurrrentOption( combobox.value(), false );
4144	4251	updateWrapperPosition();
4145	4252
4146	4253	SystemTimer.add( SUPER_USER_KEY, updateWrapperPosition, 500 );
4147	4254	},
4148	4255	hide: function( _combobox ){
4149		- if( currentCombobox !== _combobox \|\| currentCombobox === null ) return;
	4256	+ if( currentCombobox !== data.item \|\| currentCombobox === null ) return;
4150	4257
4151	4258	var _option;
4152	4259	while( _option = OPTION_LIST.shift() ){

		@@ -4173,8 +4280,8 @@ var UI = ( function(){
4173	4280	//currentCombobox.blur();
4174	4281	//OptionControl.hide( currentCombobox );
4175	4282	},
4176		- update: function( _combobox, _value ){
4177		- if( currentCombobox !== _combobox \|\| currentItem !== _combobox ) return;
	4283	+ update: function( data, _value ){
	4284	+ if( currentCombobox !== data.item \|\| currentItem !== data.item ) return;
4178	4285	if( currentOption.data.value === _value ) return;
4179	4286	updateCurrrentOption( _value, true );
4180	4287	},

		@@ -4183,13 +4290,42 @@ var UI = ( function(){
4183	4290	}
4184	4291	};
4185	4292	})();
4186		-
4187		- var UIGroupClass = function( apiuser ){
4188		- var self = this,
4189		- itemList = [],
4190		- windowW, windowH;
4191		-
4192		- this.focus = function( _value ){
	4293	+
	4294	+ var UIGroupPrivateData = function(){};
	4295	+ UIGroupPrivateData.prototype = {
	4296	+ apiuser : null,
	4297	+ node : null,
	4298	+ uigroup : null,
	4299	+ itemList : null,
	4300	+ visible : true,
	4301	+ enabled : true,
	4302	+ init : function( apiuser, node, uigroup ){
	4303	+ this.apiuser = apiuser;
	4304	+ this.node = node;
	4305	+ this.uigroup = uigroup;
	4306	+ this.itemList = [];
	4307	+ UIGroupPrivateData.list.push( this );
	4308	+ },
	4309	+ destroy : function(){
	4310	+
	4311	+ }
	4312	+ };
	4313	+ UIGroupPrivateData.list = [];
	4314	+ UIGroupPrivateData.get = function( uigroup ){
	4315	+ var list = UIGroupPrivateData.list,
	4316	+ i = list.length;
	4317	+ for( ; i; ){
	4318	+ if( list[ --i ].uigroup === uigroup ) return list[ i ];
	4319	+ };
	4320	+ return null;
	4321	+ };
	4322	+
	4323	+ var UIGroupClass = function( apiuser, node ){
	4324	+ ( new UIGroupPrivateData() ).init( apiuser, node, this );
	4325	+ };
	4326	+ UIGroupClass.prototype = {
	4327	+ focus : function( _value ){
	4328	+ var data = UIGroupPrivateData.get( this );
4193	4329	/*
4194	4330	if( _value === true ){
4195	4331	if( currentItem ){

		@@ -4203,76 +4339,96 @@ var UI = ( function(){
4203	4339	finish( apiuser, self, currentItem );
4204	4340	} else
4205	4341	*/
4206		- if( _value && Util.getIndex( itemList, _value ) !== -1 ){
	4342	+ if( _value && Util.getIndex( data.itemList, _value ) !== -1 ){
4207	4343	// currentItem = _value;
4208		- currentList = itemList;
	4344	+ currentList = data.itemList;
4209	4345	};
4210		- return currentUi === self;
4211		- };
4212		- this.blur = function(){
4213		- if( currentList === itemList ){
	4346	+ return currentUi === this;
	4347	+ },
	4348	+ blur : function(){
	4349	+ var data = UIGroupPrivateData.get( this );
	4350	+ if( currentList === data.itemList ){
4214	4351	currentList = null;
4215	4352	};
4216		- };
4217		- this.createInputText = function( _elmWrapper, _onUpdate, _validater ){
4218		- var _elmValue = Util.getElementsByClassName( _elmWrapper, 'editable-value' )[ 0 ];
4219		- if( _elmValue ){
4220		- var ret = new InputTextClass( apiuser, self, _elmWrapper, _elmValue, _onUpdate, _validater );
4221		- itemList.push( ret );
	4353	+ },
	4354	+ createInputText : function( elmWrapper, onUpdate, validater ){
	4355	+ var data = UIGroupPrivateData.get( this ),
	4356	+ elmValue = Util.getElementsByClassName( elmWrapper, 'editable-value' )[ 0 ],
	4357	+ ret;
	4358	+ if( elmValue ){
	4359	+ ret = new InputTextClass( data, elmWrapper, elmValue, onUpdate, validater );
	4360	+ data.itemList.push( ret );
4222	4361	return ret;
4223		- }
	4362	+ };
4224	4363	alert( 'error createInputText' );
4225		- };
4226		- this.createButton = function( _elm, _onClick ){
4227		- var ret = new ButtonClass( apiuser, self, _elm, _onClick );
4228		- itemList.push( ret );
	4364	+ },
	4365	+ createButton : function( elm, onClick ){
	4366	+ var data = UIGroupPrivateData.get( this ),
	4367	+ ret = new ButtonClass( data, elm, onClick );
	4368	+ data.itemList.push( ret );
4229	4369	return ret;
4230		- };
4231		- this.createFileInput = function( _elm, _onUpdate, _validater, _elmFileInput ){
4232		- var ret = FileInputClass( apiuser, self, _elm, _onUpdate, _validater, _elmFileInput );
4233		- itemList.push( ret );
	4370	+ },
	4371	+ createFileInput : function( elm, onUpdate, validater, elmFileInput ){
	4372	+ var data = UIGroupPrivateData.get( this ),
	4373	+ ret = new FileInputClass( data, elm, onUpdate, validater, elmFileInput );
	4374	+ data.itemList.push( ret );
4234	4375	return ret;
4235		- };
4236		- this.createCombobox = function( _elm, _onUpdate, _optionList ){
4237		- var ret = new ComboBoxClass( apiuser, self, _elm, _onUpdate, _optionList );
4238		- itemList.push( ret );
	4376	+ },
	4377	+ createCombobox : function( elm, onUpdate, optionList ){
	4378	+ var data = UIGroupPrivateData.get( this ),
	4379	+ ret = new ComboBoxClass( data, elm, onUpdate, optionList );
	4380	+ data.itemList.push( ret );
4239	4381	return ret;
4240		- };
4241		- this.createCheckBox = function(){
	4382	+ },
	4383	+ createCheckBox : function(){
4242	4384
4243		- };
4244		- this.createRadio = function(){
	4385	+ },
	4386	+ createRadio : function(){
4245	4387
4246		- };
4247		- this.createSlider = function(){
	4388	+ },
	4389	+ createSlider : function(){
4248	4390
4249		- };
4250		- this.destroy = function(){
4251		- var _item;
4252		- while( _item = itemList.shift() ){
	4391	+ },
	4392	+ visible : function( v ){
	4393	+ var data = UIGroupPrivateData.get( this );
	4394	+ if( Type.isBoolean( v ) === true && data.visible !== v ){
	4395	+ data.node.disabled( !v );
	4396	+ data.visible = v;
	4397	+ if( v === false && currentUi === this ){
	4398	+ currentItem.blur();
	4399	+ // finish( UIItemPrivateData.get( currentItem ) );
	4400	+ };
	4401	+ };
	4402	+ return data.visible;
	4403	+ },
	4404	+ enabled : function( v ){
	4405	+
	4406	+ },
	4407	+ destroy : function(){
	4408	+ var data = UIGroupPrivateData.get( this ),
	4409	+ _item;
	4410	+ while( _item = data.itemList.shift() ){
4253	4411	_item.destroy();
4254	4412	};
4255	4413	if( currentUi === this ){
4256		- currentItem = null;
4257		- currentUi = null;
4258		- currentUser = null;
4259		- currentList = null;
	4414	+ currentItem.blur();
	4415	+ // finish( UIItemPrivateData.get( currentItem ) );
4260	4416	};
4261		- apiuser = self = null;
4262		- };
	4417	+ data.destroy();
	4418	+ }
4263	4419	};
4264	4420
4265		- function start( _apiuser, _uigroup, _item ){
4266		- if( currentItem !== _item ){
4267		- currentUi !== _uigroup && currentUi && currentUi.blur();
	4421	+ function start( data ){
	4422	+ if( currentItem !== data.item ){
	4423	+ currentUi !== data.groupData.uigroup && currentUi && currentUi.blur();
4268	4424
4269	4425	currentItem !== null && currentItem.blur();
4270	4426
4271		- currentUser = _apiuser;
4272		- currentUi = _uigroup;
4273		- currentItem = _item;
	4427	+ currentUser = data.groupData.apiuser;
	4428	+ currentUi = data.groupData.uigroup;
	4429	+ currentItem = data.item;
4274	4430
4275		- _uigroup.focus( _item );
	4431	+ currentUi.focus( currentItem );
4276	4432
4277	4433	// if( currentUser !== _apiuser ) {
4278	4434	KeyEvent.add( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, onKeyDown, 13 );

		@@ -4282,9 +4438,9 @@ var UI = ( function(){
4282	4438	// };
4283	4439	};
4284	4440	}
4285		- function finish( _apiuser, _uigroup, _item ){
4286		- if( currentItem === _item ){
4287		- _uigroup.blur();
	4441	+ function finish( data ){
	4442	+ if( currentItem === data.item ){
	4443	+ currentUi.blur();
4288	4444
4289	4445	currentUser = null;
4290	4446	currentUi = null;

		@@ -4294,51 +4450,51 @@ var UI = ( function(){
4294	4450	KeyEvent.remove( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, onKeyDown, 13 );
4295	4451	KeyEvent.remove( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, onKeyDown, 27 );
4296	4452	KeyEvent.remove( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, onKeyDown, 9 );
4297		- KeyEvent.updateCurrentListener( _apiuser );
	4453	+ KeyEvent.updateCurrentListener( data.groupData.apiuser );
4298	4454	};
4299	4455	};
4300	4456
4301	4457	function onKeyDown( e ){
4302	4458	if( currentItem === null ) return true;
4303	4459	var keyCode = e.keyCode,
4304		- _index = Util.getIndex( currentList, currentItem );
	4460	+ index = Util.getIndex( currentList, currentItem );
4305	4461	if( keyCode === 13 \|\| keyCode === 27 \|\| keyCode === 9 \|\| keyCode === 18 \|\| e.altKey === true ){ // 13.return 27.esc 9.tab 18.alt
4306		- keyCode === 9 && tabShift( _index, e.shiftKey === true ? -1 : 1 );
	4462	+ keyCode === 9 && tabShift( index, e.shiftKey === true ? -1 : 1 );
4307	4463	keyCode === 13 && currentItem instanceof ComboBoxClass && OptionControl.onEnter();
4308		- keyCode === 13 && tabShift( _index, 1 );
	4464	+ keyCode === 13 && tabShift( index, 1 );
4309	4465	currentItem && currentItem.blur( keyCode );
4310	4466	};
4311	4467	return false;
4312	4468	};
4313	4469
4314		- function tabShift( _index, _way ){
	4470	+ function tabShift( index, way ){
4315	4471	var l = currentList.length,
4316		- i = _index + _way,
4317		- _item;
	4472	+ i = index + way,
	4473	+ item;
4318	4474	if( l < 2 ) return;
4319		- while( i !== _index ){
	4475	+ while( i !== index ){
4320	4476	i = i < 0 ?
4321	4477	l - 1 :
4322	4478	i < l ? i : 0; // 0 < i < l
4323		- _item = currentList[ i ];
4324		- if( _item.enabled() === true && _item.visible() === true ){
4325		- AsyncCall.add( currentUser, _item.focus, null, _item );
	4479	+ item = currentList[ i ];
	4480	+ if( item.enabled() === true && item.visible() === true ){
	4481	+ AsyncCall.add( currentUser, item.focus, null, item );
4326	4482	return;
4327	4483	};
4328		- i += _way;
	4484	+ i += way;
4329	4485	};
4330	4486	};
4331	4487
4332	4488	return {
4333		- createUIGroup: function( _apiuser ){
4334		- var _uid = _apiuser.getUID(),
4335		- _list = UI_LIST[ _uid ],
4336		- _ui = new UIGroupClass( _apiuser );
4337		- if( Type.isArray( _list ) === false ){
4338		- _list = UI_LIST[ _uid ] = [];
4339		- }
4340		- _list.push( _ui );
4341		- return _ui;
	4489	+ createUIGroup: function( apiuser, node ){
	4490	+ var uid = apiuser.getUID(),
	4491	+ list = UI_LIST[ uid ],
	4492	+ ui = new UIGroupClass( apiuser, node );
	4493	+ if( Type.isArray( list ) === false ){
	4494	+ list = UI_LIST[ uid ] = [];
	4495	+ };
	4496	+ list.push( ui );
	4497	+ return ui;
4342	4498	},
4343	4499	onWindowResize: function( w, h ){
4344	4500	windowW = w;

--- a/0.5.x/stylesheets/peta.apps.css

+++ b/0.5.x/stylesheets/peta.apps.css

		@@ -1,7 +1,7 @@
1	1	@charset "UTF-8";
2	2
3	3	/* pettanR peta.apps.css
4		- * version 0.5.19
	4	+ * version 0.5.23
5	5	*
6	6	* author:
7	7	* itozyun

		@@ -669,74 +669,115 @@
669	669	--------------------------------------------------------------------------------------*/
670	670	#comic-element-consol-wrapper {
671	671	position: absolute;
	672	+ bottom: 0;
	673	+ left: 0;
672	674	}
673		- #image-element-consol {
674		- width: 50px;
675		- overflow: auto;
	675	+ #comic-element-consol-container {
	676	+ background: transparent url( "../images/white_70pct.png" ) repeat 0 0;
	677	+ padding: 0.5em;
676	678	}
677		- #text-element-consol {
678		- width: 75px;
679		- overflow: auto;
	679	+ .comic-element-consol-container-hover {
	680	+ background: #fff !important;
680	681	}
681		-
682		- #change-image-button,
683		- #layer-back-button,
684		- #layer-forward-button,
685		- #delete-image-button,
686		- #edit-text-button,
687		- #change-text-style-button,
688		- #hide-text-tail-button,
689		- #back-text-button,
690		- #forward-text-button,
691		- #delete-text-button {
692		- text-indent: -9999px;
693		- width: 25px;
694		- height: 25px;
695		- line-height: 25px;
696		- float: left;
697		- background-image: url('../images/sprite.gif');
698		- background-repeat: no-repeat;
699		- background-position: 0 0;
700		- cursor: pointer;
701		- }
702		- #hide-text-tail-button {
703		- background-position: -30px -30px;
704		- }
705		- #change-image-button,
706		- #change-text-style-button {
707		- background-position: -30px 0;
708		- }
709		- #layer-back-button,
710		- #back-text-button {
711		- background-position: -60px 0;
712		- }
713		- #layer-forward-button,
714		- #forward-text-button {
715		- background-position: -60px -30px;
716		- }
717		- #delete-image-button,
718		- #delete-text-button {
719		- background-position: 0 -30px;
720		- }
721		-
722		- .console-out #comic-element-consol-wrapper-when-out {
723		- padding: 5px;
724		- background-color: #333;
725		- }
726		- .console-out #comic-element-consol-tail {
727		- border-width: 0 5px 10px 5px;
728		- border-color: transparent transparent #333 transparent;
729		- _border-color: #fff #fff #333 #fff;
730		- border-style: solid;
731		- width: 0;
732		- height: 0;
733		- font-size: 0;
734		- line-height: 0;
	682	+
	683	+ #comic-element-consol-pushout-wrapper {
	684	+ display: none;
735	685	position: absolute;
736		- top: -10px;
737		- left: 50%;
	686	+ top: -10px;
	687	+ width: 240px;
	688	+ border: 1px solid #999;
738	689	}
739		-
	690	+ #comic-element-consol-pushout-tail {
	691	+ border-style: solid;
	692	+ width: 0;
	693	+ height: 0;
	694	+ font-size: 0;
	695	+ line-height: 0;
	696	+ position: absolute;
	697	+ }
	698	+ .satellite-left #comic-element-consol-pushout-tail {
	699	+ border-width: 5px 0 5px 10px;
	700	+ border-color: transparent transparent transparent #999;
	701	+ _border-color: #fff #fff #fff #999;
	702	+ top: 50%;
	703	+ right: -10px;
	704	+ }
	705	+ .satellite-right #comic-element-consol-pushout-tail {
	706	+ border-width: 5px 10px 5px 0;
	707	+ border-color: transparent #999 transparent transparent;
	708	+ _border-color: #fff #999 #fff #fff;
	709	+ top: 50%;
	710	+ left: -10px;
	711	+ }
	712	+ .satellite-top #comic-element-consol-pushout-tail {
	713	+ border-width: 10px 5px 0 5px;
	714	+ border-color: #333 transparent transparent transparent;
	715	+ _border-color: #333 #fff #fff #fff;
	716	+ bottom: -10px;
	717	+ left: 50%;
	718	+ }
	719	+ .satellite-bottom #comic-element-consol-pushout-tail {
	720	+ border-width: 0 5px 10px 5px;
	721	+ border-color: transparent transparent #333 transparent;
	722	+ _border-color: #fff #fff #333 #fff;
	723	+ top: -10px;
	724	+ left: 50%;
	725	+ }
	726	+
	727	+
	728	+ .comic-element-consol-item {
	729	+ float: left;
	730	+ width: 70px;
	731	+ height: 70px;
	732	+ }
	733	+ .comic-element-consol-item-small {
	734	+ float: left;
	735	+ width: 70px;
	736	+ height: 35px;
	737	+ }
	738	+ .comic-element-consol-item div {
	739	+ height: 35px;
	740	+ }
	741	+ .comic-element-consol-item-small .button {
	742	+ width: 60px;
	743	+ height: 24px;
	744	+ line-height: 24px;
	745	+ margin-top: 5px;
	746	+ margin-left: 5px;
	747	+ }
	748	+ .comic-element-attribute-label {
	749	+ display: inline-block;
	750	+ width: 14px;
	751	+ line-height: 22px;
	752	+ color: #666;
	753	+ text-align: center;
	754	+ cursor: pointer;
	755	+ }
	756	+ .comic-element-attribute-value {
	757	+ width: 40px;
	758	+ text-align: right;
	759	+ }
	760	+
	761	+ #comic-element-z-value,
	762	+ #comic-element-a-value {
	763	+ width: 35px;
	764	+ }
	765	+ #comic-element-w-percent-value,
	766	+ #comic-element-h-percent-value {
	767	+ width: 30px;
	768	+ }
	769	+
	770	+ #comic-element-keep-aspect {
	771	+ position: relative;
	772	+ top: 24px;
	773	+ left: 0;
	774	+ width: 12px;
	775	+ height: 22px;
	776	+ font-size: 22px;
	777	+ line-height: 22px;
	778	+ border: 1px solid #ccc;
	779	+ }
	780	+
740	781
741	782
742	783	/* Panel > speach

		@@ -890,79 +931,6 @@
890	931	display: none;
891	932	}
892	933
893		- /* Information Window
894		- --------------------------------------------------------------------------------------*/
895		- #comic-element-infomation {
896		- background-color: #fff;
897		- position: absolute;
898		- width: 100%;
899		- }
900		- #comic-element-x, #comic-element-z,
901		- #comic-element-y, #comic-element-a,
902		- #comic-element-w, #comic-element-w-percent,
903		- #comic-element-h, #comic-element-h-percent {
904		- position: absolute;
905		- }
906		-
907		- #comic-element-x,
908		- #comic-element-y,
909		- #comic-element-w,
910		- #comic-element-h {
911		- left: 30px;
912		- }
913		- #comic-element-z,
914		- #comic-element-a {
915		- left: 115px;
916		- }
917		- #comic-element-w-percent,
918		- #comic-element-h-percent {
919		- left: 124px;
920		- }
921		- #comic-element-x, #comic-element-z {
922		- top: 10px;
923		- }
924		- #comic-element-y, #comic-element-a {
925		- top: 40px;
926		- }
927		- #comic-element-w, #comic-element-w-percent {
928		- top: 80px;
929		- }
930		- #comic-element-h, #comic-element-h-percent {
931		- top: 110px;
932		- }
933		- .comic-element-attribute-label {
934		- display: inline-block;
935		- width: 14px;
936		- line-height: 22px;
937		- color: #666;
938		- text-align: center;
939		- cursor: pointer;
940		- }
941		- .comic-element-attribute-value {
942		- width: 40px;
943		- text-align: right;
944		- }
945		-
946		- #comic-element-z-value,
947		- #comic-element-a-value {
948		- width: 35px;
949		- }
950		- #comic-element-w-percent-value,
951		- #comic-element-h-percent-value {
952		- width: 30px;
953		- }
954		-
955		- #comic-element-keep-aspect {
956		- position: absolute;
957		- top: 96px;
958		- left: 100px;
959		- width: 12px;
960		- height: 22px;
961		- font-size: 22px;
962		- line-height: 22px;
963		- border: 1px solid #ccc;
964		- }
965		-
966	934	/* Background Window
967	935	--------------------------------------------------------------------------------------*/
968	936	#bg-pattern,

--- a/0.5.x/stylesheets/system.css

+++ b/0.5.x/stylesheets/system.css

		@@ -1,7 +1,7 @@
1	1	@charset "UTF-8";
2	2
3	3	/* pettanR system.css
4		- * version 0.5.18
	4	+ * version 0.5.23
5	5	*
6	6	* author:
7	7	* itozyun

		@@ -141,39 +141,29 @@
141	141
142	142	/* editable-text
143	143	--------------------------------------------------------------------------------------*/
144		-
	144	+ #ui-textinput {
	145	+ position: absolute;
	146	+ outline: 0;
	147	+ padding: 3px 0;
	148	+ background-color: #aDf0FE;
	149	+ margin: 0;
	150	+ border-color: #4D90FE;
	151	+ }
	152	+ #ui-textinput,
	153	+ .editable-text {
	154	+ border-style: solid;
	155	+ border-width: 1px;
	156	+ font-size: 14px;
	157	+ line-height: 16px;
	158	+ }
145	159	.editable-text {
	160	+ border-color: #666 #aaa #bbb #777;
146	161	display: inline-block;
147	162	color: #333;
148		- border: 1px solid #ccc;
149		- font-size: 14px;
150		- line-height: 16px;
	163	+ zoom: 1;
	164	+ background-color: #fff;
	165	+ padding: 3px;
151	166	}
152		- .editable-text a,
153		- .editable-text a:link,
154		- .editable-text a:visited,
155		- .editable-text a:hover,
156		- .editable-text a:active {
157		- padding: 3px;
158		- color: #333;
159		- text-decoration: none;
160		- display: block;
161		- zoom: 1;
162		- outline: 0;
163		- background-color: #fff;
164		- }
165		- .editable-text a:hover {
166		- background-color: #ccf;
167		- }
168		- .editable-text input {
169		- padding: 3px 0;
170		- width: 100%;
171		- font-family: Arial,Helvetica,sans-serif;
172		- background-color: #ccf;
173		- border: 0;
174		- margin: 0;
175		- outline: 0;
176		- }
177	167
178	168	/* combobox
179	169	--------------------------------------------------------------------------------------*/

旧リポジトリブラウザで表示

ぺったんR ForkpettanrclientJs

clientJs: コミット

コミットメタ情報

ログメッセージ

変更サマリ

差分

ぺったんR
Fork
pettanr
clientJs