/*\r
* pettanR system.js\r
- * version 0.5.8\r
+ * version 0.5.9\r
* \r
* \r
* Type\r
}\r
};\r
\r
+/*\r
+ * UA\r
+ * \r
+ * detect userAgent\r
+ * detect plug in\r
+ */\r
+ var UA = ( function(){\r
+ var ua = (function(){\r
+ var acme = {};\r
+ \r
+ var n = navigator;\r
+ var dua = n.userAgent;\r
+ var dav = n.appVersion;\r
+ var tv = parseFloat(dav);\r
+ acme.isOpera = (dua.indexOf("Opera") >= 0) ? tv: undefined;\r
+ acme.isKhtml = (dav.indexOf("Konqueror") >= 0) ? tv : undefined;\r
+ acme.isWebKit = parseFloat(dua.split("WebKit\/")[1]) || undefined;\r
+ acme.isChrome = parseFloat(dua.split("Chrome\/")[1]) || undefined;\r
+ acme.isGecko = (dua.indexOf("Gecko\/") >= 0) ? parseFloat(dua.split("rv:")[1].replace( /^(\d*\.\d*)\.(\d*)/, '$1$2' )) : undefined;\r
+ var index = Math.max(dav.indexOf("WebKit"), dav.indexOf("Safari"), 0);\r
+ if(index && !acme.isChrome){\r
+ acme.isSafari = parseFloat(dav.split("Version/")[1]);\r
+ if(!acme.isSafari || parseFloat(dav.substr(index + 7)) <= 419.3){\r
+ acme.isSafari = 2;\r
+ }\r
+ }\r
+ if(document.all && !acme.isOpera){\r
+ acme.isIE = parseFloat(dav.split("MSIE ")[1]) || undefined;\r
+ }\r
+ \r
+ return acme;\r
+ })(),\r
+ isIE = navigator.userAgent.toLowerCase().indexOf( 'msie') !== -1,\r
+ ieVersion = isIE === true ? parseInt( navigator.appVersion.toLowerCase().replace( /.*msie[ ]/, '').match( /^[0-9]+/)) : 0,\r
+ ieRenderingVersion = ieVersion === 8 ? document.documentMode : ieVersion,\r
+ isStanderdMode = document.compatMode === 'CSS1Compat',\r
+ ActiveX = ( function(){\r
+ if( isIE === false || ieVersion > 8 ) return false;\r
+ var b = document.body,\r
+ c = b.className || '',\r
+ x,\r
+ ret = undefined, //pettanr.URL_PARAMS.ActiveX,\r
+ ns = 'pettanr-ActiveX-',\r
+ enabled = 'enabled',\r
+ disabled = 'disabled';\r
+ if( ret !== true && ret !== false){\r
+ if( b.className.indexOf( ns + enabled ) !== -1 ) return true;\r
+ if( b.className.indexOf( ns + disabled ) !== -1 ) return false;\r
+ x = document.createElement( 'div' );\r
+ b.appendChild(x);\r
+ x.style.cssText = 'width:1px;height:1px;line-height:1px;filter:progid:DXImageTransform.Microsoft.Shadow()';\r
+ ret = x.offsetHeight > 1;\r
+ b.removeChild(x);\r
+ }\r
+ b.className += [ c !== '' ? ' ' : c, ns, ret === true ? enabled : disabled ].join( '');\r
+ return ret;\r
+ })(),\r
+ VML = ( function(){\r
+ if( ActiveX === false || isIE === false || ieVersion > 8) return false;\r
+ var globalObjectName = 'detect_activex',//Util.createGlobalUniqueName(),\r
+ script,\r
+ id = 'detectVML';\r
+ document.write( [ '<!--[if gte vml 1]><script id="', id, '">window', '.', globalObjectName, '=1;<\/script><![endif]-->'].join( ''));\r
+ if( window[ globalObjectName ] === 1 ){\r
+ script = document.getElementById( id );\r
+ script.parentNode.removeChild( script );\r
+ window[ globalObjectName ] = null;\r
+ return true;\r
+ }\r
+ return false;\r
+ })(),\r
+ isStandAloneMode = ( function(){\r
+ if( isIE === false) return false;\r
+ if( VML === true) return false;\r
+ var globalObjectName = 'detect_standalone', //Util.createGlobalUniqueName(),\r
+ script,\r
+ id = 'detectStandAlone';\r
+ document.write( [ '<!--[if IE ', Math.floor( ieVersion ), ']><script id="', id, '">window', '.', globalObjectName, '=1;<\/script><![endif]-->'].join( ''));\r
+ if( window[globalObjectName] === 1){\r
+ script = document.getElementById( id);\r
+ script.parentNode.removeChild( script);\r
+ window[globalObjectName] = null;\r
+ return false;\r
+ }\r
+ return true;\r
+ })();\r
+ return {\r
+ IE: ua.isIE,\r
+ GECKO: ua.isGecko,\r
+ OPERA: ua.isOpera,\r
+ KHTML: ua.isKhtml,\r
+ WEBKIT: ua.isWebKit,\r
+ CHROME: ua.isChrome,\r
+ isIE: isIE,\r
+ ieVersion: ieVersion,\r
+ ieRenderingVersion: ieRenderingVersion,\r
+ isStanderdMode: isStanderdMode,\r
+ ACTIVEX: ActiveX,\r
+ VML: VML,\r
+ STANDALONE: isStandAloneMode,\r
+ VENDER_PREFIX: ( function() {\r
+ var ua = navigator.userAgent.toLowerCase();\r
+ if ( ua.indexOf('opera') !== -1 ){\r
+ return 'O';\r
+ } else if ( ua.indexOf('msie') !== -1 ){\r
+ return 'ms';\r
+ } else if ( ua.indexOf('webkit') !== -1 ){\r
+ return 'webkit';\r
+ } else if ( navigator.product === 'Gecko' ){\r
+ return 'Moz';\r
+ }\r
+ return '';\r
+ })(),\r
+ startVML: function(){\r
+ delete UA.startVML;\r
+ if( UA.VML !== true) return false;\r
+ if (!document.namespaces["v"]) {\r
+ document.namespaces.add("v", "urn:schemas-microsoft-com:vml", "#default#VML");\r
+ }\r
+ document.createStyleSheet().cssText = "v\:shape,v\:image{behavior:url(#default#VML);display:block;};";\r
+ }\r
+ }\r
+ })();\r
+\r
+\r
/* ----------------------------------------------------\r
* Util\r
* \r
var ret = doc.createElement( 'DIV' );\r
body.appendChild( ret );\r
\r
- ret.id = 'elmSizeGetter';\r
- ret.style.cssText = 'position:absolute;left:0;top:-9999px;visibility:hidden';\r
+ ret.id = 'elmSizeGetter';\r
+ ret.style.cssText = 'position:absolute;left:0;top:-9999px;visibility:hidden';\r
\r
body.removeChild( ret );\r
return ret;\r
})(),\r
CLEAN_TARGET_ELEMENT = 'script,style,object,applet,embed,iframe,frame,base,bgsound,frameset,listing'.split( ',' );\r
\r
- /* clean comment node */\r
- cleanCommnetNode();\r
+ var UNIT_RATIO = ( function( elm ){\r
+ var ret = {},\r
+ unit,\r
+ units = 'px,cm,mm,in,pt,pc'.split( ',' );\r
+ \r
+ body.appendChild( elm );\r
+ \r
+ for( var i=units.length; i; ){\r
+ unit = units[ --i ];\r
+ elm.style.width = 1000 + unit;\r
+ ret[ unit ] = elm.offsetWidth / 1000;\r
+ };\r
+ body.removeChild( elm );\r
+ elm.style.cssText = '';\r
+ \r
+ return ret;\r
+ })( ELM_SIZE_GETTER );\r
+ \r
+ var FONT_SIZE_RATIO = ( function( elm ){\r
+ var ret = {},\r
+ size,\r
+ list = 'xx-large,x-large,large,larger,medium,small,smaller,x-small,xx-small'.split( ',' );\r
+ \r
+ body.appendChild( elm );\r
+ elm.style.cssText = 'font-size:100px;line-height:1em;';\r
+ elm.appendChild( document.createTextNode( 'X' ) );\r
+ \r
+ base = elm.offsetHeight;\r
+ \r
+ for( var i = list.length; i; ){\r
+ size = list[ --i ];\r
+ elm.style.fontSize = size;\r
+ ret[ size ] = elm.offsetHeight;// / base;\r
+ };\r
+ body.removeChild( elm );\r
+ elm.style.cssText = '';\r
+ elm.removeChild( elm.firstChild );\r
+ \r
+ return ret;\r
+ })( ELM_SIZE_GETTER );\r
\r
- /* clean noscript */\r
- ( function(){\r
- var nodeNoscript = doc.getElementsByTagName( 'noscript' ),\r
- noscript;\r
- for( var i=0; i<nodeNoscript.length; ++i ){\r
- noscript = nodeNoscript[i];\r
- noscript.parentNode && noscript.parentNode.removeChild( noscript );\r
+ var SPECIAL = ( function(){\r
+ var ret = {};\r
+ if( UA.isIE === true && UA.ieVersion < 9 ){\r
+ if( UA.ACTIVEX === true ){\r
+ // ret.opacity = 'ActiveXOpacity';\r
+ ret.getFilters = function( style ){\r
+ var filters = ( style.filter || '' ).split( ') ' ),\r
+ ret = {},\r
+ i = filters.length,\r
+ filter, name, props, prop, j, l, key, v;\r
+ for( ; i; ){\r
+ filter = filters[ --i ].split( ' ' ).join( '' ).split( '(' );\r
+ if( filter.length !== 2 ) continue;\r
+ name = filter[ 0 ].split( '.' ); // progid:DXImageTransform.Microsoft.Shadow(color=#666666,direction=120,strength=9)\r
+ props = filter[ 1 ].split( ',' ); // \r
+ filter = {};\r
+ for( j = 0, l = props.length; j < l; ++j ){\r
+ prop = props[ j ].split( '=' );\r
+ key = prop[ 0 ].toLowerCase();\r
+ v = prop[ 1 ];\r
+ filter[ key ] = v; //v.charAt( 0 ) === '#' ? v : parseInt( v );\r
+ };\r
+ ret[ name[ name.length - 1 ] ] = filter;\r
+ };\r
+ return ret;\r
+ };\r
+ } else {\r
+ ret.opacity = null;\r
+ };\r
+ } else {\r
+ var style = document.documentElement.style;\r
+ ret.opacity = style.opacity !== undefined ? 'opacity' : \r
+ style.MozOpacity !== undefined ? 'MozOpacity' :\r
+ style.KhtmlOpacity !== undefined ? 'KhtmlOpacity' :\r
+ style[ '-khtml-opacity' ] !== undefined ? 'KhtmlOpacity' : null;\r
};\r
+ \r
+ return ret;\r
})();\r
- \r
- function cleanCommnetNode( _targetElm ){\r
- search( _targetElm || body );\r
- \r
- function search( _elm ){\r
- if( !_elm ) return;\r
- if( _elm.nodeType === 8 ){\r
- _elm.parentNode.removeChild( _elm );\r
- return;\r
+ \r
+ function cssToObject( css ){\r
+ var ret = {}, i, nv, n, v, parse = Util.parse, isNumber = Type.isNumber;\r
+ if( Type.isString( css ) === true ){\r
+ css = css.split( ';' );\r
+ for( i = css.length; i; ){\r
+ nv = css[ --i ].split( ':' ); // filter の場合, progid: がくる\r
+ n = nv.shift();\r
+ if( isNumber( parse( n ) ) === true ) continue;\r
+ v = nv.join( '' );\r
+ while( v.charAt( 0 ) === ' ' ) v = v.substr( 1 );\r
+ ret[ Util.camelize( n ) ] = parse( v );\r
};\r
- var i, l, _children = _elm.childNodes, _array = [];\r
- if( _children && typeof _children.length === 'number' ){\r
- // liveNode > array\r
- for( i=0, l=_children.length; i<l; ++i ){\r
- _array.push( _children[ i ] );\r
- };\r
- while( _array.length !== 0 ){\r
- search( _array.shift() );\r
- };\r
+ } else {\r
+ for( n in css ){\r
+ if( Type.isNumber( parse( n ) ) === false ) ret[ n ] = parse( css[ n ] );\r
};\r
};\r
- };\r
+ \r
+ if( SPECIAL.getFilters ){\r
+ var f = SPECIAL.getFilters( ret );\r
+ ret.filter = f;\r
+ ret.opacity = f.alpha && f.alpha.opacity ? f.alpha.opacity / 100 : 1;\r
+ } else {\r
+ ret.opacity = SPECIAL.opacity !== null ? ret[ SPECIAL.opacity ] : 1;\r
+ }\r
+ \r
+ return ret;\r
+ }; \r
+ \r
+ /* clean comment node */\r
+ window.setTimeout( function(){\r
+ Util.cleanCommnetNode();\r
+ \r
+ /* clean noscript */\r
+\r
+ var noscripts = doc.getElementsByTagName( 'noscript' ),\r
+ ns;\r
+ for( var i = noscripts.length; i; ){\r
+ ns = noscripts[ --i ];\r
+ ns.parentNode && ns.parentNode.removeChild( ns );\r
+ };\r
+ }, 0 );\r
\r
return {\r
+ parse: function( v ){\r
+ if( Type.isString( v ) === true ){\r
+ if( v === 'true' ) return true;\r
+ if( v === 'false' ) return false;\r
+ if( v === 'null' ) return null;\r
+ if( v === 'undefined' ) return undefined;\r
+ if( v === 'NaN' ) return NaN;\r
+ if( v === '' ) return v;\r
+ var _v = v.split( ' ' ).join( '' ),\r
+ n = _v - 0;\r
+ if( '' + n === _v || '' + n === '0' + _v ) return n - 0;\r
+ };\r
+ return v;\r
+ },\r
extend: function( baseInstance, extend ){\r
for( var key in extend ){\r
if( Type.isUndefined( baseInstance[ key ] ) === true ){\r
baseInstance[ key ] = extend[ key ];\r
} else {\r
alert( 'extend error' );\r
- }\r
- }\r
+ };\r
+ };\r
return baseInstance;\r
}, \r
- cleanCommnetNode: cleanCommnetNode,\r
+ cleanCommnetNode: function ( _targetElm ){\r
+ search( _targetElm || body );\r
+ \r
+ function search( _elm ){\r
+ if( !_elm ) return;\r
+ if( _elm.nodeType === 8 ){\r
+ _elm.parentNode.removeChild( _elm );\r
+ return;\r
+ };\r
+ if( _elm.nodeType === 1 ){\r
+ var _array = Util.copyArray( _elm.childNodes ); // liveNode > array\r
+ while( _array.length > 0 ) search( _array.shift() );\r
+ };\r
+ };\r
+ },\r
cleanElement: function( _targetElm ){\r
- var _nodes, _elm, _array, j, m;\r
- for( var i=0, l=CLEAN_TARGET_ELEMENT.length; i<l; ++i){\r
- _nodes = _targetElm.getElementsByTagName( CLEAN_TARGET_ELEMENT[ i]);\r
- _array = [];\r
- for( j=0, m = _nodes.length; j<m; ++j){\r
- _array.push( _nodes[ j]);\r
- }\r
- for( j=0, m = _array.length; j<m; ++j){\r
- _elm = _nodes[ j];\r
- _elm.parentNode && _elm.parentNode.removeChild( _elm);\r
- }\r
- }\r
- cleanCommnetNode( _targetElm );\r
+ var _array, _elm, j, _css;\r
+ for( var i = CLEAN_TARGET_ELEMENT.length; i; ){\r
+ _array = Util.copyArray( _targetElm.getElementsByTagName( CLEAN_TARGET_ELEMENT[ --i ] ) );\r
+ for( j = _array.length; j; ){\r
+ _elm = _nodes[ --j ];\r
+ _elm.parentNode && _elm.parentNode.removeChild( _elm );\r
+ };\r
+ };\r
+ Util.cleanCommnetNode( _targetElm );\r
+ \r
if( UA.isIE === false ) return;\r
- _nodes = _targetElm.all || _targetElm.getElementsByName( '*' );\r
- for( i=0, l = _nodes.length; i<l; ++i){\r
- _elm = _nodes[ i ];\r
- _elm.style.filter = '';\r
- _elm.style.behavior = '';\r
- }\r
+ _nodes = _targetElm.all || _targetElm.getElementsByTagName( '*' );\r
+ for( i = _nodes.length; i; ){\r
+ _elm = _nodes[ --i ];\r
+ _css = Util.getInlineStyle( _elm );\r
+ _css.filter = null;\r
+ _css.behavior = null;\r
+ _elm.style.cssText = Util.toCssText( _css );\r
+ };\r
+ },\r
+ getInlineStyle: function( _elm ){\r
+ return cssToObject( _elm.style.cssText );\r
+ },\r
+ getComputedStyle: function( elm ){\r
+ /* if( window.getComputedStyle ){\r
+ Util.getComputedStyle = function( elm ){\r
+ return cssToObject( window.getComputedStyle( elm, '' ) );\r
+ };\r
+ } else */\r
+ if( document.defaultView && document.defaultView.getComputedStyle ){\r
+ Util.getComputedStyle = function( elm ){\r
+ var obj = document.defaultView.getComputedStyle( elm, '' );\r
+ return cssToObject( obj.cssText || obj );\r
+ };\r
+ } else {\r
+ Util.getComputedStyle = function( elm ){\r
+ return cssToObject( elm.currentStyle );\r
+ };\r
+ };\r
+ return Util.getComputedStyle( elm );\r
+ },\r
+ camelize: function( cssProp ){\r
+ var parts = cssProp.split( ' ' ).join( '' ).split( '-' ),\r
+ l = parts.length;\r
+ if( l === 1 ) return parts[ 0 ];\r
+ \r
+ var camelized = cssProp.charAt(0) === '-'\r
+ ? parts[ 0 ].charAt( 0 ).toUpperCase() + parts[ 0 ].substring( 1 )\r
+ : parts[ 0 ];\r
+ \r
+ for( var i = 1; i < l; ++i ){\r
+ camelized += parts[ i ].charAt( 0 ).toUpperCase() + parts[ i ].substring( 1 );\r
+ };\r
+ return camelized;\r
+ },\r
+ uncamelize: function( str ){\r
+ return str.split( ' ' ).join( '' ).replace( /[A-Z]/g, '-$&' ).toLowerCase();\r
+ },\r
+ toCssText: function( _css ){\r
+ var ret = [], v;\r
+ for( var p in _css ){\r
+ v = _css[ p ];\r
+ v && ret.push( [ p, v ].join( ':' ) );\r
+ };\r
+ return ret.join( ';' );\r
+ },\r
+ pxTo: function( _px, _unit ){\r
+ return _px / ( UNIT_RATIO[ _unit ] || 1 );\r
+ },\r
+ toPx: function( x, _unit ){\r
+ return x * ( UNIT_RATIO[ _unit ] || 1 );\r
+ },\r
+ absoluteFontSizeToPx: function( fontsize ){\r
+ return FONT_SIZE_RATIO[ fontsize ] || 0;\r
},\r
getElementSize: function( _elm ){\r
if( Type.isHTMLElement( _elm ) === false ){\r
\r
return size;\r
},\r
- getAbsolutePath: function( path) {\r
- var e = document.createElement("div");\r
- e.innerHTML = '<a href=\"' + path + '\" />';\r
- return e.firstChild.href;\r
+ getAbsolutePath: function( path ){\r
+ var elm = document.createElement('div');\r
+ body.appendChild( elm );\r
+ elm.innerHTML = '<a href=\"' + path + '\" />';\r
+ body.removeChild( elm );\r
+ return elm.firstChild.href;\r
},\r
getAbsolutePosition: function( _elm ){\r
// Find the destination's position\r
},\r
pullHtmlAsTemplete: function( html ){\r
var elm = document.createElement( 'div' );\r
+ body.appendChild( elm );\r
elm.innerHTML = html;\r
+ body.removeChild( elm );\r
return elm.firstChild;\r
},\r
- getElementsByClassName: function( _elm, _className, opt_tagName){\r
- var _all = !opt_tagName || opt_tagName === '*',\r
- _nodes = _all === true ? ( _elm.all || _elm.getElementsByTagName( '*')) : _elm.getElementsByTagName( opt_tagName),\r
- _node, _classes, ret = [];\r
- for( var i=0, l = _nodes.length; i<l; ++i){\r
- _node = _nodes[ i];\r
- _node.nodeType === 1 && this.hasClassName( _node, _className) === true && ret.push( _node);\r
- }\r
- return ret;\r
+ getElementsByClassName: function( _elm, _className, opt_tagName ){\r
+ var _all = !opt_tagName || opt_tagName === '*',\r
+ _livenodes = _all === true ? ( _elm.all || _elm.getElementsByTagName( '*' )) : _elm.getElementsByTagName( opt_tagName ),\r
+ sp = ' ',\r
+ _cnames = _className.replace( /\s+/g, sp ).split( sp ),\r
+ _cname,\r
+ _nodes = Util.copyArray( _livenodes );\r
+ \r
+ for( var i = _cnames.length; i; ){\r
+ _cname = _cnames[ --i ];\r
+ for( var j = 0; j < _nodes.length; ){\r
+ _node = _nodes[ j ];\r
+ if( _node.nodeType !== 1 || Util.hasClassName( _node, _cname ) === false ){\r
+ _nodes.splice( j, 1 );\r
+ } else {\r
+ ++j;\r
+ };\r
+ };\r
+ };\r
+ return _nodes;\r
},\r
getChildIndex: function( _parent, _child ){\r
- var _children = _parent.getElementsByTagName( _child.tagName ),\r
- l = _children.length;\r
- for( var i=0; i<l; ++i ){\r
- if( _children[ i ] === _child ) return i;\r
+ var _children = _parent.getElementsByTagName( _child.tagName );\r
+ for( var i = _children.length; i; ){\r
+ if( _children[ --i ] === _child ) return i;\r
};\r
return -1;\r
},\r
_node.parentNode && _node.parentNode.removeChild( _node);\r
}\r
},\r
- getIndex: function( _array, _element){\r
+ getIndex: function( _array, _element ){\r
if( Array.prototype.indexof ){\r
Util.getIndex = function( _array, _element){\r
return _array.indexof( _element);\r
- }\r
+ };\r
} else {\r
Util.getIndex = function( _array, _element){\r
- for( var i=0, l = _array.length; i<l; ++i){\r
- if( _array[ i] === _element) return i;\r
- }\r
- return -1; \r
- }\r
- }\r
- return Util.getIndex( _array, _element);\r
+ for( var i = _array.length; i; ){\r
+ if( _array[ --i ] === _element ) return i;\r
+ };\r
+ return -1;\r
+ };\r
+ };\r
+ return Util.getIndex( _array, _element );\r
},\r
copyArray: function( _array ){\r
- var ret = new Array( l );\r
- for( var i=0, l = _array.length; i<l; ++i ){\r
+ var l = _array.length,\r
+ ret = new Array( l );\r
+ for( var i=0; i<l; ++i ){\r
ret[ i ] = _array[ i ];\r
}\r
return ret;\r
*/\r
createGlobalUniqueName: function(){\r
var randomKey = null;\r
- while(true) {\r
+ while( true ){\r
randomKey = '_uniqueName'+(''+Math.random()).replace(/\./,'');\r
if( typeof window[randomKey] === 'undefined'){\r
break;\r
callback( el );\r
};\r
}\r
- }\r
- })();\r
-\r
-\r
-/*\r
- * UA\r
- * \r
- * detect userAgent\r
- * detect plug in\r
- */\r
- var UA = ( function(){\r
- var ua = (function(){\r
- var acme = {};\r
- \r
- var n = navigator;\r
- var dua = n.userAgent;\r
- var dav = n.appVersion;\r
- var tv = parseFloat(dav);\r
- acme.isOpera = (dua.indexOf("Opera") >= 0) ? tv: undefined;\r
- acme.isKhtml = (dav.indexOf("Konqueror") >= 0) ? tv : undefined;\r
- acme.isWebKit = parseFloat(dua.split("WebKit\/")[1]) || undefined;\r
- acme.isChrome = parseFloat(dua.split("Chrome\/")[1]) || undefined;\r
- acme.isGecko = (dua.indexOf("Gecko\/") >= 0) ? parseFloat(dua.split("rv:")[1].replace( /^(\d*\.\d*)\.(\d*)/, '$1$2' )) : undefined;\r
- var index = Math.max(dav.indexOf("WebKit"), dav.indexOf("Safari"), 0);\r
- if(index && !acme.isChrome){\r
- acme.isSafari = parseFloat(dav.split("Version/")[1]);\r
- if(!acme.isSafari || parseFloat(dav.substr(index + 7)) <= 419.3){\r
- acme.isSafari = 2;\r
- }\r
- }\r
- if(document.all && !acme.isOpera){\r
- acme.isIE = parseFloat(dav.split("MSIE ")[1]) || undefined;\r
- }\r
- \r
- return acme;\r
- })(),\r
- isIE = navigator.userAgent.toLowerCase().indexOf( 'msie') !== -1,\r
- ieVersion = isIE === true ? parseInt( navigator.appVersion.toLowerCase().replace( /.*msie[ ]/, '').match( /^[0-9]+/)) : 0,\r
- ieRenderingVersion = ieVersion === 8 ? document.documentMode : ieVersion,\r
- isStanderdMode = document.compatMode === 'CSS1Compat',\r
- ActiveX = ( function(){\r
- if( isIE === false || ieVersion > 8 ) return false;\r
- var b = document.body,\r
- c = b.className || '',\r
- x,\r
- ret = undefined, //pettanr.URL_PARAMS.ActiveX,\r
- ns = 'pettanr-ActiveX-',\r
- enabled = 'enabled',\r
- disabled = 'disabled';\r
- if( ret !== true && ret !== false){\r
- if( Util.hasClassName( b, ns + enabled) === true ) return true;\r
- if( Util.hasClassName( b, ns + disabled) === true ) return false;\r
- x = document.createElement( 'div' );\r
- b.appendChild(x);\r
- x.style.cssText = 'width:1px;height:1px;line-height:1px;filter:progid:DXImageTransform.Microsoft.Shadow()';\r
- ret = x.offsetHeight > 1;\r
- b.removeChild(x);\r
- }\r
- b.className += [ c !== '' ? ' ' : c, ns, ret === true ? enabled : disabled ].join( '');\r
- return ret;\r
- })(),\r
- VML = ( function(){\r
- if( ActiveX === false || isIE === false || ieVersion > 8) return false;\r
- var globalObjectName = Util.createGlobalUniqueName(),\r
- script,\r
- id = 'detectVML';\r
- document.write( [ '<!--[if gte vml 1]><script id="', id, '">window', '.', globalObjectName, '=1;<\/script><![endif]-->'].join( ''));\r
- if( window[globalObjectName] === 1){\r
- script = document.getElementById( id);\r
- script.parentNode.removeChild( script);\r
- window[globalObjectName] = null;\r
- return true;\r
- }\r
- return false;\r
- })(),\r
- isStandAloneMode = ( function(){\r
- if( isIE === false) return false;\r
- if( VML === true) return false;\r
- var globalObjectName = Util.createGlobalUniqueName(),\r
- script,\r
- id = 'detectStandAlone';\r
- document.write( [ '<!--[if IE ', Math.floor( ieVersion ), ']><script id="', id, '">window', '.', globalObjectName, '=1;<\/script><![endif]-->'].join( ''));\r
- if( window[globalObjectName] === 1){\r
- script = document.getElementById( id);\r
- script.parentNode.removeChild( script);\r
- window[globalObjectName] = null;\r
- return false;\r
- }\r
- return true;\r
- })();\r
- return {\r
- IE: ua.isIE,\r
- GECKO: ua.isGecko,\r
- OPERA: ua.isOpera,\r
- KHTML: ua.isKhtml,\r
- WEBKIT: ua.isWebKit,\r
- CHROME: ua.isChrome,\r
- isIE: isIE,\r
- ieVersion: ieVersion,\r
- ieRenderingVersion: ieRenderingVersion,\r
- isStanderdMode: isStanderdMode,\r
- ACTIVEX: ActiveX,\r
- VML: VML,\r
- STANDALONE: isStandAloneMode,\r
- VENDER_PREFIX: ( function() {\r
- var ua = navigator.userAgent.toLowerCase();\r
- if ( ua.indexOf('opera') !== -1 ){\r
- return 'O';\r
- } else if ( ua.indexOf('msie') !== -1 ){\r
- return 'ms';\r
- } else if ( ua.indexOf('webkit') !== -1 ){\r
- return 'webkit';\r
- } else if ( navigator.product === 'Gecko' ){\r
- return 'Moz';\r
- }\r
- return '';\r
- })(),\r
- startVML: function(){\r
- delete UA.startVML;\r
- if( UA.VML !== true) return false;\r
- if (!document.namespaces["v"]) {\r
- document.namespaces.add("v", "urn:schemas-microsoft-com:vml", "#default#VML");\r
- }\r
- document.createStyleSheet().cssText = "v\:shape,v\:image{behavior:url(#default#VML);display:block;};";\r
- }\r
- }\r
+ };\r
})();\r
\r
\r
* \r
*/ \r
\r
-( function( window, undefined ){\r
+( function( window, document, undefined ){\r
\r
var doc = window.document;\r
var body = doc.getElementsByTagName( 'body' )[ 0 ]; //( doc.compatMode || '' ) !== 'CSS1Compat' ? doc.body : doc.documentElement;// \r
getFileUID: function( FILEDATAorFILE ){\r
if( FILEDATAorFILE instanceof FileClass ){\r
return FILEDATAorFILE.getUID();\r
- }\r
+ };\r
\r
var uid = Util.getIndex( FILEDATA_RESITER, FILEDATAorFILE );\r
if( uid === -1 ){\r
uid = FILEDATA_RESITER.length;\r
FILEDATA_RESITER.push( FILEDATAorFILE );\r
- }\r
+ };\r
return uid;\r
},\r
getFileDataAccess: function( UIDorFILEorFILEDATA ){\r
} else\r
if( Util.getIndex( FILEDATA_RESITER, UIDorFILEorFILEDATA ) !== -1 ){\r
return UIDorFILEorFILEDATA;\r
- }\r
+ };\r
return null;\r
},\r
getChildren: function( UIDorFILEorFILEDATA ){\r
if( _ticket.fileUID === _uid && _ticket.eventType === _eventType && _ticket.callBack === _callback ){\r
EVENT_LISTENER_REGISTER.splice( i, 1 );\r
_ticket.kill();\r
- }\r
- }\r
+ };\r
+ };\r
},\r
getTreeAccess: function(){\r
\r
if( FILE_CONTROLER.getFileData( _tree.getCurrentFile() ) === _data ){\r
_treeAccess = TREE_ACCESS_ARRAY[ _tree.getUID() ];\r
_treeAccess && _treeAccess.dispatchFileEvent( _event );\r
- }\r
- }\r
- }\r
+ };\r
+ };\r
+ };\r
}\r
- }\r
+ };\r
\r
var TreeClass = function( apiuser, rootFileData ){\r
var PARENT_FILE_RESITER = [],\r
if( _type === Const.TREE.EVENT.UPDATE && _eventType === Const.FILE.EVENT.GET_SEQENTIAL_FILES ){\r
//_callback( _eventType, _targetFile );\r
AsyncCall.add( apiuser, _callback, [ _eventType, _targetFile ] );\r
- }\r
- }\r
- }\r
+ };\r
+ };\r
+ };\r
\r
this.getUID = function(){\r
return Util.getIndex( TREE_ACCESS_ARRAY, ACCESS );\r
while( PARENT_FILE_RESITER.length > 0 ){\r
_currentFile = PARENT_FILE_RESITER.shift();\r
_currentFile.destroy();\r
- }\r
+ };\r
\r
AsyncCall.remove( apiuser );\r
instance = apiuser = null;\r
return true;\r
- }\r
+ };\r
};\r
\r
var FileEventTicketClass = function( _uid, _eventType, _callback ){\r
this.screenX = e.screenX;\r
this.screenY = e.screenY;\r
\r
+ this.charCode = e.keyCode;\r
this.altKey = e.altKey;\r
this.ctrlKey = e.ctrlKey;\r
this.shiftKey = e.shiftKey;\r
- this.charCode = e.keyCode;\r
\r
this.wheelDelta = e.wheelDelta;\r
\r
};\r
\r
var ReadyEvent = ( function(){\r
- var timer = null,\r
- script = null,\r
- ticketReady,\r
+ var ticketReady,\r
ticketLoad;\r
\r
- function detect(){\r
+ function webkitDetect(){\r
var state = document.readyState;\r
if( state === 'loaded' || state === 'complete' ){\r
- timer && window.clearInterval( timer );\r
+ SystemTimer.remove( SUPER_USER_KEY, webkitDetect );\r
timer = null;\r
onReady();\r
- }\r
- }\r
+ };\r
+ };\r
function ieDetect(){\r
- if( this.readyState === 'loaded' || this.readyState === 'complete' ){\r
+ if( this.readyState === 'complete' ){ // this.readyState === 'loaded' || \r
this.onreadystatechange = new Function();\r
this.onreadystatechange = null;\r
this.parentNode.removeChild( this );\r
- script = null;\r
onReady();\r
- }\r
- }\r
- \r
+ };\r
+ };\r
+ \r
function onReady(){\r
+ ticketReady && ticketReady.destroy();\r
+ ticketLoad && ticketLoad.destroy();\r
+ ticketReady = ticketLoad = null;\r
Page.onReady();\r
if( Page.registered() === true ){\r
Page.boot();\r
} else {\r
Home.boot();\r
- }\r
- ticketReady && ticketReady.destroy();\r
- ticketLoad && ticketLoad.destroy();\r
- ticketReady = ticketLoad = null;\r
- }\r
+ };\r
+ };\r
\r
// Apple WebKit (Safari, OmniWeb, ...)\r
if( doc.readyState && !!UA.WEBKIT ){\r
- timer = window.setInterval( detect, 50 );\r
+ SystemTimer.add( SUPER_USER_KEY, webkitDetect, 50 );\r
} else\r
+ /*\r
if( document.readyState && UA.isIE && UA.ieVersion < 9 ){\r
- document.write('<script type="text/javascript" defer="defer" id="ieDOMContentLoaded" src="' +\r
- ( ( window.location.protocol === 'https:' ) ? '://0' : 'javascript:void(0)' ) +\r
+ document.write('<script type="text\/javascript" defer="defer" id="ieDOMContentLoaded" src="' +\r
+ ( ( window.location.protocol === 'https:' ) ? ':\/\/0' : 'javascript:void(0)' ) +\r
'"><\/script>');\r
- script = document.getElementById( 'ieDOMContentLoaded' );\r
- script.onreadystatechange = ieDetect;\r
- } else {\r
- ticketReady = new EventTicketClass( doc, 'DOMContentLoaded', onReady );\r
- ticketLoad = new EventTicketClass( doc, 'load', onReady );\r
- }\r
+ document.getElementById( 'ieDOMContentLoaded' ).onreadystatechange = ieDetect;\r
+ } else */ {\r
+ ticketReady = new EventTicketClass( document, 'DOMContentLoaded', onReady );\r
+ ticketLoad = new EventTicketClass( window, 'load', onReady );\r
+ };\r
})();\r
\r
\r
*/\r
var KeyEvent = ( function(){\r
var EVENT_LIST_MAP = [],\r
+ LOCK_UP = [],\r
+ LOCK_DOWN = [],\r
application = null,\r
currentList = null;\r
\r
keyupTicket = null,\r
keyPress = null,\r
keypressTicket = null;\r
-\r
+ \r
+ function unlock( lock, key ){\r
+ lock.splice( Util.getIndex( lock, key ), 1 );\r
+ };\r
+ \r
function onKeyChange( e ){\r
var cancel = false,\r
type = e.type,\r
- key = e.keyCode || e.charCode || e.which,\r
+ key = e.charCode || e.which,\r
shift = Type.isBoolean( e.shiftKey ) === true ? e.shiftKey : ( e.modifiers & Event.SHIFT_MASK ),\r
ctrl = Type.isBoolean( e.ctrlKey ) === true ? e.ctrlKey : ( e.modifiers & Event.CONTROL_MASK ),\r
- t;\r
-\r
+ lock = type === 'keyup' ? LOCK_UP : LOCK_DOWN;\r
+ // block chattering\r
+ if( Util.getIndex( lock, key ) !== -1 ) return false;\r
+ lock.push( key );\r
+ AsyncCall.add( SUPER_USER_KEY, unlock, [ lock, key ] );\r
+ \r
if( key === 16 || shift === true ){\r
KeyEvent.shiftEnabled = type !== 'keyup';\r
};\r
if( key === 17 || ctrl === true ){\r
KeyEvent.ctrlEnabled = type !== 'keyup';\r
};\r
-\r
- for( var i=currentList.length; t = currentList[ --i ]; ){\r
+ for( var i=currentList.length, t; t = currentList[ --i ]; ){\r
if( Type.isFunction( t[ type ] ) === true && t.keyCode === key && ( t.shift === undefined || t.shift === shift ) && ( t.ctrl === undefined || t.ctrl === ctrl )){\r
+ \r
AsyncCall.add( t.apiuser, t[ type ], e );\r
cancel = true;\r
};\r
if( _handler !== this.keydown ) return false;\r
} else {\r
if( _handler !== this.keyup ) return false;\r
- }\r
- }\r
+ };\r
+ };\r
if( _keyCode && _keyCode !== this.keyCode ) return false;\r
if( _shift && _shift !== this.shift ) return false;\r
if( _ctrl && _ctrl !== this.ctrl ) return false;\r
\r
return true;\r
}\r
- }\r
+ };\r
\r
function registerEvent( _apiuser, _type, _onKeydown, _onKeyup, _keyCode, _shift, _ctrl ){\r
var _uid = _apiuser.getUID(),\r
} else\r
if( _type === 'cursol' ){\r
\r
- }\r
+ };\r
},\r
remove: function( _apiuser, _type, _handler, _keyCode, _shift, _ctrl ){\r
var _list = EVENT_LIST_MAP[ _apiuser.getUID() ],\r
elmA.innerHTML = _newValue;\r
elmA.style.display = 'block';\r
\r
- onUpdate && _newValue !== value && onUpdate( _newValue, value );\r
+ onUpdate && _newValue !== value && AsyncCall.add( apiuser, onUpdate, [ _newValue, value ] );\r
\r
value = _newValue;\r
focus = false;\r
};\r
instance.value( value );\r
MouseEvent.add( apiuser, elmWrapper, 'click', instance.focus );\r
- }\r
+ };\r
\r
var ButtonClass = function( apiuser, uiGroup, elmWrapper, onUpdate ){\r
var instance = this,\r
\r
function onClick(){\r
focus = true;\r
- onUpdate();\r
+ // onUpdate();\r
+ AsyncCall.add( apiuser, onUpdate );\r
return false;\r
};\r
this.focus = function(){\r
MouseEvent.remove( apiuser, elmWrapper );\r
apiuser = uiGroup = elmWrapper = onUpdate = instance = null;\r
};\r
- }\r
+ };\r
\r
var FileInputClass = function( apiuser, uiGroup, elmWrapper, onUpdate, validater, elmFileInput ){\r
var elmFilePath = Util.getElementsByClassName( elmWrapper, 'file-path' )[ 0 ],\r
if( focus === true ){\r
OptionControl.update( instance, _value );\r
};\r
- Type.isFunction( onUpdate ) === true && onUpdate( _value );\r
+ Type.isFunction( onUpdate ) === true && AsyncCall.add( apiuser, onUpdate, [ _value ] );\r
break;\r
- }\r
- }\r
- }\r
+ };\r
+ };\r
+ };\r
return value;\r
};\r
this.selectIndex = function(){\r
KeyEvent.remove( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, onKeyDown, 27 );\r
KeyEvent.remove( SUPER_USER_KEY, Const.KEY.EVENT.KEY_DOWN, onKeyDown, 9 );\r
KeyEvent.updateCurrentListener( _apiuser );\r
- }\r
- }\r
+ };\r
+ };\r
\r
function onKeyDown( e ){\r
if( currentItem === null ) return true;\r
- var keyCode = e.keyCode,\r
+ var keyCode = e.charCode,\r
_index = Util.getIndex( currentList, currentItem );\r
if( keyCode === 13 || keyCode === 27 || keyCode === 9 || keyCode === 18 || e.altKey === true ){ // 13.return 27.esc 9.tab 18.alt\r
keyCode === 9 && tabShift( _index, e.shiftKey === true ? -1 : 1 );\r
currentItem && currentItem.blur( keyCode );\r
};\r
return false;\r
- }\r
+ };\r
\r
function tabShift( _index, _way ){\r
var l = currentList.length,\r
})();\r
\r
\r
+/*\r
+ * -- len, %\r
+ * marginBottom, marginLeft, marginRight, marginTop, margin\r
+ * padding, paddingBottom, paddingLeft, paddingRight, paddingTop\r
+ * fontSize, textIndent\r
+ * height, width\r
+ * bottom, left, right, top (len, %)\r
+ *\r
+ * -- len\r
+ * borderBottomWidth, borderLeftWidth, borderRightWidth, borderTopWidth, borderWidth,\r
+ * letterSpacing\r
+ *\r
+ * -- color\r
+ * backgroundColor\r
+ * borderBottomColor, borderLeftColor, borderRightColor, borderTopColor, borderColor\r
+ * color\r
+ *\r
+ * -- special\r
+ * clip rect(0px, 40px, 40px, 0px);\r
+ * backgroundPosition (len, %)\r
+ * opacity\r
+ * lineHeight (len, %, num)\r
+ * zIndex ( order )
+ */\r
+\r
+var VisualEffect = ( function(){\r
+ \r
+ var ANIMATION_TICKET_ARRAY = [],\r
+ fpms = 50,\r
+ FILTER = 'filter',\r
+ OPACITY = 'opacity',\r
+ REG_ALPHA = /alpha\([^)]*\)/i,\r
+ CORON = ':',\r
+ EMPTY = '',\r
+ SEMICORON = ';';\r
+ UNITS = 'px,cm,mm,in,pt,pc,em,%'.split( ',' );\r
+ \r
+ PARAMS = ( function(){\r
+ ret = { size: {}, color: {}, special: {}, unit: {}, region: {} };\r
+ register( ret.size, 'marginBottom,marginLeft,marginRight,marginTop,margin,padding,paddingBottom,paddingLeft,paddingRight,paddingTop,borderBottomWidth,borderLeftWidth,borderRightWidth,borderTopWidth,borderWidth,fontSize,textIndent,height,width,bottom,left,right,top' );\r
+ register( ret.color, 'backgroundColor,borderBottomColor,borderLeftColor,borderRightColor,borderTopColor,borderColor,color' );\r
+ register( ret.special, 'clip,backgroundPosition,opacity,lineHeight,zIndex,letterSpacing' );\r
+ \r
+ register( ret.unit, 'px,cm,mm,in,pt,pc,em,%' );\r
+ register( ret.region, 'margin,padding,border,clip,backgroundPosition,borderColor' )\r
+ \r
+ function register( obj, params ){\r
+ params = params.split( ',' );\r
+ for( var i=params.length; i; ) obj[ params[ --i ] ] = true;\r
+ };\r
+ return ret;\r
+ })();\r
+ \r
+ function startAnimation( _elm, _cssObject, _onComplete, _onEnterFrame, _numFrames ){\r
+ var _ticket, i = ANIMATION_TICKET_ARRAY.length;\r
+ for( ; i; ){\r
+ _ticket = ANIMATION_TICKET_ARRAY[ --i ];\r
+ if( _ticket.elm === _elm ){\r
+ _ticket.destroy();\r
+ break;\r
+ };\r
+ };\r
+ \r
+ var _currentParameters = [],\r
+ _offsetParameters = [],\r
+ _endParameters = [],\r
+ _targetAttributes = [],\r
+ _units = [];\r
+ \r
+ // coputedStyle と _cssObject を比較して , 一致及び非数は削除しつつ コピー\r
+ // filter opacity の追加 REG_ALPHA.test( _value ) ? _value.replace( REG_ALPHA, opacity ) : _value + " " + opacity\r
+ /*\r
+ * cssObject をまわす\r
+ * 非数は削除\r
+ * computtedStyle と一致も削除\r
+ * updateTraget として記録\r
+ * 初期値を cssObject としてセット\r
+ * cssTest にセット zoom もセット\r
+ */\r
+ var x, v, _v, u,\r
+ empty = EMPTY,\r
+ px = 'px',\r
+ $1 = '$1',\r
+ isString = Type.isString,\r
+ isNumber = Type.isNumber,\r
+ inlineStyle = Util.getInlineStyle( _elm ),\r
+ computtedStyle = Util.getComputedStyle( _elm ),\r
+ REG_UINIT = /.*\d(\w{1,2})?/;\r
+ for( var p in _cssObject ){\r
+ x = _cssObject[ p ];\r
+ if( PARAMS.size[ p ] === true ){\r
+ /*\r
+ * size
+ */\r
+ if( isString( x ) === true ){\r
+ v = parseInt( x );\r
+ if( ( empty + v ).length < x.length ){\r
+ u = x.replace( REG_UINIT, $1 );\r
+ if( PARAMS.unit[ u ] === false ) u = px;\r
+ } else {\r
+ u = px;\r
+ };\r
+ } else\r
+ if( isNumber( x ) === true ){\r
+ v = x;\r
+ _unit = px; // 'px'\r
+ } else {\r
+ continue;\r
+ };\r
+ } else\r
+ if( PARAMS.color[ p ] === true ){\r
+ /*\r
+ * color
+ */\r
+ if( isString( x ) === true ){\r
+ /* #rrggbb\r
+ * "aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, orange, purple, red, silver, teal, white, yellow"\r
+ * #rgb\r
+ * rgb(r%, g%, b%)\r
+ * rgb(r, g, b)\r
+ */\r
+ } else\r
+ if( isNumber( x ) === true ){\r
+ v = x;\r
+ _unit = px; // 'px'\r
+ } else {\r
+ continue;\r
+ };\r
+ } else\r
+ if( PARAMS.special[ p ] === true ){\r
+ \r
+ } else {\r
+ continue;\r
+ }\r
+ \r
+ /*\r
+ * ここまでで、新しい値 v と 単位 u が判明．
+ */\r
+ _v = computtedStyle[ p ];\r
+ /**\r
+ * _v を u を合わせて変換して v と比較．\r
+ * em の場合は comS.fontSize を元に
+ */\r
+ if( v === _v ) continue;\r
+ _currentParameters.push( _v );\r
+ _offsetParameters.push( _v - v );\r
+ _endParameters.push( v );\r
+ _targetAttributes.push( p );\r
+ _units.push( _unit );\r
+ inlineStyle[ p ] = _v;\r
+ };\r
+ elm.style.cssText = Util.toCssText( inlineStyle );\r
+ //\r
+ /*\r
+ var style = elem.style,\r
+ currentStyle = elem.currentStyle,\r
+ opacity = jQuery.isNumeric( value ) ? "alpha(opacity=" + value * 100 + ")" : "",\r
+ filter = currentStyle && currentStyle.filter || style.filter || "";\r
+\r
+ // IE has trouble with opacity if it does not have layout\r
+ // Force it by setting the zoom level\r
+ style.zoom = 1;\r
+ */\r
+ \r
+ ANIMATION_TICKET_ARRAY.push( new AnimationTaskClass(\r
+ _elm,\r
+ _currentParameters, _offsetParameters, _endParameters, _targetAttributes, _units,\r
+ Type.isFunction( _onComplete ) === true ? _onComplete : null,\r
+ Type.isFunction( _onEnterFrame ) === true ? _onEnterFrame : null,\r
+ _numFrames\r
+ ) );\r
+ \r
+ SystemTimer.add( SUPER_USER_KEY, onEnterFrame, 1000 / fpms );\r
+ };\r
+ \r
+ function onEnterFrame(){\r
+ var _ticket,\r
+ i = 0;\r
+ while( i < ANIMATION_TICKET_ARRAY.length ){\r
+ _ticket = ANIMATION_TICKET_ARRAY[ i ];\r
+ if( _ticket.onEnterFrame() === true ){\r
+ _ticket.destroy();\r
+ ANIMATION_TICKET_ARRAY.splice( i, 1 );\r
+ } else {\r
+ ++i;\r
+ };\r
+ };\r
+ if( ANIMATION_TICKET_ARRAY.length === 0 ){\r
+ SystemTimer.remove( SUPER_USER_KEY, onEnterFrame );\r
+ };\r
+ };\r
+ function updateCss( _elm, _updateParameters, _targetAttributes, _numAttributes ){\r
+ if( _numAttributes > 0 ){\r
+ var _cssTexts = _elm.style.cssText.split( ';' ), _css,\r
+ _separate, _target, _value, _number, _unit,\r
+ i = _cssTexts.length, j;\r
+ for( ; i; ){\r
+ _css = _cssTexts[ --i ];\r
+ _separate = _css.indexOf( ':' );\r
+ if( _separate >= 3 ){\r
+ _target = _css.substr( 0, _separate + 1 );\r
+ _value = _css.substr( _separate + 1 );\r
+ /*\r
+ * ie filter\r
+ */\r
+ if( _target === FILTER ){\r
+ for( j = _numAttributes; j; ){\r
+ if( _targetAttributes[ --j ] === OPACITY ){\r
+ _cssTexts[ i ] = [\r
+ _target, ':',\r
+ _value.replace( REG_ALPHA, 'alpha(opacity=' + _updateParameters[ j ] * 100 + ')' )\r
+ ].join( '');\r
+ break;\r
+ };\r
+ };\r
+ /*\r
+ * other\r
+ */\r
+ } else {\r
+ _number = '' + parseFloat( _value );\r
+ _unit = _value.indexOf( _number );\r
+ _unit = _unit > 0 ? _value.substr( _unit + _number.length ) : '';\r
+ for( j = _numAttributes; j; ){\r
+ if( _targetAttributes[ --j ] === _target ){\r
+ _cssTexts[ i ] = [ _target, ':', _updateParameters[ j ], _unit ].join( '' );\r
+ break;\r
+ };\r
+ };\r
+ };\r
+ };\r
+ };\r
+ _elm.style.cssText = _cssTexts.join( ';' );\r
+ return; \r
+ };\r
+ /*\r
+ * 一度に update する Attributes が少ない場合、cssText は使用しない.\r
+ */\r
+ };\r
+ \r
+ var AnimationTaskClass = function( elm, currentParameters, offsetParameters, endParameters, targetAttributes, units, onComplete, onEnterFrame, numFrames ){\r
+ var l = targetAttributes.length;\r
+ this.elm = elm;\r
+ this.onEnterFrame = function(){\r
+ var _updateCss = {}, i = l;\r
+ if( numFrames === 1 ){\r
+ for( ; i; ){\r
+ --i;\r
+ _updateCss[ targetAttributes[ i ] ] = endParameters[ i ];\r
+ };\r
+ updateCss( elm, currentParameters, targetAttributes, l );\r
+ onComplete !== null && onComplete();\r
+ } else {\r
+ for( ; i; ){\r
+ --i;\r
+ _updateCss[ targetAttributes[ i ] ] = currentParameters[ i ] = Math.floor( currentParameters[ i ] + offsetParameters[ i ] );\r
+ };\r
+ updateCss( elm, currentParameters, targetAttributes, l );\r
+ onEnterFrame !== null && onEnterFrame( _updateCss );\r
+ }\r
+ --numFrames;\r
+ return numFrames === 0;\r
+ };\r
+ this.destroy = function(){\r
+ elm = onComplete = onEnterFrame = null;\r
+ };\r
+ };\r
+ \r
+ var VisualEffectClass = function( elm ){\r
+ var isHtmlElement;\r
+ \r
+ function registerAnime( _cssObject, _onComplete, _onEnterFrame, _time ){\r
+ var _numFrames = Math.floor( _time / fpms);\r
+ startAnimation( elm, _cssObject, _onComplete, _onEnterFrame, _numFrames );\r
+ };\r
+ function startFadeIn(){\r
+ \r
+ };\r
+ function startFadeOut(){\r
+ \r
+ };\r
+ function update( _x, _y, _w, _h){\r
+ var _cssText = elm.style.cssText;\r
+ \r
+ };\r
+ \r
+ this.anime = registerAnime;\r
+ this.fadeIn = startFadeIn;\r
+ this.fadeOut = startFadeOut;\r
+ this.update = update;\r
+ }\r
+ \r
+ return {\r
+ createVisualEffect: function( _elm){\r
+ return new VisualEffectClass( _elm);\r
+ },\r
+ isInstanceOfVisualEffect: function( _instance){\r
+ return _instance instanceof VisualEffectClass;\r
+ }\r
+ }\r
+})();\r
+\r
+\r
/* --------------------------------------------\r
*
*/\r
gOS.registerApplication = Application.register;\r
gOS.registerDriver = File.registerDriver;\r
\r
-})( window );\r
+})( window, document );\r
+++ /dev/null
-/*
- * pettanR peta.apps.js
- * version 0.5.5
- *
- * author:
- * itozyun
- * licence:
- * 3-clause BSD
- */
-
-( function( pettanr, gOS, window, undefined ){
-
-/*
- * PettanR service driver.
- */
- var MyAuthorID = 'current_author' in window ? current_author.id : ( pettanr.CONST.SERVER_SUPPORT === false ? 1 : -1 ),
- MyArtistID = 'current_artist' in window ? current_artist.id : ( pettanr.CONST.SERVER_SUPPORT === false ? 1 : -1 ),
- Driver = null,
- FileAPI = gOS.registerDriver( function(){
- var self = Driver = this;
-
- function onLoadJson( _file, _json ){
- var _access = FileAPI.getFileDataAccess( _file ),
- _data = _access !== null ? _access.DATA : null,
- l;
- if( _data === null ){
- onErrorJson( _file);
- return;
- }
- _data.state = Const.FILE.STATE.OK;
-
- if( Type.isArray( _json ) === true ){
- l = _json.length;
- if( l === 0) return;
- for( var i=0; i<l; ++i ){
- buildFileData( _json[ i], _data);
- }
- } else
- if( _json.id ){
- buildFileData( _json, _data );
- }
- _file.dispatchEvent( FileAPI.createFileEvent( Const.FILE.EVENT.GET_SEQENTIAL_FILES, _file, 'children', null) );
- }
- function onErrorJson( _file ){
- var _data = FileAPI.getFileData( _file);
- if( _data !== null){
- _data.state = Const.FILE.STATE.ERROR;
- }
- }
- function buildFileData( _data, _parent ){
- var _array, i, l;
- // Panel
- if( _parent === FILE_DATA_PANELS_ROOT ){
- _data.type = FILE_TYPE.PANEL;
- _array = PANEL_ARRAY;
- } else
- // Comic
- if( _parent === FILE_DATA_COMICS_ROOT ){
- _data.type = FILE_TYPE.COMIC;
- _array = COMIC_ARRAY;
- } else
- if( _parent.type === FILE_TYPE.COMIC ){
- _array = COMIC_ARRAY;
- } else
- // Lisence
- if( _parent === FILE_DATA_LISENCE_ROOT ){
- _data.type = FILE_TYPE.LICENSE;
- _array = ORIGINAL_LICENSE_ARRAY;
- } else
- // Author
- if( _parent === FILE_DATA_AUTHOR_ROOT ){
- _data.type = FILE_TYPE.AUTHOR;
- _array = AUTHOR_ARRAY;
- } else
- // Artist
- if( _parent === FILE_DATA_ARTIST_ROOT ){
- _data.type = FILE_TYPE.ARTIST;
- _array = ARTIST_ARRAY;
- } else
- // Picture
- if( _parent === FILE_DATA_PICTURE_ROOT || _parent === FILE_DATA_MY_PICTURES_ROOT ){
- _data.type = FILE_TYPE.PICTURE;
- _array = RESOURCE_PICTURE_ARRAY;
- // original_license を含まなければ、license object を削除して ビットデータ で保持
- // original_license なら ファイルを作る buildFileData( _license, FILE_DATA_LISENCE_ROOT)
- var _license = _data.license,
- _rule,
- _Math_pow = Math.pow,
- _bits = 0;
- if( typeof _license === 'object'){
- for( i=0, l=BASIC_LICENSES.length; i<l; ++i ){
- _rule = _license[ BASIC_LICENSES[ i]];
- if( typeof _rule === 'number' && _rule === 1 ){
- _bits += _Math_pow( 2, i );
- }
- }
- _data.license = _bits;
- }
- } else {
- alert( 'error' );
- }
-
- _data.driver = Driver;
-
- // _array に _data を格納 または 上書き
- if( typeof _data.id === 'number' && _data.id > 0 ){
- var _id = _data.id - 1,
- __data = _array[ _id ],
- _reserved = Const.FILE.DATA_PROPERTY_RESERVED.join( ', ' );
- if( __data ){
- for( var key in _data){
- if( _reserved.indexOf( key ) === -1 ){
- __data[ key ] = _data[ key ];
- };
- };
- _data = __data; // このタイミングで参照が切れるので注意！！
- } else {
- _array[ _id ] = _data;
- };
- } else {
- alert( 'error' );
- };
-
- // Author
- // Artist
- if( _parent === FILE_DATA_AUTHOR_ROOT || _parent === FILE_DATA_ARTIST_ROOT ){
- addChildData( _parent, _data );
- } else
- // Comic + Panels
- if( _parent.type === FILE_TYPE.COMIC || _parent === FILE_DATA_COMICS_ROOT ){
- var _panels = _data.panels,
- _panel;
- if( _panels && Type.isArray( _panels ) === true ){
-
- for( i=0, l=_panels.length; i<l; ++i){
- _panel = buildFileData( _panels[ i ], FILE_DATA_PANELS_ROOT );
- /*
- * 間違い！ t 順に格納
- */
- addChildData( _data, _panel );
- };
- delete _data.panels;
- } else {
- if( _data.json !== null ){
- _data.json = true;
- };
- if( Type.isArray( _data.children ) === false ){
- _data.children = [];
- };
- };
- var _author = _data.author || getResource( AUTHOR_ARRAY, _data.author_id );
- if( _author ){
- _data.author = _author = buildFileData( _author, FILE_DATA_AUTHOR_ROOT );
- addChildData( _author, _data );
- _author.id === MyAuthorID && addChildData( FILE_DATA_MY_COMICS_ROOT, _data );
- };
- if( _parent === FILE_DATA_COMICS_ROOT ){
- addChildData( FILE_DATA_LATEST_COMICS, _data);
- };
- } else
- // Panel
- if( _parent === FILE_DATA_PANELS_ROOT ){
- _data.comic = getResource( COMIC_ARRAY, _data.comic_id );
- _data.author = getResource( AUTHOR_ARRAY, _data.author_id );
-
- // picture data をファイルに取り出し
- var _elements = _data.panel_elements,
- _elm;
- if( Type.isArray( _elements ) === true ){
- for( i=0, l=_elements.length; i<l; ++i){
- _elm = _elements[ i];
- if( _elm.resource_picture ){
- _elm.resource_picture = buildFileData( _elm.resource_picture, FILE_DATA_PICTURE_ROOT ); // 上記参照切れに備えてここで上書き
- } else {
- _elm.resource_picture = getResource( RESOURCE_PICTURE_ARRAY, _elm.resource_picture_id );
- };
- };
- };
- } else
- // Picture
- if( _data.type == FILE_TYPE.PICTURE ){
- var _artist = _data.artist || getResource( ARTIST_ARRAY, _data.artist_id );
- if( _artist){
- _data.artist = _artist = buildFileData( _artist, FILE_DATA_ARTIST_ROOT );
- addChildData( _artist, _data );
- if( _artist.id === MyArtistID ){
- addChildData( FILE_DATA_MY_PICTURES_ROOT, _data );
- //FILE_DATA_MY_PICTURES_ROOT.type = FILE_TYPE.ARTIST;
- //FILE_DATA_MY_PICTURES_ROOT.id = MyArtistID;
- };
- };
- };
- return _data;
- }
- function addChildData( _parent, _child ){
- if( Type.isArray( _parent.children ) === false){
- _parent.children = [];
- };
- Util.getIndex( _parent.children, _child ) === -1 && _parent.children.push( _child );
- };
- function getResource( _array, _id ){
- if( Type.isArray( _array ) === false || Type.isNumber( _id ) === false || _id < 1 ) return null;
- var _data = _array[ _id - 1 ];
- if( !_data ){
- _data = _array[ _id - 1 ] = {};
- };
- return _data;
- };
-
- this.getSeqentialFiles = function( _file ){
- var _data = FileAPI.getFileData( _file ),
- _json = _data !== null ? _data.json : null;
- if( _json === true && _data.type === FILE_TYPE.COMIC ){
- if( pettanr.CONST.SERVER_SUPPORT === false ){
- _json = [ 'json\/comics_', _data.id, '.json' ].join( '' );
- } else {
- _json = [ pettanr.CONST.PETTANR_ROOT_PATH, 'comics\/', _data.id, '.json\/play\/' ].join( '' );
- }
- }
- if( typeof _json === 'string' ){
- FileAPI.getJson( _file, _json, onLoadJson, onErrorJson );
- _data.state = Const.FILE.STATE.LOADING;
- _data.json = null;
- return;
- }
- };
- this.getName = function( _file ){
- var _data = FileAPI.getFileData( _file ),
- _type = _data !== null ? _data.type : null;
- if( _type === FILE_TYPE.PICTURE ){
- return [ _data.id, _data.ext ].join( '.' );
- } else
- if( _type === FILE_TYPE.PANEL ){
- return [ _data.t, ':', _data.comic.title ].join( '' );
- } else
- if( _type === FILE_TYPE.COMIC ){
- return _data.title;
- } else
- if( _type === FILE_TYPE.ARTIST ){
- return [ _data.name, '画伯' ].join( '' );
- } else
- if( _type === FILE_TYPE.AUTHOR ){
- return [ _data.name, '先生' ].join( '' );
- };
- return _data.name;
- };
- this.getThumbnail = function( _file ){
- var _data = FileAPI.getFileData( _file ),
- _type = _data !== null ? _data.type : null;
- if( _type === FILE_TYPE.PICTURE ){
- return { image: [ pettanr.CONST.RESOURCE_PICTURE_PATH, 'thumbnail/', _data.id, '.', _data.ext ].join( '' )};
- }
- if( _data === FILE_DATA_COMICS_ROOT ){
- return { className: 'file-type-cabinet' };
- }
- if( _type === FILE_TYPE.COMIC ){
- return { className: 'file-type-comic' };
- }
- if( _type === FILE_TYPE.PANEL ){
- return { className: 'file-type-panel' };
- }
- if( _type === FILE_TYPE.AUTHOR ){
- return { className: 'file-type-author' };
- }
- if( _type === FILE_TYPE.ARTIST ){
- return { className: 'file-type-artist' };
- }
- if( _type === FILE_TYPE.FOLDER){
- return { className: 'file-type-folder' };
- }
- return { className: 'file-type-broken' };
- };
- this.getSummary = function( _file ){
- var _data = FileAPI.getFileData( _file ),
- _type = _data !== null ? _data.type : null;
- if( _type === FILE_TYPE.PICTURE ){
- return [ _data.width, 'x', _data.height, ', filesize:', _data.filesize, ', lisence:', _data.license ].join( '' );
- }
- if( _data === FILE_DATA_COMICS_ROOT ){
- return 'cabinet file';
- }
- if( _type === FILE_TYPE.COMIC ){
- return 'comic file, id:' + _data.id;
- }
- if( _type === FILE_TYPE.PANEL ){
- return [ _data.width, 'x', _data.height ].join( '' );
- }
- if( _type === FILE_TYPE.AUTHOR ){
- return 'author file, id:' + _data.id;
- }
- if( _type === FILE_TYPE.ARTIST ){
- return [ 'id:', _data.id, ' Email:', _data.email || 'empty' , ', HP:', _data.homepage_url || 'empty' ].join( '' );
- }
- if( _type === FILE_TYPE.FOLDER ){
- return 'pettanR folder';
- }
- return 'pettanR unknown file';
- };
- this.read = function( _file ){
- var _data = FileAPI.getFileData( _file ),
- _type = _data !== null ? _data.type : null,
- ret;
- if( _type === FILE_TYPE.COMIC ){
- // children を panels に deepcopy
- ret = {};
- for( var key in _data ){
- ret[ key ] = _data[ key ]
- }
- ret.panels = _data.children;
- return ret;
- }
- if( _type === FILE_TYPE.PANEL ){
- }
- if( _type === FILE_TYPE.PANEL_PICTURE ){
-
- }
- if( _type === FILE_TYPE.BALLOON ){
- }
- if( _type === FILE_TYPE.PICTURE ){
- }
- };
- this.write = function( _file, _newData, _onUpdate ){
- var _data = FileAPI.getFileData( _file ),
- _type = _data !== null ? _data.type : null;
- if( _type === FILE_TYPE.COMIC ){
- }
- if( _type === FILE_TYPE.PANEL ){
- }
- if( _type === FILE_TYPE.PANEL_PICTURE ){
-
- }
- if( _type === FILE_TYPE.BALLOON ){
- }
- if( _type === FILE_TYPE.PICTURE ){
- }
- };
- this.viewerApplicationList = function( _file ){
- var _data = FileAPI.getFileData( _file ),
- _type = _data !== null ? _data.type : null;
- if( _type === FILE_TYPE.PANEL ){
- return [ Reader ];
- }
- if( _type === FILE_TYPE.COMIC ){
- return [ Reader ];
- }
- if( _data === FILE_DATA_MY_PICTURES_ROOT ){
- return [ PremiumSatge ];
- }
- if( _type === FILE_TYPE.ARTIST ){
- return [ PremiumSatge ];
- }
- return [];
- };
- this.editorApplicationList = function( _file ){
- var _data = FileAPI.getFileData( _file ),
- _type = _data !== null ? _data.type : null;
- if( _type === FILE_TYPE.PANEL ){
- return [ Editor ];
- }
- if( _type === FILE_TYPE.COMIC ){
- return [Editor, ComicConsole ];
- }
- return [];
- }
- }),
- Const = FileAPI.getConst(),
- FILE_TYPE = Util.extend(
- Const.FILE.TYPE,
- {
- COMIC: FileAPI.createFileTypeID(),
- PANEL: FileAPI.createFileTypeID(),
- PICTURE: FileAPI.createFileTypeID(),
- PANEL_PICTURE: FileAPI.createFileTypeID(),
- BALLOON: FileAPI.createFileTypeID(),
- AUTHOR: FileAPI.createFileTypeID(),
- ARTIST: FileAPI.createFileTypeID(),
- LICENSE: FileAPI.createFileTypeID()
- }
- ),
- FILE_DATA_SERVICE_ROOT = {
- name: 'PettanR root',
- type: FILE_TYPE.FOLDER,
- children: []
- },
- FILE_DATA_COMICS_ROOT = {
- name: 'Comics',
- type: FILE_TYPE.FOLDER,
- children: [],
- driver: Driver,
- json: pettanr.CONST.URL_COMICS_JSON
- },
- FILE_DATA_PANELS_ROOT = {
- name: 'Panels',
- type: FILE_TYPE.FOLDER,
- children: [],
- driver: Driver,
- json: pettanr.CONST.URL_PANELS_JSON
- },
- FILE_DATA_PICTURE_ROOT = {
- name: 'Picutures',
- type: FILE_TYPE.FOLDER,
- children: [],
- driver: Driver,
- json: pettanr.CONST.URL_RESOURCE_PICTURES_JSON
- },
- FILE_DATA_MY_COMICS_ROOT = {
- name: 'My Comics',
- type: FILE_TYPE.FOLDER,
- children: [],
- driver: Driver,
- id: MyAuthorID
- },
- FILE_DATA_LATEST_COMICS = {
- name: 'Latest Comics',
- type: FILE_TYPE.FOLDER,
- children: []
- },
- FILE_DATA_MY_PICTURES_ROOT = {
- name: 'My Pictures',
- type: FILE_TYPE.FOLDER,
- children: [],
- driver: Driver,
- json: pettanr.CONST.URL_ORIGINAL_PICTURES_JSON,
- id: MyArtistID
- },
- FILE_DATA_AUTHOR_ROOT = {
- name: 'Authors',
- type: FILE_TYPE.FOLDER,
- children: []
- },
- FILE_DATA_ARTIST_ROOT = {
- name: 'Artists',
- type: FILE_TYPE.FOLDER,
- children: []
- },
- FILE_DATA_LISENCE_ROOT = {
- name: 'Original Lisences',
- type: FILE_TYPE.FOLDER,
- children: []
- },
- FILE_DATA_BALLOON_ROOT = {
- name: 'Balloon templetes',
- type: FILE_TYPE.FOLDER,
- children: []
- },
- AUTHOR_ARRAY = [],
- ARTIST_ARRAY = [],
- PANEL_ARRAY = [],
- COMIC_ARRAY = [],
- RESOURCE_PICTURE_ARRAY = [],
- BALLOON_TEMPLETE_ARRAY = [],
- ORIGINAL_LICENSE_ARRAY = [],
- BASIC_LICENSES = 'cc_by,cc_nc,cc_nd,cc_sa,keep_aspect_ratio,no_convert,no_flip,no_resize'.split( ',');
- FILE_DATA_SERVICE_ROOT.children.push( FILE_DATA_COMICS_ROOT, FILE_DATA_PICTURE_ROOT, FILE_DATA_PANELS_ROOT, FILE_DATA_LISENCE_ROOT, FILE_DATA_BALLOON_ROOT );
- FILE_DATA_COMICS_ROOT.children.push( FILE_DATA_MY_COMICS_ROOT, FILE_DATA_LATEST_COMICS, FILE_DATA_AUTHOR_ROOT );
- FILE_DATA_PICTURE_ROOT.children.push( FILE_DATA_MY_PICTURES_ROOT, FILE_DATA_ARTIST_ROOT );
-
- FileAPI.createFolderUnderRoot( FILE_DATA_SERVICE_ROOT );
-
- Driver.isPettanrFileInstance = function( _file ){
- if( FileAPI.isFileInstance( _file ) === true ){
- var _data = FileAPI.getFileData( _file.getUID() );// _file でなく _file.getUID()
- return _data !== null && _data.driver === Driver;
- }
- return false;
- };
-
-var Cabinet = gOS.registerApplication( function(){
- var self = this,
- finder = null,
- tree = null,
- headerH = 0;
-
- this.bgColor = '#FFFFFF';
- this.MIN_WIDTH = 500;
- this.MIN_HEIGHT = 300;
- this.onInit = function(){
- self.rootElement.id = 'cabinet-root';
- self.rootElement.innerHTML = [
- '<div id="cabinet-header">Cabinet<div id="cabinet-close-button">x</div></div>',
- '<div id="cabinet-container" class="finder-container"></div>'
- ].join( '' );
-
- self.fetchCSS( '/assets/peta.apps.css' );
-
- tree = FileAPI.createTree( FILE_DATA_SERVICE_ROOT );
-
- delete self.onInit;
- };
- this.onOpen = function( _w, _h ){
- headerH = Util.getElementSize( document.getElementById( 'cabinet-header' ) ).height;
-
- self.addMouseEventListener( document.getElementById( 'cabinet-close-button' ), 'click', Cabinet.shutdown );
-
- finder = self.createFinder( self.rootElement, tree );
- self.onPaneResize( _w, _h );
- };
- this.onClose = function(){
- finder.destroy();
- tree.destroy();
- finder = tree = null;
- };
- this.onPaneResize = function( _w, _h ){
- finder.resize( _w, _h - headerH );
- };
-}, false, true, 'Cabinet', 'cabinet', null, '#1C1C1C' );
-
-var Gallery = gOS.registerApplication( function(){
- var self = this,
- finder = null,
- tree = null,
- headerH = 0;
-
- this.bgColor = '#FFFFFF';
- this.MIN_WIDTH = 500;
- this.MIN_HEIGHT = 300;
- this.onInit = function(){
- self.rootElement.id = 'gallery-root';
- self.rootElement.innerHTML = [
- '<div id="gallery-header">Cabinet<div id="gallery-close-button">x</div></div>',
- '<div id="gallery-container" class="finder-container"></div>'
- ].join( '' );
-
- self.fetchCSS( '/assets/peta.apps.css' );
-
- tree = FileAPI.createTree( FILE_DATA_PICTURE_ROOT );
- var _root = tree.getRootFile(),
- _myPic = _root.getChildFileByIndex( 0 ),
- _pic = _root.getChildFileByIndex( 1 );
- _myPic.getSeqentialFiles();
- _pic.getSeqentialFiles();
- _myPic.destroy();
- _pic.destroy();
- };
- this.onOpen = function( _w, _h ){
- headerH = Util.getElementSize( document.getElementById( 'gallery-header' ) ).height;
-
- self.addMouseEventListener( document.getElementById( 'gallery-close-button' ), 'click', Gallery.shutdown );
-
- finder = self.createFinder( self.rootElement, tree );
- self.onPaneResize( _w, _h );
- };
- this.onClose = function(){
- finder.destroy();
- tree.destroy();
- finder = tree = null;
- };
- this.onPaneResize = function( _w, _h ){
- finder.resize( _w, _h - headerH );
- };
-}, false, true, 'Gallery', 'gallery', null, '#01A31C' );
-
-var Backyard = gOS.registerApplication( function(){
- var self = this;
-
- this.bgColor = '#FFFFFF';
- this.MIN_WIDTH = 500;
- this.MIN_HEIGHT = 300;
- this.onInit = function(){
- };
- this.onOpen = function( _w, _h, _option ){
- }
- this.onClose = function(){
- }
- this.onPaneResize = function( _w, _h){
- }
-}, false, false, 'Settings', 'settings', null, '#DDDDDD' );
-
-if( pettanr.DEBUG === true){
- var Debug = gOS.registerApplication( function(){
- var self = this,
- elmDl,
- data = ( function(){
- var data = {
- pettanR: pettanr.version,
- ua: navigator.userAgent,
- platform: navigator.platform,
- appVersion: navigator.appVersion,
- appCodeName: navigator.appCodeName,
- appName: navigator.appName,
- language: navigator.browserLanguage || navigator.language,
- ActiveX: UA.ACTIVEX,
- RenderingMode: UA.isStanderdMode === true ? 'Standerd' : 'Quirks'
- };
- if( UA.IE ){
- data.version = UA.IE;
- if( UA.ieVersion >= 8 ) data.RenderingVersion = UA.ieRenderingVersion;
- data.browserType = UA.STANDALONE === true ? 'Standalone' : 'bundle';
- if( UA.ieVersion < 9 ) {
- data.vml = UA.VML;
- } else {
- data.svg = UA.SVG;
- }
- };
- return data;
- })();
-
- this.bgColor = '#FFFFFF';
- this.MIN_WIDTH = 500;
- this.MIN_HEIGHT = 300;
- this.onInit = function(){
- self.rootElement.id = 'debug-root';
- self.rootElement.innerHTML = '<dl id="useragent" class="dl-table clearfix"></dl>';
- };
- this.onOpen = function( _w, _h, _option ){
- elmDl = document.getElementById( 'useragent' );
- var elmDt, elmDd;
- for( var key in data ){
- elmDt = document.createElement( 'dt' );
- elmDt.innerHTML = key;
- elmDd = document.createElement( 'dd' );
- elmDd.innerHTML = '' + data[ key];
- if( !data[ key ] ) elmDd.style.color = 'red';
- elmDl.appendChild( elmDt );
- elmDl.appendChild( elmDd );
- }
- }
- this.onClose = function(){
-
- }
- this.onPaneResize = function( _w, _h ){
-
- }
- }, false, true, 'Debug', 'debug', null, '#01A31C' );
-}
-
-/* ----------------------------------------
- * Image Group Exproler
- * - overlay
- */
-var PremiumSatge = gOS.registerApplication( function(){
- var BASE_PATH = pettanr.CONST.RESOURCE_PICTURE_PATH,
- THUMB_PATH = BASE_PATH, // + 'thumbnail/',
- LIMIT_FILESIZE = 1024 * 10,
- ICON_ARRAY = [];
-
- var self = this,
- tree, rootFile,
- winW, winH, wrapX,
- elmContainer, elmIconOrigin, elmName, elmButton,
- containerW, containerH,
- itemW, itemH, buttonW,
- onUpdate = null,
- onUpdateData = null,
- artistID = -1;
-
- var ImageGroupIconClass = function( index, data ){
- var elmIconWrap = elmIconOrigin.cloneNode( true ),
- elmIconTitle = Util.getElementsByClassName( elmIconWrap, 'image-group-item-title' )[ 0 ],
- 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,
- timer = null,
- onEnterFlag = false,
- instance = this;
- elmContainer.appendChild( elmIconWrap );
- elmIconWrap.style.left = ( index * itemW ) + 'px';
- elmIconTitle.appendChild( document.createTextNode( data.filesize + 'bytes' ) );
-
- function onImageLoad( url, _imgW, _imgH ){
- data.width = _imgW = _imgW || data.width || 64;
- data.height = _imgH = _imgH || data.height || 64;
- elmIconTitle.firstChild.data = _imgW + 'x' + _imgH;
- var zoom = 128 /( _imgW > _imgH ? _imgW : _imgH ),
- MATH_FLOOR = Math.floor,
- h = MATH_FLOOR( _imgH * zoom ),
- w = MATH_FLOOR( _imgW * zoom );
- reversibleImage.elm.style.cssText = [
- 'width:', w, 'px;',
- 'height:', h, 'px;',
- 'margin:', MATH_FLOOR( itemH / 2 - h / 2 ), 'px ', MATH_FLOOR( itemW / 2 - w / 2 ), 'px 0'
- ].join('');
- reversibleImage.resize( w, h );
- self.addMouseEventListener( elmIconWrap, 'click', onClick );
- };
-
- function onClick(){
- onUpdateData = data;
- PremiumSatge.shutdown();
- };
-
- function asyncDraw(){
- reversibleImage = pettanr.image.createReversibleImage( LOW_SRC || SRC, itemW, itemH, onImageLoad );
- elmIconWrap.appendChild( reversibleImage.elm );
- onEnterFlag = true;
- timer = null;
- };
-
- this.onEnter = function( delay ){
- self.addTimer( asyncDraw, delay, true );
- delete instance.onEnter;
- };
- this.destroy = function(){
- delete instance.destroy;
- // timer && window.clearTimeout( timer );
- self.removeTimer( asyncDraw );
- self.removeMouseEventListener( elmIconWrap );
- reversibleImage !== null && reversibleImage.destroy();
- // Util.removeAllChildren( elmIconWrap );
- // elmContainer.removeChild( elmIconWrap );
- reversibleImage = elmIconWrap = elmIconTitle = data = timer = null;
- };
- };
-
- function onEnterShowImage(){
- var l = ICON_ARRAY.length,
- _start = -wrapX /itemW -1,
- _end = _start + winW /itemW +1,
- _icon;
- for( var i=0, c = 0; i<l; ++i){
- _icon = ICON_ARRAY[ i ];
- if( _start < i && i < _end && _icon.onEnter ){
- _icon.onEnter( c * 100 );
- c++;
- }
- }
- //onEnterInterval !== null && window.clearTimeout( onEnterInterval );
- //onEnterInterval = null;
- self.removeTimer( onEnterShowImage );
- };
- function clickClose(){
- PremiumSatge.shutdown();
- };
- function onMouseWheel( e ){
- if( winW < containerW ){
- wrapX += e.wheelDelta / 2;
- wrapX = wrapX > 0 ? 0 : wrapX < winW -containerW ? winW -containerW : wrapX;
- elmContainer.style.left = wrapX + 'px';
-
- self.removeTimer( onEnterShowImage );
- self.addTimer( onEnterShowImage, 500 );
- }
- return false;
- }
-
- function drawIcons(){
- while( ICON_ARRAY.length > 0 ){
- ICON_ARRAY.shift().destroy();
- }
- var _index = rootFile.search( {
- id: artistID,
- type: FILE_TYPE.ARTIST
- })[ 0 ],
- _artistFile = rootFile.getChildFileByIndex( _index ),
- _file;
- if( _artistFile !== null ){
- for(var i=0, l=_artistFile.getChildFileLength(); i<l; ++i ){
- _file = _artistFile.getChildFileByIndex( i );
- ICON_ARRAY.push( new ImageGroupIconClass( i, FileAPI.getFileData( _file ) ));
- _file.destroy();
- }
- elmName.firstChild.data = _artistFile.getName();
- _artistFile.destroy();
- }
- }
-
- function onFadeout(){
- while( ICON_ARRAY.length > 0 ){
- ICON_ARRAY.shift().destroy();
- }
- onUpdate !== null && onUpdateData !== null && onUpdate( onUpdateData );
- onUpdate = onUpdateData = null;
- PremiumSatge.shutdown();
- }
-
-
- this.MIN_WIDTH = 320;
- this.MIN_HEIGHT = 320;
- this.onInit = function(){
- self.rootElement.id = 'image-group-wrapper';
-
- self.rootElement.innerHTML = [
- '<div id="image-group-icon-container"></div>',
- '<div id="image-group-name">NO DATA...</div>',
- '<div id="image-group-button" class="button">close</div>'
- ].join( '' );
-
- self.fetchCSS( '/assets/peta.apps.css' );
-
- tree = FileAPI.createTree( FILE_DATA_ARTIST_ROOT );
- rootFile = tree.getRootFile();
- };
- this.onOpen = function( _windowW, _windowH, _ARTISTIDorFILE, _onUpdate ){
- elmContainer = document.getElementById( 'image-group-icon-container' );
- containerH = Util.getElementSize( elmContainer ).height;
-
- elmIconOrigin = ( function(){
- var ret = document.createElement( 'div' ),
- data = document.createElement( 'div' );
- ret.appendChild( data );
- ret.className = 'image-group-item';
- data.className = 'image-group-item-title';
- return ret;
- })();
-
- var size = Util.getElementSize( elmIconOrigin );
- itemW = size.width;
- itemH = size.height;
-
- elmName = document.getElementById( 'image-group-name' );
- elmButton = document.getElementById( 'image-group-button' );
-
- buttonW = Util.getElementSize( elmButton ).width;
-
- self.addMouseEventListener( elmContainer, 'mousewheel', onMouseWheel );
- self.addMouseEventListener( elmButton, 'click', clickClose );
- tree.addTreeEventListener( Const.TREE.EVENT.UPDATE, drawIcons );
-
- if( Driver.isPettanrFileInstance( _ARTISTIDorFILE ) === true ){
- var _data = FileAPI.getFileData( _ARTISTIDorFILE );
- if( _ARTISTIDorFILE.getType() === FILE_TYPE.ARTIST || FILE_DATA_MY_PICTURES_ROOT === _data ){
- artistID = _data.id || -1;
- }
- } else
- if( Type.isNumber( _ARTISTIDorFILE ) === true ){
- artistID = _ARTISTIDorFILE;
- }
-
- onUpdate = _onUpdate || null;
- onUpdateData = null;
-
- drawIcons();
-
- wrapX = 0;
- containerW = ICON_ARRAY.length * itemW;
-
- winW = _windowW;
- winH = _windowH;
- var w = winW > containerW ? winW : containerW,
- h = _windowH > containerH ? containerH : _windowH,
- MATH_FLOOR = Math.floor;
-
- $( elmContainer ).css( {
- width: w,
- height: 0,
- left: 0,
- top: MATH_FLOOR( _windowH /2 )
- }).stop().animate( {
- height: h,
- top: MATH_FLOOR( _windowH /2 - h /2 )
- }, onEnterShowImage );
-
- elmButton.style.cssText = [
- 'left:', MATH_FLOOR( _windowW /2 - buttonW /2 ), 'px;',
- 'top:', MATH_FLOOR( _windowH /2 + containerH /2 +10 ), 'px'
- ].join('');
- }
- this.onPaneResize = function( _windowW, _windowH ){
- var w = _windowW > containerW ? _windowW : containerW,
- h = _windowH > containerH ? containerH : _windowH,
- MATH_FLOOR = Math.floor,
- offsetW = MATH_FLOOR( _windowW /2 -winW /2 );
-
- winW = _windowW;
- winH = _windowH;
- if( offsetW <= 0 ){ // smaller
- $( elmContainer ).stop().css( {
- left: offsetW,
- width: w
- }).animate( {
- left: 0,
- top: MATH_FLOOR( _windowH /2 -h /2 )
- });
- } else {
- $( elmContainer ).stop().css( { // bigger
- left: 0,
- width: w,
- borderLeftWidth: offsetW
- }).animate( {
- top: MATH_FLOOR( _windowH /2 -h /2 ),
- borderLeftWidth: 0
- });
- }
- elmButton.style.cssText = [
- 'left:', MATH_FLOOR( _windowW /2 -buttonW /2 ), 'px;',
- 'top:', MATH_FLOOR( _windowH /2 +containerH /2 + 10 ), 'px'
- ].join('');
- onEnterShowImage();
- }
- this.onClose = function(){
- if( tree === null ) return true;
- $( elmContainer ).stop().animate( {
- height: 0,
- top: Math.floor( winH /2 )
- }, onFadeout );
- // onEnterInterval !== null && window.clearTimeout( onEnterInterval );
- // onEnterInterval = null;
- self.removeTimer();
-
- tree.removeTreeEventListener( Const.TREE.EVENT.UPDATE, drawIcons );
- tree.destroy();
- tree = rootFile = null;
-
- return false;
- }
-}, true, true, 'Premium Stage', 'premiumStage', null, '#C3325F' );
-
-
-/* ----------------------------------------
- * Text Editor
- * - overlay
- */
-var TextEditor = gOS.registerApplication( function(){
- var elmTextarea, elmButton,
- textElement, onUpdate,
- ID = 'textEditor',
- panelX, panelY,
- self = this;
-
- function clickOK(){
- textElement && textElement.text( elmTextarea.value );
- self.addAsyncCall( asyncCallback );
- }
-
- function asyncCallback(){
- onUpdate && onUpdate( textElement );
- onUpdate = textElement = null;
- TextEditor.shutdown();
- }
-
-
- function textareaFitHeight(){
- var rows = 0;
- while( elmTextarea.offsetHeight < textElement.h ){
- rows++;
- elmTextarea.rows = rows;
- }
- if( rows > 1 ) elmTextarea.rows = --rows;
- }
-
- /* grobal method */
-
- this.MIN_WIDTH = 320;
- this.MIN_HEIGHT = 320;
- this.onInit = function(){
- self.rootElement.id = 'speach-editor-wrapper';
- self.rootElement.innerHTML = '<textarea id="speach-editor"></textarea><div id="speach-edit-complete-button" class="button">OK</div>';
- };
- this.onOpen = function( _w, _h, _panelX, _panelY, _textElement, _onUpdate ){
- elmTextarea = document.getElementById( 'speach-editor' );
- elmButton = document.getElementById( 'speach-edit-complete-button' );
-
- self.addKeyEventListener( 'keydown', new Function( 'return false' ), 69, false, true );
- self.addMouseEventListener( elmButton, 'click', clickOK );
-
- panelX = _panelX;
- panelY = _panelY;
- textElement = _textElement;
- onUpdate = _onUpdate || null;
-
- self.onPaneResize( _w, _h );
- elmTextarea.value = _textElement.text()
- elmTextarea.focus();
-
- /*
- * ie6,7は、textarea { width:100%}でも高さが変わらない。rowsを設定。
- */
- UA.isIE === true && UA.ieVersion <= 7 && self.addAsyncCall( textareaFitHeight );
- };
- this.onPaneResize = function( _w, _h ){
- self.rootElement.style.cssText = [
- 'left:', textElement.x + panelX, 'px;',
- 'top:', textElement.y + panelY, 'px;',
- 'width:', textElement.w, 'px;',
- 'height:', textElement.h, 'px;'
- ].join( '' );
- };
- this.onClose = function(){
- self.removeKeyEventListener();
- self.removeMouseEventListener( elmButton );
-
- elmTextarea = elmButton = onUpdate = textElement = self = null;
- };
-}, true, false, 'Tetxt Editor', 'texteditor', null, '#DDDDDD' );
-
-
-var Reader = gOS.registerApplication( function(){
- var windowW, windowH,
- headerH,
- consoleH,
- panelMargin,
- elmContainer, elmTitle, elmAuthor, elmBackButton, elmNextButton,
- bindWorker = null,
- currentFile = null,
- comicData = null,
- currentPanel = null,
- currentIndex = 0,
- numPanel = 0,
- self = this;
-
- function onBackClick(){
- currentIndex -= ( currentIndex > 0 ? 1 : 0 );
- slide();
- return false;
- }
- function onNextClick(){
- currentIndex += ( currentIndex < numPanel - 1 ? 1 : 0 );
- slide();
- return false;
- }
- function slide(){
- var elm = elmContainer.childNodes[ currentIndex ],
- h = windowH - headerH - consoleH,
- top = headerH;
- if( elm ){
- top = headerH - elm.offsetTop + Math.floor( ( h - elm.offsetHeight ) / 2 );
- }
-
- $( elmContainer ).stop().animate( {
- top: top
- });
- }
- function getCurrentTopPosition(){
-
- }
- function draw(){
- var fileData, title, author;
-
- if( Driver.isPettanrFileInstance( currentFile ) === true ){
- if( currentFile.getType() === FILE_TYPE.COMIC ){
- fileData = currentFile.read();
- title = fileData.title;
- author = fileData.author.name;
- comicData = fileData;
- numPanel = currentFile.getChildFileLength();
- } else
- if( currentFile.getType() === FILE_TYPE.PANEL ){
- fileData = currentFile.read();
- title = fileData.comic.title;
- author = fileData.comic.author.name;
- comicData = fileData;
- numPanel = 1;
- }
- } else {
-
- };
-
- if( comicData !== null ){
- elmTitle.data = title;
- elmAuthor.data = author;
- bindWorker.json( comicData );
- self.addAsyncCall( asyncResize );
- };
- }
- function asyncResize(){
- self.onPaneResize( windowW, windowH );
- };
-
- /* grobal method */
-
- this.MIN_WIDTH = 320;
- this.MIN_HEIGHT = 320;
- this.onInit = function(){
- self.rootElement.id = 'comic-reader-wrapper';
- self.rootElement.innerHTML = [
- '<div id="comic-reader-panel-container"></div>',
- '<div class="comic-reader-shadow" style="top:0;height:40px;"></div>',
- '<div id="comic-reader-header">',
- '<div id="comic-reader-header-content">',
- '<span id="comic-reader-title">NO DATA...</span>',
- '<span id="comic-reader-author">NO DATA...</span>',
- '</div>',
- '</div>',
- '<div class="comic-reader-shadow" style="bottom:0;height:100px;"></div>',
- '<div id="comic-reader-console">',
- '<div id="comic-reader-button-centering">',
- '<a href="#" id="comic-reader-back-button">▲</da>',
- '<a href="#" id="comic-reader-forward-button">▼</a>',
- '</div>',
- '</div>'
- ].join( '' );
-
- self.fetchCSS( '/assets/peta.apps.css' );
-
- };
- this.onOpen = function( _w, _h, _file ){
- headerH = Util.getElementSize( document.getElementById( 'comic-reader-header' ) ).height;
- consoleH = Util.getElementSize( document.getElementById( 'comic-reader-console' ) ).height;
- elmContainer = document.getElementById( 'comic-reader-panel-container' );
- elmTitle = document.getElementById( 'comic-reader-title' ).firstChild;
- elmAuthor = document.getElementById( 'comic-reader-author' ).firstChild;
- elmBackButton = document.getElementById( 'comic-reader-back-button' );
- elmNextButton = document.getElementById( 'comic-reader-forward-button' );
-
- bindWorker = pettanr.bind.createBindWorker( elmContainer, null, false, false );
-
- self.addMouseEventListener( elmBackButton, 'click', onBackClick );
- self.addMouseEventListener( elmNextButton, 'click', onNextClick );
-
- numPanel = currentIndex = 0;
-
- elmContainer.style.cssText = 'left:' + ( _w / 2 ) + 'px;' + 'top:' + _h + 'px;';
-
- windowW = _w;
- windowH = _h;
- if( FileAPI.isFileInstance( _file ) === true ){
- currentFile = _file;
- _file.addEventListener( Const.FILE.EVENT.GET_SEQENTIAL_FILES, draw );
- _file.getSeqentialFiles();
- draw();
- };
- };
- this.onPaneResize = function( _windowW, _windowH ){
- windowW = _windowW;
- windowH = _windowH;
- var panelH = elmContainer.offsetHeight,
- panelW = elmContainer.offsetWidth,
- h = _windowH - headerH - consoleH;
- $( elmContainer ).stop().animate(
- {
- left: Math.floor( ( _windowW - panelW ) / 2 ),
- top: headerH + ( panelH < h ? Math.floor( ( h - panelH ) / 2 ) : 0 )
- }
- );
- };
- this.onClose = function(){
- self.removeMouseEventListener( elmBackButton );
- self.removeMouseEventListener( elmNextButton );
-
- bindWorker.destroy();
- bindWorker = null;
-
- currentFile && currentFile.removeEventListener( Const.FILE.EVENT.GET_SEQENTIAL_FILES, draw );
- currentFile = comicData = currentPanel = null;
-
- elmContainer = elmTitle = elmAuthor = elmBackButton = elmNextButton = null;
- };
-}, true, true, 'Comic Reader', 'comicreader', null, '#01A31C' );
-
-
-var Editor = gOS.registerApplication( function(){
-
- var PANEL_ELEMENT_TYPE_IMAGE = 0,
- PANEL_ELEMENT_TYPE_TEXT = 1,
- MODULE_ARRAY = [],
- MOUSE_LISTENER_ARRAY = [],
- PANEL_ELEMENT_ARRAY = [],
- MIN_PANEL_HEIGHT = 20,
- MIN_ELEMENT_SIZE = 19,
- MOUSE_HIT_AREA = 10,
- elmMouseEventChatcher,
- jqMouseEventChacher,
- jqEditor,
- windowW, windowH,
- currentListener = null,
- currentCursor = '',
- self = this,
- app = self,
- option,
- comicID = -1,
- panelID = -1,
- panelTimming = -1,
- phase = -1,
- log;
-
- var kill = function(){
- var o = this, v;
- for( var p in o ){
- if( o.hasOwnProperty && !o.hasOwnProperty( p ) ) continue;
- v = o[ p ];
- delete o[ p ];
- };
- };
-
- var Module = {
- abstractModule: {
- init: function(){
-
- },
- open: function(){
-
- },
- close: function(){
-
- },
- destroy: function(){
- this.kill = kill;
- this.kill();
- }
- },
- register: function( _class ){
- _class.prototype = TMP.abstractModule;
- var ret = _class();
- MODULE_ARRAY.push( ret );
- return ret;
- }
- }
-/* ----------------------------------------
- * MENU BAR
- * - mouseEventListener
- * - controler
- *
- * div
- * div.title
- * ul
- * li
- * a
- * span
- * kbd shortcut
- */
- var MENU_BAR_CONTROL = ( function(){
- var ELM_ITEM_CLASSNAME = 'menu-bar-item',
- itemList = [],
- elmRoot, elmBar,
- elmItemOrigin, elmSelectionOrigin,
- barH, itemW, selectionW;
-
- var MenubarOptionClass = function( callback, separateAfter ){
- this.callback = callback;
- this.separateAfter = separateAfter;
- };
- MenubarOptionClass.prototype = {
- elm: null,
- elmTitle: null,
- title: function( _title ){
- if( Type.isString( _title ) === true ){
- this.elmTitle.innerHTML = _title;
- };
- return this.elmTitle.innerHTML;
- },
- _visible: false,
- visible: function( _visible ){
- if( Type.isBoolean( _visible ) === true && this._visible !== _visible ){
- this._visible = _visible;
- this.elm.className = _visible === true ? '' : 'disabled';
- };
- return this._visible;
- },
- _init: function( elmParent, _title, _shortcut, _visible ){
- this.elm = elmSelectionOrigin.cloneNode( true );
- this.elmTitle = this.elm.getElementsByTagName( 'span' )[ 0 ];
-
- elmParent.appendChild( this.elm );
-
- this.title( _title );
- this.visible( !!_visible );
-
- var elmShortcut = this.elm.getElementsByTagName( 'kbd' )[ 0 ];
- if( _shortcut ){
- elmShortcut.innerHTML = _shortcut;
- } else {
- elmShortcut.parentNode.removeChild( elmShortcut );
- };
- },
- _kill: kill
- };
-
- var MenuBarItemClass = function( title ){
- this.elm = elmItemOrigin.cloneNode( true );
- elmBar.appendChild( this.elm );
- this.elm.style.left = ( itemW * itemList.length ) + 'px';
-
- this.elm.getElementsByTagName( 'div' )[ 0 ].innerHTML = title;
-
- this.elmUl = this.elm.getElementsByTagName( 'ul' )[ 0 ];
- this.optionList = [];
- this.visible = false;
-
- var optionList = this.optionList;
-
- this.onClick = function( e ){
- var i = Util.getChildIndex( this.parentNode, this );
- i !== -1 && this.className !== 'disabled' && optionList[ i ].callback( i );
- return false;
- };
- this._onClose = function(){
- optionList = null;
- };
- };
- MenuBarItemClass.prototype = {
- show: function(){
- if( this.visible === true ) return;
- elmRoot.appendChild( this.elm );
- this.elm.className = ELM_ITEM_CLASSNAME + '-focus';
- this.onShow && app.addAsyncCall( this.onShow );
- this.visible = true;
- },
- hide: function(){
- if( this.visible === false ) return;
- elmBar.appendChild( this.elm );
- this.elm.className = ELM_ITEM_CLASSNAME;
- this.onHide && app.addAsyncCall( this.onHide );
- this.visible = false;
- },
- createOption: function( title, shortcut, callback, visible, separateBefore, separateAfter ){
- var ret = new MenubarOptionClass( callback, separateAfter ),
- before = this.optionList[ this.optionList.length -1 ];
- ret._init( this.elmUl, title, shortcut, visible );
-
- this.optionList.push( ret );
- if( before && ( separateBefore === true || before.separateAfter === true )){
- ret.elm.style.borderTop = '1px solid #ccc';
- }
- return ret;
- },
- _open: function(){
- for( var lis = this.optionList, i = lis.length; i; ){
- app.addMouseEventListener( lis[ --i ].elm, 'click', this.onClick );
- };
- },
- _close: function(){
- this._onClose();
- var o;
- while( o = this.optionList.shift() ) o._kill();
- this._kill = kill;
- this._kill();
- }
- };
-
- function createMenubarItem( title ){
- itemList.push( new MenuBarItemClass( title ) );
- return itemList[ itemList.length - 1 ];
- }
- return {
- init: function(){
- elmRoot = app.rootElement;
- elmBar = document.getElementById( 'menu-bar' );
- elmItemOrigin = ( function(){
- var ret = document.createElement( 'div' ),
- div = document.createElement( 'div' ),
- ul = document.createElement( 'ul' );
- ret.className = ELM_ITEM_CLASSNAME;
- ret.appendChild( div );
- ret.appendChild( ul );
- return ret;
- })();
- elmSelectionOrigin = ( function(){
- var ret = document.createElement( 'li' ),
- a = document.createElement( 'a' ),
- span = document.createElement( 'span' ),
- key = document.createElement( 'kbd' );
- a.appendChild( span );
- a.appendChild( key );
- ret.appendChild( a );
- a.href = '#';
- return ret;
- })();
- barH = Util.getElementSize( elmBar ).height;
- MENU_BAR_CONTROL.h = barH;
- itemW = Util.getElementSize( elmItemOrigin ).width;
- selectionW = Util.getElementSize( elmItemOrigin.getElementsByTagName( 'ul' )[ 0 ] ).width;
-
- MENU_BAR_CONTROL.QUIT = createMenubarItem( 'Quit' );
- MENU_BAR_CONTROL.EDIT = createMenubarItem( 'Edit' );
- MENU_BAR_CONTROL.WINDOW = createMenubarItem( 'Window' );
- MENU_BAR_CONTROL.HELP = Util.extend(
- createMenubarItem( 'Help' ),
- {
- createAjaxSelection: function( callback ){
- var elmLoading = document.createElement( 'li' ),
- that = this;
- this.elmUl.appendChild( elmLoading );
- elmLoading.className = 'loading';
- elmLoading.style.height = '90px';
-
- this.onShow = callback;
- callback = null;
-
- delete this.createAjaxSelection;
- return function(){
- that.elmUl.removeChild( elmLoading );
- that._open();
- delete that.onShow;
- elmLoading = that = null;
- };
- },
- onShow: null
- }
- );
-
- elmBar.style.top = ( -barH ) + 'px';
- $( elmBar ).animate( { top: 0 });
-
- delete MENU_BAR_CONTROL.init;
- },
- open: function(){
- for( var i = itemList.length; i; ) itemList[ --i ]._open();
- delete MENU_BAR_CONTROL.open;
- },
- close: function(){
- var s;
- while( s = itemList.shift() ) s._close();
- itemList = elmRoot = elmBar = elmItemOrigin = elmSelectionOrigin = null;
- MENU_BAR_CONTROL.kill = kill;
- MENU_BAR_CONTROL.kill();
- },
- h: 0,
- mousemove: function( _mouseX, _mouseY ){
- if( barH >= _mouseY ) return true;
-
- for( var i = itemList.length; i; ) itemList[ --i ].hide();
- return false;
- },
- mouseup: function( _mouseX, _mouseY ){
- return false;
- },
- mousedown: function( _mouseX, _mouseY ){
- var l = itemList.length;
- if( barH < _mouseY || itemW * l < _mouseX ) return false;
- for( ; l; ){
- --l;
- itemList[ l ][ l * itemW <= _mouseX && _mouseX < ( l + 1 ) * itemW ? 'show' : 'hide' ]();
- };
- return true;
- },
- busy: function( _busy ){
- return false;
- },
- onWindowResize: function( _windowW, _windowH ){
-
- },
- QUIT: null,
- EDIT: null,
- WINDOW: null,
- HELP: null
- }
- })();
-
-
-/* ----------------------------------------
- * HISTORY_CONTROL
- * - controler
- */
- var HISTORY_CONTROL = ( function() {
- var stackBack = [],
- stackForward = [],
- menubarBack,
- menubarForward;
-
- function back(){
- /*
- * currentを控えてstackForward.push(current)
- * stackBack.pop()を実行してcurrentに
- */
- if( stackBack.length === 0 ) return;
-
- var s = stackBack.pop();
- s.fn( s.argBack );
- menubarBack.visible( stackBack.length !== 0 );
- SAVE_CONTROL.panelUpdated( stackBack.length !== 0 );
-
- stackForward.push( s );
- menubarForward.visible( true );
- };
- function forward(){
- if( stackForward.length === 0 ) return;
-
- var s = stackForward.pop();
- s.fn( s.argForword );
- menubarForward.visible( stackForward.length !== 0 );
-
- stackBack.push( s );
- menubarBack.visible( true );
- SAVE_CONTROL.panelUpdated( true );
- };
- var StackClass = function( _function, _argBack, _argForword, _destroy ){
- this.fn = _function;
- this.argBack = _argBack;
- this.argForword = _argForword;
- this.destroy = _destroy;
- };
- StackClass.prototype.kill = function( _callDestroy ){
- var _argBack = this.argBack,
- _argForword = this.argForword,
- v;
- this._kill = kill;
- this._kill();
-
- if( _callDestroy !== true ) return;
-
- if( Type.isArray( _argBack ) === true ){ // isArray
- while( v = _argBack.shift() ){
- _callDestroy === true && Type.isFunction( v.destroy ) === true && v.destroy();
- };
- };
- if( Type.isArray( _argForword ) === true ){
- while( v = _argForword.shift() ){
- _callDestroy === true && Type.isFunction( v.destroy ) === true && v.destroy();
- };
- };
- };
- return {
- init: function(){
- app.addKeyEventListener( 'keydown', back, 90, false, true ); // ctrl + Z
- app.addKeyEventListener( 'keydown', forward, 90, true, true ); // ctrl + shift + Z
- app.addKeyEventListener( 'keydown', forward, 89, false, true ); // ctrl + Y
-
- delete HISTORY_CONTROL.init;
- },
- open: function(){
- menubarBack = MENU_BAR_CONTROL.EDIT.createOption( 'back', 'ctrl + z', back, false );
- menubarForward = MENU_BAR_CONTROL.EDIT.createOption( 'forward', 'ctrl + y', forward, false, false, true );
-
- delete HISTORY_CONTROL.open;
- },
- close: function(){
- var s;
- while( s = stackBack.shift() ) s.kill( true );
- while( s = stackForward.shift() ) s.kill( true );
- menubarBack = menubarForward = stackBack = stackForward = null;
- },
- saveState: function( _function, _argBack, _argForword, _destroy ){
- stackBack.push( new StackClass( _function, _argBack, _argForword, _destroy ));
- menubarBack.visible( true );
- SAVE_CONTROL.panelUpdated( true );
-
- var s;
- while( s = stackForward.shift() ) s.kill( s.destroy );
- menubarForward.visible( false );
- }
- }
- })();
-
-/* ----------------------------------------
- * SAVE_CONTROL
- * - controler
- */
- var SAVE_CONTROL = ( function(){
- var save, saveQuit, eXport, quit,
- updated = false;
-
- function quit(){
- Editor.shutdown();
- }
- function onExport(){
- OutputConsole.boot(
- comicID, panelID, panelTimming,
- PANEL_CONTROL.w, PANEL_CONTROL.h,
- 2, // border, BackgroundImage
- PANEL_ELEMENT_ARRAY
- );
- }
- return {
- init: function(){
- delete SAVE_CONTROL.init;
- },
- open: function(){
- save = MENU_BAR_CONTROL.QUIT.createOption( 'save', 'ctrl + S', quit, false );
- saveQuit = MENU_BAR_CONTROL.QUIT.createOption( 'save & quit', null, quit, false, false, true );
- eXport = MENU_BAR_CONTROL.QUIT.createOption( 'export', null, onExport, true, false, true );
- quit = MENU_BAR_CONTROL.QUIT.createOption( 'quit', null, quit, true, true );
-
- delete SAVE_CONTROL.open;
- },
- close: function(){
- save = saveQuit = eXport = quit = null;
- SAVE_CONTROL.kill = kill;
- SAVE_CONTROL.kill();
- },
- quit: quit,
- panelUpdated: function( _updated ){
- if( Type.isBoolean( _updated ) === true ){
- save.visible( _updated );
- saveQuit.visible( _updated );
- updated = _updated;
- }
- return updated;
- },
- save: function(){
-
- }
- }
- })();
-
-/* ----------------------------------------
- * WINDOWS_CONTROL
- * - contloler
- * - mouseEventListener
- */
- var WINDOWS_CONTROL = ( function(){
- /*
- * 表示上手前にあるwindowは、WINDOW_ARRAYの先頭にあり、htmlでは後ろにある。
- */
- var DEFAULT_MIN_WINDOW_WIDTH = 200,
- DEFAULT_MIN_WINDOW_HEIGHT = 200,
- WINDOW_ARRAY = [],
- WINDOW_BODY_BODER_SIZE = 1,
- currentWindowIndex = -1,
- currentWindow,
- elmRoot,
- elmWindowOrigin,
- closeButtonWidth;
-
- var WindowClass = function( bodyTempleteID, title, x, y, w, h, visible, CLOSE_BUTTON_ENABLED, RESIZE_BUTTON_ENABLED, minWindowW, minWindowH ){
- var menubarOption,
- elmHeader, elmFooter = null,
- elmBody, elmBodyStyle,
- startX, startY, startW, startH,
- offsetX, offsetY,
- headerH, bodyH, footerH = 0,
- isDragging = false,
- isResizing = false,
- bodyIsTachable = false,
- self = this;
-
- function update( _x, _y, _w, _h ){
- _x = _x !== undefined ? _x : x;
- _y = _y !== undefined ? _y : y;
- _y = _y > MENU_BAR_CONTROL.h ? _y : MENU_BAR_CONTROL.h;
- _w = _w !== undefined ? _w : w;
- _h = _h !== undefined ? _h : h;
- self.elm.style.cssText = [
- 'left:', _x, 'px;',
- 'top:', _y, 'px;',
- 'width:', _w, 'px;',
- 'height:', _h, 'px;'
- ].join( '' );
- bodyH = _h - headerH - footerH;
- elmBodyStyle.height = bodyH + 'px';
- ( w !== _w || h !== _h) && self.onResize && self.onResize( _w, bodyH );
- x = _x;
- y = _y;
- w = _w;
- h = _h;
- };
- function bodyBackOrForward( isBack ){
- if( !self ) return;
- if( bodyIsTachable === !isBack ) return;
- elmBodyStyle.position = isBack === true ? 'relative' : 'absolute';
- elmBodyStyle.left = isBack === true ? 0 : x +'px';
- elmBodyStyle.top = isBack === true ? 0 : y + headerH + 'px';
- elmBodyStyle.width = isBack === true ? '' : ( w - WINDOW_BODY_BODER_SIZE * 2 ) + 'px';
- bodyIsTachable === isBack && isBack === true ? elmHeader.parentNode.insertBefore( elmBody, elmHeader.nextSibling ) : app.rootElement.appendChild( elmBody );
- bodyIsTachable = !isBack;
- };
-
- this.init = function(){
- self.elm = elmWindowOrigin.cloneNode( true );
- menubarOption = MENU_BAR_CONTROL.WINDOW.createOption(
- ( visible !== true ? 'show ' : 'hide ' ) + title,
- null, function(){ visible === true ? self.close() : self.open(); }, true
- );
- elmHeader = Util.getElementsByClassName( self.elm, 'window-header' )[ 0 ];
- elmHeader.innerHTML = title;
- headerH = Util.getElementSize( elmHeader ).height;
- elmBody = Util.getElementsByClassName( self.elm, 'window-body' )[ 0 ];
- elmBodyStyle = elmBody.style;
-
- self.onInit && self.onInit();
- delete self.init;
- };
- this.x = function(){ return x;};
- this.y = function(){ return y;};
- this.w = function(){ return w;};
- this.h = function(){ return h;};
- this.title = function( _title ){
- if( Type.isString( _title ) === true ){
- jqHeader.html( _title );
- title = _title;
- }
- return title;
- };
- this.visible = visible;
- this.firstOpen = function(){
- var elmReplace = Util.getElementsByClassName( self.elm, 'window-body-insert-position' )[ 0 ];
-
- if( bodyTempleteID ){
- elmReplace.parentNode.replaceChild( document.getElementById( bodyTempleteID ), elmReplace );
- } else {
- elmReplace.parentNode.removeChild( elmReplace );
- };
-
- if( CLOSE_BUTTON_ENABLED !== true ){
- var elmClose = Util.getElementsByClassName( self.elm, 'window-close-button' )[ 0 ];
- elmClose.parentNode.removeChild( elmClose );
- };
-
-
- var elmFooter = Util.getElementsByClassName( self.elm, 'window-footer' )[ 0 ];
- if( RESIZE_BUTTON_ENABLED === true ){
- footerH = Util.getElementSize( elmFooter ).height;
- } else {
- elmFooter.parentNode.removeChild( elmFooter );
- }
- self.onFirstOpen && self.onFirstOpen( w, h - headerH - footerH );
-
- update( x, y, w, h );
-
- delete self.firstOpen;
- };
- this.open = function(){
- if( visible === true )return;
- self.visible = visible = true;
- openWindow( self );
- menubarOption.title( 'hide ' + title );
-
- for( var i=0, l = WINDOW_ARRAY.length; i<l; ++i ){
- if( WINDOW_ARRAY[ i ] === self ){
- WINDOW_ARRAY.splice( i, 1 );
- WINDOW_ARRAY.unshift( self );
- currentWindow = null;
- currentWindowIndex = -1;
- };
- };
- };
- this.onFadeIn = function(){
- self.firstOpen && self.firstOpen();
- self.onOpen && self.onOpen( w, bodyH );
- };
- this.onFadeOut = function(){
- self.elm.parentNode.removeChild( self.elm );
- self.onClose && app.addAsyncCall( self.onClose );
- };
- this.close = function(){
- if( visible === false) return;
- self.visible = visible = false;
- $( self.elm ).fadeOut( self.onFadeOut );
- menubarOption.title( 'show ' + title );
- };
- this.bodyBackOrForward = bodyBackOrForward;
- this.mousedown = function( _mouseX, _mouseY ){
- if( RESIZE_BUTTON_ENABLED === true && x + w -20 <= _mouseX && _mouseX < x + w && y + headerH + bodyH < _mouseY && _mouseY <= y + h ){
- bodyBackOrForward( true);
- isResizing = true;
- startX = x;
- startY = y;
- startW = w;
- startH = h;
- offsetX = _mouseX;
- offsetY = _mouseY;
- updateMouseCursor( 'nw-resize');
- return;
- }
-
- if( x > _mouseX || y > _mouseY || x + w < _mouseX || y + headerH < _mouseY ) return;
- if( CLOSE_BUTTON_ENABLED === true && x + w - closeButtonWidth < _mouseX){
- self.close();
- return;
- }
-
- isDragging = true;
- updateMouseCursor( 'move');
- startX = x;
- startY = y;
- startW = w;
- startH = h;
- offsetX = _mouseX;
- offsetY = _mouseY;
- };
- this.mouseup = function( _mouseX, _mouseY ){
- isDragging = isResizing = false;
- updateMouseCursor( '');
- };
- this.mousemove = function( _mouseX, _mouseY ){
- var _updateX = _mouseX - offsetX,
- _updateY = _mouseY - offsetY;
-
- if( isResizing === true){
- var _w = startW +_updateX,
- _h = startH +_updateY;
- update( startX, startY, _w < minWindowW ? minWindowW : _w, _h < minWindowH ? minWindowH : _h );
- return;
- } else
- if( isDragging === true) {
- update( startX + _updateX, startY + _updateY);
- return;
- } else
- if( x > _mouseX || x + w < _mouseX ) return;
-
- ( y <= _mouseY && y +headerH >= _mouseY ) ?
- updateMouseCursor( 'pointer') : // hit to header
- updateMouseCursor( '');
- bodyBackOrForward( y + headerH > _mouseY || y + headerH + bodyH < _mouseY);
- };
- this.onMouseOut = function( _mouseX, _mouseY ){
- bodyIsTachable === true && bodyBackOrForward( true );
- isDragging = false;
- updateMouseCursor( '' );
- };
- this.busy = function(){
- return isDragging === true || isResizing === true;
- };
- };
-
- function getCurrentIndex( _mouseX, _mouseY ){
- if( currentWindow && currentWindow.busy() === true ) return currentWindowIndex;
- var l = WINDOW_ARRAY.length,
- _currentWindow = null,
- _win, _x, _y;
- currentWindowIndex = -1;
- for( var i=0; i<l; i++){
- _win = WINDOW_ARRAY[ i];
- if( _win.visible !== true ) continue;
- _x = _win.x();
- _y = _win.y();
- if( _x <= _mouseX && _y <= _mouseY && _x +_win.w() >= _mouseX && _y +_win.h() >= _mouseY){
- _currentWindow = _win;
- currentWindowIndex = i;
- break;
- }
- }
- currentWindow && currentWindow !== _currentWindow && currentWindow.onMouseOut( _mouseX, _mouseY);
- currentWindow = _currentWindow;
- return currentWindowIndex;
- }
- function openWindow( _window ){
- if( _window.visible !== true ) return;
- elmRoot.appendChild( _window.elm );// appendした後に fadeIn() しないと ie で filterが適用されない．
- $( _window.elm ).fadeIn( _window.onFadeIn );
- return;
- }
-
- return {
- init: function(){
- elmRoot = document.getElementById( 'window-container' );
- elmWindowOrigin = app.fetchHTMLElement( 'windowTemplete' );
- closeButtonWidth = Util.getElementSize( Util.getElementsByClassName( elmWindowOrigin, 'window-close-button' )[ 0 ] ).width;
-
- delete WINDOWS_CONTROL.init;
- },
- open: function(){
- for( var i = WINDOW_ARRAY.length, _window; i; ){
- _window = WINDOW_ARRAY[ --i ];
- _window.init && _window.init();
- _window.visible === true && openWindow( _window );
- };
-
- delete WINDOWS_CONTROL.open;
- },
- close: function(){
- },
- mousemove: function( _mouseX, _mouseY ){
- var _index = getCurrentIndex( _mouseX, _mouseY );
- if( _index === 0 ){
- currentWindow.mousemove( _mouseX, _mouseY );
- return true;
- } else
- if( _index > 0 ){ // 先頭のクリックでない場合
- // Array を前に
- WINDOW_ARRAY.splice( currentWindowIndex, 1 );
- WINDOW_ARRAY.unshift( currentWindow );
- // Domを最後に
- elmRoot.appendChild( currentWindow.elm );
- currentWindowIndex = 0;
- return true;
- }
- return false;
- },
- mouseup: function( _mouseX, _mouseY ){
- if( getCurrentIndex( _mouseX, _mouseY) === 0){
- currentWindow.mouseup( _mouseX, _mouseY);
- return true;
- }
- return false;
- },
- mousedown: function( _mouseX, _mouseY ){
- if( getCurrentIndex( _mouseX, _mouseY) === 0){
- currentWindow.mousedown( _mouseX, _mouseY);
- return true;
- }
- return false;
- },
- busy: function(){
- return currentWindow !== null;
- },
- onWindowResize: function( _windowW, _windowH ){
- /*
- * 画面外に出るwindowの移動
- */
- },
- 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;
- opt_minWindowW = opt_minWindowW || ( w < DEFAULT_MIN_WINDOW_WIDTH ) ? w : DEFAULT_MIN_WINDOW_WIDTH;
- opt_minWindowH = opt_minWindowH || ( h < DEFAULT_MIN_WINDOW_HEIGHT ) ? h : DEFAULT_MIN_WINDOW_HEIGHT;
-
- var _window = new WindowClass( bodyTempleteID, title, x, y, w, h, opt_visible, opt_closeButtonEnabled, opt_resizeButtonEnabled, opt_minWindowW, opt_minWindowH );
- for( var key in EXTENDS ){
- _window[ key ] = EXTENDS[ key ];
- }
- WINDOW_ARRAY.unshift( _window );
- if( Type.isUndefined( WINDOWS_CONTROL.init ) === true ){
- _window.init();
- openWindow( _window );
- }
- return _window;
- }
- }
- })();
-
-/* ----------------------------------------
- * TOOL_BOX_WINDOW
- * - window
- */
- var TOOL_BOX_WINDOW = ( function(){
-
- app.addKeyEventListener( 'keydown', addImage, 73, false, true );
- app.addKeyEventListener( 'keydown', addText, 84, false, true );
- app.addKeyEventListener( 'keydown', switchGrid, 71, false, true );
-
- function addImage(){
- IMAGE_EXPLORER_WINDOW.open();// setTimeout( IMAGE_EXPLORER_WINDOW.open, 0);
- TOOL_BOX_WINDOW.bodyBackOrForward( true );
- };
- function addText(){
- app.addAsyncCall( PANEL_ELEMENT_CONTROL.createTextElement );
- };
- function switchGrid(){
- app.addAsyncCall( GRID_CONTROL.update );
- };
- function popupHelp(){
- TOOL_BOX_WINDOW.bodyBackOrForward( true );
- app.addAsyncCall( HELP_DOCUMENTS_WINDOW.open );
- };
- function editBG( e ){
- TOOL_BOX_WINDOW.bodyBackOrForward( true );
- app.addAsyncCall( INFOMATION_WINDOW.open );
- };
-
- return WINDOWS_CONTROL.createWindow(
- {
- onInit: function(){
- MENU_BAR_CONTROL.EDIT.createOption( 'Add Image', 'ctrl + I', addImage, true, true, false);
- MENU_BAR_CONTROL.EDIT.createOption( 'Add Text', 'ctrl + T', addText, true, false, true);
- MENU_BAR_CONTROL.EDIT.createOption( 'show Grid', 'ctrl + G', switchGrid, true, true, true);
-
- delete TOOL_BOX_WINDOW.onInit;
- },
- onFirstOpen: function(){
- app.addMouseEventListener( document.getElementById( 'toolbox-add-image-button'), 'click', addImage );
- app.addMouseEventListener( document.getElementById( 'toolbox-add-text-button'), 'click', addText );
- app.addMouseEventListener( document.getElementById( 'toolbox-edit-bg-button'), 'click', editBG );
- app.addMouseEventListener( document.getElementById( 'toolbox-switch-grid'), 'click', switchGrid );
- app.addMouseEventListener( document.getElementById( 'toolbox-popup-help-button'), 'click', popupHelp );
-
- // postButton = $( '#toolbox-post-button');
-
- delete TOOL_BOX_WINDOW.onFirstOpen;
- }
- },
- 'toolbox-window', 'Tool box', 0, 215, 110, 290, true
- );
- })();
-
-
-/* ----------------------------------------
- * IMAGE_EXPROLER
- * - window
- */
- var IMAGE_EXPLORER_WINDOW = ( function(){
- var tree, finder;
-
- function onFileSelect( _file ){
- // 他の image ファイルも許可する？
- if( Driver.isPettanrFileInstance( _file ) === true ){
- if( _file.getType() === FILE_TYPE.PICTURE ){
- PANEL_ELEMENT_CONTROL.onImageSelect( FileAPI.getFileData( _file ) );
- }
- }
- }
-
- return WINDOWS_CONTROL.createWindow(
- {
- onInit: function(){
- delete IMAGE_EXPLORER_WINDOW.onInit;
- },
- onFirstOpen: function( _w, _h ){
- tree = FileAPI.createTree( FILE_DATA_PICTURE_ROOT );
- var _root = tree.getRootFile(),
- _myPic = _root.getChildFileByIndex( 0 ),
- _pic = _root.getChildFileByIndex( 1 );
- _myPic.getSeqentialFiles();
- _pic.getSeqentialFiles();
- _myPic.destroy();
- _pic.destroy();
-
- finder = app.createFinder(
- document.getElementById( 'image-exproler-container' ),
- tree,
- null, null,
- onFileSelect,
- PANEL_ELEMENT_CONTROL.onImageSelect
- );
-
- delete IMAGE_EXPLORER_WINDOW.onFirstOpen;
- },
- onOpen: function( _w, _h ){
- finder.resize( _w, _h );
- },
- onResize: function( _w, _h ){
- finder.resize( _w, _h );
- }
- },
- 'image-exproler', 'Album', 0, 215, 600, 350, false, true, true, 300, 300
- );
- })();
-
-
-/* ----------------------------------------
- * INFOMATION_WINDOW
- * - window
- */
- var INFOMATION_WINDOW = ( function(){
- var FADE_EFFECT_ENABLED = true, //UA.isIE === false || UA.ieVersion >= 8,
- FADE_IN_EFFECT = FADE_EFFECT_ENABLED === true ? 'fadeIn' : 'show',
- FADE_OUT_EFFECT = FADE_EFFECT_ENABLED === true ? 'fadeOut' : 'hide',
- backgroundInfomationElm,
- jqPanelElementInformation,
- ui, inputX, inputY, inputZ, inputA, inputW, inputH, inputAspectRatio,
- inputPercentW, inputPercentH,
- currentPanelElement = null,
- currentElementType = -1,
- currentLock = false;
-
- return WINDOWS_CONTROL.createWindow(
- {
- onFirstOpen: function( _w, _h ){
- backgroundInfomationElm = $( '#panel-background-information');
-
- jqPanelElementInformation = $( '#comic-element-infomation').hide().css( {
- height: _h
- });
- ui = app.createUIGroup();
- inputX = ui.createInputText( document.getElementById( 'comic-element-x' ), null );
- inputY = ui.createInputText( document.getElementById( 'comic-element-y' ), null );
- inputZ = ui.createInputText( document.getElementById( 'comic-element-z' ), null );
- inputA = ui.createInputText( document.getElementById( 'comic-element-a' ), null );
- inputW = ui.createInputText( document.getElementById( 'comic-element-w' ), null );
- inputH = ui.createInputText( document.getElementById( 'comic-element-h' ), null );
- inputPercentW = ui.createInputText( document.getElementById( 'comic-element-w-percent' ), null );
- inputPercentH = ui.createInputText( document.getElementById( 'comic-element-h-percent' ), null );
- inputAspectRatio = $( '#comic-element-keep-aspect' );
- delete INFOMATION_WINDOW.onFirstOpen;
- },
- onResize: function( _w, _h ){
- jqPanelElementInformation.css( {
- height: _h
- });
- },
- 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 === PANEL_ELEMENT_TYPE_TEXT ? Math.floor( currentElement.angle() ) : 0,
- w = currentElement !== null ? currentElement.w : 0,
- h = currentElement !== null ? currentElement.h : 0,
- actualW = _elementType === PANEL_ELEMENT_TYPE_IMAGE ? currentElement.actualW() : 1,
- actualH = _elementType === PANEL_ELEMENT_TYPE_IMAGE ? currentElement.actualH() : 1,
- wPercent = _elementType === PANEL_ELEMENT_TYPE_IMAGE ? Math.floor( w / actualW *100 ) : 0,
- hPercent = _elementType === PANEL_ELEMENT_TYPE_IMAGE ? Math.floor( h / actualH *100 ) : 0,
- keepAspect = currentElement !== null && currentElement.keepAspect === true;
-
- if( currentElementType !== _elementType ){
- if( _elementType !== -1 ){
- if( _elementType === 1 ){
- inputA.visible( true );
- inputPercentW.visible( false );
- inputPercentH.visible( false );
- inputAspectRatio.hide();
- } else {
- inputA.visible( false );
- inputPercentW.visible( true );
- inputPercentH.visible( true );
- inputAspectRatio.show();
- }
- currentElementType === -1 && jqPanelElementInformation.stop().css( {
- filter: '',
- opacity: ''
- })[ FADE_IN_EFFECT ]();
- } else {
- currentElementType !== -1 && jqPanelElementInformation.stop().css({
- filter: '',
- opacity: ''
- })[ FADE_OUT_EFFECT ]();
- }
- currentElementType = _elementType;
- }
- if( currentElementType !== -1){
- inputX.value( x );
- inputY.value( y );
- inputZ.value( z );
- _elementType === 1 && inputA.value( a );
- inputW.value( w );
- inputH.value( h );
- _elementType === 0 && inputPercentW.value( wPercent );
- _elementType === 0 && inputPercentH.value( hPercent );
- } else {
-
- }
- },
- lock: function( _currentLock ){
- currentLock = !!_currentLock;
- INFOMATION_WINDOW.bodyBackOrForward( !currentLock );
- }
- },
- 'infomation-window', 'Infomation', 0, 30, 200, 180, true
- );
- })();
-
-/* ----------------------------------------
- * HELP_WINDOW
- * - window
- */
- var HELP_DOCUMENTS_WINDOW = ( function(){
- var visible = true,
- jqAjaxContents,
- jqNaviItems,
- jqPages,
- currentPageIndex = 0,
- numPage = 0,
- help = null,
- onLoadFunction = null;
-
- function onAjaxStart( _pageIndex ){
- currentPageIndex = _pageIndex || currentPageIndex;
- if( onHelpLoad !== null ){
- $.ajax({
- url: 'help/jp.xml',
- dataType: 'xml',
- success: onHelpLoad
- });
- onHelpLoad = null;
- }
- onAjaxStart = new Function;
- }
- var onHelpLoad = 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;
- elmNavi.className = 'sidenavi';
- elmItemOrigin.className = 'sidenavi-item';
- elmItemOrigin.href = '#';
- elmPages.className = 'page-contents';
- elmPageOrigin.className = 'page-content main';
- elmPageOrigin.appendChild( elmTitleOrigin);
-
- 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;
-
- 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.createOption( 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 );
-
- app.addAsyncCall( jumpPage );
- }
- function onSelectionClick( _pageIndex ){
- HELP_DOCUMENTS_WINDOW.open();
- jumpPage( _pageIndex );
- }
- function jumpPage( _index ){
- if( Type.isNumber( _index ) === true && 0 <= _index && _index < numPage && currentPageIndex !== _index ){
- currentPageIndex = _index;
- }
- jqNaviItems.removeClass( 'current' ).eq( currentPageIndex).addClass( 'current' );
- jqPages.hide().eq( currentPageIndex ).show();
- }
- function onNaviClick( e ){
- // this は <a>
- jumpPage( Util.getChildIndex( this.parentNode, this ));
- return false;
- }
- function onInnerLinkClick( e ){
- var jump = ( this.href || '' ).split( '#jump' ),
- n = jump[ 1 ];
- if( !n ) return;
- jumpPage( '' + parseFloat( n ) === n ? parseFloat( n ) : -1 );
- return false;
- }
- return WINDOWS_CONTROL.createWindow(
- {
- onInit: function(){
- help = MENU_BAR_CONTROL.HELP;
- onLoadFunction = help.createAjaxSelection( onAjaxStart );
- jqAjaxContents = $( HELP_DOCUMENTS_WINDOW.elm ).find( '.window-body' ).addClass( 'loading' ).css( { overflow: 'auto' } );
- delete HELP_DOCUMENTS_WINDOW.onInit;
- },
- onFirstOpen: function( _w, _h ){
- jqAjaxContents.css( { height: _h } );
- onAjaxStart();
- delete HELP_DOCUMENTS_WINDOW.onFirstOpen;
- },
- onResize: function( _w, _h ){
- jqAjaxContents && jqAjaxContents.css( { height: _h });
- }
- },
- null, 'Help', 0, 215, 400, 350, false, true, true, 300, 300
- );
- })();
-
-/* ----------------------------------------
- * GRID_CONTROL
- * - control
- * - panelResizeListener
- */
- var GRID_CONTROL = ( function(){
- var elmGrid,
- urlBG = "url('images/grid.gif')",
- visible = false;
-
- return {
- init: function(){
- elmGrid = document.getElementById( 'grid' );
- delete GRID_CONTROL.init;
- },
- open: function(){
- delete GRID_CONTROL.open;
- },
- close: function(){
-
- },
- onPanelResize: function( _panelX, _panelY ){
- elmGrid.style.backgroundPosition = [ _panelX % 10, 'px ', _panelY % 10, 'px' ].join( '' );
- elmGrid.style.height = windowH +'px';
- },
- enabled: function(){
- return visible;
- },
- update: function(){
- $( elmGrid ).stop().css( {
- opacity: '',
- fliter: ''
- })[ visible === true ? 'fadeOut' : 'fadeIn' ]();
-
- visible = !visible;
-
- if( visible === true && urlBG !== null ){
- elmGrid.style.backgroundImage = urlBG;
- urlBG = null;
- }
- return visible;
- }
- }
- })();
-
-/* ----------------------------------------
- * WHITE_GLASS_CONTROL
- * - panelResizeListener
- */
- var WHITE_GLASS_CONTROL = ( function(){
- var styleTop, styleLeft, styleRight, styleBottom;
-
- return {
- init: function(){
- styleTop = document.getElementById( 'whiteGlass-top' ).style;
- styleLeft = document.getElementById( 'whiteGlass-left' ).style;
- styleRight = document.getElementById( 'whiteGlass-right' ).style;
- styleBottom = document.getElementById( 'whiteGlass-bottom' ).style;
- delete WHITE_GLASS_CONTROL.init;
- },
- onPanelResize: function( _panelX, _panelY, _panelW, _panelH ){
- var _w = _panelW,
- _h = _panelH,
- marginTop = _panelY,
- marginBottom = windowH -_h -marginTop,
- marginX = _panelX,
- rightWidth = windowW -_w -marginX;
-
- styleTop.height = ( marginTop < 0 ? 0 : marginTop ) + 'px';
-
- styleLeft.top = marginTop + 'px';
- styleLeft.width = ( marginX < 0 ? 0 : marginX ) + 'px';
- styleLeft.height = ( _h + marginBottom ) + 'px';
-
- styleRight.top = marginTop + 'px';
- styleRight.left = _w +marginX + 'px';
- styleRight.width = ( rightWidth < 0 ? 0 : rightWidth ) + 'px';
- styleRight.height = ( _h + marginBottom ) + 'px';
-
- styleBottom.top = ( _h +marginTop ) + 'px';
- styleBottom.left = marginX + 'px';
- styleBottom.width = _w + 'px';
- styleBottom.height = ( marginBottom < 0 ? 0 : marginBottom ) + 'px';
- }
- }
- })();
-
-
-/* --------------------------------------------------------------------------------------------
- * PanelResizerClass
- * - mouseEventListener
- */
- var PanelResizerClass = function( id, isTop ){
- var style = document.getElementById( id ).style,
- BORDER_WIDTH = 2,
- RESIZER_HEIGHT = 30,
- x = -BORDER_WIDTH / 2,
- y = isTop === true ? ( -5 - RESIZER_HEIGHT - BORDER_WIDTH ) : 0,
- w,
- h = RESIZER_HEIGHT,
- panelX, panelY, panelW, panelH,
- offsetY, startY, startH,
- isDragging = false;
-
- function restoreState( arg ){
- if( arg && arg.length > 3){
- PANEL_CONTROL.resize( isTop, arg[ 0 ] || panelX, arg[ 1 ] || panelY, arg[ 2 ] || panelW, arg[ 3 ] || panelH );
- };
- };
-
- this.mousedown = function( _mouseX, _mouseY ){
- var _x = _mouseX -panelX,
- _y = _mouseY -panelY;
- if( _x < x || x + w < _x || _y < y || y + h < _y) return false;
- offsetY = _y;
- startY = panelY;
- startH = panelH;
- isDragging = true;
- updateMouseCursor( 'n-resize' );
- return true;
- };
- this.mousemove = function( _mouseX, _mouseY ){
- var _x = _mouseX - panelX,
- _y = _mouseY - panelY;
- if( isDragging !== true ){
- if( _x < x || x + w < _x || _y < y || y + h < _y ) return false;
- PANEL_ELEMENT_OPERATION_MANAGER.hide();
- updateMouseCursor( 'pointer' );
- return true;
- } else {
- var move = _y -offsetY;
- if( isTop === true){
- if( panelH - move < MIN_PANEL_HEIGHT ){
- move = panelH -MIN_PANEL_HEIGHT;
- };
- PANEL_CONTROL.resize( true, panelX, panelY + move, panelW, panelH - move );
- } else {
- var _h = startH + move;
- if( 0 < _h && _h < windowH -panelY -RESIZER_HEIGHT -5 -BORDER_WIDTH ){
- PANEL_CONTROL.resize( false, panelX, panelY, panelW, _h < MIN_PANEL_HEIGHT ? MIN_PANEL_HEIGHT : _h );
- };
- };
- };
- return true;
- };
- this.mouseup = function( _mouseX, _mouseY ){
- if( isDragging !== true ) return;
- ( startY !== panelY || startH !== panelH ) && HISTORY_CONTROL.saveState( restoreState, [ NaN, startY, NaN, startH], [ NaN, panelY, NaN, panelH ] );
- isDragging = false;
- updateMouseCursor( '');
- };
- this.busy = function(){
- return isDragging;
- };
- this.onPanelResize = function( _x, _y, _w, _h ){
- panelX = _x;
- panelY = _y;
- if( panelW !== _w ){
- style.width = ( _w + 2 ) + 'px';
- panelW = _w;
- }
- panelH = _h;
- y = isTop === true ? y : ( panelH + 5 + BORDER_WIDTH );
- w = panelW + 2;
- };
- };
- var PANEL_RESIZER_TOP,
- PANEL_RESIZER_BOTTOM;
-
-/* ----------------------------------------
- * PANEL_CONTROL
- * - controler
- * - mouseEventListener
- *
- * panel-border の表示と onPanelResize の通知．
- * panel drag.
- *
- */
- var PANEL_CONTROL = ( function(){
- var elmPanel, stylePanel,
- DEFAULT_PANEL_WIDTH = 400,
- DEFAULT_PANEL_HEIGHT = 300,
- borderSize = 2,
- offsetX, offsetY, startX, startY,
- isDragging = false,
- isDraggable = false;
-
- app.addKeyEventListener( 'keychange', onSpaceUpdate, 32, false, false );
-
- function onSpaceUpdate( e ){
- if( e.type === 'keyup' ){
- currentListener === null && updateMouseCursor( '' );
- isDraggable = false;
- } else {
- currentListener === null && updateMouseCursor( 'move' );
- isDraggable = true;
- };
- return false;
- };
-
- return {
- x: 0,
- y: 0,
- w: 0,
- h: 0,
- init: function(){
- elmPanel = document.getElementById( 'panel-tools-container' );
- stylePanel = elmPanel.style;
-
- PANEL_RESIZER_TOP = new PanelResizerClass( 'panel-resizer-top', true );
- PANEL_RESIZER_BOTTOM = new PanelResizerClass( 'panel-resizer-bottom', false );
- PanelResizerClass = null;
-
- delete PANEL_CONTROL.init;
- },
- open: function( _panelW, _panelH, _borderSize ){
- PANEL_CONTROL.w = Type.isFinite( _panelW ) === true ? _panelW : DEFAULT_PANEL_WIDTH;
- PANEL_CONTROL.h = Type.isFinite( _panelH ) === true ? _panelH : DEFAULT_PANEL_HEIGHT;
- borderSize = Type.isFinite( _borderSize ) === true ? _borderSize : borderSize;
-
- delete PANEL_CONTROL.open;
- },
- close: function(){
-
- },
- resize: function( isResizerTopAction, _x, _y, _w, _h ){
- PANEL_CONTROL.x = _x = _x !== undefined ? _x : PANEL_CONTROL.x;
- PANEL_CONTROL.y = _y = _y !== undefined ? _y : PANEL_CONTROL.y;
- PANEL_CONTROL.w = _w = _w !== undefined ? _w : PANEL_CONTROL.w;
- PANEL_CONTROL.h = _h = _h !== undefined ? _h : PANEL_CONTROL.h;
-
- stylePanel.left = ( _x - borderSize ) + 'px';
- stylePanel.top = ( _y - borderSize ) + 'px';
- stylePanel.width = _w + 'px';
- stylePanel.height = _h + 'px';
-
- PANEL_RESIZER_TOP.onPanelResize( _x, _y, _w, _h );
- PANEL_RESIZER_BOTTOM.onPanelResize( _x, _y, _w, _h );
- GRID_CONTROL.onPanelResize( _x, _y );
- WHITE_GLASS_CONTROL.onPanelResize( _x, _y, _w, _h );
- PANEL_ELEMENT_CONTROL.onPanelResize( _x, _y, _w, _h, isResizerTopAction === true );
- },
- onWindowResize: function( _windowW, _windowH ){
- PANEL_CONTROL.x = Math.floor( ( _windowW - PANEL_CONTROL.w ) / 2 );
- PANEL_CONTROL.y = Math.floor( ( _windowH - PANEL_CONTROL.h ) / 2 );
- PANEL_CONTROL.resize();
- },
- mousemove: function( _mouseX, _mouseY ){
- if( isDraggable === true && isDragging === true ){
- PANEL_CONTROL.resize( false, startX + _mouseX - offsetX, startY + _mouseY - offsetY );
- }
- },
- mouseup: function( _mouseX, _mouseY ){
- if( isDraggable === true ){
- isDragging = false;
- updateMouseCursor( '' );
- }
- },
- mousedown: function( _mouseX, _mouseY ){
- if( isDraggable === true ){
- offsetX = _mouseX;
- offsetY = _mouseY;
- startX = PANEL_CONTROL.x;
- startY = PANEL_CONTROL.y;
- isDragging = true;
- updateMouseCursor( 'move' );
- return true;
- }
- },
- busy: function(){
- return isDragging === true;
- }
- }
- })();
-
-
-/* --------------------------------------------------------------------------------------------
- * CONSOLE_CONTROLER
- */
- var CONSOLE_CONTROLER = ( function(){
- var LAYER_BACK_BUTTON, LAYER_FORWARD_BUTTON, DELETE_BUTTON, EDIT_BUTTON, CHANGE_BUTTON,
- elmConsoleWrapper, styleConsoleWrapper,
- elmConsoleParent,
- styleImgConsole, styleTextConsole,
- currentElement = null,
- currentType = -1,
- visible = false,
- imgConsoleWidth, imgConsoleHeight,
- textConsoleWidth, textConsoleHeight,
- tailSize = 10,
- buttonClickable = false;
-
- function buttonBackOrForward( isBack ){
- var offset = Util.getAbsolutePosition( elmConsoleWrapper );
- styleConsoleWrapper.position = isBack === true ? '' : 'absolute';
- styleConsoleWrapper.left = ( isBack === true ? CONSOLE_CONTROLER.x : offset.x ) + 'px';
- styleConsoleWrapper.top = ( isBack === true ? CONSOLE_CONTROLER.y : offset.y ) + 'px';
- buttonClickable === isBack && ( isBack === true ? elmConsoleParent : app.rootElement ).appendChild( elmConsoleWrapper );
- buttonClickable = !isBack;
- };
- function layerBack(){
- if( currentElement === null) return;
- if( PANEL_ELEMENT_CONTROL.replace( currentElement, false) === false ) return;
- INFOMATION_WINDOW.update( currentElement );
- HISTORY_CONTROL.saveState( PANEL_ELEMENT_CONTROL.restoreReplace, [ currentElement, true ], [ currentElement, false ]);
- var _z = currentElement.z;
- LAYER_BACK_BUTTON.visible( _z > 0 );
- LAYER_FORWARD_BUTTON.visible( _z < PANEL_ELEMENT_ARRAY.length -1 );
- };
- function layerForward(){
- if( currentElement === null) return;
- if( PANEL_ELEMENT_CONTROL.replace( currentElement, true) === false) return;
- INFOMATION_WINDOW.update( currentElement);
- HISTORY_CONTROL.saveState( PANEL_ELEMENT_CONTROL.restoreReplace, [ currentElement, false], [ currentElement, true]);
- var _z = currentElement.z;
- LAYER_BACK_BUTTON.visible( _z > 0);
- LAYER_FORWARD_BUTTON.visible( _z < PANEL_ELEMENT_ARRAY.length -1);
- };
- function del(){
- if( currentElement === null) return;
- buttonBackOrForward( true);
- PANEL_ELEMENT_CONTROL.remove( currentElement);
- HISTORY_CONTROL.saveState( PANEL_ELEMENT_CONTROL.restore, [ true, currentElement], [ false, currentElement], true);
- PANEL_ELEMENT_OPERATION_MANAGER.hide();
- };
- function edit(){
- if( currentElement === null || currentElement.type !== PANEL_ELEMENT_TYPE_TEXT) return;
- TextEditor.boot( PANEL_CONTROL.x, PANEL_CONTROL.y, currentElement );
- buttonBackOrForward( true );
- };
- function change(){
- if( currentElement === null) return;
- buttonBackOrForward( true);
- PremiumSatge.boot( currentElement.getArtistID(), currentElement.resourcePicture );
- };
- function onImageSelect( resourcePicture ){
- currentElement.resourcePicture( resourcePicture );
- };
- return {
- x: 0,
- y: 0,
- w: 0,
- h: 0,
- init: function(){
- app.addKeyEventListener( 'keydown', layerBack, 66, false, true );
- app.addKeyEventListener( 'keydown', layerForward, 70, false, true );
- app.addKeyEventListener( 'keydown', del, 68, false, true );
- app.addKeyEventListener( 'keydown', edit, 69, false, true );
- app.addKeyEventListener( 'keydown', change, 85, false, true );
-
- var elmImgConsole = document.getElementById( 'image-element-consol' ),
- imgConsoleSize = Util.getElementSize( elmImgConsole );
- imgConsoleWidth = imgConsoleSize.width;
- imgConsoleHeight = imgConsoleSize.height;
- styleImgConsole = elmImgConsole.style;
- elmImgConsole.style.display = 'none';
-
- var elmTextConsole = document.getElementById( 'text-element-consol' ),
- textConsoleSize = Util.getElementSize( elmTextConsole );
- textConsoleWidth = textConsoleSize.width;
- textConsoleHeight = textConsoleSize.height;
- styleTextConsole = elmTextConsole.style;
- styleTextConsole.display = 'none';
-
- elmConsoleWrapper = document.getElementById( 'comic-element-consol-wrapper' );
- styleConsoleWrapper = elmConsoleWrapper.style;
- elmConsoleParent = elmConsoleWrapper.parentNode;
- styleConsoleWrapper.display = 'none';
-
- app.addMouseEventListener( document.getElementById( 'edit-text-button' ), 'click', edit );
- app.addMouseEventListener( document.getElementById( 'delete-image-button' ), 'click', del );
- app.addMouseEventListener( document.getElementById( 'delete-text-button' ), 'click', del );
- app.addMouseEventListener( document.getElementById( 'change-image-button' ), 'click', change );
- app.addMouseEventListener( document.getElementById( 'layer-forward-button' ), 'click', layerForward );
- app.addMouseEventListener( document.getElementById( 'forward-text-button' ), 'click', layerForward );
- app.addMouseEventListener( document.getElementById( 'layer-back-button' ), 'click', layerBack );
- app.addMouseEventListener( document.getElementById( 'back-text-button' ), 'click', layerBack );
-
- delete CONSOLE_CONTROLER.init;
- },
- open: function(){
- LAYER_BACK_BUTTON = MENU_BAR_CONTROL.EDIT.createOption( 'layer back', 'ctrl + B', layerBack, false, true, false );
- LAYER_FORWARD_BUTTON = MENU_BAR_CONTROL.EDIT.createOption( 'layer forward', 'ctrl + F', layerForward, false, false, false );
- DELETE_BUTTON = MENU_BAR_CONTROL.EDIT.createOption( 'delete', 'ctrl + D', del, false, true, true );
- EDIT_BUTTON = MENU_BAR_CONTROL.EDIT.createOption( 'Edit Text', 'ctrl + E', edit, false, true, false );
- CHANGE_BUTTON = MENU_BAR_CONTROL.EDIT.createOption( 'change', 'ctrl + U', change, false, false, true );
-
- delete CONSOLE_CONTROLER.open;
- },
- show: function( _currentElement, _w, _h ){
- if( visible === false ) styleConsoleWrapper.display = '';
- visible = true;
- currentElement = _currentElement;
- var _currentType = _currentElement.type,
- _z = _currentElement.z;
- if( currentType !== _currentType ){
- currentType = _currentType;
- styleImgConsole.display = _currentType === PANEL_ELEMENT_TYPE_IMAGE ? '' : 'none';
- styleTextConsole.display = _currentType === PANEL_ELEMENT_TYPE_TEXT ? '' : 'none';
- CONSOLE_CONTROLER.w = _currentType === PANEL_ELEMENT_TYPE_IMAGE ? imgConsoleWidth : textConsoleWidth;
- CONSOLE_CONTROLER.h = _currentType === PANEL_ELEMENT_TYPE_IMAGE ? imgConsoleHeight : textConsoleHeight;
- }
- CONSOLE_CONTROLER.x = Math.floor( ( _w - CONSOLE_CONTROLER.w ) / 2 );
-
- LAYER_BACK_BUTTON.visible( _z > 0 );
- LAYER_FORWARD_BUTTON.visible( _z < PANEL_ELEMENT_ARRAY.length - 1 );
- DELETE_BUTTON.visible( true);
- EDIT_BUTTON.visible( _currentType === PANEL_ELEMENT_TYPE_TEXT );
- CHANGE_BUTTON.visible( false);
-
- if( _w > CONSOLE_CONTROLER.w * 1.5 && _h > CONSOLE_CONTROLER.h * 1.5 ){
- CONSOLE_CONTROLER.y = Math.floor( ( _h - CONSOLE_CONTROLER.h ) / 2 );
- elmConsoleWrapper.className = '';
- } else {
- CONSOLE_CONTROLER.y = _h + tailSize;
- elmConsoleWrapper.className = 'console-out';
- };
- styleConsoleWrapper.left = CONSOLE_CONTROLER.x + 'px';
- styleConsoleWrapper.top = CONSOLE_CONTROLER.y + 'px';
- },
- hide: function(){
- if( visible === true ) styleConsoleWrapper.display = 'none';
- visible = false;
- currentElement = null;
- LAYER_BACK_BUTTON.visible( false);
- LAYER_FORWARD_BUTTON.visible( false);
- DELETE_BUTTON.visible( false);
- EDIT_BUTTON.visible( false);
- CHANGE_BUTTON.visible( false);
- },
- mousemove: function( _mouseX, _mouseY ){
- if( CONSOLE_CONTROLER.x > _mouseX || CONSOLE_CONTROLER.y > _mouseY || CONSOLE_CONTROLER.x + CONSOLE_CONTROLER.w < _mouseX || CONSOLE_CONTROLER.y + CONSOLE_CONTROLER.h < _mouseY ){
- buttonClickable === true && buttonBackOrForward( true );
- return false;
- }
- buttonClickable === false && buttonBackOrForward( false );
- return true;
- }
- }
- })();
-
-/* --------------------------------------------------------------------------------------------
- * TAIL_OPERATOR
- * - panelElementOperator
- */
- var TAIL_OPERATOR = ( function(){
- var styleMover,
- SIZE,
- SIN = Math.sin,
- COS = Math.cos,
- ATAN = Math.atan,
- FLOOR = Math.floor,
- DEG_TO_RAD = Math.PI / 180,
- RAD_TO_DEG = 1 / DEG_TO_RAD,
- currentText = null,
- tailX, tailY,
- x, y, w, h,
- balloonW, balloonH, balloonA, radA,
- visible = false,
- startA;
-
- return {
- init: function(){
- var elm = document.getElementById( 'balloon-tail-mover' );
- SIZE = Util.getElementSize( elm ).width;
- styleMover = elm.style;
- delete TAIL_OPERATOR.init;
- },
- update: function ( _w, _h, _a ){
- balloonW = _w !== undefined ? _w : balloonW;
- balloonH = _h !== undefined ? _h : balloonH;
- balloonA = _a !== undefined ? _a : balloonA;
- radA = ( balloonA - 90 ) * DEG_TO_RAD;
- tailX = FLOOR( ( ( COS( radA ) / 2 + 0.5 ) * ( balloonW + SIZE )) - SIZE / 2 );
- tailY = FLOOR( ( ( SIN( radA ) / 2 + 0.5 ) * ( balloonH + SIZE )) - SIZE / 2 );
- styleMover.left = tailX +'px';
- styleMover.top = tailY +'px';
- //log.html( [ balloonW, balloonH, balloonA].join());
- },
- show: function( _currentText ){
- /*
- * visibilityのほうがいい, display:none だと ie で描画が狂う
- */
- styleMover.visibility = '';
- TAIL_OPERATOR.update( _currentText.w, _currentText.h, _currentText.angle() );
- currentText = _currentText;
- },
- hitTest: function( _mouseX, _mouseY ){
- var _x = tailX -SIZE / 2,
- _y = tailY -SIZE / 2;
- ret = _x <= _mouseX && _y <= _mouseY && _x +SIZE >= _mouseX && _y +SIZE >= _mouseY;
- ret === true && updateMouseCursor( 'move' );
- return ret;
- },
- hide: function(){
- styleMover.visibility = 'hidden';
- currentText = null;
- },
- onStart: function( _currentText, _mouseX, _mouseY ){
- if( _currentText.type !== PANEL_ELEMENT_TYPE_TEXT ) return false;
- x = _currentText.x;
- y = _currentText.y;
- if( TAIL_OPERATOR.hitTest( _mouseX -x, _mouseY -y ) === true){
- w = _currentText.w;
- h = _currentText.h;
- currentText = _currentText;
- startA = _currentText.angle();
- return true;
- }
- return false;
- },
- onDrag: function( _mouseX, _mouseY ){
- _mouseX = _mouseX - x - w / 2;
- _mouseY = _mouseY - y - h / 2; //Balloonの中心を0,0とする座標系に変換
- TAIL_OPERATOR.update( w, h,
- _mouseX !== 0 ?
- ATAN( _mouseY / _mouseX ) * RAD_TO_DEG + ( _mouseX > 0 ? 90 : 270 ) :
- _mouseY > 0 ? 180 : 0
- );
- currentText && currentText.angle( FLOOR( balloonA + 0.5 ));
- INFOMATION_WINDOW.update( currentText );
- },
- onFinish: function(){
- startA !== currentText.angle() && PANEL_ELEMENT_OPERATION_MANAGER.saveStatus( x, y, w, h, startA );
- startA !== currentText.angle() && PANEL_ELEMENT_OPERATION_MANAGER.resize( x, y, w, h, currentText.angle() );
- currentText = null;
- },
- onCancel: function(){
- currentText.angle( startA);
- PANEL_ELEMENT_OPERATION_MANAGER.resize( x, y, w, h, startA );
- currentText = null;
- }
- }
- })();
-
-/* --------------------------------------------------------------------------------------------
- * RESIZE_OPERATOR
- * - panelElementOperator
- */
- var RESIZE_OPERATOR = ( function(){
- var HIT_AREA = MOUSE_HIT_AREA,
- POSITION_ARRAY = [],
- FLOOR = Math.floor,
- CURSOR_AND_FLIP = [
- { cursor: 'n-resize', v: 3 },
- { cursor: 'e-resize', h: 2 },
- { cursor: 'e-resize', h: 1 },
- { cursor: 'n-resize', v: 0 },
- { cursor: 'nw-resize', h: 5, v: 6, vh: 7 },
- { cursor: 'ne-resize', h: 4, v: 7, vh: 6 },
- { cursor: 'ne-resize', h: 7, v: 4, vh: 5 },
- { cursor: 'nw-resize', h: 6, v: 5, vh: 4 }
- ],
- elmResizerContainer,
- elmResizerContainerStyle,
- elmResizerTopStyle,
- elmResizerLeftStyle,
- elmResizerRightStyle,
- elmResizerBottomStyle,
- x, y, w, h,
- currentIndex = -1,
- currentElement,
- currentIsTextElement = false;
-
- var RESIZE_WORK_ARRAY = [
- { x: 0, w: 0, y: 1, h: -1}, //top
- { x: 1, w: -1, y: 0, h: 0}, //left
- { x: 0, w: 1, y: 0, h: 0}, //right
- { x: 0, w: 0, y: 0, h: 1}, //bottom
- { x: 1, w: -1, y: 1, h: -1}, //top-left
- { x: 0, w: 1, y: 1, h: -1}, //top-right
- { x: 1, w: -1, y: 0, h: 1}, //bottom-left
- { x: 0, w: 1, y: 0, h: 1} //bottom-right
- ],
- startX, startY, startW, startH, startFilpV, startFilpH, startAspect,
- baseX, baseY, baseW, baseH,
- currentX, currentY, currentW, currentH,
- offsetX, offsetY,
- lock = false,
- error = 0;
-
- function draw( _x, _y, _w, _h ){
- x = _x = _x !== undefined ? _x : x;
- y = _y = _y !== undefined ? _y : y;
- w = _w = _w !== undefined ? _w : w;
- h = _h = _h !== undefined ? _h : h;
- try {
- elmResizerContainerStyle.left = _x + 'px';
- elmResizerContainerStyle.top = _y + 'px';
- elmResizerContainerStyle.width = _w + 'px';
- elmResizerContainerStyle.height = _h + 'px';
- elmResizerTopStyle.left = elmResizerBottomStyle.left = FLOOR( _w / 2 - 5 ) + 'px';
- elmResizerLeftStyle.top = elmResizerRightStyle.top = FLOOR( _h / 2 - 5 ) + 'px';
- } catch(e){
- alert( [x, y, w, h].join( ','));
- return;
- }
-
- POSITION_ARRAY.splice( 0, POSITION_ARRAY.length );
- POSITION_ARRAY.push(
- {x: _x +5, y: _y -HIT_AREA, w: _w -5 *2, h: HIT_AREA +5},
- {x: _x -HIT_AREA, y: _y +HIT_AREA +5, w: HIT_AREA +5, h: _h -5 *2},
- {x: _x + _w -5, y: _y +HIT_AREA +5, w: HIT_AREA +5, h: _h -5 *2},
- {x: _x +5, y: _y +_h -5, w: _w -5 *2, h: HIT_AREA +5},
- {x: _x -HIT_AREA, y: _y -HIT_AREA, w: HIT_AREA +5, h: HIT_AREA +5},
- {x: _x + _w -HIT_AREA, y: _y -HIT_AREA, w: HIT_AREA +5, h: HIT_AREA +5},
- {x: _x -HIT_AREA, y: _y +_h -5, w: HIT_AREA +5, h: HIT_AREA +5},
- {x: _x +_w -5, y: _y +_h -5, w: HIT_AREA +5, h: HIT_AREA +5}
- );
- }
-
- function update( _x, _y, _w, _h ){
- var __w, __h;
- _x = _x !== undefined ? _x : currentX;
- _y = _y !== undefined ? _y : currentY;
- _w = _w !== undefined ? _w : currentW;
- _h = _h !== undefined ? _h : currentH;
-
- if( currentIsTextElement === false && currentIndex > 3 && app.shiftEnabled() === true){
- if( startAspect >= 1 ){
- __w = _w;
- _w = FLOOR( startAspect * _h );
- _x = _x +( currentIndex % 2 === 0 ? __w - _w : 0);
- } else {
- __h = _h;
- _h = FLOOR( _w / startAspect );
- _y = _y + ( currentIndex <= 5 ? __h - _h : 0);
- }
- }
- draw( x = _x, y = _y, w = _w, h = _h );
- currentElement.resize( _x, _y, _w, _h );
- currentIsTextElement === true && TAIL_OPERATOR.update( _w, _h );
- CONSOLE_CONTROLER.show( currentElement, _w, _h );
- INFOMATION_WINDOW.update( currentElement);
- }
-
- 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;
- updateMouseCursor( CURSOR_AND_FLIP[ currentIndex ].cursor );
- elmResizerContainer.className = 'current-resizer-is-' + currentIndex;
- currentElement.flip( _flipH, _flipV );
- }
- return {
- init: function(){
- elmResizerContainer = document.getElementById( 'comic-element-resizer-container');
- elmResizerContainerStyle = elmResizerContainer.style;
- elmResizerContainerStyle.display = 'none';
-
- elmResizerTopStyle = document.getElementById( 'comic-element-resizer-top').style;
- elmResizerLeftStyle = document.getElementById( 'comic-element-resizer-left').style;
- elmResizerRightStyle = document.getElementById( 'comic-element-resizer-right').style;
- elmResizerBottomStyle = document.getElementById( 'comic-element-resizer-bottom').style;
-
- delete RESIZE_OPERATOR.init;
- },
- update: draw,
- index: function( _mouseX, _mouseY ){
- var p, i;
- for( i=4; i<8; i++ ){
- p = POSITION_ARRAY[ i ];
- if( p.x <= _mouseX && p.y <= _mouseY && p.x + p.w >= _mouseX && p.y +p.h >= _mouseY ){
- updateMouseCursor( CURSOR_AND_FLIP[ i].cursor);
- elmResizerContainer.className = 'current-resizer-is-' +i;
- return currentIndex = i;
- }
- }
- for( i=0; i<4; i++ ){
- p = POSITION_ARRAY[ i ];
- if( p.x <= _mouseX && p.y <= _mouseY && p.x + p.w >= _mouseX && p.y +p.h >= _mouseY){
- updateMouseCursor( CURSOR_AND_FLIP[ i].cursor);
- elmResizerContainer.className = 'current-resizer-is-' +i;
- return currentIndex = i;
- }
- }
- updateMouseCursor( '' );
- elmResizerContainer.className = '';
- return -1;
- },
- show: function( _currentElement ){
- currentElement = _currentElement;
- currentIsTextElement = _currentElement.type === PANEL_ELEMENT_TYPE_TEXT;
- elmResizerContainerStyle.display = '';
- },
- hide: function(){
- currentElement = null;
- elmResizerContainerStyle.display = 'none';
- },
- onStart: function( _currentElement, _mouseX, _mouseY ){
- currentElement = _currentElement;
- currentIsTextElement = _currentElement.type === PANEL_ELEMENT_TYPE_TEXT;
- if( _currentElement.keepSize === true) return false;
- currentIndex = this.index( _mouseX, _mouseY);
- if( currentIndex === -1) return false;
- offsetX = _mouseX;
- offsetY = _mouseY;
- startX = baseX = _currentElement.x;
- startY = baseY = _currentElement.y;
- startW = baseW = _currentElement.w;
- startH = baseH = _currentElement.h;
- if( _currentElement.type === PANEL_ELEMENT_TYPE_IMAGE){
- startFilpV = _currentElement.flipV();
- startFilpH = _currentElement.flipH();
- }
- startAspect = startW /startH;
- return true;
- },
- onDrag: function( _mouseX, _mouseY ){
- var com = RESIZE_WORK_ARRAY[ currentIndex],
- moveX = _mouseX -offsetX,
- moveY = _mouseY -offsetY,
- _updated = moveX !== 0 || moveY !== 0,
- _x, _y, _w, _h,
- _thisError = 0;
-
- var _memoryX = 0,
- _memoryY = 0,
- _momoryW = 0,
- _momoryH = 0;
- /*
- * Opera 11+ often forget values, why ??
- */
- while( _x === undefined || _y === undefined || _w === undefined || _h === undefined){
- _x = _x !== undefined ? _x : baseX +moveX *com.x;
- _y = _y !== undefined ? _y : baseY +moveY *com.y;
- _w = _w !== undefined ? _w : baseW +moveX *com.w;
- _h = _h !== undefined ? _h : baseH +moveY *com.h;
- error += _thisError === 0 ? 0 : 1;
- ++_thisError;
- if( _thisError > 9999){
- ++error
- //alert( 'opera error' +error);
- this.onCancel;
- return;
- }
- }
-
- if( _w >= MIN_ELEMENT_SIZE && _h >= MIN_ELEMENT_SIZE){
-
- } else
- if( _w >= -MIN_ELEMENT_SIZE && _h >= -MIN_ELEMENT_SIZE){
- //return;
- if( _w < MIN_ELEMENT_SIZE){
- //_x += Math.abs( MIN_ELEMENT_SIZE -_w);
- _x = currentX;
- _w = MIN_ELEMENT_SIZE;
- }
- if( _h < MIN_ELEMENT_SIZE){
- //_y += Math.abs( MIN_ELEMENT_SIZE -_h);
- _y = currentY;
- _h = MIN_ELEMENT_SIZE;
- }
- } else
- if( currentElement.type === PANEL_ELEMENT_TYPE_TEXT){
- return;
- } else
- if( _w < -MIN_ELEMENT_SIZE || _h < -MIN_ELEMENT_SIZE){
-
- if( _w < -MIN_ELEMENT_SIZE && _h > MIN_ELEMENT_SIZE){
- // flipH
- _memoryX = _x;
- baseX = _x = _x +_w;
- baseY = _y;
- baseW = _w = _memoryX -_x;
- baseH = _h;
- flip( true, false);
- flipV = currentElement.flipV();
- } else
- if( _w > MIN_ELEMENT_SIZE && _h < -MIN_ELEMENT_SIZE){
- // flipV
- _memoryY = _y;
- baseX = _x;
- baseY = _y = _y +_h;
- baseW = _w;
- baseH = _h = _memoryY -_y;
- flip( false, true);
- flipH = currentElement.flipH();
- } else {
- // flipVH
- _memoryX = _x;
- _memoryY = _y;
- baseX = _x = _x +_w;
- baseY = _y = _y +_h;
- baseW = _w = _memoryX -_x;
- baseH = _h = _memoryY -_y;
- flip( true, true);
- flipV = currentElement.flipV();
- flipH = currentElement.flipH();
- }
- _updated = true;
- offsetX = _mouseX;
- offsetY = _mouseY;
- }
- currentX = _x;
- currentY = _y;
- currentW = _w;
- currentH = _h;
- _updated === true && update( _x, _y, _w, _h );
- /*
- log.html( [
- 'currentIndex:', currentIndex,
- 'baseW', baseW, 'baseH', baseH,'<br>',
- 'mouse', _mouseX, _mouseY,'<br>',
- 'move', moveX, moveY,'<br>',
- 'xy', _x, _y, 'wh',_w, _h,'<br>',
- 'com.w', com.w, 'com.h', com.h,'<br>',
- 'current',currentW, currentH,'<br>',
- 'result', y, h,
- 'err', error
- ].join( ' , ')); */
- },
- onFinish: function(){
- updateMouseCursor( '');
- if( w === startW && h === startH && x === startX && y === startY) return;
- PANEL_ELEMENT_OPERATION_MANAGER.resize( x, y, w, h);
- currentElement.resize( x, y, w, h);
- PANEL_ELEMENT_OPERATION_MANAGER.saveStatus( startX, startY, startW, startH, undefined, startFilpV, startFilpH);
- },
- onCancel: function(){
- updateMouseCursor( '');
- PANEL_ELEMENT_OPERATION_MANAGER.resize( startX, startY, startW, startH);
- currentElement.type === PANEL_ELEMENT_TYPE_IMAGE ?
- currentElement.animate( startX, startY, startW, startH, startFilpV, startFilpH) :
- currentElement.animate( startX, startY, startW, startH, angle);
- },
- lock: function( _lock ){
- if( _lock !== undefined){
- elmResizerContainerStyle.borderColor = _lock === true ? 'blue' : '';
- lock = _lock;
- }
- return lock;
- },
- onShiftUpdate: update,
- onCtrlUpdate: update
- }
- })();
-
-/* --------------------------------------------------------------------------------------------
- * POSITION_OPERATOR
- * - panelElementOperator
- */
- var POSITION_OPERATOR = ( function(){
- var currentElement,
- startX, startY,
- x, y,
- offsetX, offsetY,
- isCopy = false;
- function update( _x, _y ){
- x = _x !== undefined ? _x : x;
- y = _y !== undefined ? _y : y;
- RESIZE_OPERATOR.update( x, y );
- currentElement.resize( x, y );
- INFOMATION_WINDOW.update( currentElement );
- };
- return {
- init: function(){
- delete POSITION_OPERATOR.init;
- },
- onStart: function( _currentElement, _mouseX, _mouseY ){
- currentElement = _currentElement;
- offsetX = _mouseX;
- offsetY = _mouseY;
- startX = x = _currentElement.x;
- startY = y = _currentElement.y;
- updateMouseCursor( 'move' );
- },
- onDrag: function( _mouseX, _mouseY ){
- var moveX = _mouseX - offsetX,
- moveY = _mouseY - offsetY,
- _x = startX + moveX,
- _y = startY + moveY;
- if( GRID_CONTROL.enabled() === true ){
- _x = Math.floor( _x / 10 ) * 10;
- _y = Math.floor( _y / 10 ) * 10;
- };
- update( _x, _y );
- },
- onFinish: function(){
- updateMouseCursor( '' );
- if( x === startX && y === startY ) return;
- PANEL_ELEMENT_OPERATION_MANAGER.resize( x, y );
- currentElement.resize( x, y );
- PANEL_ELEMENT_OPERATION_MANAGER.saveStatus( startX, startY );
- },
- onCancel: function(){
- updateMouseCursor( '' );
- PANEL_ELEMENT_OPERATION_MANAGER.resize( startX, startY );
- currentElement.animate( startX, startY );
- },
- onShiftUpdate: update,
- onCtrlUpdate: update
- }
- })();
-
-
-/* --------------------------------------------------------------------------------------------
- * PANEL_ELEMENT_OPERATION_MANAGER
- */
- var PANEL_ELEMENT_OPERATION_MANAGER = ( function(){
- var HIT_AREA = MOUSE_HIT_AREA,
- currentIsTextElement = false,
- currentOperator = null,
- currentElement = null,
- currentX, currentY, currentW, currentH, angle, flipV, flipH;
-
- function resize( _x, _y, _w, _h, _angle ){
- currentX = _x = _x !== undefined ? _x : currentX;
- currentY = _y = _y !== undefined ? _y : currentY;
- currentW = _w = _w !== undefined ? _w : currentW;
- currentH = _h = _h !== undefined ? _h : currentH;
- angle = _angle = _angle !== undefined ? _angle : angle;
-
- RESIZE_OPERATOR.update( _x, _y, _w, _h );
- currentIsTextElement === true && TAIL_OPERATOR.update( _w, _h, angle );
- CONSOLE_CONTROLER.show( currentElement, _w, _h );
- INFOMATION_WINDOW.update( currentElement );
- };
- function show( _currentElement ){
- currentElement === null && RESIZE_OPERATOR.show( _currentElement );
- if( currentElement !== _currentElement ){
- currentElement = _currentElement;
-
- currentIsTextElement = ( _currentElement.type === PANEL_ELEMENT_TYPE_TEXT );
- currentIsTextElement === true ? TAIL_OPERATOR.show( _currentElement ) : TAIL_OPERATOR.hide();
-
- flipV = currentIsTextElement === false ? _currentElement.flipV() : 0;
- flipH = currentIsTextElement === false ? _currentElement.flipH() : 0;
-
- resize(
- _currentElement.x, _currentElement.y, _currentElement.w, _currentElement.h,
- currentIsTextElement === true ? _currentElement.angle() : 0
- );
- };
- };
-
- return {
- init: function(){
- TAIL_OPERATOR.init();
- RESIZE_OPERATOR.init();
- POSITION_OPERATOR.init();
-
- app.addKeyEventListener( 'keychange', function( e ){
- currentOperator !== null && currentOperator.onShiftUpdate && currentOperator.onShiftUpdate();
- return false;
- }, 16 );
- app.addKeyEventListener( 'keychange', function( e ){
- currentOperator !== null && currentOperator.onCtrlUpdate && currentOperator.onCtrlUpdate();
- return false;
- }, 17 );
- app.addKeyEventListener( 'keydown', function( e ){
- currentOperator !== null && currentOperator.onCancel && currentOperator.onCancel();
- currentOperator = null;
- return false;
- }, 27, false, false );
-
- delete PANEL_ELEMENT_OPERATION_MANAGER.init;
- },
- open: function(){
- PANEL_ELEMENT_OPERATION_MANAGER.hide();
-
- delete PANEL_ELEMENT_OPERATION_MANAGER.open;
- },
- close: function(){
-
- },
- hide: function(){
- currentElement !== null && RESIZE_OPERATOR.hide();
- currentElement = null;
- updateMouseCursor( '' );
- TAIL_OPERATOR.hide();
- CONSOLE_CONTROLER.hide();
- 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 ],
- _a = arg[ 5 ],
- _flipV = arg[ 6 ], _flipH = arg[ 7 ];
- if( !_currentElement && !currentOperator ) return;
- _currentElement.type === PANEL_ELEMENT_TYPE_IMAGE ?
- _currentElement.animate( _x, _y, _w, _h, _flipV, _flipH ) :
- _currentElement.animate( _x, _y, _w, _h, _a );
- currentOperator !== null && currentOperator.onCancel && currentOperator.onCancel();
- currentOperator = null;
- currentElement === _currentElement ? resize( _x, _y, _w, _h, _a ) : show( _currentElement );
- },
- saveStatus: function( startX, startY, startW, startH, startA, startFilpV, startFilpH ){
- startX = startX !== undefined ? startX : currentX;
- startY = startY !== undefined ? startY : currentY;
- startW = startW !== undefined ? startW : currentW;
- startH = startH !== undefined ? startH : currentH;
- startA = startA !== undefined ? startA : angle;
- startFilpV = startFilpV !== undefined ? startFilpV : flipV;
- startFilpH = startFilpH !== undefined ? startFilpH : flipH;
- currentElement && HISTORY_CONTROL.saveState( PANEL_ELEMENT_OPERATION_MANAGER.restoreState,
- [ currentElement, startX, startY, startW, startH, startA, startFilpV, startFilpH],
- [ currentElement, currentX, currentY, currentW, currentH, angle, flipV, flipH]
- );
- },
- busy: function(){
- return currentOperator !== null;
- },
- hitTest: function( _mouseX, _mouseY, _panelElement ){
- var _x, _y, _w, _h;
- if( _panelElement === currentElement ){
- var _consoleX = CONSOLE_CONTROLER.x;
- _x = currentX +( _consoleX < 0 ? _consoleX : 0 ) - HIT_AREA;
- _y = currentY - HIT_AREA;
- var _consoleW = CONSOLE_CONTROLER.w;
- _w = ( _consoleW < currentW ? currentW : _consoleW ) + HIT_AREA * 2;
- var _consoleY = CONSOLE_CONTROLER.y;
- _h = ( _consoleY < currentH ? currentH : _consoleY + CONSOLE_CONTROLER.h ) + HIT_AREA * 2;
- } else {
- _x = _panelElement.x - HIT_AREA;
- _y = _panelElement.y - HIT_AREA;
- _w = _panelElement.w + HIT_AREA *2;
- _h = _panelElement.h + HIT_AREA *2;
- }
- return _x <= _mouseX && _mouseX <= _x + _w && _y <= _mouseY && _mouseY <= _y + _h;
- },
- mousedown: function( _currentElement, _mouseX, _mouseY ){
- //show( _currentElement);
- if( currentIsTextElement === true && TAIL_OPERATOR.onStart( _currentElement, _mouseX, _mouseY) === true){
- currentOperator = TAIL_OPERATOR;
- } else
- if( RESIZE_OPERATOR.onStart( _currentElement, _mouseX, _mouseY) === true){
- currentOperator = RESIZE_OPERATOR;
- } else {
- POSITION_OPERATOR.onStart( _currentElement, _mouseX, _mouseY)
- currentOperator = POSITION_OPERATOR;
- }
- },
- mousemove: function( _currentElement, _mouseX, _mouseY ){
- show( _currentElement);
- if( currentOperator !== null){
- currentOperator.onDrag( _mouseX, _mouseY );
- } else
- if( currentElement !== null){
- CONSOLE_CONTROLER.mousemove( _mouseX - currentX, _mouseY - currentY );
- if( currentIsTextElement === false || TAIL_OPERATOR.hitTest( _mouseX -currentX, _mouseY -currentY) === false){
- RESIZE_OPERATOR.index( _mouseX, _mouseY);
- }
- }
- },
- mouseup: function( _currentElement, _mouseX, _mouseY ){
- currentOperator !== null && currentOperator.onFinish();
- currentOperator = null;
- }
- }
- })();
- /*
- * // PANEL_ELEMENT_OPERATION_MANAGER
- */
-
- var AbstractPanelElement = function( COMIC_ELM_TYPE ){
- this.type = COMIC_ELM_TYPE;
- this.hitTest = function( _mouseX, _mouseY ){
- return PANEL_ELEMENT_OPERATION_MANAGER.hitTest( _mouseX, _mouseY, this );
- }
- this.shift = function( _shiftX, _shiftY ){
- this.resize( this.x + _shiftX, this.y + _shiftY);
- }
- this.busy = function(){
- return PANEL_ELEMENT_OPERATION_MANAGER.busy();
- }
- this.mousemove = function( _mouseX, _mouseY ){
- PANEL_ELEMENT_OPERATION_MANAGER.mousemove( this, _mouseX, _mouseY );
- }
- this.mouseup = function( _mouseX, _mouseY ){
- PANEL_ELEMENT_OPERATION_MANAGER.mouseup( this, _mouseX, _mouseY );
- }
- this.mousedown = function( _mouseX, _mouseY ){
- PANEL_ELEMENT_OPERATION_MANAGER.mousedown( this, _mouseX, _mouseY );
- }
- };
-
-/* --------------------------------------------------------------------------------------------
- * ImageElementClass
- */
- var jqImageElementOrigin;
- var ImageElementClass = function( data ){
- jqImageElementOrigin = jqImageElementOrigin || $( app.fetchHTMLElement( 'imgElementTemplete' ) );
-
- var jqWrap = jqImageElementOrigin.clone( true ),
- flipH = data.width < 0 ? -1 : 1,
- flipV = data.height < 0 ? -1 : 1,
- resourcePicture = data.resource_picture,
- actualW = data.resource_picture.width,
- actualH = data.resource_picture.height,
- reversibleImage = null,
- self = this,
- x, y, z, w, h;
- function flipReversibleImage(){
- reversibleImage && reversibleImage.resize( flipH * w, flipV * h );
- };
- function updateResourcePicture( _resourcePicture ){
- resourcePicture = _resourcePicture;
-
- actualW = _resourcePicture.width;
- actualH = _resourcePicture.height;
-
- var _reversibleImage = pettanr.image.createReversibleImage(
- [ pettanr.CONST.RESOURCE_PICTURE_PATH, _resourcePicture.id, '.', _resourcePicture.ext ].join(''),
- flipH * w, flipV * h
- );
- if( reversibleImage !== null ){
- jqWrap.children( reversibleImage.elm ).replaceWith( _reversibleImage.elm );
- reversibleImage.destroy();
- } else {
- jqWrap.append( _reversibleImage.elm );
- }
- reversibleImage = _reversibleImage;
- };
- /* global methods */
- this.$ = jqWrap;
- //this.x = x;
- //this.y = y;
- //this.w = w;
- //this.h = h;
- this.z = data.z;
- this.timing = data.t || PANEL_ELEMENT_ARRAY.length + 1;
- this.keepSize = false;
- this.init = function(){
- updateResourcePicture( data.resource_picture );
- self.resize( data.x, data.y, Math.abs( data.width ), Math.abs( data.height ) );
- delete self.init;
- };
- this.flip = function( _updateH, _updateV ){
- if( _updateH !== true && _updateV !== true ) return;
- flipH = _updateH === true ? -flipH : flipH;
- flipV = _updateV === true ? -flipV : flipV;
- reversibleImage.resize( flipH * w, flipV * h );
- };
- this.flipV = function(){ return flipV;}
- this.flipH = function(){ return flipH;}
- this.resourcePicture = function( _resourcePicture ){
- if( _resourcePicture && _resourcePicture !== resourcePicture ){
- HISTORY_CONTROL.saveState( updateResourcePicture, resourcePicture, _resourcePicture );
- updateResourcePicture( _resourcePicture );
- };
- return resourcePicture;
- };
- this.getArtistID = function(){
- return resourcePicture.artist_id || resourcePicture.artist.id || -1;
- };
- this.actualW = function(){ return actualW;}
- this.actualH = function(){ return actualH;}
- this.resize = function( _x, _y, _w, _h, animate ){
- self.x = x = Type.isFinite( _x ) === true ? _x : x;
- self.y = y = Type.isFinite( _y ) === true ? _y : y;
- self.w = w = Type.isFinite( _w ) === true ? _w : w;
- self.h = h = Type.isFinite( _h ) === true ? _h : h;
- jqWrap[ animate === true ? 'animate' : 'css' ]( {
- left: x,
- top: y,
- width: w,
- height: h
- }, 250, flipReversibleImage );
- animate !== true && flipReversibleImage();
- };
- this.animate = function ( _x, _y, _w, _h, _flipH, _flipV ){
- flipH = _flipH !== undefined ? _flipH : flipH;
- flipV = _flipV !== undefined ? _flipV : flipV;
- self.resize( _x, _y, _w, _h, true );
- };
- this.destroy = function(){
- delete self.destroy;
-
- reversibleImage.destroy();
- jqWrap.stop().remove();
- jqWrap = reversibleImage = resourcePicture = data = self = null;
- };
- };
- ImageElementClass.prototype = new AbstractPanelElement( PANEL_ELEMENT_TYPE_IMAGE );
-/*
- * / ImageElementClass
- * --------------------------------------------------------------------------------------------
- */
-
-
-/* --------------------------------------------------------------------------------------------
- * TextElementClass
- *
- * type
- * 0.none
- * 1.speach balloon
- * 2.think
- * 3.bom
- * 4.black-box( dq style)
- * 5.blue-box( ff style)
- *
- */
- var jqTextElementOrigin;
- var TextElementClass = function( data ){
- jqTextElementOrigin = jqTextElementOrigin || ( function(){
- var _OLD_IE = $( app.fetchHTMLElement( 'textElementTempleteForOldIE' ) ),
- _MODERN = $( app.fetchHTMLElement( 'textElementTemplete' ) );
- return UA.isIE === true && UA.ieRenderingVersion < 8 ? _OLD_IE : _MODERN;
- })();
-
- var JQ_WRAPPER = jqTextElementOrigin.clone( true ),
- elmText = JQ_WRAPPER.find( 'td,.speach-inner' ).get( 0 ),
- type = data.balloon_template_id,
- text = ( function(){
- var _speachs = data.speeches_attributes;
- for( var k in _speachs ){
- return _speachs[ k ].content || '';
- }
- return '';
- })(),
- balloon = pettanr.balloon.createBalloon( data.width, data.height, data.tail, type ),
- x, y, w, h, a,
- self = this;
-
- JQ_WRAPPER.find( 'img' ).eq( 0 ).replaceWith( balloon.elm );
-
- function updateType( _type ){
- if( type !== _type ){
- type = _type || type;
- balloon.type( type );
- }
- }
- function updateAngle( _a ){
- if( _a !== undefined && a !== _a ){
- a = _a !== undefined ? _a : a;
- balloon.angle( a );
- }
- }
- function updateText( _text ){
- text = _text || text || '';
- elmText.firstChild.data = text;
- }
- function resizeBalloon(){
- balloon && balloon.resize( a, w, h );
- }
-
- /* global methods */
- this.$ = JQ_WRAPPER;
- //this.x = x;
- //this.y = y;
- //this.w = w;
- //this.h = h;
- this.z = data.z;
- this.timing = data.t || PANEL_ELEMENT_ARRAY.length + 1;
- this.init = function(){
- updateText();
- self.resize( data.x, data.y, data.width, data.height, data.tail );
- delete self.init;
- };
- this.angle = function( _a ){
- _a !== undefined && self.resize( x, y, w, h, _a );
- return a;
- };
- this.text = function( _text ){
- if( _text && text !== _text) {
- HISTORY_CONTROL.saveState( updateText, text || '', _text );
- updateText( _text );
- }
- return text;
- };
- this.resize = function( _x, _y, _w, _h, _a, animate ){
- self.x = x = _x !== undefined ? _x : x;
- self.y = y = _y !== undefined ? _y : y;
- self.w = w = _w !== undefined ? _w : w;
- self.h = h = _h !== undefined ? _h : h;
- a = _a !== undefined ? _a : a;
-
- JQ_WRAPPER[ animate === true ? 'animate' : 'css']( {
- left: x,
- top: y,
- width: w,
- height: h
- }, 250, resizeBalloon
- );
- animate !== true && resizeBalloon();
- };
- this.animate = function ( _x, _y, _w, _h, _a ){
- self.resize( _x, _y, _w, _h, _a, true );
- };
- this.destroy = function(){
- delete self.destroy;
-
- JQ_WRAPPER.stop().remove();
- balloon.destroy();
- JQ_WRAPPER = elmText = data = balloon = self = null;
- };
- }
- TextElementClass.prototype = new AbstractPanelElement( PANEL_ELEMENT_TYPE_TEXT );
-
-/* --------------------------------------------------------------------------------------------
- * PANEL_ELEMENT_CONTROL
- * - mouseEventListener
- */
- var PANEL_ELEMENT_CONTROL = ( function(){
- var elmContainer,
- currentElement = null,
- currentLockTest = false,
- currentLock = false,
- panelX, panelY, panelW, panelH,
- startX, startY;
- /*
- * append, remove, replace
- *
- * panelElement には、z-position と dom-index がある。
- * z-position は 表示上の位置。大きいほど前に表示される（ z-index）
- * dom-index は 意味上の順番。htmlタグの登場順で、検索結果や音声読み上げブラウザで正しく意味が取れる順番。
- *
- * editerでは、実際には z-index は使わず、htmlの順序で前後を表現する。
- * dom-index は、数値のみ保持して、投稿時にpanelElementを適宜に並び替える。
- *
- * append panelElement
- * 1. 新しい panelElement の z-position を得る
- * 2. ｚ の同じ panelElementを見つけ、その前に加える。または一番先頭へ。（PANEL_ELEMENT_ARRAY）
- * zが大きいほど、PANEL_ELEMENT_ARRAYの先頭へ。
- * 3. dom位置は、PANEL_ELEMENT_ARRAY とは反対に、前のものほど後ろへ。
- *
- *
- * remove panelElement
- * 1. remove
- * 2. renumber z
- */
- function appendPanelElement( _panelElement ) {
- var z = Type.isFinite( _panelElement.z ) === true ? _panelElement.z : -1,
- l = PANEL_ELEMENT_ARRAY.length,
- _jqElm = _panelElement.$.stop().css( {
- filter: '',
- opacity: ''
- });
- if( z < 0 ){
- PANEL_ELEMENT_ARRAY.unshift( _panelElement );
- } else {
- for( var i = 0; i < l; ++i ){
- if( PANEL_ELEMENT_ARRAY[ i ].z < z ) break;
- };
- if( i === l ){
- PANEL_ELEMENT_ARRAY.push( _panelElement );
- } else {
- PANEL_ELEMENT_ARRAY.splice( i, 0, _panelElement );
- };
- };
- renumber();
- _jqElm.fadeIn();
- };
-
- function onFadeOut(){
- this.parentNode.removeChild( this );
- };
- /*
- * PANEL_ELEMENT_ARRAY の順番を基準に、zの再計算
- * jqElmの並び替え。
- */
- function renumber(){
- var _panelElement, jqElm, jqNext;
- for( var i = 0, l = PANEL_ELEMENT_ARRAY.length; i < l; ++i ){
- _panelElement = PANEL_ELEMENT_ARRAY[ i ];
- jqElm = _panelElement.$;
- i === 0 && elmContainer.appendChild( jqElm.get( 0 ) );
- jqNext && jqNext.before( jqElm );
- if( phase === 1 ) _panelElement.z = l - i - 1;
- jqNext = jqElm;
- };
- };
- function onTextInput( _panelElement ){
- appendPanelElement( _panelElement );
- HISTORY_CONTROL.saveState( PANEL_ELEMENT_CONTROL.restore, [ false, _panelElement ], [ true, _panelElement ], true );
- };
-
- return {
- init: function(){
- elmContainer = document.getElementById( 'comic-element-container' );
- delete PANEL_ELEMENT_CONTROL.init;
- },
- open: function(){
-
- },
- close: function(){
- var _comicElm;
- while( PANEL_ELEMENT_ARRAY.length > 0 ){
- _comicElm = PANEL_ELEMENT_ARRAY.shift();
- _comicElm.destroy && _comicElm.destroy();
- }
- },
- remove: function( _panelElement ){
- var l = PANEL_ELEMENT_ARRAY.length;
- for( var i=0; i<l; ++i ){
- if( PANEL_ELEMENT_ARRAY[ i ] === _panelElement ){
- PANEL_ELEMENT_ARRAY.splice( i, 1 );
- renumber();
- _panelElement.$.stop().css( {
- filter: '',
- opacity: ''
- }).fadeOut( onFadeOut );
- currentElement = currentElement === _panelElement ? null : currentElement;
- return;
- };
- };
- },
- restore: function( arg ){
- var isAppend = arg[ 0 ],
- panelElement = arg[ 1 ];
- isAppend === true ? appendPanelElement( panelElement ) : PANEL_ELEMENT_CONTROL.remove( panelElement );
- },
- replace: function( _panelElement, goForward ){
- // PANEL_ELEMENT_ARRAYの再構築
- var l = PANEL_ELEMENT_ARRAY.length,
- i = -1;
- for( var j = 0; j < l; ++j ){
- if( PANEL_ELEMENT_ARRAY[ j ] === _panelElement ){
- i = j;
- break;
- };
- }
- if( i === -1) return false;
- if( goForward === true ){
- if( i === 0 ) return false;
- PANEL_ELEMENT_ARRAY.splice( i, 1 );
- PANEL_ELEMENT_ARRAY.splice( i - 1, 0, _panelElement );
- } else {
- if( i === l - 1 ) return false;
- PANEL_ELEMENT_ARRAY.splice( i, 1 );
- PANEL_ELEMENT_ARRAY.splice( i + 1, 0, _panelElement );
- }
- renumber( true );
- return true;
- },
- restoreReplace: function( arg ){
- PANEL_ELEMENT_CONTROL.replace( arg[ 0 ], arg[ 1 ] );
- },
- onPanelResize : function ( _panelX, _panelY, _panelW, _panelH, isResizerTopAction ){
- /*
- * リサイズが、ResizerTopによって行われた場合、panelElementのyを動かして見かけ上動かないようにする。
- */
- if( isResizerTopAction === true){
- var _shiftX = _panelW - panelW,
- _shiftY = _panelH - panelH;
- for( var i = PANEL_ELEMENT_ARRAY.length; i; ){
- PANEL_ELEMENT_ARRAY[ --i ].shift( _shiftX, _shiftY );
- };
- };
- elmContainer.style.cssText = [
- 'width:', panelW = _panelW, 'px;',
- 'height:', panelH = _panelH, 'px;',
- 'left:', panelX = _panelX, 'px;',
- 'top:', panelY = _panelY, 'px'
- ].join( '' );
- },
- mousemove: function( _mouseX, _mouseY ){
- var l = PANEL_ELEMENT_ARRAY.length,
- _x = _mouseX - panelX,
- _y = _mouseY - panelY,
- _elm = currentElement;
-
- if( _elm !== null ){
- currentLockTest = currentLockTest === true && _x === 0 && _y === 0;
- if( _elm.busy() === true ){
- _elm.mousemove( _x, _y );
- return true;
- }
- if( _elm.hitTest( _x, _y ) === true ){
- _elm.mousemove( _x, _y ); // cursor
- return true;
- }
- if( currentLock === true ){
- currentLockTest = true;
- return true;
- }
- };
- for( var i=0; i<l; ++i ){
- _elm = PANEL_ELEMENT_ARRAY[ i ];
- // hitTest
- if( _elm.hitTest( _x, _y ) === true ){
- _elm.mousemove( _x, _y ); // cursor
- currentElement = _elm;
- return true;
- };
- };
- currentElement = null;
- PANEL_ELEMENT_OPERATION_MANAGER.hide();
- return false;
- },
- mouseup: function( _mouseX, _mouseY ){
- var ret = currentElement !== null && currentElement.busy() === true;
- ret === true && currentElement.mouseup( _mouseX -startX || panelX, _mouseY -startY || panelY );
- currentLock = currentLockTest === true && currentElement.hitTest( _mouseX -panelX, _mouseY -panelY ) === true;
- RESIZE_OPERATOR.lock( currentLock );
- INFOMATION_WINDOW.lock( currentLock );
- return ret;
- },
- mousedown: function( _mouseX, _mouseY ){
- startX = panelX;
- startY = panelY;
- if( currentElement === null) return false
- currentElement.mousedown( _mouseX -startX, _mouseY -startY);
- currentLockTest = true;
- return true;
- },
- busy: function(){
- return currentElement !== null;
- },
- createImageElement: function( data ){
- if( Type.isObject( data ) === false ){
- PremiumSatge.boot( 1, PANEL_ELEMENT_CONTROL.onImageSelect );
- } else {
- PANEL_ELEMENT_CONTROL.onImageSelect( data, true );
- }
- },
- onImageSelect: function( data, isPanelPictureData ){
- var _panelElement;
- if( isPanelPictureData !== true ){
- _panelElement = new ImageElementClass( {
- resource_picture:data,
- x: Math.floor( panelW / 2 - data.width / 2 ),
- y: Math.floor( panelH / 2 - data.height / 2 ),
- z: -1,
- t: PANEL_ELEMENT_ARRAY.length + 1,
- width: 1,
- height: 1
- });
- _panelElement.init();
- appendPanelElement( _panelElement );
- _panelElement.animate( undefined, undefined, Math.abs( data.width ), Math.abs( data.height ) );
- } else {
- _panelElement = new ImageElementClass( data );
- _panelElement.init();
- appendPanelElement( _panelElement );
- }
- HISTORY_CONTROL.saveState( PANEL_ELEMENT_CONTROL.restore, [ false, _panelElement], [ true, _panelElement ], true );
- },
- createTextElement: function( data ){
- var _panelElement;
- if( Type.isObject( data ) === false ){
- data = {
- balloon_template_id:1,
- size: 1,
- tail: 90,
- x: Math.floor( panelW / 2 - 100 + Math.random() * 10 ),
- y: Math.floor( panelH / 2 - 100 + Math.random() * 10 ),
- z: -1,
- t: PANEL_ELEMENT_ARRAY.length + 1,
- width: 200,
- height: 200,
- speeches_attributes: {
- text1: {
- content: 'Hello'
- }
- }
- }
- _panelElement = new TextElementClass( data );
- _panelElement.init();
- TextEditor.boot( PANEL_CONTROL.x, PANEL_CONTROL.y, _panelElement, onTextInput );
- } else {
- _panelElement = new TextElementClass( data );
- _panelElement.init();
- onTextInput( _panelElement );
- }
- }
- }
- })();
-
- /*
- * end of PANEL_ELEMENT_CONTROL
- */
-
- function updateMouseCursor( _cursor ){
- if( currentCursor !== _cursor ){
- currentCursor = _cursor;
- self.addAsyncCall( update );
- };
- function update(){
- elmMouseEventChatcher.style.cursor = currentCursor;
- };
- };
- function centering(){
- self.onPaneResize( windowW, windowH );
- };
- function mouseEventRellay( e ){
- var _mouseX = e.clientX,
- _mouseY = e.clientY,
- rellayMethod = e.type === 'mouseout' ? 'mouseup' : e.type;
- if( currentListener !== null && currentListener.busy() === true ){
- currentListener[ rellayMethod ]( _mouseX, _mouseY );
- } else {
- currentListener = null;
- var l = MOUSE_LISTENER_ARRAY.length,
- _listener;
- for( var i=0; i<l; ++i ){
- _listener = MOUSE_LISTENER_ARRAY[ i ];
- if( _listener[ rellayMethod ]( _mouseX, _mouseY ) === true ){
- currentListener = _listener;
- break;
- };
- };
- };
- // 文字選択の禁止
- //!document.selection && window.getSelection().removeAllRanges();
- return false;
- };
-
- /* grobal method */
-
- this.MIN_WIDTH = 320;
- this.MIN_HEIGHT = 320;
- this.onInit = function(){
- app.rootElement.id = 'editor';
- app.rootElement.innerHTML = [
- '<div id="grid" style="display:none;"></div>',
- '<div id="comic-element-container"></div>',
- '<div id="whiteGlass-container">',
- '<div id="whiteGlass-top"></div>',
- '<div id="whiteGlass-left"></div>',
- '<div id="whiteGlass-right"></div>',
- '<div id="whiteGlass-bottom"></div>',
- '</div>',
- '<div id="panel-tools-container">',
- '<div id="panel-resizer-top">▲</div>',
- '<div id="panel-resizer-bottom">▼</div>',
- '<div id="comic-element-resizer-container">',
- '<div class="comic-element-resizer" id="comic-element-resizer-top"></div>',
- '<div class="comic-element-resizer" id="comic-element-resizer-left"></div>',
- '<div class="comic-element-resizer" id="comic-element-resizer-right"></div>',
- '<div class="comic-element-resizer" id="comic-element-resizer-bottom"></div>',
- '<div class="comic-element-resizer" id="comic-element-resizer-top-left"></div>',
- '<div class="comic-element-resizer" id="comic-element-resizer-top-right"></div>',
- '<div class="comic-element-resizer" id="comic-element-resizer-bottom-left"></div>',
- '<div class="comic-element-resizer" id="comic-element-resizer-bottom-right"></div>',
- '<div id="balloon-tail-mover"></div>',
- '<div id="comic-element-consol-wrapper">',
- '<div id="comic-element-consol-tail"></div>',
- '<div id="comic-element-consol-wrapper-when-out">',
- '<div id="image-element-consol">',
- '<div id="change-image-button"></div>',
- '<div id="layer-back-button"></div>',
- '<div id="delete-image-button"></div>',
- '<div id="layer-forward-button"></div>',
- '</div>',
- '<div id="text-element-consol">',
- '<div id="edit-text-button"></div>',
- '<div id="change-text-style-button"></div>',
- '<div id="back-text-button"></div>',
- '<div id="delete-text-button"></div>',
- '<div id="hide-text-tail-button"></div>',
- '<div id="forward-text-button"></div>',
- '</div>',
- '</div>',
- '</div>',
- '</div>',
- '</div>',
- '<div id="window-container"></div>',
- '<div id="menu-bar"></div>',
- '<div id="mouse-operation-catcher" unselectable="on"></div>',
-
- '<div id="templete-container" style="display: none;">',
-
- '<div id="imgElementTemplete" class="comic-element-wrapper image-element"></div>',
-
- '<div id="textElementTemplete" class="comic-element-wrapper text-element">',
- '<img>',
- '<div class="speach">',
- '<div class="speach-inner"> </div>',
- '</div>',
- '</div>',
-
- '<div id="textElementTempleteForOldIE" class="comic-element-wrapper text-element">',
- '<img>',
- '<div class="speach">',
- '<table><tr><td> </td></tr></table>',
- '</div>',
- '</div>',
-
- '<div id="imageGroupItemTemplete" class="image-group-item">',
- '<div class="image-group-item-title">img-title</div>',
- '</div>',
-
- '<div id="windowTemplete" class="window-wrapper">',
- '<div class="window-header">window title</div>',
- '<div class="window-close-button">x</div>',
- '<div class="window-body clearfix">',
- '<div class="window-body-insert-position"></div>',
- '</div>',
- '<div class="window-footer">',
- '<div class="window-resize-button">／</div>',
- '</div>',
- '</div>',
-
- '<div id="infomation-window">',
- '<div id="panel-background-information">',
- '<div id="bg-pattern"></div>',
- '<div id="select-bg-pattern-button">pattern</div>',
- '<div id="reset-bg-pattern-button">x</div>',
- '<div id="bg-color"></div>',
- '<div id="select-bg-color-button">color</div>',
- '<div id="reset-bg-color-button">x</div>',
- '<!-- <div id="bg-pattern-x"></div>',
- '<div id="bg-pattern-y"></div>',
- '<div id="bg-pattern-repeat-x"></div>',
- '<div id="bg-pattern-repeat-y"></div> -->',
- '</div>',
-
- '<div id="comic-element-infomation">',
- '<div id="comic-element-x">',
- '<span class="comic-element-attribute-label">x:</span>',
- '<span id="comic-element-x-value" class="comic-element-attribute-value editable-value">0</span>',
- '</div>',
- '<div id="comic-element-y">',
- '<span class="comic-element-attribute-label">y:</span>',
- '<span id="comic-element-y-value" class="comic-element-attribute-value editable-value">0</span>',
- '</div>',
- '<div id="comic-element-z">',
- '<span class="comic-element-attribute-label">z:</span>',
- '<span id="comic-element-z-value" class="comic-element-attribute-value editable-value">0</span>',
- '</div>',
- '<div id="comic-element-a">',
- '<span id="comic-element-a-value" class="comic-element-attribute-value editable-value">0</span>',
- '<span class="comic-element-attribute-label">°</span>',
- '</div>',
- '<div id="comic-element-w">',
- '<span class="comic-element-attribute-label">w:</span>',
- '<span id="comic-element-w-value" class="comic-element-attribute-value editable-value">0</span>',
- '</div>',
- '<div id="comic-element-h">',
- '<span class="comic-element-attribute-label">h:</span>',
- '<span id="comic-element-h-value" class="comic-element-attribute-value editable-value">0</span>',
- '</div>',
- '<div id="comic-element-w-percent">',
- '<span id="comic-element-w-percent-value" class="comic-element-attribute-value editable-value">0</span>',
- '<span class="comic-element-attribute-label">%</span>',
- '</div>',
- '<div id="comic-element-h-percent">',
- '<span id="comic-element-h-percent-value" class="comic-element-attribute-value editable-value">0</span>',
- '<span class="comic-element-attribute-label">%</span>',
- '</div>',
- '<div id="comic-element-keep-aspect"></div>',
- '</div>',
- '</div>',
-
- '<div id="toolbox-window">',
- '<div id="toolbox-add-image-button">add image</div>',
- '<div id="toolbox-add-text-button">add text</div>',
- '<div id="toolbox-edit-bg-button">edit bg</div>',
- '<div id="toolbox-switch-grid">grid</div>',
- '<div id="toolbox-popup-help-button">?</div>',
- '<div id="toolbox-post-button">post</div>',
- '</div>',
-
- '<div id="image-exproler"><div id="image-exproler-container"></div></div>',
-
- '</div>'
- ].join( '' );
-
- app.fetchCSS( '/assets/peta.apps.css' );
-
- delete app.onInit;
- };
- this.onOpen = function( _w, _h, _file ){
- elmMouseEventChatcher = document.getElementById( 'mouse-operation-catcher' );
-
- MENU_BAR_CONTROL.init();
- HISTORY_CONTROL.init();
- SAVE_CONTROL.init();
- WINDOWS_CONTROL.init();
- GRID_CONTROL.init();
- WHITE_GLASS_CONTROL.init();
- PANEL_CONTROL.init();
- CONSOLE_CONTROLER.init();
- PANEL_ELEMENT_OPERATION_MANAGER.init();
- PANEL_ELEMENT_CONTROL.init();
-
- /*
- * MOUSE_LISTENER_ARRAY は、表示順に格納．手前の要素が最初
- * MENU_BAR_CONTROL,
- * WINDOW_CONTROL,
- * PANEL_ELEMENT_CONTROL,
- * PANEL_CONTROL
- * .busy() === true なら、そのままmousemove()にイベントを流す．
- * mousemove()に流してみて、false が帰れば、次のリスナーにも流す．
- */
- MOUSE_LISTENER_ARRAY.push( MENU_BAR_CONTROL, WINDOWS_CONTROL, PANEL_RESIZER_TOP, PANEL_RESIZER_BOTTOM, PANEL_ELEMENT_CONTROL, PANEL_CONTROL );
-
- comicID = -1;
- panelID = -1;
- panelTimming = -1;
- phase = 0;
-
- var panelW, panelH,
- borderSize,
- fileData, panelElements, panelElm;
-
- if( FileAPI.isFileInstance( _file ) === true ){
- if( Driver.isPettanrFileInstance( _file ) === true ){
- if( _file.getType() === FILE_TYPE.COMIC ){
- fileData = _file.read();
- panelW = fileData.width;
- panelH = fileData.height;
- comicID = fileData.id || -1;
- } else
- if( _file.getType() === FILE_TYPE.PANEL ){
- fileData = _file.read();
- panelW = fileData.width;
- panelH = fileData.height;
- borderSize = fileData.border;
- panelElements = fileData.panel_elements;
- comicID = fileData.comic ? fileData.comic.id || -1 : -1;
- panelID = fileData.id || -1;
- panelTimming = fileData.t || -1;
- };
- } else {
- };
- } else {
- };
-
- HISTORY_CONTROL.open();
- SAVE_CONTROL.open();
- WINDOWS_CONTROL.open();
-
- GRID_CONTROL.open();
- PANEL_CONTROL.open( panelW, panelH, borderSize );
- CONSOLE_CONTROLER.open();
- PANEL_ELEMENT_OPERATION_MANAGER.open();
- PANEL_ELEMENT_CONTROL.open();
-
- // last
- MENU_BAR_CONTROL.open();
-
- windowW = _w;
- windowH = _h;
- self.onPaneResize( _w, _h );
-
-
- if( Type.isArray( panelElements ) === true ){
- for( var i=0; i<panelElements.length; ++i ){
- panelElm = panelElements[ i ];
- if( panelElm.resource_picture ){
- PANEL_ELEMENT_CONTROL.createImageElement( panelElm );
- } else
- if( panelElm.balloon_template_id ){
- PANEL_ELEMENT_CONTROL.createTextElement( panelElm );
- };
- };
- };
-
- /*
- * centering
- */
- self.addKeyEventListener( 'keydown', centering, 96, false, true ); // ctrl + 0
- self.addKeyEventListener( 'krydown', centering, 48, false, true ); // ctrl + 0
- MENU_BAR_CONTROL.EDIT.createOption( 'centering', 'ctrl + 0', centering, true, true, true);
- /*
- * jqMouseEventChacher は透明な要素で、
- * マウスイベントをcurrentElement(currentElement)に伝えるのが仕事
- * このような実装になるのは、ここの表示オブジェクトにイベントを設定した場合、表示が追いつかずマウスカーソルが外れたタイミングでイベントが終わってしまうため。
- */
- self.addMouseEventListener( elmMouseEventChatcher, 'mousemove', mouseEventRellay );
- self.addMouseEventListener( elmMouseEventChatcher, 'mousedown', mouseEventRellay );
- self.addMouseEventListener( elmMouseEventChatcher, 'mouseup', mouseEventRellay );
- //self.addMouseEventListener( elmMouseEventChatcher, 'mouseout', mouseEventRellay );
-
- phase = 1;
-
- delete app.onOpen;
- };
- this.onClose = function(){
- phase = 2;
- HISTORY_CONTROL.close();
-
- WINDOWS_CONTROL.close();
-
- GRID_CONTROL.close();
- PANEL_CONTROL.close();
-
- PANEL_ELEMENT_OPERATION_MANAGER.close();
- PANEL_ELEMENT_CONTROL.close();
-
- // last
- MENU_BAR_CONTROL.close();
-
- phase = -1;
- };
- this.onPaneResize = function( _windowW, _windowH ){
- windowW = _windowW || windowW;
- windowH = _windowH || windowH;
- /*
- * ieは +'px'が不要みたい
- */
- self.rootElement.style.height = _windowH + 'px';
- elmMouseEventChatcher.style.height = _windowH + 'px';
-
- WINDOWS_CONTROL.onWindowResize( _windowW, _windowH );
- MENU_BAR_CONTROL.onWindowResize( _windowW, _windowH );
- PANEL_CONTROL.onWindowResize( _windowW, _windowH );
- };
-}, false, true, 'Panel Editor', 'paneleditor', null, '#2D89F0' );
-
-
-var ComicConsole = gOS.registerApplication( function(){
- var elmHeader, elmProgress,
- winW, winH,
- inputTitle, inputW, inputH,
- comboboxVisible, // comboboxEditable,
- buttonSubmit, buttonCancel,
- elmUploader = null,
- elmScript = null,
- elmIframe = null,
- elmForm = null,
- isUploading = false,
- instance = this;
- //pettanr.key.addKeyDownEvent( ID, 69, false, false, clickOK);
-
- function clickOK(){
- if( !elmForm || !elmIframe || isUploading === true ) return false;
- // validate
- isUploading = true;
- elmProgress.innerHTML = '■';
- copyAndSubmit();
- };
-
- function copyAndSubmit(){
- var _inputList = elmForm.getElementsByTagName( 'input' ),
- _input, _name;
- for( var i = _inputList.length; i; ){
- _input = _inputList[ --i ];
- _name = _input.name;
- if( _name === 'comic[title]'){
- _input.value = inputTitle.value();
- } else
- if( _name === 'comic[width]'){
- _input.value = inputW.value();
- } else
- if( _name === 'comic[height]'){
- _input.value = inputH.value();
- };
- };
- var _selectList = elmForm.getElementsByTagName( 'select' ),
- _select, _optionList;
- for( i = _selectList.length; i; ){
- _select = _selectList[ --i ];
- _name = _select.name;
- _optionList = _select.getElementsByTagName( 'option' )
- if( _name === 'comic[visible]'){
- _select.selectedIndex = comboboxVisible.selectIndex();
- } else
- if( _name === 'comic[editable]'){
- // _select.selectedIndex = comboboxEditable.selectIndex();
- };
- };
- try {
- elmForm.submit();
- } catch( e ){
- elmProgress.innerHTML = 'submit() err..';
- isUploading = false;
- instance.addTimer( clickCancel , 3000, true );
- return;
- };
- if( UA.isIE ){
- elmIframe.onreadystatechange = detectIframe;
- } else {
- elmIframe.onload = onIframeUpdate;
- };
- elmProgress.innerHTML = 'uploading..';
- };
- /*
- * ie の 場合、readyState をチェック．
- */
- function detectIframe(){
- if ( elmIframe.readyState === 'complete' ){
- elmIframe.onreadystatechange = new Function();
- elmIframe.onreadystatechange = null;
- onIframeUpdate();
- };
- };
- function onIframeUpdate(){
- elmIframe.onload = null;
- try {
- console.log( ( elmIframe.contentWindow || elmIframe.contentDocument.parentWindow ).document.body.innerHTML );
- } catch(e){
-
- }
-
- ( elmIframe.contentWindow || elmIframe.contentDocument.parentWindow ).close();
- elmIframe = null;
- elmProgress.innerHTML = 'success!';
- instance.addTimer( clickCancel , 1000 );
- isUploading = false;
- };
-
- function clickCancel(){
- if( isUploading === true ) return false;
- ComicConsole.shutdown();
- };
- function detectForm(){
- elmForm = elmUploader.getElementsByTagName( 'form' )[ 0 ];
- if( elmForm ){
- var selectList = elmForm.getElementsByTagName( 'select' ),
- select,
- j, m,
- optionList, option;
- for( var i=0, l=selectList.length; i<l; ++i ){
- select = selectList[ i ];
- optionList = select.getElementsByTagName( 'option' );
- for( j=0, m=optionList.length; j<m; ++j ){
- option = optionList[ j ];
- if( select.name === 'comic[visible]' ){
- comboboxVisible.createOption( option.innerHTML, option.value, option.selected );
- } else
- if( select.name === 'comic[editable]' ){
- // comboboxEditable.createOption( option.innerHTML, option.value, option.selected );
- };
- };
- };
-
- instance.removeTimer( detectForm );
- Util.createIframe( 'targetFrameCreateComic', onCreateIframe );
- elmProgress.innerHTML = 'create iframe';
-
- instance.onPaneResize( winW, winH );
- inputTitle.focus();
- };
- };
- function onCreateIframe( _iframe ){
- elmUploader.appendChild( _iframe );
- elmIframe = _iframe;
- elmForm.target = _iframe.name;
- elmProgress.innerHTML = '';
- };
-
- /* grobal method */
- this.MIN_WIDTH = 320;
- this.MIN_HEIGHT = 320;
- this.onInit = function(){
- instance.rootElement.id = 'comic-console-wrapper';
- instance.rootElement.className = 'console-wrapper';
- instance.rootElement.innerHTML = [
- '<div id="comic-console-header" class="console-header">Create New Comic</div>',
- '<div id="comic-console" class="console-inner">',
- '<div id="comic-console-title" class="field">',
- '<span class="field-label">Title:</span>',
- '<span id="comic-console-title-value" class="comic-console-value editable-value">No Title</span>',
- '</div>',
- '<div id="comic-console-width" class="field">',
- '<span class="field-label">Default Width:</span>',
- '<span id="comic-console-width-value" class="comic-console-value editable-value">300</span>',
- '</div>',
- '<div id="comic-console-height" class="field">',
- '<span class="field-label">Default Height:</span>',
- '<span id="comic-console-height-value" class="comic-console-value editable-value">200</span>',
- '</div>',
- '<div id="comic-console-visible" class="field">',
- '<span class="field-label">Visible:</span>',
- '<span id="comic-console-visible-value" class="comic-console-value combobox"></span>',
- '</div>',
- //'<div id="comic-console-editable" class="field">',
- // '<span class="field-label">Editable:</span>',
- // '<span id="comic-console-editable-value" class="comic-console-value combobox"></span>',
- //'</div>',
- '<div class="console-button-container">',
- '<div id="comic-console-post-button" class="button console-submit-button">create</div>',
- '<div id="comic-console-cancel-button" class="button console-cancel-button">cancel</div>',
- '</div>',
- '<div id="comic-console-progress" class="console-progress"> </div>',
- '</div>'
- ].join( '' );
-
- instance.fetchCSS( '/assets/peta.apps.css' );
-
- delete instance.onInit;
- };
- this.onOpen = function( w, h ){
- var ui = instance.createUIGroup();
-
- inputTitle = ui.createInputText( document.getElementById( 'comic-console-title') );
- inputW = ui.createInputText( document.getElementById( 'comic-console-width') );
- inputH = ui.createInputText( document.getElementById( 'comic-console-height') );
- comboboxVisible = ui.createCombobox( document.getElementById( 'comic-console-visible') );
- // comboboxEditable = ui.createCombobox( document.getElementById( 'comic-console-editable') );
- buttonSubmit = ui.createButton( document.getElementById( 'comic-console-post-button'), clickOK );
- buttonCancel = ui.createButton( document.getElementById( 'comic-console-cancel-button'), clickCancel );
-
- elmHeader = document.getElementById( 'comic-console-header' );
- elmProgress = document.getElementById( 'comic-console-progress' );
-
- elmUploader = document.createElement( 'div' );
- instance.rootElement.appendChild( elmUploader );
- elmUploader.id = 'newcomic';
- elmUploader.style.cssText = 'height:1px;line-height:1px;visibility:hidden;overflow:hidden;';
-
- elmScript = document.createElement( 'script' );
- document.body.appendChild( elmScript );
- elmScript.type = 'text\/javascript';
- elmScript.src = pettanr.CONST.CREATE_COMIC_JS;
-
- elmProgress.innerHTML = 'loading form.';
-
- instance.addTimer( detectForm, 250 );
- instance.onPaneResize( w, h );
-
- delete instance.onOpen;
- };
- this.onPaneResize = function( _w, _h ){
- winW = _w;
- winH = _h;
- instance.rootElement.style.cssText = [
- 'left:', Math.floor( ( _w - instance.rootElement.offsetWidth ) /2 ), 'px;',
- 'top:', Math.floor( ( _h- instance.rootElement.offsetHeight ) /2 ), 'px;'
- ].join( '' );
- };
- this.onClose = function(){
- elmHeader = elmProgress = elmForm = elmUploader = instance = null;
- isUploading = false;
- };
-}, true, true, 'Comic Console', 'comicConsole', null, '#D44A26' );
-
-var UploadConsole = gOS.registerApplication( function(){
- var windowW, windowH,
- TARGET_FRAME_NAME = 'targetFrame',
- elmContainer,
- elmProgress,
- elmScript = null,
- elmForm = null,
- elmFile = null,
- elmIframe = null,
- isUploading = false,
- instance = this;
- /*
- * upload ボタンが押されたらまず iframe をつくる．
- */
- function clickOK(){
- if( !elmForm || !elmIframe || isUploading === true ) return false;
- if( elmFile.value.length === 0 ) return false;
- elmProgress.innerHTML = 'uploading.';
- isUploading = true;
- submit();
- return false;
- };
- /*
- * form の target に iframe を指定したのち submit();
- */
- function submit(){
- try {
- elmForm.submit();
- } catch( e){
- elmProgress.innerHTML = 'submit() err..';
- isUploading = false;
- instance.addTimer( clickCancel , 3000, true );
- return;
- };
-
- if( UA.isIE){
- elmIframe.onreadystatechange = detectIframe;
- } else {
- elmIframe.onload = onLoad;
- };
- elmProgress.innerHTML = 'uploading..';
- };
- /*
- * ie の 場合、readyState をチェック．
- */
- function detectIframe(){
- if ( elmIframe.readyState === 'complete') {
- elmIframe.onreadystatechange = new Function();
- elmIframe.onreadystatechange = null;
- onLoad();
- };
- };
- function onLoad(){
- elmIframe.onload = null;
- ( elmIframe.contentWindow || elmIframe.contentDocument.parentWindow ).close();
- elmProgress.innerHTML = 'success!';
- instance.addTimer( clickCancel , 1000 );
- isUploading = false;
- };
-
- function detectForm(){
- elmForm = elmContainer.getElementsByTagName( 'form' )[ 0 ];
- if( elmForm ){
- var _inputList = elmForm.getElementsByTagName( 'input' ),
- _input;
- for( var i = _inputList.length; i; ){
- _input = _inputList[ --i ];
- if( _input.type === 'file' ){
- elmFile = _input;
- };
- if( _input.type === 'submit' ){
- _input.style.display = 'none';
- };
- };
- instance.removeTimer( detectForm );
- Util.createIframe( TARGET_FRAME_NAME, onCreateIframe );
- elmProgress.innerHTML = 'create iframe';
- };
- };
- function onCreateIframe( _iframe ){
- elmContainer.appendChild( _iframe );
- elmIframe = _iframe;
- elmForm.target = _iframe.name;
- elmProgress.innerHTML = '';
- instance.onPaneResize( windowW, windowH );
- };
- function clickCancel(){
- if( isUploading === true ) return false;
- UploadConsole.shutdown();
- return false;
- };
-
- /* grobal method */
- this.MIN_WIDTH = 320;
- this.MIN_HEIGHT = 320;
- this.onInit = function(){
- instance.rootElement.id = 'upload-console-wrapper';
- instance.rootElement.className = 'console-wrapper';
- instance.rootElement.innerHTML = [
- '<div id="upload-console-header" class="console-header">Upload Picture</div>',
- '<div id="upload-console" class="console-inner">',
- '<div id="uploader"></div>',
- '<div class="console-button-container">',
- '<div id="upload-console-post-button" class="button console-submit-button">upload</div>',
- '<div id="upload-console-cancel-button" class="button console-cancel-button">cancel</div>',
- '</div>',
- '<div id="upload-console-progress" class="console-progress"> </div>',
- '</div>'
- ].join( '' );
-
- instance.fetchCSS( '/assets/peta.apps.css' );
-
- delete instance.onInit;
- }
- this.onOpen = function( w, h ){
- elmContainer = document.getElementById( 'uploader' );
- elmProgress = document.getElementById( 'upload-console-progress' );
-
- instance.addMouseEventListener( document.getElementById( 'upload-console-post-button' ), 'click', clickOK );
- instance.addMouseEventListener( document.getElementById( 'upload-console-cancel-button' ), 'click', clickCancel );
- /*
- * ie 6, 7 で fadeIn 中の要素に appendChild すると クラッシュするので、document.body に追加．
- */
- elmScript = document.createElement( 'script' );
- document.body.appendChild( elmScript );
- elmScript.type = 'text\/javascript';
- elmScript.src = pettanr.CONST.UPLOAD_PICTURE_JS;
-
- instance.addTimer( detectForm, 250 );
- instance.onPaneResize( w, h );
-
- elmProgress.innerHTML = 'loading form.';
- };
- this.onPaneResize = function( _windowW, _windowH){
- windowW = _windowW;
- windowH = _windowH;
- instance.rootElement.style.cssText = [
- 'left:', Math.floor( ( _windowW - instance.rootElement.offsetWidth ) /2 ), 'px;',
- 'top:', Math.floor( ( _windowH - instance.rootElement.offsetHeight ) /2 ), 'px;'
- ].join( '' );
- }
- this.onClose = function(){
- elmHeader = elmProgress = elmForm = elmUploader = instance = null;
- isUploading = false;
- }
-}, true, true, 'Upload Console', 'uploadConsole', null, '#01A31C' );
-
-var PanelConsole = gOS.registerApplication( function(){
- var windowW, windowH,
- TARGET_FRAME_NAME = 'targetFrameCreateNewPanel',
- elmContainer, elmProgress,
- elmScript = null,
- elmForm = null,
- elmIframe = null,
- isUploading = false,
- instance = this;
- /*
- * upload ボタンが押されたらまず iframe をつくる．
- */
- function clickOK(){
- if( !elmForm || !elmIframe || isUploading === true ) return false;
- elmProgress.innerHTML = 'uploading.';
- isUploading = true;
- submit();
- return false;
- }
- /*
- * form の target に iframe を指定したのち submit();
- */
- function submit(){
- try {
- elmForm.submit();
- } catch( e ){
- elmProgress.innerHTML = 'submit() err..';
- isUploading = false;
- instance.addTimer( clickCancel , 3000, true );
- return;
- }
-
- if( UA.isIE ){
- elmIframe.onreadystatechange = detectIframe;
- } else {
- elmIframe.onload = onLoad;
- }
- elmProgress.innerHTML = 'uploading..';
- }
- /*
- * ie の 場合、readyState をチェック．
- */
- function detectIframe(){
- if ( elmIframe.readyState === 'complete' ){
- elmIframe.onreadystatechange = new Function();
- elmIframe.onreadystatechange = null;
- onLoad();
- };
- };
- function onLoad(){
- try {
- console.log( ( elmIframe.contentWindow || elmIframe.contentDocument.parentWindow ).document.body.innerHTML );
- } catch(e){
-
- }
- elmIframe.onload = null;
- ( elmIframe.contentWindow || elmIframe.contentDocument.parentWindow ).close();
- elmProgress.innerHTML = 'success!';
- instance.addTimer( clickCancel , 1000, true );
- isUploading = false;
- };
-
- function detectForm(){
- elmForm = elmContainer.getElementsByTagName( 'form' )[ 0 ];
- if( elmForm){
- var _inputList = elmForm.getElementsByTagName( 'input' ),
- _input;
- for( var i = _inputList.length; i; ){
- _input = _inputList[ --i ];
- if( _input.type === 'submit' ){
- _input.style.display = 'none';
- };
- };
- instance.removeTimer( detectForm );
- Util.createIframe( TARGET_FRAME_NAME, onCreateIframe );
- elmProgress.innerHTML = 'create iframe';
- };
- };
- function onCreateIframe( _iframe ){
- elmContainer.appendChild( _iframe );
- elmIframe = _iframe;
- elmForm.target = _iframe.name;
- elmProgress.innerHTML = '';
- instance.onPaneResize( windowW, windowH );
- };
- function clickCancel(){
- if( isUploading === true) return false;
- PanelConsole.shutdown();
- return false;
- };
-
- /* grobal method */
- this.MIN_WIDTH = 320;
- this.MIN_HEIGHT = 320;
- this.onInit = function(){
- instance.rootElement.id = 'panel-console-wrapper';
- instance.rootElement.className = 'console-wrapper';
- instance.rootElement.innerHTML = [
- '<div id="panel-console-header" class="console-header">Create New Panel (dev)</div>',
- '<div id="panel-console" class="console-inner">',
- '<div id="newpanel"></div>',
- '<div class="console-button-container">',
- '<div id="panel-console-post-button" class="button console-submit-button">post</div>',
- '<div id="panel-console-cancel-button" class="button console-cancel-button">cancel</div>',
- '</div>',
- '<div id="panel-console-progress" class="console-progress"> </div>',
- '</div>'
- ].join( '' );
-
- instance.fetchCSS( '/assets/peta.apps.css' );
-
- delete instance.onInit;
- }
- this.onOpen = function( w, h ){
- elmContainer = document.getElementById( 'newpanel' );
- elmProgress = document.getElementById( 'panel-console-progress' );
-
- instance.addMouseEventListener( document.getElementById( 'panel-console-post-button' ), 'click', clickOK );
- instance.addMouseEventListener( document.getElementById( 'panel-console-cancel-button' ), 'click', clickCancel );
- /*
- * ie 6, 7 で fadeIn 中の要素に appendChild すると クラッシュするので、document.body に追加．
- */
- elmScript = document.createElement( 'script' );
- document.body.appendChild( elmScript );
- elmScript.type = 'text\/javascript';
- elmScript.src = pettanr.CONST.CREATE_PANEL_JS;
-
- instance.addTimer( detectForm, 250 );
- instance.onPaneResize( w, h );
-
- elmProgress.innerHTML = 'loading form.';
- };
- this.onPaneResize = function( _windowW, _windowH ){
- windowW = _windowW;
- windowH = _windowH;
- instance.rootElement.style.cssText = [
- 'left:', Math.floor( ( _windowW - instance.rootElement.offsetWidth ) /2 ), 'px;',
- 'top:', Math.floor( ( _windowH - instance.rootElement.offsetHeight ) /2 ), 'px;'
- ].join( '' );
- };
- this.onClose = function(){
- elmHeader = elmProgress = elmForm = elmUploader = instance = null;
- isUploading = false;
- };
-}, true, true, 'Panel Console', 'panelConsole', null, '#603CBA' );
-
-var ArtistConsole = gOS.registerApplication( function(){
- var windowW, windowH,
- TARGET_FRAME_NAME = 'targetFrameRegisterArtist',
- elmContainer, elmProgress,
- elmScript = null,
- elmForm = null,
- elmIframe = null,
- isUploading = false,
- instance = this;
- /*
- * upload ボタンが押されたらまず iframe をつくる．
- */
- function clickOK(){
- if( !elmForm || !elmIframe || isUploading === true ) return false;
- elmProgress.innerHTML = 'uploading.';
- isUploading = true;
- submit();
- return false;
- }
- /*
- * form の target に iframe を指定したのち submit();
- */
- function submit(){
- try {
- elmForm.submit();
- } catch( e){
- elmProgress.innerHTML = 'submit() err..';
- isUploading = false;
- instance.addTimer( clickCancel , 3000, true );
- return;
- }
-
- if( UA.isIE){
- elmIframe.onreadystatechange = detectIframe;
- } else {
- elmIframe.onload = onLoad;
- }
- elmProgress.innerHTML = 'uploading..';
- }
- /*
- * ie の 場合、readyState をチェック．
- */
- function detectIframe(){
- if ( elmIframe.readyState === 'complete' ){
- elmIframe.onreadystatechange = new Function();
- elmIframe.onreadystatechange = null;
- onLoad();
- }
- }
- function onLoad(){
- elmIframe.onload = null;
- ( elmIframe.contentWindow || elmIframe.contentDocument.parentWindow ).close();
- elmProgress.innerHTML = 'success!';
- instance.addTimer( clickCancel , 1000, true );
- isUploading = false;
- }
-
- function detectForm(){
- elmForm = elmContainer.getElementsByTagName( 'form' )[ 0 ];
- if( elmForm){
- var _inputList = elmForm.getElementsByTagName( 'input' ),
- _input;
- for( var i = _inputList.length; i; ){
- _input = _inputList[ --i ];
- if( _input.type === 'submit' ){
- _input.style.display = 'none';
- }
- }
- instance.removeTimer( detectForm );
- Util.createIframe( TARGET_FRAME_NAME, onCreateIframe);
- elmProgress.innerHTML = 'create iframe';
- }
- }
- function onCreateIframe( _iframe ){
- elmContainer.appendChild( _iframe );
- elmIframe = _iframe;
- elmForm.target = _iframe.name;
- elmProgress.innerHTML = '';
- instance.onPaneResize( windowW, windowH );
- }
- function clickCancel(){
- if( isUploading === true) return false;
- ArtistConsole.shutdown();
- return false;
- }
-
- /* grobal method */
- this.MIN_WIDTH = 320;
- this.MIN_HEIGHT = 320;
- this.onInit = function(){
- instance.rootElement.id = 'artist-console-wrapper';
- instance.rootElement.className = 'console-wrapper';
- instance.rootElement.innerHTML = [
- '<div id="artist-console-header" class="console-header">Register Artist</div>',
- '<div id="artist-console" class="console-inner">',
- '<div id="register"></div>',
- '<div class="console-button-container">',
- '<div id="artist-console-post-button" class="button console-submit-button">register</div>',
- '<div id="artist-console-cancel-button" class="button console-cancel-button">cancel</div>',
- '</div>',
- '<div id="artist-console-progress" class="console-progress"> </div>',
- '</div>'
- ].join( '' );
-
- instance.fetchCSS( '/assets/peta.apps.css' );
-
- delete instance.onInit;
- };
- this.onOpen = function( w, h ){
- elmContainer = document.getElementById( 'register');
- elmProgress = document.getElementById( 'artist-console-progress');
-
- instance.addMouseEventListener( document.getElementById( 'artist-console-post-button' ), 'click', clickOK );
- instance.addMouseEventListener( document.getElementById( 'artist-console-cancel-button' ), 'click', clickCancel );
- /*
- * ie 6, 7 で fadeIn 中の要素に appendChild すると クラッシュするので、document.body に追加．
- */
- elmScript = document.createElement( 'script' );
- document.body.appendChild( elmScript );
- elmScript.type = 'text\/javascript';
- elmScript.src = pettanr.CONST.REGISTER_ARTIST_JS;
-
- instance.addTimer( detectForm, 250 );
- instance.onPaneResize( w, h );
-
- elmProgress.innerHTML = 'loading form.';
- };
- this.onPaneResize = function( _windowW, _windowH ){
- windowW = _windowW;
- windowH = _windowH;
- instance.rootElement.style.cssText = [
- 'left:', Math.floor( ( _windowW - instance.rootElement.offsetWidth ) /2 ), 'px;',
- 'top:', Math.floor( ( _windowH - instance.rootElement.offsetHeight ) /2 ), 'px;'
- ].join( '' );
- };
- this.onClose = function(){
- elmHeader = elmProgress = elmForm = elmUploader = instance = null;
- isUploading = false;
- };
-}, true, true, 'Artist Console', 'artistConsole', null, '#FFC40D' );
-
-var OutputConsole = gOS.registerApplication( function(){
- var FORMAT_LIST = [ 'json[POST]', 'json[GET]', 'XML', 'HTML', 'XHTML', 'MT export', 'Blogger ATOM' ];
- var elmOutputArea,
- comboboxFormat, inputOption,
- buttonGenerate, buttonClose,
- windowW, windowH,
- timing = 0,
- comicID, panelID, panelTimming, panelW, panelH, borderSize, panelElementArray,
- instance = this;
- //pettanr.key.addKeyDownEvent( ID, 69, false, false, clickOK);
-
- function clickOK(){
- OutputConsole.shutdown();
- };
-
- function getPanelElementByTiming(){
- var i, l = panelElementArray.length;
- while( timing < l * 2){
- for( i=0; i<l; ++i ){
- if( timing === panelElementArray[ i ].timing ){
- ++timing;
- return panelElementArray[ i ];
- }
- }
- ++timing;
- }
- return null;
- };
-
- function getAsHtmlString( isAbsoluteUrl, isXHTML ){
- timing = 0;
-
- var HTML_ARRAY = [],
- l = panelElementArray.length,
- _panelElement;
-
- while( HTML_ARRAY.length < l ){
- _panelElement = getPanelElementByTiming();
- if( _panelElement === null) break;
- HTML_ARRAY.push( panelElementToHtml( _panelElement, isAbsoluteUrl, isXHTML ));
- };
-
- HTML_ARRAY.unshift(
- [
- '<div class="panel" ',
- 'style="',
- 'height:', panelH, 'px;',
- 'background-color:', ';',
- '"',
- '>'
- ].join( '')
- );
- HTML_ARRAY.push( '</div>');
-
- return HTML_ARRAY.join( pettanr.LINE_FEED_CODE_TEXTAREA);
- };
-
- function panelElementToHtml( _panelElement, isAbsoluteUrl, isXHTML ){
- var url;
- if( _panelElement.type === 0 ){
- url = [ pettanr.CONST.RESOURCE_PICTURE_PATH, _panelElement.resourcePicture().id, '.', _panelElement.resourcePicture().ext ].join( '' );
- return [
- '<img ',
- 'src="', isAbsoluteUrl !== true ? url : Util.getAbsolutePath( url ), '" ',
- 'width="', _panelElement.w, '" ',
- 'height="', _panelElement.h, '" ',
- 'style="',
- 'left:', _panelElement.x, 'px;',
- 'top:', _panelElement.y, 'px;',
- 'z-index:', _panelElement.z, ';',
- '"',
- isXHTML !== true ? '>' : ' \/>'
- ].join( '');
- } else {
- url = pettanr.balloon.getBalloonUrl( _panelElement.w, _panelElement.h, _panelElement.angle() );
- return [
- '<img ',
- 'src="', isAbsoluteUrl !== true ? url : Util.getAbsolutePath( url ), '" ',
- 'width="', _panelElement.w, '" ',
- 'height="', _panelElement.h, '" ',
- 'style="',
- 'left:', _panelElement.x, 'px;',
- 'top:', _panelElement.y, 'px;',
- 'z-index:', _panelElement.z, ';',
- '"',
- isXHTML !== true ? '>' : ' \/>',
- pettanr.LINE_FEED_CODE_TEXTAREA,
- '<div class="balloon" style="',
- 'left:', _panelElement.x, 'px;',
- 'top:', _panelElement.y, 'px;',
- 'width:', _panelElement.w, 'px;',
- 'height:', _panelElement.h, 'px;',
- 'z-index:', _panelElement.z,
- '"><span>', _panelElement.text(), '<\/span>', '<\/div>'
-
- ].join( '');
- };
- };
-
- function getJsonGetString(){
- timing = 0;
-
- var JSON_STRING_ARRAY = [],
- ELEMENT_ARRAY = [],
- l = panelElementArray.length,
- cr = pettanr.LINE_FEED_CODE_TEXTAREA,
- _panelElement;
-
- while( ELEMENT_ARRAY.length <= l){
- _panelElement = getPanelElementByTiming();
- if( _panelElement === null ) break;
-
- ELEMENT_ARRAY.push( _panelElement.type === 0 ? getImageJsonGET( _panelElement ) : balloonToJson( _panelElement ));
- };
- return [
- '{', cr,
- '"panel": {', cr,
- '"id": ', panelID, ',', cr,
- '"border": ', borderSize, ',', cr,
- '"comic_id": ', comicID, ',', cr,
- '"resource_picture_id": 1,', cr,
- '"x": ', 0, ',', cr,
- '"y": ', 0, ',', cr,
- '"z": ', 0, ',', cr,
- panelTimming !== -1 ? ( '"t": ' + panelTimming + ',' + cr ) : '',
- '"width": ', panelW, ',', cr,
- '"height": ', panelH, ',', cr,
- '"panel_elements": [', cr,
- ELEMENT_ARRAY.join( ',' + cr ), cr,
- ']', cr,
- '}', cr,
- '}'
- ].join( '' );
- };
- function getImageJsonGET( _imageElement ){
- var cr = pettanr.LINE_FEED_CODE_TEXTAREA;
- return [
- '{', cr,
- '"resource_picture": {', cr,
- '"id": ', _imageElement.resourcePicture().id, ',', cr,
- '"ext": ', '"',_imageElement.resourcePicture().ext, '"', cr,
- '},', cr,
- '"x": ', _imageElement.x, ',', cr,
- '"y": ', _imageElement.y, ',', cr,
- '"z": ', _imageElement.z, ',', cr,
- '"width": ', _imageElement.flipH() * _imageElement.w, ',', cr,
- '"height": ', _imageElement.flipV() * _imageElement.h, ',', cr,
- '"t": ', timing, cr,
- '}'
- ].join( '');
- };
-
- function getJsonPostString(){
- timing = 0;
-
- var JSON_STRING_ARRAY = [],
- IMAGE_ARRAY = [],
- BALLOON_ARRAY = [],
- l = panelElementArray.length,
- _panelElement,
- cr = pettanr.LINE_FEED_CODE_TEXTAREA;
-
- while( IMAGE_ARRAY.length + BALLOON_ARRAY.length <= l){
- _panelElement = getPanelElementByTiming();
- if( _panelElement === null) break;
- _panelElement.type === 0 ?
- IMAGE_ARRAY.push( [ '"new', timing, '": ', imageToJson( _panelElement ) ].join( '' )) :
- BALLOON_ARRAY.push( [ '"new', timing, '": ', balloonToJson( _panelElement ) ].join( '' ) );
- };
- return [
- '{', cr,
- '"panel": {', cr,
- '"id": ', panelID, ',', cr,
- '"border": ', borderSize, ',', cr,
- '"comic_id": ', comicID, ',', cr,
- '"resource_picture_id": 1,', cr,
- '"x": ', 0, ',', cr,
- '"y": ', 0, ',', cr,
- '"z": ', 0, ',', cr,
- '"t": ', panelTimming, ',', cr,
- '"width": ', panelW, ',', cr,
- '"height": ', panelH, ',', cr,
- '"panel_pictures_attributes": {', cr,
- IMAGE_ARRAY.join( ',' + cr ), cr,
- '},', cr,
- '"balloons_attributes": {', cr,
- BALLOON_ARRAY.join( ',' + cr ), cr,
- '}', cr,
- '}', cr,
- '}'
- ].join( '' );
- };
- function imageToJson( _imageElement ){
- var cr = pettanr.LINE_FEED_CODE_TEXTAREA;
- return [
- '{', cr,
- '"resource_picture_id": ', _imageElement.resourcePicture().id, ',', cr,
- '"x": ', _imageElement.x, ',', cr,
- '"y": ', _imageElement.y, ',', cr,
- '"z": ', _imageElement.z, ',', cr,
- '"width": ', _imageElement.flipH() * _imageElement.w, ',', cr,
- '"height": ', _imageElement.flipV() * _imageElement.h, ',', cr,
- '"t": ', timing, cr,
- '}'
- ].join( '');
- };
-
- function balloonToJson( _textElement ){
- var cr = pettanr.LINE_FEED_CODE_TEXTAREA;
- return [
- '{', cr,
- '"balloon_template_id": ', 1, ',', cr,
- '"system_picture_id": ', 1, ',', cr,
- '"size": ', 1, ',', cr,
- '"tail": ', _textElement.angle(), ',', cr,
- '"x": ', _textElement.x, ',', cr,
- '"y": ', _textElement.y, ',', cr,
- '"z": ', _textElement.z, ',', cr,
- '"t": ', timing, ',', cr,
- '"width": ', _textElement.w, ',', cr,
- '"height": ', _textElement.h, ',', cr,
- '"speeches_attributes": {', cr,
- '"newf', timing, '": {', cr,
- '"content": "', _textElement.text(), '",', cr,
- '"x": ', _textElement.x, ',', cr,
- '"y": ', _textElement.y, ',', cr,
- '"t": ', timing, ',', cr,
- '"width": ', _textElement.w, ',', cr,
- '"height": ', _textElement.h, cr,
- '}', cr,
- '}', cr,
- '}'
- ].join( '');
- };
-
- function clickGenerate(){
- var i = comboboxFormat.selectIndex(),
- text = 'sorry...';
- if( i === 0 ){
- text = getJsonPostString();
- } else
- if( i === 1 ){
- text = getJsonGetString();
- } else
- if( i === 3 ){
- text = getAsHtmlString( false, false );
- } else {
-
- };
- elmOutputArea.value = text;
- };
- function clickClose(){
- OutputConsole.shutdown();
- return false;
- };
-
- /* grobal method */
- this.MIN_WIDTH = 320;
- this.MIN_HEIGHT = 320;
- this.onInit = function(){
- instance.rootElement.id = 'output-console-wrapper';
- instance.rootElement.className = 'console-wrapper';
- instance.rootElement.innerHTML = [
- '<div id="output-console-header" class="console-header">Output Console</div>',
- '<div id="output-console" class="console-inner">',
- '<div id="output-console-format" class="field">',
- '<span class="field-label">Format:</span>',
- '<span id="output-console-format-value" class="output-console-value combobox"></span>',
- '</div>',
- '<div id="output-console-option" class="field">',
- '<span class="field-label">Options:</span>',
- '<span id="output-console-option-value" class="output-console-value editable-value">absolute-path</span>',
- '</div>',
- '<div id="output-console-button-container" class="clearfix">',
- '<div id="output-console-generate-button" class="button console-submit-button">generate</div>',
- '<div id="output-console-close-button" class="button console-cancel-button">close</div>',
- '</div>',
- '<textarea id="output-area" readonly></textarea>',
- '</div>'
- ].join( '' );
-
- instance.fetchCSS( '/assets/peta.apps.css' );
-
- delete instance.onInit;
- };
- this.onOpen = function( _w, _h, _comicID, _panelID, _panelTimming, _panelW, _panelH, _borderSize, _panelElementArray ){
- elmOutputArea = document.getElementById( 'output-area' );
-
- var ui = instance.createUIGroup();
- comboboxFormat = ui.createCombobox( document.getElementById( 'output-console-format' ), clickGenerate );
-
- for( var i=0; FORMAT_LIST[ 0 ]; ++i ){
- comboboxFormat.createOption( FORMAT_LIST.shift(), null, i === 0 );
- };
- inputOption = ui.createInputText( document.getElementById( 'output-console-option' ), null );
- buttonGenerate = ui.createButton( document.getElementById( 'output-console-generate-button' ), clickGenerate );
- buttonClose = ui.createButton( document.getElementById( 'output-console-close-button' ), clickClose );
- instance.onPaneResize( _w, _h );
-
- comicID = _comicID;
- panelID = _panelID;
- panelTimming = _panelTimming;
- panelW = _panelW;
- panelH = _panelH;
- borderSize = _borderSize;
- panelElementArray = _panelElementArray;
-
- clickGenerate();
- };
- this.onPaneResize = function( _windowW, _windowH ){
- windowW = _windowW;
- windowH = _windowH;
- instance.rootElement.style.cssText = [
- 'left:', Math.floor( ( _windowW - instance.rootElement.offsetWidth ) /2 ), 'px;',
- 'top:', Math.floor( ( _windowH - instance.rootElement.offsetHeight ) /2 ), 'px;'
- ].join( '' );
- };
- this.onClose = function(){
- elmOutputArea.value = '';
- elmOutputArea = comboboxFormat = inputOption = buttonGenerate = buttonClose = panelElementArray = instance = null;
- };
-}, true, false, 'Output Console', 'outputConsole', null, '#2D89F0' );
-
-})( pettanr, gOS, window );
OSDN Git Service
