From: itozyun Date: Sun, 27 May 2012 09:49:59 +0000 (+0900) Subject: client is version0.4.35, added pettanr.comicReader. X-Git-Url: http://git.osdn.net/view?p=pettanr%2Fpettanr.git;a=commitdiff_plain;h=cd9653c66c4883c5e9a483fc47f0ddf77ed837be client is version0.4.35, added pettanr.comicReader. --- diff --git a/app/assets/stylesheets/common.css b/app/assets/stylesheets/common.css index 13ea61f3..af30ddc7 100644 --- a/app/assets/stylesheets/common.css +++ b/app/assets/stylesheets/common.css @@ -546,6 +546,9 @@ version: 2.7.0 /* PettanR Comic --------------------------------------------------------------------------------------*/ +.pettanr-comic-wrapper { + margin: 1em auto; +} .pettanr-comic-panel { border-style: solid; border-color: #111; @@ -553,42 +556,53 @@ version: 2.7.0 margin: 1em auto; overflow: hidden; } - .pettanr-comic-image, - .pettanr-comic-balloon { - position: absolute; - } - .pettanr-comic-image img { - position: absolute; - height: 100%; - width: 100%; - left: 0; - top: 0; - } - .pettanr-comic-panel img { - position: absolute; - left: 0; - top: 0; + .pettanr-comic-panel img, + .pettanr-comic-panel .reversible-image-container { + position: absolute; } - .pettanr-comic-balloon .pettanr-comic-speach { + .pettanr-comic-balloon { position: absolute; - top: 0; - left: 0; } - .pettanr-comic-speach, - .pettanr-comic-speach tbody, - .pettanr-comic-speach tr, - .pettanr-comic-speach td { - width: 100%; - height: 100%; - border: 0; - padding: 0; - margin: 0 !important; - text-align: center; - vertical-align: middle; + .pettanr-comic-panel .reversible-image-container img, + .pettanr-comic-balloon img { + width: 100%; + height: 100%; } - .pettanr-comic-speach td { - padding: 16.66%; + .pettanr-comic-balloon p { + margin: 0 !important; + padding: 0 !important; + display: table; + position: absolute; + top: 0; + left: 16.6%; + width: 66.6%; + height: 100%; + *height: auto; + *top: 50% !important; } - .pettanr-comic-speach { - table-layout: fixed; /* ie6で上下中央にテキストがならない対処。固定レイアウトアルゴリズムになるので負荷を下げるらしい */ - } \ No newline at end of file + .pettanr-comic-balloon p span, + .pettanr-comic-balloon p strong, + .pettanr-comic-balloon p em, + .pettanr-comic-balloon p i, + .pettanr-comic-balloon p samp, + .pettanr-comic-balloon p code { + vertical-align: middle; + text-align: center; + font-size: 14px; /* opera6 で使用 13px は不可 */ + display: table-cell; + *display: block; + zoom: 1; + *position: relative; + *top: -50%; + } + .pettanr-comic-balloon p strong { + font-weight: bold; + } + .pettanr-comic-balloon p em, + .pettanr-comic-balloon p i { + font-style: italic; + } + .pettanr-comic-balloon p samp, + .pettanr-comic-balloon p code { + font-family: monospace; + } \ No newline at end of file diff --git a/app/assets/stylesheets/work.css b/app/assets/stylesheets/work.css index 3c1755c6..23bab385 100644 --- a/app/assets/stylesheets/work.css +++ b/app/assets/stylesheets/work.css @@ -71,6 +71,7 @@ position: absolute; top: 9px; right: 9px; + z-index: 9999; border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; @@ -165,8 +166,103 @@ width: 180px; text-align: center; } - - + /* Comic Reader + --------------------------------------------------------------------------------------*/ + #comic-reader-wrapper {} + #comic-reader-panel-container { + position: absolute; + left: 0; + top: 0; + } + #comic-reader-header, + #comic-reader-console { + position: absolute; + left; 0; + width: 100%; + z-index: 9998; + } + #comic-reader-header { + top: 0; + height: 40px; + } + .comic-reader-shadow { + z-index: 9997; + position: absolute; + width: 100%; + left; 0; + width: 100%; + height: 40px; + background: #000; + opacity: 0.5; + -moz-opacity: 0.5; + -khtml-opacity: 0.5; + } + .pettanr-ActiveX-enabled .comic-reader-shadow { + filter: alpha(opacity=50); + -ms-filter: alpha(opacity=50); + } + .pettanr-ActiveX-disabled .comic-reader-shadow { + background: transparent url( black_50pct.png)　repeat 0 0; + _background: url( black_50pct.gif)　repeat 0 0; + } + #comic-reader-header-content { + height: 24px; + padding-top: 16px; + border-bottom: 1px solid #fff; + } + #comic-reader-title { + font-size: 20px; + line-height: 24px; + color: #fff; + font-weight: bold; + } + #comic-reader-author { + font-size: 18px; + line-height: 24px; + color: #ddd; + text-indent: 1em; + } + #comic-reader-console { + bottom: 0; + height: 100px; + border-top: 1px solid #fff; + } + #comic-reader-button-centering { + position: relative; + margin: 0 auto; + width: 399px; + } + #comic-reader-back-button, + #comic-reader-forward-button, + #comic-reader-back-button:link, + #comic-reader-forward-button:link { + display: block; + zoom: 1; + position: absolute; + top: 0; + height: 100px; + line-height: 100px; + color: #ddd; + width: 198px; + border-left: 1px solid #999; + border-right: 1px solid #999; + text-align: center; + font-size: 30px; + } + #comic-reader-back-button:hover, + #comic-reader-forward-button:hover { + background-color: #111; + color: #fff; + font-size: 34px; + text-decoration: none; + } + #comic-reader-back-button { + left: 0; + border-right: 1px solid #ccc; + } + #comic-reader-forward-button { + right: 0; + } /* Output Console --------------------------------------------------------------------------------------*/ diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb index b78281b9..1a179345 100644 --- a/app/views/layouts/application.html.erb +++ b/app/views/layouts/application.html.erb @@ -27,6 +27,7 @@
<%= yield %> +

