X-Git-Url: http://git.osdn.jp/view?a=blobdiff_plain;f=0.4.x%2Fjavascripts%2Fwork.js;h=25d3256be66037fcd59030588f7c7aa64487d3ad;hb=080ecdb578eb49a116464aefc6b86bd5b6f6da38;hp=a56e152b936d2fde3d55ba724c6391fd5b8478a8;hpb=d832988712abc5e8baa2ea0f43f1db1f8fced762;p=pettanr%2FclientJs.git diff --git a/0.4.x/javascripts/work.js b/0.4.x/javascripts/work.js index a56e152..25d3256 100644 --- a/0.4.x/javascripts/work.js +++ b/0.4.x/javascripts/work.js @@ -1,6 +1,6 @@ /* * pettanR work.js - * version 0.4.1 + * version 0.4.12 * * author: * itozyun @@ -31,22 +31,11 @@ * */ - pettanr.LINE_FEED_CODE_TEXTAREA = ( function(){ - var text = document.getElementById( 'shadowTxtarea'), - form = text.parentNode; - form.parentNode.removeChild( form); - return text.value; - })(); - pettanr.LINE_FEED_CODE_PRE = ( function(){ - var pre = document.getElementById( 'shadowPre'); - pre.parentNode.removeChild( pre); - return pettanr.ua.isIE === true ? this.LINE_FEED_CODE_TEXTAREA : pre.innerHTML; // ie ?? - })(); /* ---------------------------------------- * pettanr.editor * - MENU_BAR_CONTROL - * - HISTORY + * - HISTORY_CONTROL * - SAVE_CONTROL * - TEXT_EDITOR_CONTROL * - IMAGE_GROUP_EXPROLER @@ -86,7 +75,7 @@ pettanr.editor = ( function(){ COMIC_ELEMENT_ARRAY = [], ELM_MOUSE_EVENT_CHATCHER = document.getElementById( 'mouse-operation-catcher'), MIN_PANEL_HEIGHT = 20, - MIN_OBJECT_SIZE = 19, + MIN_ELEMENT_SIZE = 19, MOUSE_HIT_AREA = 10, jqMouseEventChacher, jqEditor, @@ -98,6 +87,9 @@ pettanr.editor = ( function(){ /* ---------------------------------------- * MENU BAR + * - mouseEventListener + * - controler + * * div * div.title * ul @@ -129,7 +121,6 @@ pettanr.editor = ( function(){ a.href = '#'; return ret; })(), - EMPTY_FUNCTION = new Function, ITEM_ARRAY = [], barH = pettanr.util.getElementSize( ELM_BAR).height, itemW = pettanr.util.getElementSize( ELM_ITEM_ORIGN).width, @@ -177,12 +168,12 @@ pettanr.editor = ( function(){ } } - var MenuBarItemClass = function( title, opt_callbackArray){ + var MenuBarItemClass = function( title){ var ELM_WRAPPER = ELM_ITEM_ORIGN.cloneNode( true), ELM_TITLE = ELM_WRAPPER.getElementsByTagName( 'div')[ 0], ELM_SELECTION = ELM_WRAPPER.getElementsByTagName( 'ul')[ 0], INDEX = ITEM_ARRAY.length, - SELECTION_CALLBACK_ARRAY = opt_callbackArray || [], + SELECTION_CALLBACK_ARRAY = [], numSelection = 0, visible = false; ELM_TITLE.innerHTML = title; @@ -192,18 +183,10 @@ pettanr.editor = ( function(){ function onClick( e){ var that = this, - i = ( function(){ - var parent = that.parentNode, - children = parent.getElementsByTagName( 'li'), - l = children.length; - for(var i=0; i= _mouseY){ @@ -318,9 +312,10 @@ pettanr.editor = ( function(){ /* ---------------------------------------- - * HISTORY + * HISTORY_CONTROL + * - controler */ - var HISTORY = ( function() { + var HISTORY_CONTROL = ( function() { var STACK_BACK = [], STACK_FORWARD = [], MENUBAR_BACK = MENU_BAR_CONTROL.EDIT.createSelection( 'back', 'ctrl + z', back, false), @@ -357,12 +352,44 @@ pettanr.editor = ( function(){ MENUBAR_BACK.visible( true); SAVE_CONTROL.panelUpdated( true); } + function destroyStack( _stack, _destroy){ + _stack.fn = null; + + var _argBack = _stack.argBack, + _argForword = _stack.argForword, + _value; + if( typeof _argBack.length === 'number'){ // isArray + while( _argBack.length > 0){ + _value = _argBack.shift(); + _destroy === true && typeof _value.destroy === 'function' && _value.destroy(); + } + } + if( typeof _argForword.length === 'number'){ + while( _argForword.length > 0){ + _value = _argForword.shift(); + _destroy === true && typeof _value.destroy === 'function' && _value.destroy(); + } + } + } return { init: function(){ log = $( '#history-log'); - delete HISTORY.init; + delete HISTORY_CONTROL.init; + }, + open: function(){ + HISTORY_CONTROL.init && HISTORY_CONTROL.init(); + }, + close: function(){ + MENUBAR_BACK.visible( false); + MENUBAR_FORWARD.visible( false); + while( STACK_BACK.length > 0){ + destroyStack( STACK_BACK.shift(), true); + } + while( STACK_FORWARD.length > 0){ + destroyStack( STACK_FORWARD.shift(), true); + } }, - saveState: function( _function, _argBack, _argForword, _destory) { + saveState: function( _function, _argBack, _argForword, _destroy) { STACK_BACK.push( { fn: _function, argBack: _argBack, @@ -371,26 +398,11 @@ pettanr.editor = ( function(){ }); MENUBAR_BACK.visible( true); SAVE_CONTROL.panelUpdated( true); - + + var _stack; while( STACK_FORWARD.length > 0){ - var _stack = STACK_FORWARD.shift(), - _destroy = _stack.destroy, - _value; - _argBack = _stack.argBack; - _argForword = _stack.argForword; - _stack.fn = null; - if( typeof _argBack === 'array'){ - while( _argBack.length > 0){ - _value = _argBack.shift(); - _destroy === true && typeof _value.destroy === 'function' && _value.destroy(); - } - } - if( typeof _argForword === 'array'){ - while( _argForword.length > 0){ - _value = _argForword.shift(); - _destroy === true && typeof _value.destroy === 'function' && _value.destroy(); - } - } + _stack = STACK_FORWARD.shift(); + destroyStack( _stack, _stack.destroy); } MENUBAR_FORWARD.visible( false); } @@ -399,9 +411,60 @@ pettanr.editor = ( function(){ /* ---------------------------------------- - * Save Control + * OUTPUT_CONSOLE + * - overlay */ + var OUTPUT_CONSOLE = ( function(){ + var jqWrap, jqOutputArea, + ID = 'outputConsole'; + //pettanr.key.addKeyDownEvent( ID, 69, false, false, clickOK); + + function close(){ + jqWrap.hide(); + jqOutputArea.val(''); + } + function clickOK(){ + pettanr.overlay.hide(); + close(); + } + return { + init: function(){ + this.jqWrap = jqWrap = $( '#output-console-wrapper').hide(); + jqOutputArea = $( '#output-area'); + delete OUTPUT_CONSOLE.init; + }, + jqWrap: null, + show: function( _text){ + jqWrap.show(); + + + pettanr.overlay.show( this); + jqWrap.css( + { + left: Math.floor( ( windowW -jqWrap.width()) /2), + top: Math.floor( ( windowH -jqWrap.height()) /2) + } + ); + + jqOutputArea.val( _text).focus(); + }, + onWindowResize: function(){ + jqWrap.css( + { + left: Math.floor( ( windowW -jqWrap.width()) /2), + top: Math.floor( ( windowH -jqWrap.height()) /2) + } + ); + }, + onClose: close, + ID: 'textEditor' + } + })(); +/* ---------------------------------------- + * SAVE_CONTROL + * - controler + */ var SAVE_CONTROL = ( function(){ var SAVE = MENU_BAR_CONTROL.QUIT.createSelection( 'save', 'ctrl + S', quit, false), SAVE_AND_QUIT = MENU_BAR_CONTROL.QUIT.createSelection( 'save & quit', null, quit, false, false, true), @@ -411,15 +474,19 @@ pettanr.editor = ( function(){ updated = false; function quit(){ + // 本来は os.application.close(); + pettanr.view.show( 'entrance'); } function outputAsHtml(){ - alert( COMIC_ELEMENT_CONTROL.getAsHTML( true, false)); + OUTPUT_CONSOLE.show( COMIC_ELEMENT_CONTROL.getAsHTML( true, false)); } function outputAsJsonString(){ - alert( COMIC_ELEMENT_CONTROL.getAsJsonString()); + OUTPUT_CONSOLE.show( COMIC_ELEMENT_CONTROL.getAsJsonString()); } return { + open: function(){}, + close: function(){}, quit: quit, panelUpdated: function( _updated){ if( _updated !== undefined && updated !== _updated){ @@ -436,14 +503,14 @@ pettanr.editor = ( function(){ })(); /* ---------------------------------------- - * Text Editor (Overlay) + * Text Editor + * - overlay */ - var TEXT_EDITOR_CONTROL = ( function(){ var jqWrap, jqTextarea, jqButton, - textElement, onUpdateFunction; - - pettanr.key.addKeyDownEvent( this.ID, 69, false, false, clickOK); + textElement, onUpdateFunction, + ID = 'textEditor'; + //pettanr.key.addKeyDownEvent( ID, 69, false, false, clickOK); function close(){ jqWrap.hide(); @@ -501,12 +568,13 @@ pettanr.editor = ( function(){ textElement && this.show( textElement); }, onClose: close, - ID: 'textEditor' + ID: ID } })(); /* ---------------------------------------- - * Image Group Exproler (Overlay) + * Image Group Exproler + * - overlay */ var IMAGE_GROUP_EXPROLER = ( function(){ var ICON_ARRAY = [], @@ -515,7 +583,8 @@ pettanr.editor = ( function(){ jqWrap, jqContainer, jqItemOrigin, itemW, itemH, jqName, jqButton, buttonW, - onUpdateFunction, + //onUpdateFunction, + _g_onUpdateFunction, winW, onEnterInterval = null; @@ -703,56 +772,61 @@ pettanr.editor = ( function(){ SRC = [ BASE_PATH, data.id, '.', data.ext].join( ''), LOW_SRC = data.filesize && data.filesize > LIMIT_FILESIZE ? [ THUMB_PATH, data.id, '.', data.ext].join( '') : null, reversibleImage = null, - onEnterFlag = false; + onEnterFlag = false, + imgW, imgH; JQ_ICON_WRAP.children( 'div').eq( 0).html( data.filesize + 'bytes'); jqContainer.append( JQ_ICON_WRAP.css( { left: INDEX * itemW})); + function onImageLoad( url, _imgW, _imgH){ + if( reversibleImage === null) { + alert( url); + return; + } + imgW = _imgW || data.width || 64; + imgH = _imgH || data.height || 64; + JQ_ICON_WRAP.children( 'div').eq( 1).html( imgW +'x' +imgH); + var zoom = 128 /( imgW > imgH ? imgW : imgH), + h = Math.floor( imgH *zoom), + w = Math.floor( imgW *zoom); + reversibleImage.elm.style.width = w +'px'; + reversibleImage.elm.style.height = h +'px'; + reversibleImage.elm.style.margin = Math.floor( itemH /2 -h /2)+'px 0 0'; + reversibleImage.resize( w, h); + JQ_ICON_WRAP.click( onClick); + } + + function onClick( e){ + pettanr.overlay.hide(); + if( _g_onUpdateFunction) { + if( LOW_SRC === null){ + window[ _g_onUpdateFunction]( SRC, imgW, imgH); + window[ _g_onUpdateFunction] = null; + } else { + var _onLoad = pettanr.util.createGlobalFunc( [ + 'function( url, w, h){', + 'window["', _g_onUpdateFunction, '"]( url, w || ', data.width,', h || ', data.height,');', + 'window["', _g_onUpdateFunction, '"] = null;', + '}' + ].join( '')), + _onError = pettanr.util.createGlobalFunc( [ + 'function( url){', + 'window["', _g_onUpdateFunction, '"]( url, ', data.width || 64 ,', ', data.height || 64,');', + 'window["', _g_onUpdateFunction, '"] = null;', + '}' + ].join( '')); + pettanr.util.loadImage( SRC, window[ _onLoad], window[ _onError]); + window[ _onLoad] = window[ _onError] = undefined; + } + } + close(); + } + return { onEnter: function(){ if( onEnterFlag === true) return; - reversibleImage = pettanr.image.createReversibleImage( LOW_SRC || SRC, itemW, itemH, function( url, imgW, imgH){ - if( reversibleImage === null) { - alert( url); - return; - } - /* - * ieでサイズが取れない、、、 - */ - imgW = imgW || data.width || 64; - imgH = imgH || data.height || 64; - JQ_ICON_WRAP.children( 'div').eq( 1).html( imgW +'x' +imgH); - var zoom = 128 /( imgW > imgH ? imgW : imgH), - h = Math.floor( imgH *zoom), - w = Math.floor( imgW *zoom); - reversibleImage.elm.style.width = w +'px'; - reversibleImage.elm.style.height = h +'px'; - reversibleImage.elm.style.margin = Math.floor( itemH /2 -h /2)+'px 0 0'; - reversibleImage.resize( w, h); - JQ_ICON_WRAP.click( function( e){ - pettanr.overlay.hide(); - if (onUpdateFunction) { - if( LOW_SRC === null){ - onUpdateFunction( SRC, imgW, imgH); - } else { - ( function( onUpdate){ - pettanr.util.loadImage( SRC, - function( _abspath, imgW, imgH){ - onUpdate( SRC, imgW, imgH); - onUpdate = null; - }, - function( _abspath){ - onUpdate( SRC, data.width || 64, data.height || 64); - onUpdate = null; - } - ); - })( onUpdateFunction); // close()で値が消えるので、クロージャに保持 - } - } - close(); - }); - }); + reversibleImage = pettanr.image.createReversibleImage( LOW_SRC || SRC, itemW, itemH, onImageLoad); JQ_ICON_WRAP.children( 'img').replaceWith( reversibleImage.elm); - onEnterFlag = true; + onEnterFlag = true; }, destroy: function(){ reversibleImage && reversibleImage.destroy(); @@ -774,7 +848,7 @@ pettanr.editor = ( function(){ ICON_ARRAY.shift().destroy(); } onEnterInterval !== null && window.clearTimeout( onEnterInterval); - onUpdateFunction = onEnterInterval = null; + onEnterInterval = _g_onUpdateFunction = null; } function onEnterShowImage(){ var l = ICON_ARRAY.length, @@ -788,25 +862,24 @@ pettanr.editor = ( function(){ } function clickOK(){ pettanr.overlay.hide(); - // onUpdateFunction && onUpdateFunction( textElement); close(); } + function onMouseWheel( e, delta){ + if( winW < containerW){ + wrapX += delta *WHEEL_DELTA; + wrapX = wrapX > 0 ? 0 : wrapX < winW -containerW ? winW -containerW : wrapX; + jqContainer.css( { left: wrapX}); + + onEnterInterval !== null && window.clearTimeout( onEnterInterval); + onEnterInterval = window.setTimeout( onEnterShowImage, 500); + } + //e.stopPropagation(); + return false; + } return { init: function(){ this.jqWrap = jqWrap = $( '#image-gruop-wrapper').hide(); - jqContainer = $( '#image-icon-container').mousewheel( - function( e, delta){ - if( winW < containerW){ - wrapX += delta *WHEEL_DELTA; - wrapX = wrapX > 0 ? 0 : wrapX < winW -containerW ? winW -containerW : wrapX; - jqContainer.css( { left: wrapX}); - - onEnterInterval !== null && window.clearTimeout( onEnterInterval); - onEnterInterval = window.setTimeout( onEnterShowImage, 500); - } - //e.stopPropagation(); - return false; - }); + jqContainer = $( '#image-icon-container').mousewheel( onMouseWheel); containerH = pettanr.util.getElementSize( jqContainer.get( 0)).height; jqItemOrigin = $( $( '#imageGruopItemTemplete').remove().html()); var itemSize = pettanr.util.getElementSize( jqItemOrigin.get( 0)); @@ -820,7 +893,12 @@ pettanr.editor = ( function(){ }, jqWrap: null, show: function( _onUpdateFunction){ - onUpdateFunction = _onUpdateFunction; + //onUpdateFunction = _onUpdateFunction; + if( _onUpdateFunction){ + _g_onUpdateFunction = pettanr.util.createGlobalFunction( _onUpdateFunction); + } else { + _g_onUpdateFunction = null; + } pettanr.overlay.show( this); var CURRENT_GROUP_ARRAY = IMAGE_DATA[ 'pen001'] || [], @@ -889,6 +967,8 @@ pettanr.editor = ( function(){ /* ---------------------------------------- * WINDOWS_CONTROL + * - contloler + * - mouseEventListener */ var WINDOWS_CONTROL = ( function(){ /* @@ -1017,9 +1097,9 @@ pettanr.editor = ( function(){ } else { jqWrapper.find( '.window-footer').remove(); } - update( x, y, w, h); + this.onFirstOpen && this.onFirstOpen( w, h -headerH -footerH); - this.onFirstOpen && this.onFirstOpen(); + update( x, y, w, h); delete this.firstOpen; }, @@ -1038,11 +1118,22 @@ pettanr.editor = ( function(){ } } }, + onFadeIn: function(){ + instance.firstOpen && instance.firstOpen(); + instance.onOpen && setTimeout( callOnOpen, 0); + function callOnOpen(){ + instance.onOpen( w, bodyH); + } + }, + onFadeOut: function(){ + var elmWrapper = jqWrapper.get(0); + elmWrapper.parentNode.removeChild( elmWrapper); + instance.onClose && setTimeout( instance.onClose, 0); + }, close: function(){ if( visible === false) return; instance.visible = visible = false; - instance.onClose && setTimeout( instance.onClose, 0); - closeWindow( instance); + jqWrapper.fadeOut( instance.onFadeOut); MENUBAR_SELWCTION.title( 'show ' +title); }, bodyBackOrForward: bodyBackOrForward, @@ -1062,7 +1153,7 @@ pettanr.editor = ( function(){ if( x > _mouseX || y > _mouseY || x +w < _mouseX || y +headerH < _mouseY ) return; if( CLOSE_BUTTON_ENABLED === true && x +w -closeButtonWidth < _mouseX){ - this.close(); + instance.close(); return; } @@ -1114,7 +1205,7 @@ pettanr.editor = ( function(){ } }; - function getCurrentWindow( _mouseX, _mouseY){ + function getCurrentIndex( _mouseX, _mouseY){ if( currentWindow && currentWindow.busy() === true) return currentWindowIndex; var l = WINDOW_ARRAY.length, _currentWindow = null, @@ -1139,28 +1230,9 @@ pettanr.editor = ( function(){ if( _window.visible !== true) return; var _jqWindow = _window.$; jqContainer.append( _jqWindow);// appendした後に fadeIn() しないと ie で filterが適用されない. - _jqWindow.fadeIn( - function(){ - _window.firstOpen && _window.firstOpen(); - _window.onOpen && setTimeout( _window.onOpen, 0); - } - ); + _jqWindow.fadeIn( _window.onFadeIn); return; } - function closeWindow( _window){ - if( _window.visible !== false) return; - var l = WINDOW_ARRAY.length; - for( var i=0; i 0){ // 先頭のクリックでない場合 // Array を前に WINDOW_ARRAY.splice( currentWindowIndex, 1); WINDOW_ARRAY.unshift( currentWindow); @@ -1195,14 +1273,14 @@ pettanr.editor = ( function(){ return false; }, onMouseUp: function( _mouseX, _mouseY){ - if( getCurrentWindow( _mouseX, _mouseY) === 0){ + if( getCurrentIndex( _mouseX, _mouseY) === 0){ currentWindow.onMouseUp( _mouseX, _mouseY); return true; } return false; }, onMouseDown: function( _mouseX, _mouseY){ - if( getCurrentWindow( _mouseX, _mouseY) === 0){ + if( getCurrentIndex( _mouseX, _mouseY) === 0){ currentWindow.onMouseDown( _mouseX, _mouseY); return true; } @@ -1216,7 +1294,7 @@ pettanr.editor = ( function(){ * 画面外に出るwindowの移動 */ }, - createWindow: function( scope, EXTENDS, bodyTempleteID, title, x, y, w, h, opt_visible, opt_closeButtonEnabled, opt_resizeButtonEnabled, opt_minWindowW, opt_minWindowH){ + createWindow: function( EXTENDS, bodyTempleteID, title, x, y, w, h, opt_visible, opt_closeButtonEnabled, opt_resizeButtonEnabled, opt_minWindowW, opt_minWindowH){ opt_visible = opt_visible !== false; opt_closeButtonEnabled = opt_closeButtonEnabled === true; opt_resizeButtonEnabled = opt_resizeButtonEnabled === true; @@ -1224,7 +1302,9 @@ pettanr.editor = ( function(){ opt_minWindowH = opt_minWindowH || ( h < DEFAULT_MIN_WINDOW_HEIGHT) ? h : DEFAULT_MIN_WINDOW_HEIGHT; var _window = pettanr.util.extend( - WindowClass.apply( scope, [ bodyTempleteID, title, x, y, w, h, opt_visible, opt_closeButtonEnabled, opt_resizeButtonEnabled, opt_minWindowW, opt_minWindowH]), + new WindowClass( + bodyTempleteID, title, x, y, w, h, opt_visible, opt_closeButtonEnabled, opt_resizeButtonEnabled, opt_minWindowW, opt_minWindowH + ), EXTENDS ); WINDOW_ARRAY.unshift( _window); @@ -1237,6 +1317,7 @@ pettanr.editor = ( function(){ /* ---------------------------------------- * TOOL_BOX_WINDOW + * - window */ var TOOL_BOX_WINDOW = ( function(){ var addImageButton, addTextButton, editBgButton, switchGridButton, popupHelpButton, postButton, @@ -1253,34 +1334,33 @@ pettanr.editor = ( function(){ function addImage( e){ setTimeout( COMIC_ELEMENT_CONTROL.createImageElement, 0); - e && e.preventDefault(); + e && e.preventDefault && e.preventDefault(); return false; } function addText( e){ setTimeout( COMIC_ELEMENT_CONTROL.createTextElement, 0); - e && e.preventDefault(); + e && e.preventDefault && e.preventDefault(); return false; } function switchGrid( e){ setTimeout( GRID_CONTROL.update, 0); - e && e.preventDefault(); + e && e.preventDefault && e.preventDefault(); return false; } function popupHelp( e){ instance.bodyBackOrForward( true); setTimeout( HELP_DOCUMENTS_WINDOW.open, 0); - e && e.preventDefault(); + e && e.preventDefault && e.preventDefault(); return false; } function editBG( e){ instance.bodyBackOrForward( true); setTimeout( INFOMATION_WINDOW.open, 0); - e && e.preventDefault(); + e && e.preventDefault && e.preventDefault(); return false; } return WINDOWS_CONTROL.createWindow( - this, { onInit: function(){ instance = this; @@ -1305,23 +1385,23 @@ pettanr.editor = ( function(){ /* ---------------------------------------- * IMAGE_EXPROLER + * - window */ var IMAGE_EXPLORER_WINDOW = ( function(){ var instance, finder; return WINDOWS_CONTROL.createWindow( - this, { onInit: function(){ instance = this; delete this.onInit; }, - onFirstOpen: function(){ - finder = pettanr.finder.createFinder( document.getElementById( 'image-exproler-container'), pettanr.file.TREE_TYPE_IS_IMAGE); + onFirstOpen: function( _w, _h){ + finder = pettanr.finder.createFinder( document.getElementById( 'image-exproler-container'), pettanr.driver.createPictureTree()); delete this.onFirstOpen; }, - onOpen: function(){ - finder.onOpen(); + onOpen: function( _w, _h){ + finder.onOpen( _w, _h); }, onResize: function( _w, _h){ finder.onWindowResize( _w, _h); @@ -1334,59 +1414,75 @@ pettanr.editor = ( function(){ /* ---------------------------------------- * INFOMATION_WINDOW + * - window */ var INFOMATION_WINDOW = ( function(){ - var FADE_EFFECT_ENABLED = pettanr.ua.isIE === false || pettanr.ua.ieVersion >= 8, + var FADE_EFFECT_ENABLED = true, //pettanr.ua.isIE === false || pettanr.ua.ieVersion >= 8, FADE_IN_EFFECT = FADE_EFFECT_ENABLED === true ? 'fadeIn' : 'show', FADE_OUT_EFFECT = FADE_EFFECT_ENABLED === true ? 'fadeOut' : 'hide', backgroundInfomationElm, jqComicElementInformation, - elmValueX, elmValueY, elmValueZ, elmValueA, elmValueW, elmValueH, elmAspect, - elmPercentW, elmPercentH, + inputX, inputY, inputZ, inputA, inputW, inputH, inputAspectRatio, + inputPercentW, inputPercentH, currentComicElement = null, - currentElementType = -1; + currentElementType = -1, + currentLock = false; return WINDOWS_CONTROL.createWindow( - this, { - onFirstOpen: function(){ + onFirstOpen: function( _w, _h){ backgroundInfomationElm = $( '#panel-background-information'); jqComicElementInformation = $( '#comic-element-infomation').hide().css( { - height: this.bodyHeight() + height: _h }); var TAB_GROUP_ID = 'comic-element-attribute'; - var CREATER = pettanr.key.createEditableText; - elmValueX = CREATER( $( '#comic-element-x'), null, TAB_GROUP_ID); - elmValueY = CREATER( $( '#comic-element-y'), null, TAB_GROUP_ID); - elmValueZ = CREATER( $( '#comic-element-z'), null, TAB_GROUP_ID); - elmValueA = CREATER( $( '#comic-element-a'), null, TAB_GROUP_ID); - elmValueW = CREATER( $( '#comic-element-w'), null, TAB_GROUP_ID); - elmValueH = CREATER( $( '#comic-element-h'), null, TAB_GROUP_ID); - elmPercentW = CREATER( $( '#comic-element-w-percent'), null, TAB_GROUP_ID); - elmPercentH = CREATER( $( '#comic-element-h-percent'), null, TAB_GROUP_ID); - elmAspect = $( '#comic-element-keep-aspect'); + var CREATER = pettanr.form.createInputText;//pettanr.key.createEditableText; + inputX = CREATER( document.getElementById( 'comic-element-x'), null, TAB_GROUP_ID); + inputY = CREATER( document.getElementById( 'comic-element-y'), null, TAB_GROUP_ID); + inputZ = CREATER( document.getElementById( 'comic-element-z'), null, TAB_GROUP_ID); + inputA = CREATER( document.getElementById( 'comic-element-a'), null, TAB_GROUP_ID); + inputW = CREATER( document.getElementById( 'comic-element-w'), null, TAB_GROUP_ID); + inputH = CREATER( document.getElementById( 'comic-element-h'), null, TAB_GROUP_ID); + inputPercentW = CREATER( document.getElementById( 'comic-element-w-percent'), null, TAB_GROUP_ID); + inputPercentH = CREATER( document.getElementById( 'comic-element-h-percent'), null, TAB_GROUP_ID); + inputAspectRatio = $( '#comic-element-keep-aspect'); delete this.onFirstOpen; }, - onResize: function( w, h){ - jqComicElementInformation && jqComicElementInformation.css( { - height: h + onResize: function( _w, _h){ + jqComicElementInformation.css( { + height: _h }); }, - update: function( _elementType, x, y, z, a, w, h, wPercent, hPercent, keepAspect){ - if( !backgroundInfomationElm) return; // なぜか !backgroundInfomationElm が必要 + update: function( currentElement){ + + if( currentLock === true && currentElement === null) return; + + var _elementType = currentElement === null ? -1 : currentElement.type, + x = currentElement !== null ? currentElement.x : 0, + y = currentElement !== null ? currentElement.y : 0, + z = currentElement !== null ? currentElement.z : 0, + a = _elementType === COMIC_ELEMENT_TYPE_TEXT ? Math.floor( currentElement.angle()) : 0, + w = currentElement !== null ? currentElement.w : 0, + h = currentElement !== null ? currentElement.h : 0, + actualW = _elementType === COMIC_ELEMENT_TYPE_IMAGE ? currentElement.actualW() : 1, + actualH = _elementType === COMIC_ELEMENT_TYPE_IMAGE ? currentElement.actualH() : 1, + wPercent = _elementType === COMIC_ELEMENT_TYPE_IMAGE ? Math.floor( w / actualW *100) : 0, + hPercent = _elementType === COMIC_ELEMENT_TYPE_IMAGE ? Math.floor( h / actualH *100) : 0, + keepAspect = currentElement !== null && currentElement.keepAspect === true; + if( currentElementType !== _elementType){ if( _elementType !== -1){ if( _elementType === 1){ - elmValueA.show(); - elmPercentW.hide(); - elmPercentH.hide(); - elmAspect.hide(); + inputA.visible( true); + inputPercentW.visible( false); + inputPercentH.visible( false); + inputAspectRatio.hide(); } else { - elmValueA.hide(); - elmPercentW.show(); - elmPercentH.show(); - elmAspect.show(); + inputA.visible( false); + inputPercentW.visible( true); + inputPercentH.visible( true); + inputAspectRatio.show(); } currentElementType === -1 && jqComicElementInformation.stop().css( { filter: '', @@ -1401,17 +1497,21 @@ pettanr.editor = ( function(){ currentElementType = _elementType; } if( currentElementType !== -1){ - elmValueX.update( x); - elmValueY.update( y); - elmValueZ.update( z); - _elementType === 1 && elmValueA.update( a); - elmValueW.update( w); - elmValueH.update( h); - _elementType === 0 && elmPercentW.update( wPercent); - _elementType === 0 && elmPercentH.update( hPercent); + inputX.value( x); + inputY.value( y); + inputZ.value( z); + _elementType === 1 && inputA.value( a); + inputW.value( w); + inputH.value( h); + _elementType === 0 && inputPercentW.value( wPercent); + _elementType === 0 && inputPercentH.value( hPercent); } else { } + }, + lock: function( _currentLock){ + currentLock = !!_currentLock; + this.bodyBackOrForward( !currentLock); } }, 'infomation-window', 'Infomation', 0, 30, 200, 180, true @@ -1420,144 +1520,124 @@ pettanr.editor = ( function(){ /* ---------------------------------------- * HELP_WINDOW + * - window */ var HELP_DOCUMENTS_WINDOW = ( function(){ var visible = true, - hasAjaxContents = false, jqAjaxContents, jqNaviItems, jqPages, + currentPageIndex = 0, + numPage = 0, HELP = MENU_BAR_CONTROL.HELP, - onLoadFunction = HELP.createAjaxSelection( onFirstOpen), + onLoadFunction = HELP.createAjaxSelection( onAjaxStart), instance; - function jumpPage( _index){ - - } - function onFirstOpen( _pageIndex){ - _pageIndex = _pageIndex || 0; - if( hasAjaxContents === false){ + + function onAjaxStart( _pageIndex){ + currentPageIndex = _pageIndex || currentPageIndex; + if( onHelpLoad !== null){ $.ajax({ url: 'help/jp.xml', dataType: 'xml', - success: function( _xml){ - var jqXML = $( _xml), - helpTitle = jqXML.find( 'pages').eq( 0).attr( 'title'), - elmNavi = document.createElement( 'div'), - elmItemOrigin = document.createElement( 'a'), - elmPages = document.createElement( 'div'), - elmPageOrigin = document.createElement( 'div'), - elmTitleOrigin = document.createElement( 'h2'), - elmPage, - numPage = 0; - elmNavi.className = 'sidenavi'; - elmItemOrigin.className = 'sidenavi-item'; - elmItemOrigin.href = '#'; - elmPages.className = 'page-contents'; - elmPageOrigin.className = 'page-content'; - elmPageOrigin.appendChild( elmTitleOrigin); - - // helpTitle && instance.title( helpTitle); - - jqXML.find( 'page').each( function(){ - var xmlPage = $( this), - title = xmlPage.attr( 'title'), - content = xmlPage.text(); - - elmItemOrigin.innerHTML = title; - elmNavi.appendChild( elmItemOrigin.cloneNode( true)); - - elmTitleOrigin.innerHTML = title; - elmPage = elmPageOrigin.cloneNode( true); - elmPage.innerHTML = content; - - pettanr.util.cleanElement( elmPage); - - if( elmPage.childNodes.length > 0){ - elmPage.insertBefore( elmTitleOrigin.cloneNode( true), elmPage.childNodes[0]); - } else { - elmPage.appendChild( elmTitleOrigin.cloneNode( true)); - } - elmPages.appendChild( elmPage); - - HELP.createSelection( title, null, ( function( _pageIndex){ - return function(){ - HELP_DOCUMENTS_WINDOW.open(); - onOpen( _pageIndex); - } - })( numPage), true); - ++numPage; - }); - onLoadFunction(); - onLoadFunction = null; - - jqAjaxContents.removeClass( 'loading').append( elmNavi, elmPages); - - jqNaviItems = jqAjaxContents.find( 'a.' +elmItemOrigin.className) - .click( function( e){ - var that = this, - parent = this.parentNode, - i = ( function(){ - var children = parent.getElementsByTagName( 'a'), - l = children.length; - for( var i=0; i 0){ + elmPage.insertBefore( elmTitleOrigin.cloneNode( true), elmPage.childNodes[0]); + } else { + elmPage.appendChild( elmTitleOrigin.cloneNode( true)); + } + elmPages.appendChild( elmPage); + + HELP.createSelection( title, null, onSelectionClick, true); + ++numPage; + }); + onLoadFunction(); + onLoadFunction = null; + + jqAjaxContents.removeClass( 'loading').append( elmNavi, elmPages); + + jqNaviItems = jqAjaxContents.find( 'a.' +elmItemOrigin.className).click( onNaviClick); + jqPages = jqAjaxContents.find( '.page-content'); + jqPages.find( 'a').click( onInnerLinkClick); + + setTimeout( jumpPage, 0); + } + function onSelectionClick( _pageIndex){ + HELP_DOCUMENTS_WINDOW.open(); + jumpPage( _pageIndex); + } + function jumpPage( _index){ + if( typeof _index === 'number' && 0 <= _index && _index < numPage && currentPageIndex !== _index){ + currentPageIndex = _index; } + jqNaviItems.removeClass( 'current').eq( currentPageIndex).addClass( 'current'); + jqPages.hide().eq( currentPageIndex).show(); + } + function onNaviClick( e){ + // this は + jumpPage( pettanr.util.getChildIndex( this.parentNode, this)); + e.stopPropagation(); + return false; + } + function onInnerLinkClick( e){ + var jump = ( this.href || '').split( '#jump'), + n = jump[1]; + if( !n) return; + jumpPage( '' + parseFloat( n) === n ? parseFloat( n) : -1); + e.stopPropagation(); + return false; } return WINDOWS_CONTROL.createWindow( - this, { onInit: function(){ instance = this; - jqAjaxContents = this.$.find( '.window-body').addClass( 'loading').css( { height: this.bodyHeight()}); + jqAjaxContents = this.$.find( '.window-body').addClass( 'loading'); delete this.onInit; }, - onFirstOpen: onFirstOpen, - onResize: function( w, h){ - jqAjaxContents && jqAjaxContents.css( { height: h}); + onFirstOpen: function( _w, _h){ + jqAjaxContents.css( { height: _h}); + onAjaxStart(); + delete this.onFirstOpen; }, - setAjaxContent: function( html){ - - delete this.onLoadAjaxContent; + onResize: function( _w, _h){ + jqAjaxContents && jqAjaxContents.css( { height: _h}); } }, null, 'Help', 0, 215, 400, 350, false, true, true, 300, 300 @@ -1566,9 +1646,12 @@ pettanr.editor = ( function(){ /* ---------------------------------------- * GRID_CONTROL + * - control + * - panelResizeListener */ var GRID_CONTROL = ( function(){ var ELM_GRID = document.getElementById( 'grid'), + BG_URL = "url('images/grid.gif')", jqGrid, visible = false; @@ -1577,6 +1660,12 @@ pettanr.editor = ( function(){ jqGrid = $( ELM_GRID); delete GRID_CONTROL.init; }, + open: function(){ + GRID_CONTROL.init && GRID_CONTROL.init(); + }, + close: function(){ + + }, onPanelResize: function( _panelX, _panelY){ ELM_GRID.style.backgroundPosition = [ _panelX % 10, 'px ', _panelY % 10, 'px'].join( ''); ELM_GRID.style.height = windowH +'px'; @@ -1592,17 +1681,19 @@ pettanr.editor = ( function(){ visible = !visible; - if( visible === true && !ELM_GRID.style.backgroundImage){ - ELM_GRID.style.backgroundImage = "url('images/grid.gif')"; + if( visible === true && BG_URL !== null){ + ELM_GRID.style.backgroundImage = BG_URL; + BG_URL = null; } return visible; } } })(); - /* - * WHITE_GLASS_CONTROL - */ +/* ---------------------------------------- + * WHITE_GLASS_CONTROL + * - panelResizeListener + */ var WHITE_GLASS_CONTROL = ( function(){ var styleTop = document.getElementById( 'whiteGlass-top').style, styleLeft = document.getElementById( 'whiteGlass-left').style, @@ -1638,8 +1729,11 @@ pettanr.editor = ( function(){ })(); -/* +/* ---------------------------------------- * PANEL_CONTROL + * - controler + * - mouseEventListener + * * panel-border の表示と onPanelResize の通知. * panel drag. * @@ -1655,6 +1749,8 @@ pettanr.editor = ( function(){ isDragging = false, isDraggable = false; + pettanr.key.addKeyUpdateEvent( pettanr.view.EDITOR, 32, false, false, onSpaceUpdate); + function onSpaceUpdate(e){ if( e.type === 'keyup'){ currentListener === null && updateMouseCursor( ''); @@ -1666,18 +1762,17 @@ pettanr.editor = ( function(){ } return { - init: function( _panelW, _panelH, _borderSize){ + open: function( _panelW, _panelH, _borderSize){ panelW = _panelW || DEFAULT_PANEL_WIDTH; panelH = _panelH || DEFAULT_PANEL_HEIGHT; - panelX = Math.floor( ( windowW -panelW) /2); - panelY = Math.floor( ( windowH -panelH) /2); + //panelX = Math.floor( ( windowW -panelW) /2); + //panelY = Math.floor( ( windowH -panelH) /2); borderSize = _borderSize !== undefined ? _borderSize : borderSize; - pettanr.key.addKeyUpdateEvent( pettanr.view.EDITOR, 32, false, false, onSpaceUpdate); - - setTimeout( PANEL_CONTROL.resize, 0); + //setTimeout( PANEL_CONTROL.resize, 0); + }, + close: function(){ - delete PANEL_CONTROL.init; }, x: function(){ return panelX; @@ -1735,9 +1830,9 @@ pettanr.editor = ( function(){ } })(); -/* - * -------------------------------------------------------------------------------------------- - * panel resizer +/* -------------------------------------------------------------------------------------------- + * PanelResizerClass + * - mouseEventListener */ var PanelResizerClass = function( ID, isTop){ var ELM = document.getElementById( ID), @@ -1759,9 +1854,6 @@ pettanr.editor = ( function(){ } return { - busy: function(){ - return isDragging; - }, onMouseDown: function( _mouseX, _mouseY){ var _x = _mouseX -panelX, _y = _mouseY -panelY; @@ -1799,7 +1891,7 @@ pettanr.editor = ( function(){ }, onMouseUp: function( _mouseX, _mouseY){ if( isDragging !== true) return; - ( startY !== panelY || startH !== panelH) && HISTORY.saveState( restoreState, [ NaN, startY, NaN, startH], [ NaN, panelY, NaN, panelH]); + ( startY !== panelY || startH !== panelH) && HISTORY_CONTROL.saveState( restoreState, [ NaN, startY, NaN, startH], [ NaN, panelY, NaN, panelH]); isDragging = false; MOUSE_CURSOR( ''); }, @@ -1824,14 +1916,16 @@ pettanr.editor = ( function(){ PanelResizerClass = undefined; - +/* -------------------------------------------------------------------------------------------- + * CONSOLE_CONTROLER + */ var CONSOLE_CONTROLER = ( function(){ var LAYER_BACK_BUTTON = MENU_BAR_CONTROL.EDIT.createSelection( 'layer back', 'ctrl + B', layerBack, false, true, false), LAYER_FORWARD_BUTTON = MENU_BAR_CONTROL.EDIT.createSelection( 'layer forward', 'ctrl + F', layerForward, false, false, false), DELETE_BUTTON = MENU_BAR_CONTROL.EDIT.createSelection( 'delete', 'ctrl + D', del, false, true, true), EDIT_BUTTON = MENU_BAR_CONTROL.EDIT.createSelection( 'Edit Text', 'ctrl + E', edit, false, true, false), CHANGE_BUTTON = MENU_BAR_CONTROL.EDIT.createSelection( 'change', 'ctrl + U', change, false, false, true), - SAVE = HISTORY.saveState, + SAVE = HISTORY_CONTROL.saveState, jqStage, jqConsoleParent, jqConsoleWrapper, @@ -1866,18 +1960,18 @@ pettanr.editor = ( function(){ } function layerBack(){ if( currentElement === null) return; - COMIC_ELEMENT_CONTROL.replaceComicElement( currentElement, false); - updateInfomation(); - SAVE( COMIC_ELEMENT_CONTROL.restoreReplaceObject, [ currentElement, true], [ currentElement, false]); + if( COMIC_ELEMENT_CONTROL.replace( currentElement, false) === false) return; + INFOMATION_WINDOW.update( currentElement); + SAVE( COMIC_ELEMENT_CONTROL.restoreReplace, [ currentElement, true], [ currentElement, false]); var _z = currentElement.z; LAYER_BACK_BUTTON.visible( _z > 0); LAYER_FORWARD_BUTTON.visible( _z < COMIC_ELEMENT_ARRAY.length -1); } function layerForward(){ if( currentElement === null) return; - COMIC_ELEMENT_CONTROL.replaceComicElement( currentElement, true); - updateInfomation(); - SAVE( COMIC_ELEMENT_CONTROL.restoreReplaceObject, [ currentElement, false], [ currentElement, true]); + if( COMIC_ELEMENT_CONTROL.replace( currentElement, true) === false) return; + INFOMATION_WINDOW.update( currentElement); + SAVE( COMIC_ELEMENT_CONTROL.restoreReplace, [ currentElement, false], [ currentElement, true]); var _z = currentElement.z; LAYER_BACK_BUTTON.visible( _z > 0); LAYER_FORWARD_BUTTON.visible( _z < COMIC_ELEMENT_ARRAY.length -1); @@ -1885,8 +1979,8 @@ pettanr.editor = ( function(){ function del(){ if( currentElement === null) return; buttonBackOrForward( true); - COMIC_ELEMENT_CONTROL.removeComicElement( currentElement); - SAVE( COMIC_ELEMENT_CONTROL.restoreComicElement, [ true, currentElement], [ false, currentElement], true); + COMIC_ELEMENT_CONTROL.remove( currentElement); + SAVE( COMIC_ELEMENT_CONTROL.restore, [ true, currentElement], [ false, currentElement], true); COMIC_ELEMENT_OPERATION_MANAGER.hide(); } function edit(){ @@ -1987,7 +2081,10 @@ pettanr.editor = ( function(){ } })(); - +/* -------------------------------------------------------------------------------------------- + * TAIL_OPERATOR + * - comicElementOperator + */ var TAIL_OPERATOR = ( function(){ var MOUSE_CURSOR = updateMouseCursor, ELM_MOVER = document.getElementById( 'balloon-tail-mover'), @@ -2059,7 +2156,7 @@ pettanr.editor = ( function(){ _mouseY > 0 ? 90 : -90 ); currentText && currentText.angle( balloonA); - COMIC_ELEMENT_OPERATION_MANAGER.updateInfomation( undefined, undefined, undefined, balloonA); + INFOMATION_WINDOW.update( currentText); }, onFinish: function(){ startA !== currentText.angle() && COMIC_ELEMENT_OPERATION_MANAGER.saveStatus( x, y, w, h, startA); @@ -2072,8 +2169,13 @@ pettanr.editor = ( function(){ currentText = null; } } - })(), - RESIZE_OPERATOR = ( function(){ + })(); + +/* -------------------------------------------------------------------------------------------- + * RESIZE_OPERATOR + * - comicElementOperator + */ + var RESIZE_OPERATOR = ( function(){ var MOUSE_CURSOR = updateMouseCursor, GRID_ENABLED = GRID_CONTROL.enabled; @@ -2125,14 +2227,20 @@ pettanr.editor = ( function(){ y = _y !== undefined ? _y : y; w = _w !== undefined ? _w : w; h = _h !== undefined ? _h : h; - elmResizerContainerStyle.left = x +'px'; - elmResizerContainerStyle.top = y +'px'; - elmResizerContainerStyle.width = w +'px'; - elmResizerContainerStyle.height = h +'px'; - elmResizerTopStyle.left = FLOOR( w /2 -10 /2) +'px'; - elmResizerLeftStyle.top = FLOOR( h /2 -10 /2) +'px'; - elmResizerRightStyle.top = FLOOR( h /2 -10 /2) +'px'; - elmResizerBottomStyle.left = FLOOR( w /2 -10 /2) +'px'; + try { + elmResizerContainerStyle.left = x +'px'; + elmResizerContainerStyle.top = y +'px'; + elmResizerContainerStyle.width = w +'px'; + elmResizerContainerStyle.height = h +'px'; + elmResizerTopStyle.left = FLOOR( w /2 -10 /2) +'px'; + elmResizerLeftStyle.top = FLOOR( h /2 -10 /2) +'px'; + elmResizerRightStyle.top = FLOOR( h /2 -10 /2) +'px'; + elmResizerBottomStyle.left = FLOOR( w /2 -10 /2) +'px'; + } catch(e){ + alert( [x, y, w, h].join( ',')); + return; + } + POSITION_ARRAY.splice( 0, POSITION_ARRAY.length); POSITION_ARRAY.push( @@ -2168,17 +2276,17 @@ pettanr.editor = ( function(){ currentElement.resize( x, y, w, h); currentIsTextElement === true && TAIL_OPERATOR.update( w, h); CONSOLE_CONTROLER.show( currentElement, w, h); - COMIC_ELEMENT_OPERATION_MANAGER.updateInfomation( x, y, undefined, undefined, w, h); + INFOMATION_WINDOW.update( currentElement); } - function flip( _flipV, _flipH){ + function flip( _flipH, _flipV){ var p = CURSOR_AND_FLIP[ currentIndex]; currentIndex = _flipH === true || _flipV === true ? p[ _flipH === true && _flipV === true ? 'vh' : ( _flipH === true ? 'h' : 'v') ] : currentIndex; MOUSE_CURSOR( CURSOR_AND_FLIP[ currentIndex].cursor); elmResizerContainer.className = 'current-resizer-is-' +currentIndex; - currentElement.flip( _flipV, _flipH); + currentElement.flip( _flipH, _flipV); } return { update: draw, @@ -2245,7 +2353,7 @@ pettanr.editor = ( function(){ _momoryW = 0, _momoryH = 0; /* - * Opera 11+ often forget values, why ?? + * Opera 11+ often forget values, why ?? */ while( _x === undefined || _y === undefined || _w === undefined || _h === undefined){ _x = _x !== undefined ? _x : baseX +moveX *com.x; @@ -2262,45 +2370,45 @@ pettanr.editor = ( function(){ } } - if( _w >= MIN_OBJECT_SIZE && _h >= MIN_OBJECT_SIZE){ + if( _w >= MIN_ELEMENT_SIZE && _h >= MIN_ELEMENT_SIZE){ } else - if( _w >= -MIN_OBJECT_SIZE && _h >= -MIN_OBJECT_SIZE){ + if( _w >= -MIN_ELEMENT_SIZE && _h >= -MIN_ELEMENT_SIZE){ //return; - if( _w < MIN_OBJECT_SIZE){ - //_x += Math.abs( MIN_OBJECT_SIZE -_w); + if( _w < MIN_ELEMENT_SIZE){ + //_x += Math.abs( MIN_ELEMENT_SIZE -_w); _x = currentX; - _w = MIN_OBJECT_SIZE; + _w = MIN_ELEMENT_SIZE; } - if( _h < MIN_OBJECT_SIZE){ - //_y += Math.abs( MIN_OBJECT_SIZE -_h); + if( _h < MIN_ELEMENT_SIZE){ + //_y += Math.abs( MIN_ELEMENT_SIZE -_h); _y = currentY; - _h = MIN_OBJECT_SIZE; + _h = MIN_ELEMENT_SIZE; } } else if( currentElement.type === COMIC_ELEMENT_TYPE_TEXT){ return; } else - if( _w < -MIN_OBJECT_SIZE || _h < -MIN_OBJECT_SIZE){ + if( _w < -MIN_ELEMENT_SIZE || _h < -MIN_ELEMENT_SIZE){ - if( _w < -MIN_OBJECT_SIZE && _h > MIN_OBJECT_SIZE){ + if( _w < -MIN_ELEMENT_SIZE && _h > MIN_ELEMENT_SIZE){ // flipH _memoryX = _x; baseX = _x = _x +_w; baseY = _y; baseW = _w = _memoryX -_x; baseH = _h; - flip( false, true); + flip( true, false); flipV = currentElement.flipV(); } else - if( _w > MIN_OBJECT_SIZE && _h < -MIN_OBJECT_SIZE){ + if( _w > MIN_ELEMENT_SIZE && _h < -MIN_ELEMENT_SIZE){ // flipV _memoryY = _y; baseX = _x; baseY = _y = _y +_h; baseW = _w; baseH = _h = _memoryY -_y; - flip( true, false); + flip( false, true); flipH = currentElement.flipH(); } else { // flipVH @@ -2360,8 +2468,13 @@ pettanr.editor = ( function(){ onShiftUpdate: update, onCtrlUpdate: update } - })(), - POSITION_OPERATOR = ( function(){ + })(); + +/* -------------------------------------------------------------------------------------------- + * POSITION_OPERATOR + * - comicElementOperator + */ + var POSITION_OPERATOR = ( function(){ var MOUSE_CURSOR = updateMouseCursor, GRID_ENABLED = GRID_CONTROL.enabled; @@ -2376,7 +2489,7 @@ pettanr.editor = ( function(){ y = _y !== undefined ? _y : y; RESIZE_OPERATOR.update( x, y); currentElement.resize( x, y); - COMIC_ELEMENT_OPERATION_MANAGER.updateInfomation( x, y); + INFOMATION_WINDOW.update( currentElement); } return { @@ -2417,13 +2530,12 @@ pettanr.editor = ( function(){ })(); -/* - * -------------------------------------------------------------------------------------------- +/* -------------------------------------------------------------------------------------------- * COMIC_ELEMENT_OPERATION_MANAGER */ var COMIC_ELEMENT_OPERATION_MANAGER = ( function(){ var MOUSE_CURSOR = updateMouseCursor, - SAVE = HISTORY.saveState, + SAVE = HISTORY_CONTROL.saveState, GRID_ENABLED = GRID_CONTROL.enabled, HIT_AREA = MOUSE_HIT_AREA, currentIsTextElement = false, @@ -2441,23 +2553,7 @@ pettanr.editor = ( function(){ RESIZE_OPERATOR.update( currentx, currenty, currentw, currenth); currentIsTextElement === true && TAIL_OPERATOR.update( currentw, currenth, angle); CONSOLE_CONTROLER.show( currentElement, currentw, currenth); - updateInfomation( currentx, currenty, currentElement.z, angle, currentw, currenth); - } - function updateInfomation( _x, _y, _z, _a, _w, _h, keepAspect){ - _w = _w !== undefined ? _w : currentw; - _h = _h !== undefined ? _h : currenth; - INFOMATION_WINDOW.update( - currentElement === null ? -1 : currentElement.type, - _x !== undefined ? _x : currentx, - _y !== undefined ? _y : currenty, - _z !== undefined ? _z : ( currentElement === null ? '*' : currentElement.z), - _a !== undefined ? Math.floor( _a) : ( currentIsTextElement === true ? Math.floor( angle) : '-'), - _w, - _h, - currentElement === null || currentIsTextElement === true ? '-' : ( currentElement.actualW() === 0 ? '?' : Math.floor( _w / currentElement.actualW() *100)), - currentElement === null || currentIsTextElement === true ? '-' : ( currentElement.actualH() === 0 ? '?' : Math.floor( _h / currentElement.actualH() *100)), - currentElement === null || currentIsTextElement === true ? '-' : currentElement.keepAspect - ); + INFOMATION_WINDOW.update( currentElement); } function show( _currentElement){ currentElement === null && RESIZE_OPERATOR.show( _currentElement); @@ -2476,15 +2572,34 @@ pettanr.editor = ( function(){ ); } } - function hide(){ + + pettanr.key.addKeyUpdateEvent( pettanr.view.EDITOR, 16, undefined, undefined, function( e){ + currentOperator !== null && currentOperator.onShiftUpdate && currentOperator.onShiftUpdate(); + }); + pettanr.key.addKeyUpdateEvent( pettanr.view.EDITOR, 17, undefined, undefined, function( e){ + currentOperator !== null && currentOperator.onCtrlUpdate && currentOperator.onCtrlUpdate(); + }); + pettanr.key.addKeyDownEvent( pettanr.view.EDITOR, 27, false, false, function( e){ + currentOperator !== null && currentOperator.onCancel && currentOperator.onCancel(); + currentOperator = null; + }); + return { + open: function(){ + this.hide(); + }, + close: function(){ + + }, + hide: function(){ currentElement !== null && RESIZE_OPERATOR.hide(); currentElement = null; MOUSE_CURSOR( ''); TAIL_OPERATOR.hide(); CONSOLE_CONTROLER.hide(); - updateInfomation(); - } - function restoreState( arg){ + INFOMATION_WINDOW.update( null); + }, + resize: resize, + restoreState: function( arg){ if( arg && arg.length !== 8) return; var _currentElement = arg[ 0], _x = arg[ 1], _y = arg[ 2], _w = arg[ 3], _h = arg[ 4], @@ -2497,8 +2612,8 @@ pettanr.editor = ( function(){ currentOperator !== null && currentOperator.onCancel && currentOperator.onCancel(); currentOperator = null; currentElement === _currentElement ? resize( _x, _y, _w, _h, _a) : show( _currentElement); - } - function saveComicElementStatus( startX, startY, startW, startH, startA, startFilpV, startFilpH){ + }, + saveStatus: function( startX, startY, startW, startH, startA, startFilpV, startFilpH){ startX = startX !== undefined ? startX : currentx; startY = startY !== undefined ? startY : currenty; startW = startW !== undefined ? startW : currentw; @@ -2506,58 +2621,14 @@ pettanr.editor = ( function(){ startA = startA !== undefined ? startA : angle; startFilpV = startFilpV !== undefined ? startFilpV : flipV; startFilpH = startFilpH !== undefined ? startFilpH : flipH; - currentElement && SAVE( restoreState, + currentElement && SAVE( COMIC_ELEMENT_OPERATION_MANAGER.restoreState, [ currentElement, startX, startY, startW, startH, startA, startFilpV, startFilpH], [ currentElement, currentx, currenty, currentw, currenth, angle, flipV, flipH] ); - } - pettanr.key.addKeyUpdateEvent( pettanr.view.EDITOR, 16, undefined, undefined, function( e){ - currentOperator !== null && currentOperator.onShiftUpdate && currentOperator.onShiftUpdate(); - }); - pettanr.key.addKeyUpdateEvent( pettanr.view.EDITOR, 17, undefined, undefined, function(){ - currentOperator !== null && currentOperator.onCtrlUpdate && currentOperator.onCtrlUpdate(); - }); - pettanr.key.addKeyDownEvent( pettanr.view.EDITOR, 27, false, false, function(){ - currentOperator !== null && currentOperator.onCancel && currentOperator.onCancel(); - currentOperator = null; - }); - return { - init: function(){ - hide(); - delete COMIC_ELEMENT_OPERATION_MANAGER.init; }, - hide: hide, - resize: resize, - restoreState: restoreState, - updateInfomation: updateInfomation, - saveStatus: saveComicElementStatus, busy: function(){ return currentOperator !== null; }, - hitareaX: function( _comicElement, _x){ - if( _comicElement === currentElement){ - var _consoleX = CONSOLE_CONTROLER.x(); - return currentx +( _consoleX < 0 ? _consoleX : 0) -HIT_AREA; - } - return _x -HIT_AREA; - }, - hitareaY: function( _comicElement, _y){ - return _y -HIT_AREA; - }, - hitareaW: function( _comicElement, _w){ - if( _comicElement === currentElement){ - var _consoleW = CONSOLE_CONTROLER.w(); - return ( _consoleW < currentw ? currentw : _consoleW) +HIT_AREA *2; - } - return _w +HIT_AREA *2; - }, - hitareaH: function( _comicElement, _h){ - if( _comicElement === currentElement){ - var _consoleY = CONSOLE_CONTROLER.y(); - return ( _consoleY < currenth ? currenth : _consoleY +CONSOLE_CONTROLER.h()) +HIT_AREA *2; - } - return _h +HIT_AREA *2; - }, hitTest: function( _mouseX, _mouseY, _comicElement){ var _x, _y, _w, _h; if( _comicElement === currentElement){ @@ -2621,10 +2692,6 @@ pettanr.editor = ( function(){ h: h, z: z, timing: timing, - hitareaX: function(){ return OPERATOR.hitareaX( this, this.x);}, - hitareaY: function(){ return OPERATOR.hitareaY( this, this.y);}, - hitareaW: function(){ return OPERATOR.hitareaW( this, this.w);}, - hitareaH: function(){ return OPERATOR.hitareaH( this, this.h);}, hitTest: function( _mouseX, _mouseY){ return OPERATOR.hitTest( _mouseX, _mouseY, this);}, shift: function( _shiftX, _shiftY){ update( this.x +_shiftX, this.y +_shiftY); @@ -2643,8 +2710,8 @@ pettanr.editor = ( function(){ } } }; -/* - * -------------------------------------------------------------------------------------------- + +/* -------------------------------------------------------------------------------------------- * ImageElementClass */ var jqImageElementOrigin; @@ -2653,7 +2720,7 @@ pettanr.editor = ( function(){ var JQ_WRAPPER = jqImageElementOrigin.clone( true), OPERATOR = COMIC_ELEMENT_OPERATION_MANAGER, - SAVE = HISTORY.saveState, + SAVE = HISTORY_CONTROL.saveState, HIT_AREA = MOUSE_HIT_AREA, reversibleImage = null, actualW = 0, actualH = 0, @@ -2779,12 +2846,9 @@ pettanr.editor = ( function(){ */ -/* - * -------------------------------------------------------------------------------------------- +/* -------------------------------------------------------------------------------------------- * TextElementClass * - * ELM はpettanr.domで書き出したものを突っ込むcreateの場合 - * * type * 0.none * 1.speach balloon @@ -2807,7 +2871,7 @@ pettanr.editor = ( function(){ TEXT_ELM = JQ_WRAPPER.find( 'td,.speach-inner').eq( 0), OPERATOR = COMIC_ELEMENT_OPERATION_MANAGER, HIT_AREA = MOUSE_HIT_AREA, - SAVE = HISTORY.saveState, + SAVE = HISTORY_CONTROL.saveState, instance; JQ_WRAPPER.find( 'img').eq( 0).replaceWith( XBROWSER_BALLOON.elm); @@ -2934,21 +2998,22 @@ pettanr.editor = ( function(){ ].join( ''); }, getAsXML: function(){} - } ); } - +/* -------------------------------------------------------------------------------------------- + * COMIC_ELEMENT_CONTROL + * - mouseEventListener + */ var COMIC_ELEMENT_CONTROL = ( function(){ - var SAVE = HISTORY.saveState, + var SAVE = HISTORY_CONTROL.saveState, ELM_CONTAINER = document.getElementById( 'comic-element-container'), currentElement = null, currentLockTest = false, currentLock = false, panelX, panelY, panelW, panelH, startX, startY; - /* * append, remove, replace * @@ -2993,14 +3058,14 @@ pettanr.editor = ( function(){ COMIC_ELEMENT_ARRAY[ insertIndex].$.before( _jqElm.fadeIn()); COMIC_ELEMENT_ARRAY.splice( insertIndex, 0, _comicElement); } - numberingComicElement(); + renumber(); } function removeComicElement( _comicElement) { var l = COMIC_ELEMENT_ARRAY.length; for( var i=0; i 0){ + COMIC_ELEMENT_ARRAY.shift().destroy(); + } + }, + remove: removeComicElement, + restore: restoreComicElement, + replace: replaceComicElement, + restoreReplace: restoreReplaceElement, onPanelResize : function ( _panelX, _panelY, _panelW, _panelH, isResizerTopAction){ /* * リサイズが、ResizerTopによって行われた場合、comicElementのyを動かして見かけ上動かないようにする。 @@ -3135,8 +3209,9 @@ pettanr.editor = ( function(){ onMouseUp: function( _mouseX, _mouseY){ var ret = currentElement !== null && currentElement.busy() === true; ret === true && currentElement.onMouseUp( _mouseX -startX || panelX, _mouseY -startY || panelY); - RESIZE_OPERATOR.lock( currentLockTest); - currentLock = currentLockTest; + currentLock = currentLockTest === true && currentElement.hitTest( _mouseX -panelX, _mouseY -panelY) === true; + RESIZE_OPERATOR.lock( currentLock); + INFOMATION_WINDOW.lock( currentLock); return ret; }, onMouseDown: function( _mouseX, _mouseY){ @@ -3155,12 +3230,13 @@ pettanr.editor = ( function(){ h = h || 150; //ActualHeight x = x || Math.floor( panelW /2 -w /2); y = y || Math.floor( panelH /2 -h /2); - IMAGE_GROUP_EXPROLER.show( function( _url, _w, _h){ - var _comicElement = ImageElementClass.apply( {}, [ _url, imagesetID, x, y, z || -1, w, h, COMIC_ELEMENT_ARRAY.length]); + function onImageSelect( _url, _w, _h){ + var _comicElement = new ImageElementClass( _url, imagesetID, x, y, z || -1, _w, _h, COMIC_ELEMENT_ARRAY.length); appendComicElement( _comicElement); _comicElement.animate( undefined, undefined, _w, _h); - SAVE( restoreComicElement, [ false, _comicElement], [ true, _comicElement], true); - }); + SAVE( restoreComicElement, [ false, _comicElement], [ true, _comicElement], true); + } + IMAGE_GROUP_EXPROLER.show( onImageSelect); }, createTextElement: function( type, angle, text, x, y, z, w, h){ type = type || 0; @@ -3313,43 +3389,28 @@ pettanr.editor = ( function(){ return { init: function( _option){ option = _option; + }, firstOpen: function(){ - var jqWindow = pettanr.jqWindow(); - windowW = jqWindow.width(); - windowH = jqWindow.height(); - - jqEditor = $( '#editor'); - /* * MOUSE_LISTENER_ARRAY は、表示順に格納.手前の要素が最初 * MENU_BAR_CONTROL, * WINDOW_CONTROL, * COMIC_ELEMENT_CONTROL, * PANEL_CONTROL - * .busy() === true なら、そのままonMouseMove()にイベントを流す.これはArrayの後ろから、奥の表示要素から + * .busy() === true なら、そのままonMouseMove()にイベントを流す. * onMouseMove()に流してみて、false が帰れば、次にリスナーにも流す. */ MOUSE_LISTENER_ARRAY.push( MENU_BAR_CONTROL, WINDOWS_CONTROL, PANEL_RESIZER_TOP, PANEL_RESIZER_BOTTOM, COMIC_ELEMENT_CONTROL, PANEL_CONTROL); - - HISTORY.init(); - - WINDOWS_CONTROL.init(); - GRID_CONTROL.init(); - PANEL_CONTROL.init(); CONSOLE_CONTROLER.init(); - COMIC_ELEMENT_OPERATION_MANAGER.init(); - COMIC_ELEMENT_CONTROL.init(); - - // last - MENU_BAR_CONTROL.init(); + OUTPUT_CONSOLE.init(); TEXT_EDITOR_CONTROL.init(); IMAGE_GROUP_EXPROLER.init(); /* - * centering + * centering */ pettanr.key.addKeyDownEvent( pettanr.view.EDITOR, 96, false, true, centering); // ctrl + 0 pettanr.key.addKeyDownEvent( pettanr.view.EDITOR, 48, false, true, centering); // ctrl + 0 @@ -3367,22 +3428,46 @@ pettanr.editor = ( function(){ delete pettanr.editor.firstOpen; }, - onOpen: function( _option){ - pettanr.editor.firstOpen !== undefined && pettanr.editor.firstOpen(); - - // HISTORY.onOpen(); - // WINDOWS_CONTROL.onOpen(); - // COMIC_ELEMENT_CONTROL.onOpen(); - // MENU_BAR_CONTROL.onOpen(); - // TEXT_EDITOR_CONTROL.onOpen(); - // IMAGE_GROUP_EXPROLER.onOpen(); - }, - onClose: function(){ - }, - onWindowResize: function( _windowW, _windowH){ + onOpen: function( _file){ + if( pettanr.file.isFileInstance( _file) === true){ + // pettanr.file.isPettanFileInstance( _file) === true + // + } + jqEditor = jqEditor || $( '#editor'); + + HISTORY_CONTROL.open(); + + WINDOWS_CONTROL.open(); + + GRID_CONTROL.open(); + PANEL_CONTROL.open(); + + COMIC_ELEMENT_OPERATION_MANAGER.open(); + COMIC_ELEMENT_CONTROL.open(); + + // last + MENU_BAR_CONTROL.open(); + + pettanr.editor.firstOpen !== undefined && pettanr.editor.firstOpen(); + }, + onClose: function(){ + HISTORY_CONTROL.close(); + + WINDOWS_CONTROL.close(); + + GRID_CONTROL.close(); + PANEL_CONTROL.close(); + + COMIC_ELEMENT_OPERATION_MANAGER.close(); + COMIC_ELEMENT_CONTROL.close(); + + // last + MENU_BAR_CONTROL.open(); + }, + onWindowResize: function( _windowW, _windowH){ windowW = _windowW; windowH = _windowH; - + if( pettanr.editor.firstOpen) return; /* * ieは +'px'が不要みたい */ @@ -3397,3 +3482,767 @@ pettanr.editor = ( function(){ MIN_HEIGHT: 320 } })(); + +// create hidden iframe +// write script +// setInterval +pettanr.proxy = ( function(){ + + function FormProxy( formJsUrl, callback){ + var timer = null, + iWin, idoc; + + pettanr.util.createIframe( 'id00000', onCreateIframe); + + function onCreateIframe( _iframe){ + iWin = _iframe.contentWindow; + idoc = _iframe.contentWindow.document; + + idoc.open(); + idoc.write( ''); + idoc.writeln( '