OSDN Git Service

pettanR version0.4.15
[pettanr/clientJs.git] / 0.4.x / javascripts / system.js
index bb45944..5941d01 100644 (file)
@@ -1,6 +1,6 @@
 /*
  * pettanR system.js
- *   version 0.4.11
+ *   version 0.4.15
  *   
  * author:
  *   itozyun
@@ -40,7 +40,7 @@ pettanr.file = ( function(){
                FILEDATA_RESITER = [],                  // store all of fileData( json object )
                FILEDATA_ACCESS = [],                   // file operations for Kernel only ! hide from Out of pettanr.file
                FILE_OBJECT_POOL = [],
-               EVENT_LISTENER_RESISTER = [],
+               EVENT_LISTENER_REGISTER = [],
                TREE_ARRAY = [],
                TREE_ACCESS_ARRAY = [];
        
@@ -156,15 +156,15 @@ pettanr.file = ( function(){
                },
                addEventListener: function( FILEorNULL, _eventType, _callback){
                        var _uid = FILEorNULL instanceof FileClass ? FILEorNULL.getUID() : FILEorNULL;
-                       EVENT_LISTENER_RESISTER.push( new FileEventTicketClass( _uid, _eventType, _callback));
+                       EVENT_LISTENER_REGISTER.push( new FileEventTicketClass( _uid, _eventType, _callback));
                },
                removeEventListener: function( FILEorNULL, _eventType, _callback){
                        var _uid = FILEorNULL instanceof FileClass ? FILEorNULL.getUID() : FILEorNULL,
                                _ticket;
-                       for(var i=0, l = EVENT_LISTENER_RESISTER.length; i<l; ++i){
-                               _ticket = EVENT_LISTENER_RESISTER[i];
+                       for(var i=0, l = EVENT_LISTENER_REGISTER.length; i<l; ++i){
+                               _ticket = EVENT_LISTENER_REGISTER[i];
                                if( _ticket.fileUID === _uid && _ticket.eventType === _eventType && _ticket.callBack === _callback){
-                                       EVENT_LISTENER_RESISTER.splice( i, 1);
+                                       EVENT_LISTENER_REGISTER.splice( i, 1);
                                        _ticket.destroy();
                                }
                        }
@@ -212,9 +212,9 @@ pettanr.file = ( function(){
                                _targetFile = e.targetFile,
                                _uid = _targetFile.getUID(),
                                _ticket, _type, _callback;
-                       for(var i=0, l = EVENT_LISTENER_RESISTER.length; i<l; ++i){
-                               _ticket = EVENT_LISTENER_RESISTER[i],
-                               _type = _ticket.eventType,
+                       for(var i=0, l = EVENT_LISTENER_REGISTER.length; i<l; ++i){
+                               _ticket = EVENT_LISTENER_REGISTER[i];
+                               _type = _ticket.eventType;
                                _callback = _ticket.callBack;
                                if( _eventType === _type && _uid === _ticket.fileUID){
                                        _callback( _eventType, _targetFile, e.key, e.value);
@@ -356,7 +356,9 @@ pettanr.file = ( function(){
                        if( _index === -1 || _access === null) return;
                        FILEDATA_ACCESS.splice( _index, 1);
                        TREE = parentFile = data = null;
-                       delete _access.DATA, _access.updateParent, _access.dispatchFileEvent;
+                       delete _access.DATA;
+                       delete _access.updateParent;
+                       delete _access.dispatchFileEvent;
                }
        };
        
@@ -413,6 +415,13 @@ pettanr.file = ( function(){
                        var _data = FILE_CONTROLER.getFileData( this);
                        return typeof _data.state === 'number' ? _data.state : pettanr.file.FILE_STATE.OK;
                },
+               getSummary: function(){
+                       var driver = FILE_CONTROLER.getDriver( this );
+                       if( typeof driver.getSummary === 'function'){
+                               return driver.getSummary( this );
+                       }
+                       return FileDriverBase.getSummary( this);
+               },
                isWritable: function(){
                        return FILE_CONTROLER.getUpdateFlag( this, pettanr.file.FILE_UPDATE_POLICY.WRITE);
                },
@@ -432,11 +441,19 @@ pettanr.file = ( function(){
                write: function( _newName, _newData){
                        return false;
                },
-               viwerApps: function(){
-                       
+               viwerApplicationList: function(){
+                       var driver = FILE_CONTROLER.getDriver( this );
+                       if( typeof driver.viwerApplicationList === 'function'){
+                               return driver.viwerApplicationList( this );
+                       }
+                       return FileDriverBase.viwerApplicationList( this );
                },
-               editorApps: function(){
-                       
+               editorApplicationList: function(){
+                       var driver = FILE_CONTROLER.editorApplicationList( this );
+                       if( typeof driver.editorApplicationList === 'function'){
+                               return driver.editorApplicationList( this );
+                       }
+                       return FileDriverBase.viwerApps( this );
                },
                create: function(){
                        
@@ -463,7 +480,7 @@ pettanr.file = ( function(){
                        return _data.name || 'No Name';
                },
                getThumbnail: function( _file){
-                       var _data = FILE_CONTROLER.getFileData( _file);
+                       var _data = FILE_CONTROLER.getFileData( _file),
                                _type = _data.type,
                                _className = '';
                        if( _type === pettanr.file.FILE_TYPE.FOLDER){
@@ -492,6 +509,32 @@ pettanr.file = ( function(){
                                className:      ' file-type-' + _className
                        }
                },
+               getSummary: function( _file ){
+                       var _data = FILE_CONTROLER.getFileData( _file ),
+                               _type = _data.type;
+                       if( _type === pettanr.file.FILE_TYPE.FOLDER){
+                               return 'folder';
+                       } else
+                       if( _type === pettanr.file.FILE_TYPE.IMAGE){
+                               return 'image file';
+                       } else
+                       if( _type === pettanr.file.FILE_TYPE.TEXT){
+                               return 'text file';
+                       } else
+                       if( _type === pettanr.file.FILE_TYPE.HTML){
+                               return 'html document file';
+                       } else
+                       if( _type === pettanr.file.FILE_TYPE.CSV){
+                               return 'csv daat file';
+                       } else
+                       if( _type === pettanr.file.FILE_TYPE.JSON){
+                               return 'json data file';
+                       } else
+                       if( _type === pettanr.file.FILE_TYPE.XML){
+                               return 'xml data file';
+                       }
+                       return '';
+               },
                getUpdatePolicy: function( _file){
                        // debug用 全てのメニューを許可
                        return pettanr.file.FILE_UPDATE_POLICY.SRWC;
@@ -502,6 +545,12 @@ pettanr.file = ( function(){
                write: function( _newName, _newData){
                        return false;
                },
+               viwerApplicationList: function(){
+                       return [];
+               },
+               editorApplicationList: function(){
+                       return [];
+               },
                onCreate: function(){
                        
                },
@@ -530,7 +579,7 @@ pettanr.file = ( function(){
                        .dispatchFileEvent( new FileEventClass( pettanr.file.FILE_EVENT.GET_SEQENTIAL_FILES, ROOT_FILE, 'children', null));
        }
        function createFileEvent( _eventType, _file, _key, _value){
-               return new FileEventClass( _eventType, _file, _key, _value)
+               return new FileEventClass( _eventType, _file, _key, _value);
        }
        function createFileTypeID(){
                return ++numFileType;
@@ -542,7 +591,7 @@ pettanr.file = ( function(){
                        //FILE_CONTROLER.init();
                        delete pettanr.file.init;
                },
-               resisterDriver: function( _driver){
+               registerDriver: function( _driver){
                        _driver.prototype = FileDriverBase;
                        /*
                         * File API
@@ -623,15 +672,16 @@ pettanr.finder = ( function(){
                ELM_ORIGIN_FINDER_ICON = pettanr.util.pullHtmlAsTemplete( 'templete-finder-icon'),
                ELM_ORIGIN_CONTAINER = pettanr.util.pullHtmlAsTemplete( 'templete-finder-container'),
                ICON_HEIGHT = pettanr.util.getElementSize( ELM_ORIGIN_FINDER_ICON).height,
-               ICON_CLASSNAME = ELM_ORIGIN_FINDER_ICON.getElementsByTagName( 'div')[0].className,
+               ICON_CLASSNAME = 'finder-icon-thumbnail',
                FINDER_ICON_POOL = [],
                BREAD_OBJECT_POOL = [];
        
        var FinderIconClass = function(){
                var elmContainer,
                        ELM_WRAPPER = ELM_ORIGIN_FINDER_ICON.cloneNode( true),
-                       ELM_THUMBNAIL = pettanr.util.getElementsByClassName( ELM_WRAPPER, 'finder-icon-thumbnail', 'div')[0],
-                       ELM_FILENAME = pettanr.util.getElementsByClassName( ELM_WRAPPER, 'finder-icon-filename', 'div')[0],
+                       ELM_THUMBNAIL = pettanr.util.getElementsByClassName( ELM_WRAPPER, ICON_CLASSNAME )[0],
+                       ELM_FILENAME = pettanr.util.getElementsByClassName( ELM_WRAPPER, 'finder-icon-filename' )[0],
+                       ELM_DESCRIPTION = pettanr.util.getElementsByClassName( ELM_WRAPPER, 'finder-icon-summary' )[0],
                        file, w, index, style, instansce, callback;
                
                ELM_WRAPPER.onclick = onClick;
@@ -649,6 +699,7 @@ pettanr.finder = ( function(){
                                ELM_THUMBNAIL.style.backgroundImage = '';
                        }
                        ELM_FILENAME.innerHTML = file.getName();
+                       ELM_DESCRIPTION.innerHTML = file.getSummary();
                }
                function resize(){
                        ELM_WRAPPER.style.top = (index * ICON_HEIGHT) +'px';
@@ -750,7 +801,7 @@ pettanr.finder = ( function(){
                }
        }
        
-       var FinderClass = function( ELM_CONTAINER, tree, detailSwitchEnabled, styleSwitchEnabled, actionSwitchEnabled){
+       var FinderClass = function( ELM_CONTAINER, tree, header, footer ){
                var ICON_ARRAY = [],
                        BREAD_ARRAY = [],
                        elmContainer = ELM_ORIGIN_CONTAINER.cloneNode( true),
@@ -759,23 +810,26 @@ pettanr.finder = ( function(){
                        elmSidebarButton = nodesDiv[1],
                        elmStyleButton = nodesDiv[2],
                        elmActionButton = nodesDiv[3],
-                       elmBody = nodesDiv[ nodesDiv.length -1],
+                       elmBody = nodesDiv[ nodesDiv.length -1 ],
                        //tree = pettanr.file.createTree( TREE_TYPE),
                        headX,
                        headY,
-                       headH = pettanr.util.getElementSize( ELM_ORIGIN_FINDER_ICON).height,
+                       headH = pettanr.util.getElementSize( nodesDiv[0] ).height,
                        bodyY,
                        currentFile = null,
                        breadW = 90,
-                       size = pettanr.util.getElementSize( ELM_ORIGIN_FINDER_ICON),
+                       size = pettanr.util.getElementSize( ELM_ORIGIN_FINDER_ICON ),
                        iconW = size.width,
                        iconH = size.height,
-                       style = 0;
-                       w = 800;
-
+                       style = 0,
+                       w, h, bodyH;
+                       
                tree.addTreeEventListener( pettanr.file.TREE_EVENT.UPDATE, draw);
                
-               function draw(){
+               function draw( _w, _h ){
+                       w = Type.isFinite( _w ) === true ? _w : w;
+                       h = Type.isFinite( _h ) === true ? _h : h;
+                       bodyH = _h - headH;
                        var     l = tree.hierarchy() +1,
                                m = BREAD_ARRAY.length,
                                _file, _bread;
@@ -798,20 +852,28 @@ pettanr.finder = ( function(){
                                if( i < m){
                                        ICON_ARRAY[ i].init( _file.getChildFileByIndex( i), elmBody, w, i, style, onBodyClick);
                                } else {
-                                       ICON_ARRAY.push( getFinderIcon( _file.getChildFileByIndex( i), elmBody, w, i, style, onBodyClick));
+                                       ICON_ARRAY.push( getFinderIcon( _file.getChildFileByIndex( i), elmBody, _w, i, style, onBodyClick));
                                }
                        }
+                       if( _file.getState() === pettanr.file.FILE_STATE.LOADING ){
+                               elmBody.className = 'finder-body loading';
+                       } else {
+                               elmBody.className = 'finder-body';
+                       }
+                       elmBody.style.height = bodyH + 'px';
+                       
                        while( l < ICON_ARRAY.length){
                                ICON_ARRAY.pop().destroy();
                        }
                }
+               
                function onHeadClick( i){
                        var l = BREAD_ARRAY.length -1;
                        if( i < l){
                                var _file = tree.getParentFileAt( i);
                                if( _file !== null){
                                        tree.up( i);
-                                       draw();
+                                       draw( w, h );
                                }
                        }
                }
@@ -821,7 +883,7 @@ pettanr.finder = ( function(){
                                var _file = tree.getCurrentFile().getChildFileByIndex( i);
                                if( _file !== null && ( _file.getChildFileLength() !== -1 || _file.getType() === pettanr.file.FILE_TYPE.FOLDER)){
                                        tree.down( i);
-                                       draw();
+                                       draw( w, h );
                                }
                        }
                }
@@ -836,17 +898,28 @@ pettanr.finder = ( function(){
                        bodyY = pettanr.util.getAbsolutePosition( elmBody).y;
                        delete this.init;
                }
-               this.onOpen = function(){
+               this.onOpen = function( _w, _h, _option ){
                        this.init !== undefined && this.init();
-                       draw();
+                       draw( _w, _h );
                }
                this.onClose = function(){
-                       
+                       return true;
                }
-               this.onWindowResize = function( _w, _h){
-                               
+               this.onPaneResize = function( _w, _h){
+                       w = _w;
+                       h = _h;
+                       elmBody.style.height = ( _h - headH ) + 'px';
+                       
+                       for(var i=0, l=ICON_ARRAY.length; i<l; ++i){
+                               ICON_ARRAY[ i].onResize( _w );
+                       }
                }
+               this.MIN_WIDTH = 240;
+               this.MIN_HEIGHT = 240;
        }
+       
+       pettanr.view.registerAsBasicPane( FinderClass );
+       
        function getFinderIcon( _file, _elmContainer, w, index, style, callback){
                var _icon;
                if( FINDER_ICON_POOL.length > 0){
@@ -873,27 +946,32 @@ pettanr.finder = ( function(){
                init: function(){
                        
                },
-               createFinder: function( _elmTarget, _tree, detailSwitchEnabled, styleSwitchEnabled, actionSwitchEnabled){
-                       var _finder = new FinderClass( _elmTarget, _tree, detailSwitchEnabled, styleSwitchEnabled, actionSwitchEnabled);
+               createFinder: function( _elmTarget, _tree, _header, _footer ){
+                       var _finder = new FinderClass( _elmTarget, _tree, _header, _footer );
                        FINDER_ARRAY.push( _finder);
                        return _finder;
                },
-               createFinderHead: function(){
+               registerFinderHead: function(){
                        
                },
-               resisterFinderPane: function( _finderPane){
+               registerFinderPane: function( _finderPane){
                        
                },
                isFinderInstance: function( _finder){
                        return _finder instanceof FinderClass;
+               },
+               isFinderPaneInstance: function(){
+                       
+               },
+               isFinderHeadInstance: function(){
                }
        }
 })();
 
 
 pettanr.driver = ( function(){
-       var MyAuthorID = 'current_author' in window ? current_author.id : 1,
-               MyArtistID = 'current_artist' in window ? current_artist.id : 1,
+       var MyAuthorID = 'current_author' in window ? current_author.id : ( pettanr.DEBUG ? 1 : -1 ),
+               MyArtistID = 'current_artist' in window ? current_artist.id : ( pettanr.DEBUG ? 1 : -1 ),
                Driver = {
                        getSeqentialFiles: function( _file){
                                var _data = FileAPI.getFileData( _file),
@@ -929,7 +1007,7 @@ pettanr.driver = ( function(){
                                return _data.name;
                        },
                        getThumbnail: function( _file){
-                               var _data = FileAPI.getFileData( _file);
+                               var _data = FileAPI.getFileData( _file),
                                        _type = _data !== null ? _data.type : null;
                                if( _type === pettanr.driver.FILE_TYPE.PICTURE){
                                        return { image: [ pettanr.CONST.RESOURCE_PICTURE_PATH, 'thumbnail/', _data.id, '.', _data.ext ].join( '')};
@@ -949,13 +1027,49 @@ pettanr.driver = ( function(){
                                if( _type === pettanr.driver.FILE_TYPE.ARTIST){
                                        return { className: 'file-type-artist'};
                                }
-                               if( _type === pettanr.driver.FILE_TYPE.FOLDEER){
+                               if( _type === pettanr.file.FILE_TYPE.FOLDER){
                                        return { className: 'file-type-folder'};
                                }
-                               return { className: 'file-type-folder'};
+                               return { className: 'file-type-broken'};
+                       },
+                       getSummary: function( _file ){
+                               var _data = FileAPI.getFileData( _file),
+                                       _type = _data !== null ? _data.type : null;
+                               if( _type === pettanr.driver.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 === pettanr.driver.FILE_TYPE.COMIC){
+                                       return 'comic file';
+                               }
+                               if( _type === pettanr.driver.FILE_TYPE.PANEL){
+                                       return [ _data.width, 'x', _data.height ].join( '' );
+                               }
+                               if( _type === pettanr.driver.FILE_TYPE.AUTHOR){
+                                       return 'author file';
+                               }
+                               if( _type === pettanr.driver.FILE_TYPE.ARTIST){
+                                       return [ 'Email:', _data.email || 'empty' , ', HP:', _data.homepage_url || 'empty' ].join( '' );
+                               }
+                               if( _type === pettanr.file.FILE_TYPE.FOLDER){
+                                       return 'pettanR folder';
+                               }
+                               return 'pettanR unknown file';
+                       },
+                       viwerApplicationList: function( _file ){
+                               var _data = FileAPI.getFileData( _file ),
+                                       _type = _data !== null ? _data.type : null;
+                               return [];
+                       },
+                       editorApplicationList: function( _file ){
+                               var _data = FileAPI.getFileData( _file ),
+                                       _type = _data !== null ? _data.type : null;
+                               return [];
                        }
                },
-               FileAPI = pettanr.file.resisterDriver( Driver),
+               FileAPI = pettanr.file.registerDriver( Driver),
                FILE_DATA_SERVICE_ROOT = {
                        name:           'PettanR root',
                        type:           pettanr.file.FILE_TYPE.FOLDER,
@@ -984,13 +1098,18 @@ pettanr.driver = ( function(){
                },
                FILE_DATA_MY_COMICS_ROOT = {
                        name:           'My Comics',
-                       type:           pettanr.file.FILE_TYPE.AUTHOR,
+                       type:           pettanr.file.FILE_TYPE.FOLDER,
                        children:       [],
                        driver:         Driver
                },
+               FILE_DATA_LATEST_COMICS = {
+                       name:           'Latest Comics',
+                       type:           pettanr.file.FILE_TYPE.FOLDER,
+                       children:       []
+               },
                FILE_DATA_MY_PICTURES_ROOT = {
                        name:           'My Pictures',
-                       type:           pettanr.file.FILE_TYPE.ARTIST,
+                       type:           pettanr.file.FILE_TYPE.FOLDER,
                        children:       [],
                        driver:         Driver,
                        json:           pettanr.CONST.URL_ORIGINAL_PICTURES_JSON
@@ -1024,12 +1143,12 @@ pettanr.driver = ( function(){
                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_AUTHOR_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);
 
-       function onLoadJson( _file, _json){
+       function onLoadJson( _file, _json ){
                var _access = FileAPI.getFileDataAccess( _file),
                        _data = _access !== null ? _access.DATA : null,
                        l;
@@ -1040,7 +1159,7 @@ pettanr.driver = ( function(){
                _data.state = pettanr.file.FILE_STATE.OK;
                
                if( Type.isArray( _json ) === true ){
-                       var l = _json.length;
+                       l = _json.length;
                        if( l === 0) return;
                        for( var i=0; i<l; ++i ){
                                buildFileData( _json[ i], _data);
@@ -1094,11 +1213,13 @@ pettanr.driver = ( function(){
                        // 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){
-                                       if( typeof _license[ BASIC_LICENSES[ i]] === 'number'){
+                                       _rule = _license[ BASIC_LICENSES[ i]]
+                                       if( typeof _rule === 'number' && _rule === 1 ){
                                                _bits += _Math_pow( 2, i);
                                        }
                                }
@@ -1162,10 +1283,13 @@ pettanr.driver = ( function(){
                                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.comic = getResource( COMIC_ARRAY, _data.comic_id );
                        _data.author = getResource( AUTHOR_ARRAY, _data.author_id );
 
                        // picture data をファイルに取り出し
@@ -1183,7 +1307,7 @@ pettanr.driver = ( function(){
                        }
                } else
                // Picture
-               if( _data.type = pettanr.driver.FILE_TYPE.PICTURE ){
+               if( _data.type == pettanr.driver.FILE_TYPE.PICTURE ){
                        var _artist = _data.artist || getResource( ARTIST_ARRAY, _data.artist_id );
                        if( _artist){
                                _data.artist = _artist = buildFileData( _artist, FILE_DATA_ARTIST_ROOT );
@@ -1238,12 +1362,44 @@ pettanr.driver = ( function(){
        }
 })();
 
+pettanr.entrance = {
+               onOpen: function( _w, _h, _option ){
+                       var pageHeaderH = pettanr.util.getElementSize( document.getElementById('header') ).height;
+                       document.getElementById('inner-wrapper').style.height = ( _h - pageHeaderH ) + 'px';
+               },
+               onClose: function(){
+                       document.getElementById('inner-wrapper').style.height = '0px';
+               },
+               onWindowResize: function( _w, _h){
+                       pettanr.entrance.onOpen( _w, _h );
+               }
+       }
+pettanr.backyard = {
+               onOpen: function( _w, _h, _option ){
+               },
+               onClose: function(){
+               },
+               onWindowResize: function( _w, _h){
+               }
+       }
+pettanr.debug = {
+               onOpen: function( _w, _h, _option ){
+                       var pageHeaderH = pettanr.util.getElementSize( document.getElementById('header') ).height;
+                       document.getElementById('inner-wrapper').style.height = ( _h - pageHeaderH ) + 'px';
+               },
+               onClose: function(){
+                       document.getElementById('inner-wrapper').style.height = '0px';
+               },
+               onWindowResize: function( _w, _h){
+                       pettanr.debug.onOpen( _w, _h );
+               }
+       }
 
 pettanr.gallery = ( function(){
        var finder,
                elmContainer = document.getElementById( 'gallery'),
-               option;
-               
+               option,
+               pageHeaderH = pettanr.util.getElementSize( document.getElementById('header') ).height;
        return {
                init: function( _option){
                        option = _option;
@@ -1253,16 +1409,16 @@ pettanr.gallery = ( function(){
                        finder = pettanr.finder.createFinder( elmContainer, pettanr.driver.createPictureTree());
                        delete pettanr.gallery.firstOpen;
                },
-               onOpen: function(){
+               onOpen: function( _w, _h, _option ){
                        pettanr.gallery.firstOpen !== undefined && pettanr.gallery.firstOpen();
-                       finder.onOpen();
+                       finder.onOpen( _w, _h - pageHeaderH, _option );
                        
                },
                onClose: function(){
                        finder.onClose();
                },
                onWindowResize: function( _w, _h){
-                       finder.onWindowResize( _w, _h);
+                       finder.resize( _w, _h - pageHeaderH );
                }
        }
 })();
@@ -1270,7 +1426,8 @@ pettanr.gallery = ( function(){
 pettanr.cabinet = ( function(){
        var finder,
                elmContainer = document.getElementById( 'cabinet'),
-               option;
+               option,
+               pageHeaderH = pettanr.util.getElementSize( document.getElementById('header') ).height;
                
        return {
                init: function( _option){
@@ -1281,16 +1438,16 @@ pettanr.cabinet = ( function(){
                        finder = pettanr.finder.createFinder( elmContainer, pettanr.driver.createComicTree());
                        delete pettanr.cabinet.firstOpen;
                },
-               onOpen: function(){
+               onOpen: function( _w, _h, _option ){
                        pettanr.cabinet.firstOpen !== undefined && pettanr.cabinet.firstOpen();
-                       finder.onOpen();
+                       finder.onOpen( _w, _h - pageHeaderH, _option );
                        
                },
                onClose: function(){
                        finder.onClose();
                },
                onWindowResize: function( _w, _h){
-                       finder.onWindowResize( _w, _h);
+                       finder.resize( _w, _h - pageHeaderH);
                }
        }
 })();