This page is login user console.

クイックアクセス

新しいコマを描く(開発用)

新しいコミックをつくる

@@ -302,6 +303,25 @@
close
+ +
+
+
+
+
+ NO DATA... + NO DATA... +
+
+
+
+ +
+
+
Register Artist
diff --git a/public/assets/common.js b/public/assets/common.js index a604d02d..5f475e0e 100644 --- a/public/assets/common.js +++ b/public/assets/common.js @@ -1,6 +1,6 @@ /* * pettanR common.js - * version 0.4.34 + * version 0.4.35 * * author: itozyun */ @@ -108,7 +108,7 @@ var pettanr = ( function(){ IS_DEBUG = Type.isBoolean( URL_PARAMS.debug ) ? URL_PARAMS.debug : IS_LOCAL === true, jqWindow , jqDocument , jqBody; return { - version: '0.4.33', + version: '0.4.35', init: function(){ jqWindow = $( window ); jqDocument = $( document ); @@ -965,11 +965,11 @@ pettanr.view = ( function(){ pettanr.overlay = ( function(){ var SHADOW_OPACITY = 0.5, - ELM_CONTAINER = document.getElementById( 'overlay-container' ), - jqConteiner, jqShadow, jqCloseButton,// jqBody, + ELM_CONTAINER = document.getElementById( 'overlay-container' ), currentOverlay = null, - bootParams = null, - visible = false, + bootParams = null, + visible = false, + jqConteiner, jqShadow, jqCloseButton,// jqBody, windowW, windowH; function asyncResize(){ @@ -978,7 +978,7 @@ pettanr.overlay = ( function(){ function onCloseClick( e){ pettanr.overlay.hide(); e.preventDefault(); - return false; + return false; } function onFadeInComplete(){ @@ -992,8 +992,8 @@ pettanr.overlay = ( function(){ return { init: function(){ //jqBody = pettanr.jqBody(); - jqConteiner = $( '#overlay-container'); - jqShadow = $( '#overlay-shadow'); + jqConteiner = $( '#overlay-container'); + jqShadow = $( '#overlay-shadow'); jqCloseButton = $( '#overlay-close-button').click( onCloseClick ); pettanr.key.addKeyDownEvent( pettanr.view.OVERLAY, 27, false, false, pettanr.overlay.hide ); // 27.esc @@ -1005,6 +1005,7 @@ pettanr.overlay = ( function(){ if( pettanr.view.isApplicationInstance( _overlay ) === false ) return; document.body.style.overflow = 'hidden'; + document.body.appendChild( ELM_CONTAINER ); // ie6-8 で必要、なんで、、、？ this.visible = visible = true; this.currentID = _overlay.ID; @@ -2289,6 +2290,9 @@ pettanr.bind = ( function(){ var ret = document.createElement( 'div'); ret.style.cssText = 'width: auto;height: 0;padding: 0;margin: 0;display: block;visibility: hidden;float: none;position: static;'; return ret; + })(), + ELM_TITLE_ORIGN = ( function(){ + })(); /* @@ -2315,7 +2319,7 @@ pettanr.bind = ( function(){ var size = getInnerSize(); if (_size.w !== size.w || _size.h !== size.h) { // resized _size = size; // update - onResizeFunction( _size); + onResizeFunction( _size ); } setTimeout( unlock, 0); // delay unlock } @@ -2328,151 +2332,175 @@ pettanr.bind = ( function(){ } - var ElementBuilder = ( function(){ - var ELM_TITLE_ORIGN = ( function(){ - - })(), - ELM_TEXT_ORIGN = ( function(){ - var _table = document.createElement( 'table'), - _tr = document.createElement( 'tr'); - _table.appendChild( _tr); - _tr.appendChild( document.createElement( 'td')); - _table.cellspacing = '0'; - return _table; - })(); + var ElementBuilderClass = function( elmTarget, noClassnameMode ){ + var RIMG_ARRAY = [], + BALLOON_ARRAY = []; function buildComicElement(){ } - function buildPanelElement( elmTarget, json, noClassnameMode){ - var _elmPanel = document.createElement( 'div'), + function buildPanelElement( json, zoom ){ + var _elmPanel = document.createElement( 'div' ), _style = { - "border-width": typeof json.border === 'number' ? json.border + 'px' : 0, + 'border-width': typeof json.border === 'number' ? json.border + 'px' : 0, width: json.width + 'px', height: json.height + 'px' }, _cssText = [], _comicElements = json.panel_elements || [], - _comicElement, _elmImgWrap, _rImg, _rPic, _balloon, _elmBalloonWrap, _elmText; - if( noClassnameMode === true){ + _comicElement, _elmImg, _rImg, _rPic, + _balloon, _elmBalloonWrap, _elmText, _text, _speachesAttributes, _key; + if( noClassnameMode === true ){ } else { _elmPanel.className = NAMESPACE_CLASSNAME + 'panel'; } - for( var _key in _style){ - _cssText.push( _key + ':' + _style[ _key]); + for( var _key in _style ){ + _cssText.push( _key + ':' + _style[ _key ] ); } _elmPanel.style.cssText = _cssText.join( ';'); - elmTarget.appendChild( _elmPanel); + elmTarget.appendChild( _elmPanel ); - for( var i=0, l=_comicElements.length; i 0 ){ + RIMG_ARRAY.shift().destroy(); + } + while( BALLOON_ARRAY.length > 0 ){ + BALLOON_ARRAY.shift().destroy(); + } + pettanr.util.removeAllChildren( elmTarget ); + } + + this.build = function( json, zoom ){ + clean(); + + // json is Comic ? Panel ? + var panels = json.panels; + if( Type.isArray( panels ) === true ){ + // comic + for( var i=0, l=panels.length; i 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 ); + } + + jqPanelContainer.stop().animate( { + top: top + }); + } + function getCurrentTopPosition(){ + + } + function draw(){ + var fileData, title, author; + + if( pettanr.driver.isPettanrFileInstance( currentFile ) === true ){ + if( currentFile.getType() === pettanr.driver.FILE_TYPE.COMIC ){ + fileData = currentFile.read(); + title = fileData.title; + author = fileData.author.name; + comicData = fileData; + numPanel = currentFile.getChildFileLength(); + } else + if( currentFile.getType() === pettanr.driver.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 ); + window.setTimeout( asyncResize, 0 ); + } + } + function asyncResize(){ + instance.onPaneResize( windowW, windowH ); + } + + /* grobal method */ + // this.rootElement = elmWrap; + this.displayName = ID; + this.ID = ID; + this.rootElement = document.getElementById( 'comic-reader-wrapper' ); + this.MIN_WIDTH = 320; + this.MIN_HEIGHT = 320; + this.init = function(){ + jqWrap = $( instance.rootElement ); + jqPanelContainer = $( elmContainer ); + + elmBackButton.onclick = onBackClick; + elmNextButton.onclick = onNextClick; + + bindWorker = pettanr.bind.createBindWorker( elmContainer, null, false, false ); + + delete instance.init; + } + this.onOpen = function( _w, _h, _file ){ + instance.init && instance.init(); + numPanel = currentIndex = 0; + + jqWrap.show(); + jqPanelContainer.css({ + left: _w / 2, + top: _h + }); + windowW = _w; + windowH = _h; + if( pettanr.file.isFileInstance( _file ) === true ){ + currentFile = _file; + _file.addEventListener( pettanr.file.FILE_EVENT.GET_SEQENTIAL_FILES, draw ); + draw(); + } + } + this.onPaneResize = function( _windowW, _windowH ){ + windowW = _windowW; + windowH = _windowH; + var panelH = elmContainer.offsetHeight, + panelW = elmContainer.offsetWidth, + h = _windowH - headerH - consoleH; + jqPanelContainer.stop().animate( + { + left: Math.floor( ( _windowW - panelW ) / 2 ), + top: headerH + ( panelH < h ? Math.floor( ( h - panelH ) / 2 ) : 0 ) + } + ); + } + this.onClose = function(){ + jqWrap.hide(); + currentFile.addEventListener( pettanr.file.FILE_EVENT.GET_SEQENTIAL_FILES, draw ); + currentFile = comicData = currentPanel = null; + } +}); + // i18n // login // lib diff --git a/public/assets/work.js b/public/assets/work.js index d18c952c..b7e7b176 100644 --- a/public/assets/work.js +++ b/public/assets/work.js @@ -1,6 +1,6 @@ /* * pettanR work.js - * version 0.4.33 + * version 0.4.35 * * author: * itozyun