OSDN Git Service

add wiki.*
authoritozyun <itozyun@git.sourceforge.jp>
Mon, 9 Jan 2012 14:00:41 +0000 (23:00 +0900)
committeritozyun <itozyun@git.sourceforge.jp>
Mon, 9 Jan 2012 14:00:41 +0000 (23:00 +0900)
0.3.0/common.css
0.3.0/common.js
0.3.0/diary/itozyun.xml
0.3.0/wiki/wiki.css [new file with mode: 0644]
0.3.0/wiki/wiki.js [new file with mode: 0644]
0.3.0/wiki/wiki.xml [new file with mode: 0644]
0.3.0/wiki/wiki.xsl [new file with mode: 0644]
0.3.0/work.css
0.3.0/work.html
0.3.0/work.js

index c0297a9..6f1942e 100644 (file)
@@ -146,27 +146,42 @@ version: 2.7.0
                text-decoration:        underline;\r
                color:                          #f60;\r
        }\r
-       \r
+       h1 {\r
+               letter-spacing:         2px;\r
+       }\r
        h2 {\r
                letter-spacing:         2px;\r
+           border-top:                 1px solid #333;\r
+           border-bottom:              1px solid #333;\r
+           padding:                    0.5em 0;\r
+           font-size:                  1.4em;\r
+               line-height:            1.4em;\r
+               text-align:                     center;\r
+               margin:                         0 2px 1em;\r
+               text-shadow:            1px 1px 3px rgba(0, 0, 0, 0.6);\r
+    }\r
+\r
+\r
+       h3 {\r
+               letter-spacing:         2px;\r
            border-bottom:              1px dotted #333333;\r
            font-size:                  1.4em;\r
                line-height:            1.4em;\r
                text-align:                     center;\r
                margin:                         0 0 1em;\r
+               font-weight:            bold;\r
        }               \r
-        h3, h4 {\r
-               font-size:                      116%;\r
+\r
+       h4 {\r
                font-weight:            bold;\r
-       }\r
-       h3 {\r
+               font-size:                      116%;\r
                letter-spacing:         1px;\r
                border:                         1px #333 solid;\r
                border-width:           0 0 1px 0.5em;\r
                padding:                        4px 0 2px 0.6em;\r
                margin:                         2em 0 1em;\r
        }\r
-       h4 {\r
+       h5 {\r
                letter-spacing:         1px;\r
                border-bottom:          1px #999 dotted;\r
                padding:                        6px 6px 2px;\r
@@ -177,7 +192,7 @@ version: 2.7.0
                padding:                        0 5px 0;\r
                margin:                         1.5em 14px 1em;\r
        }\r
-       h5 {\r
+       h6 {\r
                border-left:            5px #999 solid;\r
                letter-spacing:         1px;\r
        }\r
@@ -349,7 +364,7 @@ version: 2.7.0
 /*  main\r
 --------------------------------------------------------------------------------------*/\r
        #main {\r
-               padding:                                        2em 1em;\r
+               padding:                                        20px 10px;\r
        }\r
 \r
 /*  footer-content\r
@@ -371,12 +386,17 @@ version: 2.7.0
                        }\r
                        .footer-item h2 {\r
                                font-size:                      1em;\r
-                               padding-left:           0.5em;\r
-                               padding-bottom:         0.3em;\r
+                               padding:                        0 0 0.3em 0.5em;\r
                                margin-top:                     0.7em;\r
                                margin-bottom:          0.6em;\r
                                text-align:                     left;\r
+                               border-top:                     0;\r
+                               border-left:            0;\r
+                               border-right:           0;\r
                                border-bottom:          1px solid #999;\r
+                               box-shadow:                     none;\r
+                               -moz-box-shadow:        none;\r
+                               -webkit-box-shadow:     0;\r
                        }\r
                        .footer-item ul {\r
                                list-style:                     none;\r
@@ -401,12 +421,14 @@ version: 2.7.0
 --------------------------------------------------------------------------------------*/       \r
        img.img-flip-v { /* 上下反転 */\r
                transform:                              scale( 1, -1);\r
-               -o-transform:                   scale( 1, -1);\r
+               /*-o-transform:                 scale( 1, -1);*/\r
                -ms-transform:                  scale( 1, -1);\r
                -moz-transform:                 scale( 1, -1);\r
                -webkit-transform:              scale( 1, -1);\r
-               filter:                                 progid:DXImageTransform.Microsoft.BasicImage( Mirror=1, Rotation=2);\r
-               -ms-filter:                             progid:DXImageTransform.Microsoft.BasicImage( Mirror=1, Rotation=2);\r
+               /*filter:                                       progid:DXImageTransform.Microsoft.BasicImage( Mirror=1, Rotation=2);\r
+               -ms-filter:                             progid:DXImageTransform.Microsoft.BasicImage( Mirror=1, Rotation=2);*/\r
+               filter:                                 flipv();\r
+               -ms-filter:                             flipv();\r
        }\r
        v\:image.img-flip-v {\r
                flip:                                   y; /* vml */\r
@@ -414,12 +436,14 @@ version: 2.7.0
        \r
        img.img-flip-h { /* 左右反転 */\r
                transform:                              scale( -1, 1);\r
-               -o-transform:                   scale( -1, 1);\r
+               /*-o-transform:                 scaleX( -1);*/\r
                -ms-transform:                  scale( -1, 1);\r
                -moz-transform:                 scale( -1, 1);\r
                -webkit-transform:              scale( -1, 1);\r
-               filter:                                 progid:DXImageTransform.Microsoft.BasicImage( Mirror=1);\r
-               -ms-filter:                             progid:DXImageTransform.Microsoft.BasicImage( Mirror=1);\r
+               /*filter:                                       progid:DXImageTransform.Microsoft.BasicImage( Mirror=1);\r
+               -ms-filter:                             progid:DXImageTransform.Microsoft.BasicImage( Mirror=1);*/\r
+               filter:                                 fliph();\r
+               -ms-filter:                             fliph();\r
        }\r
        v\:image.img-flip-h {\r
                flip:                                   x; /* vml */\r
@@ -427,12 +451,14 @@ version: 2.7.0
        \r
        img.img-flip-vh { /* 上下左右反転 */\r
                transform:                              scale( -1, -1);\r
-               -o-transform:                   scale( -1, -1);\r
+               /* -o-transform:                        scaleY( -1); */\r
                -ms-transform:                  scale( -1, -1);\r
                -moz-transform:                 scale( -1, -1);\r
                -webkit-transform:              scale( -1, -1);\r
-               filter:                                 progid:DXImageTransform.Microsoft.BasicImage( Rotation=2);\r
-               -ms-filter:                             progid:DXImageTransform.Microsoft.BasicImage( Rotation=2);\r
+               /*filter:                                       progid:DXImageTransform.Microsoft.BasicImage( Rotation=2);\r
+               -ms-filter:                             progid:DXImageTransform.Microsoft.BasicImage( Rotation=2);*/\r
+               filter:                                 flipv() fliph();\r
+               -ms-filter:                             flipv() fliph();\r
        }\r
        v\:image.img-flip-vh {\r
                rotation :                              180; /* vml */\r
index 6230136..18f937c 100644 (file)
@@ -1,4 +1,4 @@
-/*\r
+/*\r
  * pettanR common.js\r
  *   version 0.1.0\r
  * \r
        \r
        var location = document.location.pathname,\r
                isWorkPage = location.indexOf( '\/work.html') !== -1,\r
-               deep = location.indexOf( '\/diary\/') !== -1 || location.indexOf( '\/help\/') !== -1 || location.indexOf( '\/sitemap\/') !== -1;\r
+               deep =  location.indexOf( '\/diary\/') !== -1 ||\r
+                               location.indexOf( '\/text\/') !== -1 ||\r
+                               location.indexOf( '\/help\/') !== -1 ||\r
+                               location.indexOf( '\/sitemap\/') !== -1 ||\r
+                               location.indexOf( '\/wiki\/') !== -1;\r
 \r
        var LoginUserConsole = isWorkPage === false ?\r
                ( function(){\r
index ffe015b..a27a5c7 100644 (file)
                ieでイメージの縦横pxが取れない問題の解消。new Image()の場合、ie8以下ではサイズが取れなかったり、removeChildに失敗するっぽい。\r
        </entry>\r
        <entry pubdate="11-12-18">\r
-               helpウインドウの追加。併せてWindowClass周りの大幅な書き換え。クロージャを効かせるスタイルでも継承っぽい書き方ができたかも。\r
+               helpウインドウの追加。併せてWindowClass周りの大幅な書き換え。クロージャを効かせるスタイルでも継承っぽい書き方ができたかも(継承ではない.継承親・子で相互に利用するプロパティがないと美しく収まるだけ、、、)\r
                domTreeに追加する前にjQueryでセットしても特にイベント周りで表示がおかしくなる.ieでは特に酷い。\r
        </entry>\r
        <entry pubdate="11-12-25">\r
                http://pettanr.sourceforge.jp/ の top ページを制作。\r
        </entry>\r
        <entry pubdate="12-01-01">\r
-               help ドキュメントを .xml から読み込むようにする。.xml がクロールされユーザーに開かれた場合、.xsl で html 化して表示しユーザーを正しいページに誘導する.\r
+               help ドキュメントを .xml から読み込むようにする。.xml が検索結果に表示されユーザーに開かれた場合、.xsl で html 化して表示しユーザーを正しいページに誘導する.\r
                .xml に埋め込まれた script などの対策もしておいたけど、あんなもんでいいのだろうか??\r
        </entry>\r
        <entry pubdate="12-01-02">\r
                Quit > getAsHTML が少し動作, サーバ画像での吹きだし表示も動作。\r
                90°, -90°のときに起きていたしっぽの操作ボタンのジャンプを修正。\r
        </entry>\r
+       <entry pubdate="12-01-03">\r
+               helpドキュメント の xml の内容を元に、メニューバーの help の内容を入れるようにする。このあたりは入り組んでしまっている。\r
+               vml が使えるか?は、vml を描画してそのサイズの取得からはできない。vml 用の条件コメントを使用に切り替えなくては。\r
+               ActiveX による反転画像モードのときに、ie で画像が表示されなかった。img を appendChild するタイミングを先にすると解消したみたい。\r
+       </entry>\r
 </diary>
\ No newline at end of file
diff --git a/0.3.0/wiki/wiki.css b/0.3.0/wiki/wiki.css
new file mode 100644 (file)
index 0000000..2ef41d4
--- /dev/null
@@ -0,0 +1,156 @@
+#wiki-container {
+       margin:                         1em 0 3em;
+}
+       #page-navi-container {
+               width:                          180px;
+               float:                          left;
+       }
+               #page-total {
+                       height:                         12px;
+                       font-size:                      12px;
+                       line-height:            12px;
+                       padding:                        8px 1em;
+                       color:                          #999;
+                       border-top:                     1px solid #ccc;
+                       border-bottom:          1px solid #ccc;
+               }
+               .page-navi,
+               .page-navi-current {
+                       height:                         24px;
+                       border-bottom:          1px solid #ccc;
+               }
+                       .page-navi a,
+                       .page-navi a:link,
+                       .page-navi-current a,
+                       .page-navi-current a:link {
+                               display:                        block;
+                               font-size:                      14px;
+                               line-height:            14px;
+                               padding:                        6px 0 4px 1em;
+                               color:                          #333;
+                               text-decoration:        none;
+                       }
+                       .page-navi a:hover {
+                               background-color:       #ccc;
+                       }               
+               
+               .page-navi-current {
+                       background-color:       #333;
+               }
+                       .page-navi-current a:link,
+                       .page-navi-current a:visited {
+                               color:                          #eee;
+                       }
+                       .page-navi-current a:hover {
+                               background-color:       #444;
+                       }
+
+       #page-body-container {
+               width:                          580px;
+               float:                          right;
+       }
+               .page-wrapper {
+                       display:                        none;
+               }
+               .page-wrapper:target,
+               .page-wrapper-current {
+                       display:                        block !important;
+               }
+                       .page-header {
+                               position:                       relative;
+                               line-height:            56px;
+                               background-color:       #ddd;
+                               margin-bottom:          1em;
+                               height:                         56px;
+                       }
+                               .page-title {
+                                       position:                       absolute;
+                                       top:                            0;
+                                       left:                           0;
+                                       font-size:                      56px;
+                                       font-weight:            bold;
+                                       line-height:            56px;
+                                       height:                         56px;
+                                       padding-left:           10px;
+                                       overflow:                       hidden;
+                                       display:                        block;
+                                       color:                          #fff;
+                                       width:                          570px;
+                               }
+                               .page-title:first-letter {
+                                       font-size:                      76px;
+                                       line-height:            56px;
+                                       color:                          #666;
+                               }
+                               .page-date {
+                                       position:                       absolute;
+                                       top:                            28px;
+                                       right:                          0;
+                                       display:                        block;
+                                       color:                          #666;
+                                       font-size:                      12px;
+                                       font-weight:            bold;
+                                       line-height:            12px;
+                                       width:                          80px;
+                               }
+       
+       
+       .internalLink {
+               border-bottom:          1px solid green;
+       }                       
+       .externalLink {
+               border-bottom:          1px solid red;
+       }
+       .internalLink:hover,                    
+       .externalLink:hover {
+               text-decoration:        none;
+       }       
+       .jump-to-top {
+               display:                        block;
+               text-align:                     right;
+       }
+       
+
+#wiki-container h1 {
+       text-align:             left;
+       margin:                 1em 0 2em;
+       font-size:              2em;
+}
+
+#wiki-container h2 {
+       text-align:             left;
+       margin:                 2em 0 1em 0;
+}
+#wiki-container h3,
+#wiki-container h4,
+#wiki-container h5,
+#wiki-container h6 {
+       text-align:             left;
+       margin:                 2em 0 1em;
+}
+
+img.embed-image {
+       margin:                 0 0 1em;
+       max-width:              580px;
+}
+#wiki-container {
+       line-height: 1.6em;
+}
+
+#wiki-container pre {
+    background-color:  #F0F0F0;
+    border:                            1px solid #CCCCCC;
+    overflow:                  auto;
+    padding:                   4px 0.5em;
+    margin:                            0.8em 1px 1em 0.8em;
+    line-height:               1.4em;
+    white-space:               pre-wrap;
+    word-wrap:                 break-word;
+    font-size:                 12px;
+}
+       #page-body-container ul,
+       #page-body-container ol {
+               margin-bottom: 1em;
+       }
+       #page-body-container ul ul, #page-body-container ol ul {margin: 0 0 0 1.2em; font-size: 0.95em;}
+       #page-body-container ul ol, #page-body-container ol ol {margin: 0 0 0 1.6em; font-size: 0.95em;}
diff --git a/0.3.0/wiki/wiki.js b/0.3.0/wiki/wiki.js
new file mode 100644 (file)
index 0000000..e8a734b
--- /dev/null
@@ -0,0 +1,308 @@
+/**
+ * @author Administrator
+ */
+( function(){
+       var CLEAN_TARGET_ELEMENT = 'script,style,object,applet,embed,iframe,frame,base,bgsound,frameset,listing'.split( ','),
+               root = document.getElementById('wiki-container'),
+               navi = document.getElementById('page-navi-container'),
+               ELM_BODY_CONTAINER = document.getElementById('page-body-container'),
+               titleArray = [],
+               elmBuilder = document.createElement( 'div'),
+               wikiPageClass = function( id, title, elmNavi, elmAnchor, elmWrapper, elmBody){
+                       var visible = false;
+                       titleArray.push( title);
+                       
+                       elmAnchor.onclick = jumpPage;
+                       
+                       return {
+                               fixCommentToHtml: function(){
+                                       elmBuilder.innerHTML = elmBody.childNodes[0].nodeValue.replace( /\[\[BR\]\]/g, '');
+                                       cleanElement( elmBuilder);
+                                       moveElement( elmBody);
+                                       delete this.fixCommentToHtml;
+                               },
+                               buildInnerLink: function(){
+                                       var jumpArray = elmBody.getElementsByTagName( 'a'),
+                                               l = jumpArray.length,
+                                               _jump, _index;
+                                       for(var i=0; i<l; ++i){
+                                               _jump = jumpArray[i];
+                                               _index = getPageIndexByTitle( _jump.childNodes[0].nodeValue);
+                                               if( _index === -1) continue;
+                                               _jump.href = '#page' +( _index +1);
+                                               _jump.onclick = jumpPage;
+                                               _jump.className += ' internalLink';
+                                       }
+                                       delete this.buildInnerLink;
+                               },
+                               show: function( _id){
+                                       if( id === _id && visible === false){
+                                               elmWrapper.className = 'page-wrapper-current';
+                                               elmWrapper.style.display = 'block';
+                                               elmNavi.className = 'page-navi-current';
+                                               ELM_BODY_CONTAINER.appendChild( elmWrapper);
+                                               visible = true;
+                                       }
+                                       if( id !== _id && visible === true){
+                                               elmWrapper.className = 'page-wrapper';
+                                               elmWrapper.style.display = '';
+                                               elmNavi.className = 'page-navi';
+                                               ELM_BODY_CONTAINER.removeChild( elmWrapper);
+                                               visible = false;
+                                       }
+                               }
+                       }
+               },
+               wikiPageArray = ( function(){
+                       var ret = [],
+                               _body = document.body,
+                               _children = navi.getElementsByTagName( 'div'),
+                               l = _children.length,
+                               _child, _a, _title, _id, _wrap,
+                               _page;
+                               
+                       _body.appendChild( elmBuilder);
+
+                       for(var i=0; i<l; ++i){
+                               _child = _children[i];
+                               if( _child.className.indexOf( 'page-navi') !== -1){
+                                       _a = _child.getElementsByTagName( 'a')[0];
+                                       _title = _a ? _a.childNodes[0].nodeValue : null;
+                                       _id = _a ? _a.href.split('#')[1] : null;
+                                       _wrap = document.getElementById( _id);
+                                       _page = new wikiPageClass( _id, _title, _child, _a, _wrap, _wrap.getElementsByTagName( 'div')[1]);
+                                       !document.all && _page.fixCommentToHtml();
+                                       ret.push( _page);
+                               }
+                       }
+                       _body.removeChild( elmBuilder);
+                       
+                       return ret;
+               })(),
+               NUM_PAGE = wikiPageArray.length,
+               FRONT_ID = 'FrontPage',
+               FRONT_INDEX = getPageIndexByTitle( FRONT_ID) +1,
+               jumpArray = root.getElementsByTagName('a'),
+               hash = document.location.href.split('#')[1],
+               _jump, i;
+
+       // 
+       if( !document.all){
+               cleanElement( root);
+       }
+       root = navi = elmBuilder = null;
+
+       // build inner link
+       for( i=0; i<NUM_PAGE; ++i){
+               wikiPageArray[i].buildInnerLink();
+       }
+       
+       // externalLink
+       for( i=0, l = jumpArray.length; i<l; ++i){
+               _jump = jumpArray[i];
+               if( _jump.href.indexOf('#page') === -1 ){
+                       _jump.target = '_blank';
+                       _jump.className += ' externalLink';
+               }
+       }
+       jumpArray = _jump = null;
+       
+       // show current
+       setTimeout(
+               function(){
+                       jumpPage( hash && hash.match( /page\d/) ? hash : 'page' +FRONT_INDEX);
+                       hash = null;
+               }
+       );
+       
+       function moveElement( _targetElm){
+               var _elms = _targetElm.childNodes;
+               while( _elms.length > 0){
+                       _targetElm.removeChild( _elms[ 0]);
+               }               
+               
+               _elms = elmBuilder.childNodes;
+               while( _elms.length > 0){
+                       _targetElm.appendChild( _elms[0]);
+               }
+               cleanElement( elmBuilder);
+       }
+       function cleanElement( _targetElm){
+               var l = CLEAN_TARGET_ELEMENT.length,
+                       elms, elm, i;
+               for( i=0; i<l; ++i){
+                       elms = _targetElm.getElementsByTagName( CLEAN_TARGET_ELEMENT[ i]);
+                       while( elms.length > 0){
+                               elm = elms[ 0];
+                               elm.parentNode && elm.parentNode.removeChild( elm);
+                       }
+               }
+               if( !document.all) return;
+               elms = _targetElm.getElementsByName( '*');
+               l = elms.length;
+               for(i=0; i<l; ++i){
+                       elm = elms[ i];
+                       elm.style.filter = elm.style.behavior = '';
+               }
+       }
+       function getPageIndexByTitle( _title){
+               for(var i=0; i<NUM_PAGE; ++i){
+                       if( titleArray[ i] === _title) return i;
+               }
+               return -1;
+       }
+       function jumpPage( id){
+               var id = typeof id === 'string' ? id : this.href.split('#')[1];
+               for(var i=0; i<NUM_PAGE; ++i){
+                       wikiPageArray[i].show( id);
+               }
+               return false;
+       }
+})();
+
+
+
+/* Smooth scrolling
+   Changes links that link to other parts of this page to scroll
+   smoothly to those links rather than jump to them directly, which
+   can be a little disorienting.
+   
+   sil, http://www.kryogenix.org/
+   
+   v1.0 2003-11-11
+   v1.1 2005-06-16 wrap it up in an object
+*/
+
+var ss = {
+  fixAllLinks: function() {
+    // Get a list of all links in the page
+    var allLinks = document.getElementsByTagName('a');
+    // Walk through the list
+    for (var i=0;i<allLinks.length;i++) {
+      var lnk = allLinks[i];
+      if ((lnk.href && lnk.href.indexOf('#') != -1) && 
+          ( (lnk.pathname == location.pathname) ||
+           ('/'+lnk.pathname == location.pathname) ) && 
+          (lnk.search == location.search)) {
+        // If the link is internal to the page (begins in #)
+        // then attach the smoothScroll function as an onclick
+        // event handler
+        ss.addEvent(lnk,'click',ss.smoothScroll);
+      }
+    }
+  },
+
+  smoothScroll: function(e) {
+    // This is an event handler; get the clicked on element,
+    // in a cross-browser fashion
+    if (window.event) {
+      target = window.event.srcElement;
+    } else if (e) {
+      target = e.target;
+    } else return;
+
+    // Make sure that the target is an element, not a text node
+    // within an element
+    if (target.nodeName.toLowerCase() != 'a') {
+      target = target.parentNode;
+    }
+  
+    // Paranoia; check this is an A tag
+    if (target.nodeName.toLowerCase() != 'a') return;
+  
+    // Find the <a name> tag corresponding to this href
+    // First strip off the hash (first character)
+    anchor = target.hash.substr(1);
+    // Now loop all A tags until we find one with that name
+    var allLinks = document.getElementsByTagName('a');
+    var destinationLink = null;
+    for (var i=0;i<allLinks.length;i++) {
+      var lnk = allLinks[i];
+      if (lnk.name && (lnk.name == anchor)) {
+        destinationLink = lnk;
+        break;
+      }
+    }
+    if (!destinationLink) destinationLink = document.getElementById(anchor);
+
+    // If we didn't find a destination, give up and let the browser do
+    // its thing
+    if (!destinationLink) return true;
+  
+    // Find the destination's position
+    var destx = destinationLink.offsetLeft; 
+    var desty = destinationLink.offsetTop;
+    var thisNode = destinationLink;
+    while (thisNode.offsetParent && 
+          (thisNode.offsetParent != document.body)) {
+      thisNode = thisNode.offsetParent;
+      destx += thisNode.offsetLeft;
+      desty += thisNode.offsetTop;
+    }
+  
+    // Stop any current scrolling
+    clearInterval(ss.INTERVAL);
+  
+    cypos = ss.getCurrentYPos();
+  
+    ss_stepsize = parseInt((desty-cypos)/ss.STEPS);
+    ss.INTERVAL = setInterval('ss.scrollWindow('+ss_stepsize+','+desty+',"'+anchor+'")',10);
+
+    // And stop the actual click happening
+    if (window.event) {
+      window.event.cancelBubble = true;
+      window.event.returnValue = false;
+    }
+    if (e && e.preventDefault && e.stopPropagation) {
+      e.preventDefault();
+      e.stopPropagation();
+    }
+  },
+
+  scrollWindow: function(scramount,dest,anchor) {
+    wascypos = ss.getCurrentYPos();
+    isAbove = (wascypos < dest);
+    window.scrollTo(0,wascypos + scramount);
+    iscypos = ss.getCurrentYPos();
+    isAboveNow = (iscypos < dest);
+    if ((isAbove != isAboveNow) || (wascypos == iscypos)) {
+      // if we've just scrolled past the destination, or
+      // we haven't moved from the lpageWrapperArraycroll (i.e., we're at the
+      // bottom of the page) then scroll exactly to the link
+      window.scrollTo(0,dest);
+      // cancel the repeating timer
+      clearInterval(ss.INTERVAL);
+      // and jump to the link directly so the URL's right
+      location.hash = anchor;
+    }
+  },
+
+  getCurrentYPos: function() {
+    if (document.body && document.body.scrollTop)
+      return document.body.scrollTop;
+    if (document.documentElement && document.documentElement.scrollTop)
+      return document.documentElement.scrollTop;
+    if (window.pageYOffset)
+      return window.pageYOffset;
+    return 0;
+  },
+
+  addEvent: function(elm, evType, fn, useCapture) {
+    // addEvent and removeEvent
+    // cross-browser event handling for IE5+,  NS6 and Mozilla
+    // By Scott Andrew
+    if (elm.addEventListener){
+      elm.addEventListener(evType, fn, useCapture);
+      return true;
+    } else if (elm.attachEvent){
+      var r = elm.attachEvent("on"+evType, fn);
+      return r;
+    } else {
+      alert("Handler could not be removed");
+    }
+  }
+}
+
+ss.STEPS = 25;
+
+ss.addEvent(window,"load",ss.fixAllLinks);
diff --git a/0.3.0/wiki/wiki.xml b/0.3.0/wiki/wiki.xml
new file mode 100644 (file)
index 0000000..f58393b
--- /dev/null
@@ -0,0 +1,1798 @@
+<?xml version="1.0" encoding="utf-8" ?>\r
+<?xml-stylesheet type="text/xsl" href="wiki.xsl"?>\r
+\r
+<rdf:RDF\r
+  xmlns="http://purl.org/rss/1.0/"\r
+  xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"\r
+  xmlns:content="http://purl.org/rss/1.0/modules/content/"\r
+  xmlns:dc="http://purl.org/dc/elements/1.1/"\r
+ >\r
+\r
+  <channel rdf:about="http://sourceforge.jp/projects/pettanr/wiki/!feeds/list">\r
+    <title>ぺったんR Wiki</title>\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/!feeds/list</link>\r
+    <description>\r
+      ぺったんR プロジェクト Wiki ページ一覧    </description>\r
+        <dc:date>2012-01-07T10:06:07+09:00</dc:date>\r
+\r
+        <items>\r
+      <rdf:Seq>\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/ItoZyun" />\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/YasushiIto" />\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/ForAuthors" />\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/FrontPage" />\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/XbackendReversibleImage" />\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/AboutModels" />\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/JavascriptEditor" />\r
+\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/ChangeDoc" />\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/DatabaseSchema" />\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/SpeachBalloonsController" />\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/PanelPictureModel" />\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/ResourcePictureModel" />\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/PanelPicturesController" />\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/ForDevelopers" />\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/XbackendSpeachBalloon" />\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/HtmlAndCss2" />\r
+\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/HowToMakeSpeachBalloon" />\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/ClientSide" />\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/PngFix" />\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/ForWebmasters" />\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/AboutSpeachBalloon" />\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/JsonApi" />\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/AboutLisence" />\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/CommonLisencesController" />\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/LisencesController" />\r
+\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/RailsControllers" />\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/WhatsPettan" />\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/GuidanceForArtist" />\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/GuidanceForAuthor" />\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/TranslationComicElements" />\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/PictureIo" />\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/RmagickAndDmagick" />\r
+                <rdf:li rdf:resource="http://sourceforge.jp/projects/pettanr/wiki/InstallRubyAndRails" />\r
+              </rdf:Seq>\r
+\r
+    </items>\r
+  </channel>\r
+\r
+      <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/ItoZyun">\r
+    <title>ItoZyun</title>\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/ItoZyun</link>\r
+    <dc:identifier>ItoZyun</dc:identifier>\r
+    <dc:date>2012-01-07T10:06:07+09:00</dc:date>\r
+\r
+        <description>\r
+      <![CDATA[= クライアント側\r
+ * ユーザーログイン後の操作(マンガ管理・コマ作成・画像管理・設定)は、すべて js 有効 が前提の Ajax ページで行う.\r
+ * ログインしたユーザーのマンガ閲覧も、Ajaxページで行う.画像読み込みを非同期化して、画面外の画像の読み込みを抑止する.\r
+\r
+= javascript のクリーンアップ、圧縮\r
+== クリーンアップ\r
+javascript は、変数宣言時]]>\r
+    </description>\r
+    <content:encoded>\r
+      <![CDATA[<h1 id="h1-.E3.82.AF.E3.83.A9.E3.82.A4.E3.82.A2.E3.83.B3.E3.83.88.E5.81.B4">クライアント側</h1><ul><li>ユーザーログイン後の操作(マンガ管理・コマ作成・画像管理・設定)は、すべて js 有効 が前提の Ajax ページで行う.\r
+</li><li>ログインしたユーザーのマンガ閲覧も、Ajaxページで行う.画像読み込みを非同期化して、画面外の画像の読み込みを抑止する.\r
+</li></ul><h1 id="h1-javascript.20.E3.81.AE.E3.82.AF.E3.83.AA.E3.83.BC.E3.83.B3.E3.82.A2.E3.83.83.E3.83.97.E3.80.81.E5.9C.A7.E7.B8.AE">javascript のクリーンアップ、圧縮</h1><h2 id="h2-.E3.82.AF.E3.83.AA.E3.83.BC.E3.83.B3.E3.82.A2.E3.83.83.E3.83.97">クリーンアップ</h2><p>javascript は、変数宣言時の区切り文字や、行の終わりのセミコロンなどを間違えていても、予期したとおりに動作したりして潜在的な問題を抱えることになる.<br />\r
+以上のものは、Aptana で警告されないものも結構ある.<br />\r
+jsDo.it にアップロードすると、Webコンソールで javascript の警告を教えてくれる.<br />\r
+その警告に従って修正したところ、Aptana2 の構文解析も動くようになった.コード量が増えると勝手に構文解析も止まるのかと思っていたけど、そのようなわけだった、、、<br />\r
+</p><h2 id="h2-.E5.9C.A7.E7.B8.AE">圧縮</h2><p>以上を済ませた後に、圧縮(難読化)を行うことで、js ファイルの読み込みや動作を早くし、負荷を抑えることができる.<br />\r
+圧縮ツールには、Web アプリとして提供されているものもあって便利.<br />\r
+<a href="http://compressorrater.thruhere.net/" class="external" rel="nofollow">http://compressorrater.thruhere.net/</a> が、複数の圧縮エンジンに通した結果を比較表示してくれる.<br />\r
+現在 140KB 程度の js ファイルを 60KB 程度にすることができた.<br />\r
+ただし、その圧縮後のファイルが動かないこともあり(というかほとんど動かない、または操作中に動かなくなる)圧縮ツール用にコードを書く必要がある.<br />\r
+jsは、コードが実行される順番に変数宣言をしていけばいいのだが、圧縮ツール用には、変数の宣言を最初の変数の登場より先にしなくてはならない.<br />\r
+</p><p>変数の宣言がないままに変数が登場すると、\r
+<pre>function createPopup(){\r
+// Popup クラスから Popup インスタンスを作る.\r
+ var _popup = PopupClass.apply( {}, []);\r
+}\r
+~\r
+// Popup クラスの宣言\r
+var PopupClass = function(){};\r
+</pre>圧縮ツールは、最初に登場する <a href="http://sourceforge.jp/projects/pettanr/wiki/PopupClass">PopupClass</a> はそのまま.var <a href="http://sourceforge.jp/projects/pettanr/wiki/PopupClass">PopupClass</a>= のみ、var a= などと圧縮をかける.結果、createPopup() したときに <a href="http://sourceforge.jp/projects/pettanr/wiki/PopupClass">PopupClass</a> が未定義だよ!となる.<br />\r
+</p><ul><li>決定版はこれだ! Javascriptの圧縮、難読化ツール 比較検討 <a href="http://gogolounge.blog.shinobi.jp/Entry/4/" class="external" rel="nofollow">http://gogolounge.blog.shinobi.jp/Entry/4/</a>\r
+</li></ul><h1 id="h1-javascript.20.E3.81.AE.E3.83.A1.E3.83.A2.E3.83.AA.E3.83.AA.E3.83.BC.E3.82.AF">javascript のメモリリーク</h1><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/%E9%96%8B%E7%99%BA">開発</a>IEメモリリークの最後の壁はAjaxのonreadystatechangeやった!! <a href="http://d.hatena.ne.jp/AWAWA/20071207/1197036423" class="external" rel="nofollow">http://d.hatena.ne.jp/AWAWA/20071207/1197036423</a>\r
+</li><li>Internet Explorer リーク パターンを理解して解決する <a href="http://msdn.microsoft.com/ja-jp/library/bb250448" class="external" rel="nofollow">http://msdn.microsoft.com/ja-jp/library/bb250448</a>\r
+</li></ul><p>クロージャがまずい.<br />\r
+dom追加は、appendChild を先に.あとからプロパティをセット.<br />\r
+イベントハンドラに、グローバルで定義された 空の function を突っ込んで解除する.\r
+</p><h1 id="h1-.E3.82.B9.E3.82.BF.E3.83.B3.E3.83.89.E3.82.A2.E3.83.AD.E3.83.BC.E3.83.B3.E7.89.88.20IE.20.E3.81.AE.E9.80.9A.E5.B8.B8.E7.89.88.E3.81.A8.E7.95.B0.E3.81.AA.E3.82.8B.E6.8C.99.E5.8B.95">スタンドアローン版 IE の通常版と異なる挙動</h1><p>IETester で 条件付コメントによる、vml のインストールの有無のチェックができない挙動に遭遇.<br />\r
+vml のチェックは、現在は条件付コメントを動的に付与して行っている.(他にいい方法ないかな、、、?)\r
+<pre>VML: ( function(){\r
+       if( isIE === false || ieVersion &gt; 8) return false;\r
+       var globalObjectName = createGrobalObjectName(), script;\r
+       document.writeln( [ '&lt;!--[if gte vml 1]&gt;&lt;script type=&quot;text/javascript&quot;&gt;window.', globalObjectName,'=1;&lt;/script&gt;&lt;![endif]--&gt;'].join( ''));\r
+       if( window[ globalObjectName] === 1){\r
+               window[ globalObjectName] = undefined;\r
+               return true;\r
+       }\r
+       return false;\r
+})(),\r
+</pre></p><p>XPsp3 に IETester をインストールして 6, 7, 8 をテストできる環境にしているが、6 と 7 では、vml のチェックが働かない.<br />\r
+これは、スタンドアローン版 IE は 条件付コメントが働かない、ためと思われる.<br />\r
+一方で、8 で正しく動いているのは、8 が Windows 環境のデフォルトの ie なので通常版であるため、と思う.<br />\r
+</p><p>navigator.ua で取得したバージョンと 動的に書き出した条件付コメント(内でスクリプトを使用)が不一致だったら、スタンドアローン版として処理する.\r
+</p><ul><li>条件付コメント文の誤算 <a href="http://bopsublog.blog.shinobi.jp/Entry/15/" class="external" rel="nofollow">http://bopsublog.blog.shinobi.jp/Entry/15/</a>\r
+</li><li><a href="http://philip.html5.org/data/ccs.html" class="external" rel="nofollow">http://philip.html5.org/data/ccs.html</a>\r
+</li></ul><h1 id="h1-about.20itozyun">about itozyun</h1><ul><li>目立ちたがり屋という点でフロントエンジニアが性に合っている.\r
+</li><li>好奇心に負けて地雷を踏む性格なので、API 設計などを任せてはいけない.</li></ul>]]>\r
+    </content:encoded>\r
+      </item>\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/YasushiIto">\r
+    <title>YasushiIto</title>\r
+\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/YasushiIto</link>\r
+    <dc:identifier>YasushiIto</dc:identifier>\r
+    <dc:date>2012-01-06T19:59:29+09:00</dc:date>\r
+        <description>\r
+      <![CDATA[管理者メンテナンスページを分離\r
+\r
+= wとhにマイナスはあり?\r
+\r
+ * 逆フキダシ\r
+ * min_width&rarr;lower_limit\r
+ * フォントなど\r
+{{{\r
+       &lt;property name=&quot;fontSize&quot;/&gt;\r
+       &lt;property name=&quot;fontColor&quot;/&gt;\r
+       &lt;property]]>\r
+    </description>\r
+    <content:encoded>\r
+\r
+      <![CDATA[<p>管理者メンテナンスページを分離\r
+</p><h1 id="h1-w.E3.81.A8h.E3.81.AB.E3.83.9E.E3.82.A4.E3.83.8A.E3.82.B9.E3.81.AF.E3.81.82.E3.82.8A.EF.BC.9F">wとhにマイナスはあり?</h1><ul><li>逆フキダシ\r
+</li><li>min_width→lower_limit\r
+</li><li>フォントなど\r
+<pre>  &lt;property name=&quot;fontSize&quot;/&gt;\r
+       &lt;property name=&quot;fontColor&quot;/&gt;\r
+       &lt;property name=&quot;fontWeight&quot;/&gt;\r
+       &lt;property name=&quot;serif&quot;/&gt;\r
+       &lt;property name=&quot;way&quot;/&gt;\r
+       &lt;property name=&quot;textAlign&quot;/&gt;\r
+</pre></li><li>no_adult ?\r
+</li></ul><ul><li> → \r
+</li><li> → \r
+</li><li> → \r
+</li><li> → \r
+</li></ul>]]>\r
+    </content:encoded>\r
+      </item>\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/ForAuthors">\r
+    <title>ForAuthors</title>\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/ForAuthors</link>\r
+    <dc:identifier>ForAuthors</dc:identifier>\r
+\r
+    <dc:date>2012-01-06T19:53:55+09:00</dc:date>\r
+        <description>\r
+      <![CDATA[== 奥行きzと時間軸t\r
+コミックの各コマには奥行きと時間軸があります。\r
+\r
+奥行きとは、キャラクターの重なり順序とも言いかえることができて、CSS上ではzindexと同じ意味です。\r
+\r
+時間軸はストーリー上での時間の流れの順序で、読者がフキダシやキャラクターを目で追う順序とも言えます。コマのデータを時間軸順に並べれば、台本を読むのと同じになるイメージです。\r
+\r
+これらをコミック上で正しく]]>\r
+    </description>\r
+    <content:encoded>\r
+      <![CDATA[<h2 id="h2-.E5.A5.A5.E8.A1.8C.E3.81.8Dz.E3.81.A8.E6.99.82.E9.96.93.E8.BB.B8t">奥行きzと時間軸t</h2><p>コミックの各コマには奥行きと時間軸があります。\r
+</p><p>奥行きとは、キャラクターの重なり順序とも言いかえることができて、CSS上ではzindexと同じ意味です。\r
+</p><p>時間軸はストーリー上での時間の流れの順序で、読者がフキダシやキャラクターを目で追う順序とも言えます。コマのデータを時間軸順に並べれば、台本を読むのと同じになるイメージです。\r
+</p><p>これらをコミック上で正しく並べるために、奥行きzと時間軸tが用意してあります。奥行きに関してはエディタでビジュアルに操作している限り問題ありません。しかし、コマの外観だけを見て制作すると、時間軸は必ず正しく並ぶというわけではありません。時間軸を意識することで、より違和感のない漫画ができるとぺったんRでは考えています。画像がきれいに表示されない環境や読み上げソフトなどを使った場合は、特に効果があるはずです。\r
+</p><h2 id="h2-.E3.83.A6.E3.83.8B.E3.83.BC.E3.82.AF.E3.81.AA.E5.A5.A5.E8.A1.8C.E3.81.8D.E3.83.87.E3.83.BC.E3.82.BF.E4.BD.9C.E6.88.90">ユニークな奥行きデータ作成</h2><p>ページ内で同じzindexを持っては意味がありません。そこでzが重ならないようにデータをユニークに作成する必要があります。\r
+</p><h2 id="h2-.E3.83.A6.E3.83.8B.E3.83.BC.E3.82.AF.E3.81.AA.E6.99.82.E9.96.93.E8.BB.B8.E3.83.87.E3.83.BC.E3.82.BF.E4.BD.9C.E6.88.90">ユニークな時間軸データ作成</h2><ul><li>コマ単位でtを順序づけ。\r
+<ul><li>コミック表示など複数のコマが表示される場合は、コマ番号tからのオフセット\r
+</li><li>例えば、コマ1にオブジェクトが4つあるとき、コマ2のtは4から始まる。\r
+</li><li>コマ2に6つのオブジェクトがあるなら、コマ3のtは10から始まる。\r
+</li><li>コマ3に添付されたコマ絵のtが2なら、コマ3のt(オフセット)10+2で12\r
+<ul><li>まぁ、ここはクライアントが好きにしていい話か。別に1-2とか2-3で管理してもいいけど。\r
+</li></ul></li></ul></li><li>tは0から始まる\r
+</li><li>コマpanels内でコマ絵panel_picturesとフキダシ枠speach_balloonのtは重なっちゃだめ。両者は同じレベル。\r
+<ul><li>ただし、フキダシ枠speach_balloonの中にあるセリフspeachesは一つレベルが下。セリフspeachesのtは一つのフキダシ枠speach_balloonの中でユニーク。ほとんどのフキダシにはセリフスペースは一個しかないから、多段フキダシを除けばspeaches.tは常に0。\r
+</li></ul></li></ul>]]>\r
+    </content:encoded>\r
+      </item>\r
+\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/FrontPage">\r
+    <title>FrontPage</title>\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/FrontPage</link>\r
+    <dc:identifier>FrontPage</dc:identifier>\r
+    <dc:date>2012-01-06T18:30:57+09:00</dc:date>\r
+        <description>\r
+      <![CDATA[= ぺったんRのWiki =\r
+[[Embed(http://static.sourceforge.jp/thumb/g/2/926/640x640_0.png)]]\r
+== ぺったんRって何だってばよ?\r
+ぺったんを参考に、より使い勝手の良い漫画作成ツールを作ろうとしている。Rの意味はみなさんで勝手に想像してください。\r
+\r
+参考\r
+ * http://sourceforge.jp/projec]]>\r
+\r
+    </description>\r
+    <content:encoded>\r
+      <![CDATA[<h1 id="h1-.E3.81.BA.E3.81.A3.E3.81.9F.E3.82.93R.E3.81.AEWiki">ぺったんRのWiki</h1><img src="http://static.sourceforge.jp/thumb/g/2/926/640x640_0.png" alt="640x640_0.png" id="emb-http:2f2fstatic.sourceforge.jp2fthumb2fg2f22f9262f640x640_0.png-1" title="640x640_0.png" class="embed-image"><p>\r
+</p><h2 id="h2-.E3.81.BA.E3.81.A3.E3.81.9F.E3.82.93R.E3.81.A3.E3.81.A6.E4.BD.95.E3.81.A0.E3.81.A3.E3.81.A6.E3.81.B0.E3.82.88.EF.BC.9F">ぺったんRって何だってばよ?</h2><p>ぺったんを参考に、より使い勝手の良い漫画作成ツールを作ろうとしている。Rの意味はみなさんで勝手に想像してください。\r
+</p><p>参考\r
+</p><ul><li><a href="http://sourceforge.jp/projects/pettan/">http://sourceforge.jp/projects/pettan/</a>\r
+</li><li><a href="http://sourceforge.jp/projects/pettanoss/">http://sourceforge.jp/projects/pettanoss/</a>\r
+</li></ul><p>より詳しくは<a href="http://sourceforge.jp/projects/pettanr/wiki/WhatsPettan">WhatsPettan</a>\r
+</p><h2 id="h2-.E3.81.BA.E3.81.A3.E3.81.9F.E3.82.93R.E3.81.AE.E7.9B.AE.E6.A8.99">ぺったんRの目標</h2><h3 id="h3-.E7.B7.8F.E5.90.88.E7.9B.AE.E6.A8.99">総合目標</h3><ul><li>漫画形式の表現がブラウザだけでできる\r
+</li><li>漫画形式のブログを簡単に始められる\r
+</li><li>漫画形式のSNSを簡単に始められる\r
+</li><li>漫画形式の記事をブログに埋め込める\r
+</li><li>その他あらゆるwebページに最小限の労力で漫画を表示できる\r
+</li></ul><h3 id="h3-.E9.96.8B.E7.99.BA.E7.9B.AE.E6.A8.99">開発目標</h3><ul><li>ぺったんR Web API\r
+</li><li>ぺったんR Web API に対応した、ひとつ以上のサーバ側実装\r
+</li><li>ぺったんR Web API に対応した、ひとつ以上のクライアント側実装\r
+</li><li>ぺったんR をお試しできる Web サービスの運営\r
+</li></ul><h2 id="h2-.E7.8F.BE.E5.9C.A8.E3.81.AE.E7.8A.B6.E6.B3.81">現在の状況</h2><ul><li>プロトタイプ作成中。 <a href="http://pettanr.heroku.com/" class="external" rel="nofollow">http://pettanr.heroku.com/</a>\r
+</li><li>プロジェクト Web サイトの制作中 <a href="http://pettanr.sourceforge.jp/index.html" class="external" rel="nofollow">http://pettanr.sourceforge.jp/index.html</a>\r
+</li></ul><h2 id="h2-.E9.96.8B.E7.99.BA.E8.80.85.E5.90.91.E3.81.91.E3.83.89.E3.82.AD.E3.83.A5.E3.83.A1.E3.83.B3.E3.83.88">開発者向けドキュメント</h2><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/ForDevelopers">ForDevelopers</a>\r
+</li></ul><h2 id="h2-.E7.B7.A8.E9.9B.86.E9.95.B7.E5.90.91.E3.81.91.E3.83.89.E3.82.AD.E3.83.A5.E3.83.A1.E3.83.B3.E3.83.88">編集長向けドキュメント</h2><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/ForWebmasters">ForWebmasters</a>\r
+</li></ul><h2 id="h2-.E4.BD.9C.E5.AE.B6.E5.90.91.E3.81.91.E3.83.89.E3.82.AD.E3.83.A5.E3.83.A1.E3.83.B3.E3.83.88">作家向けドキュメント</h2><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/ForAuthors">ForAuthors</a>\r
+</li></ul><h2 id="h2-.E5.90.84.E8.87.AA.E3.81.AE.E3.83.A1.E3.83.A2">各自のメモ</h2><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/YasushiIto">YasushiIto</a>\r
+</li><li><a href="http://sourceforge.jp/projects/pettanr/wiki/ItonZyun">ItonZyun</a>\r
+</li></ul><h2 id="h2-.E8.B3.87.E6.96.99.E3.83.BB.E3.83.9E.E3.83.B3.E3.82.AC.E8.A6.81.E7.B4.A0.E3.81.AE.E6.97.A5.E8.8B.B1.E5.AF.BE.E8.A8.B3">資料・マンガ要素の日英対訳</h2><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/TranslationComicElements">TranslationComicElements</a>\r
+</li></ul><script src="/projects/pettanr/files/compact.js" type="text/javascript" charset="utf-8"></script>\r
+<div class="dashboard-widget"><h3 class="titlebar">最近のチケット一覧</h3><div class="dashboard-body"><div class="noent">(empty)</div></div></div>\r
+]]>\r
+    </content:encoded>\r
+      </item>\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/XbackendReversibleImage">\r
+    <title>XbackendReversibleImage</title>\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/XbackendReversibleImage</link>\r
+\r
+    <dc:identifier>XbackendReversibleImage</dc:identifier>\r
+    <dc:date>2012-01-06T08:09:10+09:00</dc:date>\r
+        <description>\r
+      <![CDATA[= クロスバックエンドな反転画像機能\r
+[[Embed(http://static.sourceforge.jp/thumb/g/2/933/640x640_0.png)]]\r
+ぺったん運営時から、画像を反転させて使用したい、という要望はあった.[[BR]]\r
+とくにキャラクター画像を左右に反転させたい、という要望だ.[[BR]]\r
+\r
+ぺったんR では、その反転に取り組む.[[BR]]\r
+サーバ]]>\r
+    </description>\r
+    <content:encoded>\r
+      <![CDATA[<h1 id="h1-.E3.82.AF.E3.83.AD.E3.82.B9.E3.83.90.E3.83.83.E3.82.AF.E3.82.A8.E3.83.B3.E3.83.89.E3.81.AA.E5.8F.8D.E8.BB.A2.E7.94.BB.E5.83.8F.E6.A9.9F.E8.83.BD">クロスバックエンドな反転画像機能</h1><img src="http://static.sourceforge.jp/thumb/g/2/933/640x640_0.png" alt="640x640_0.png" id="emb-http:2f2fstatic.sourceforge.jp2fthumb2fg2f22f9332f640x640_0.png-1" title="640x640_0.png" class="embed-image"><p>\r
+ぺったん運営時から、画像を反転させて使用したい、という要望はあった.[[BR]]\r
+<br />とくにキャラクター画像を左右に反転させたい、という要望だ.[[BR]]\r
+<br /></p><p>ぺったんR では、その反転に取り組む.[[BR]]\r
+<br />サーバー側での反転画像の準備と、ブラウザでのクロスバックエンドな対応、という二段構えだ.[[BR]]\r
+<br /></p><h2 id="h2-.E3.83.96.E3.83.A9.E3.82.A6.E3.82.B6.E5.81.B4.E3.81.A7.E3.81.AE.E3.82.AF.E3.83.AD.E3.82.B9.E3.83.90.E3.83.83.E3.82.AF.E3.82.A8.E3.83.B3.E3.83.89.E3.81.AA.E5.8F.8D.E8.BB.A2.E8.A1.A8.E7.A4.BA">ブラウザ側でのクロスバックエンドな反転表示</h2><h3 id="h3-.E3.81.AF.E3.81.98.E3.82.81.E3.81.AB">はじめに</h3><p>ブラウザのネイティブな反転表示機能(css3)および、ブラウザの独自拡張や Flash 等のプラグインを使用する.[[BR]]\r
+<br />これらの機能をサポートしない、または切っているブラウザは、サーバー側で生成した画像を利用することになる.[[BR]]\r
+<br />ブラウザ側でなるべく画像を用意しサーバーへの負荷を極力抑えます.\r
+</p><h3 id="h3-.E4.BD.BF.E7.94.A8.E3.81.99.E3.82.8B.E3.83.90.E3.83.83.E3.82.AF.E3.82.A8.E3.83.B3.E3.83.89">使用するバックエンド</h3><h4 id="h4-css3">css3</h4><p>例\r
+<pre>img.img-flip-v { /* 上下反転 */\r
+       transform:              scale( 1, -1);\r
+       -o-transform:           scale( 1, -1);\r
+       -ms-transform:          scale( 1, -1);\r
+       -moz-transform:         scale( 1, -1);\r
+       -webkit-transform:      scale( 1, -1);\r
+}      \r
+img.img-flip-h { /* 左右反転 */\r
+       transform:              scale( -1, 1);\r
+       -o-transform:           scale( -1, 1);\r
+       -ms-transform:          scale( -1, 1);\r
+       -moz-transform:         scale( -1, 1);\r
+       -webkit-transform:      scale( -1, 1);\r
+}\r
+img.img-flip-vh { /* 上下左右反転 */\r
+       transform:              scale( -1, -1);\r
+       -o-transform:           scale( -1, -1);\r
+       -ms-transform:          scale( -1, -1);\r
+       -moz-transform:         scale( -1, -1);\r
+       -webkit-transform:      scale( -1, -1);\r
+}\r
+</pre></p><h4 id="h4-VML">VML</h4><p>例\r
+<pre>v\:image.img-flip-v {\r
+       flip:                   y; /* vml */\r
+}\r
+v\:image.img-flip-h {\r
+       flip:                   x; /* vml */\r
+}v\:image.img-flip-vh {\r
+       rotation :              180; /* vml */\r
+}\r
+</pre>ie独自拡張の VML が ie6~8 での反転画像の本命となる.上記のように vml 用の css も使える.(ただし js による css の適用にくせがある.)[[BR]]\r
+<br />VML で表示された画像は、ie6 以下にある透過 png の問題も解消される.(但し ie6 のみ.ie5.5 以下では透過表示が不十分)[[BR]]\r
+<br /></p><blockquote class="citation"><p>Windows版 IE 5以降の VMLレンダラで半透明、透過PNGを表示する[[BR]]\r
+<br /><a href="http://www.minc.ne.jp/~konda/new/png/urawaza04.html" class="external" rel="nofollow">http://www.minc.ne.jp/~konda/new/png/urawaza04.html</a><br />\r
+IE 5 及び 5.5 (5.50.4133.200)の vgx.dll(Microsoft Vector Graphics Rendering(VML))は、Beta バージョンですから 半透明系は、以下の画像の様に擬似半透明表示(ディザリング)されます\r
+</p></blockquote><pre>&lt;!--[if !gte vml 1]&gt;&lt;!--&gt;&lt;img src=&quot;*.png&quot; width=&quot;*&quot; height=&quot;*&quot; alt=&quot;*&quot; /&gt;&lt;!--&lt;![endif]--&gt;\r
+&lt;!--[if gte vml 1]&gt;&lt;v:image src=&quot;*.png&quot; style=&quot;width: *px; height: *px; behavior: url(#default#vml)&quot; alt=&quot;*&quot; /&gt;&lt;![endif]--&gt;\r
+</pre><p>さらに、ActiveX よりも動作が速い(らしい).[[BR]]\r
+<br />但し VML は windows の構成によってはインストールされていない場合があり、必ずしも使えるわけではない.[[BR]]\r
+<br />itozyun の環境のひとつでも VML が使えなかった.nlite で削ってしまったためと思われる.\r
+</p><h3 id="h3-SVG">SVG</h3><p>svg な xml を js で作って data スキームで読み込む。Opera8+ でも画像反転できるかも。Opera9.6 で静的に埋め込んだ以上の html では反転表示ができた。ただし Firefox3.6 Chrome8 では表示できない。[[BR]]\r
+<br />dataスキームになった svg に対しては、画像の url を絶対座標で与える。\r
+svg を html に直接埋め込む方式では、なぜか手元で一度も成功していない。\r
+<pre>&lt;?xml version=&quot;1.0&quot;?&gt;\r
+&lt;!DOCTYPE svg PUBLIC &quot;-//W3C//DTD SVG 1.1//EN&quot; &quot;http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd&quot;&gt;\r
+&lt;svg xmlns=&quot;http://www.w3.org/2000/svg&quot; version=&quot;1.1&quot; xmlns:xlink=&quot;http://www.w3.org/1999/xlink&quot; width=&quot;200&quot; height=&quot;200&quot;&gt;\r
+&lt;image x=&quot;0&quot; y=&quot;0&quot; width=&quot;200&quot; height=&quot;200&quot; xlink:href=&quot;1.gif&quot; transform=&quot;scale(-1,1) translate(-200,0)&quot; /&gt;\r
+&lt;/svg&gt;\r
+</pre></p><ul><li><a href="http://software.hixie.ch/utilities/cgi/data/data" class="external" rel="nofollow">http://software.hixie.ch/utilities/cgi/data/data</a>\r
+</li><li>サイトの表示スピードを改善!dataスキームURIを使った画像の埋め込み http://labs.cybridge.jp/2011/12/data-uri.html\r
+<a href="http://labs.cybridge.jp/2011/12/data-uri.html" class="external" rel="nofollow">http://labs.cybridge.jp/2011/12/data-uri.html</a><ul><li>データスキーム対応ブラウザ \r
+</li><li>Firefox2+\r
+</li><li>Safari\r
+</li><li>Chrome\r
+</li><li>Opera7.2+\r
+</li><li>IE8+\r
+</li></ul></li></ul><pre>&lt;img src=&quot;data:image/svg+xml;charset=utf-8,%3c%3fxml%20version%3d%221.0%22%3f%3e%3c!DOCTYPE%20svg%20PUBLIC%20%22-%2f%2fW3C%2f%2fDTD%20SVG%201.1%2f%2fEN%22%20%22http%3a%2f%2fwww.w3.org%2fGraphics%2fSVG%2f1.1%2fDTD%2fsvg11.dtd%22%3e%3csvg%20xmlns%3d%22http%3a%2f%2fwww.w3.org%2f2000%2fsvg%22%20version%3d%221.1%22%20xmlns%3axlink%3d%22http%3a%2f%2fwww.w3.org%2f1999%2fxlink%22%20width%3d%22200%22%20height%3d%22200%22%3e%3cimage%20x%3d%220%22%20y%3d%220%22%20width%3d%22200%22%20height%3d%22200%22%20xlink%3ahref%3d%22http%3a%2f%2fstatic.sourceforge.jp%2fthumb%2fg%2f2%2f930%2f640x640_0.png%22%20transform%3d%22scale(-1%2c1)%20translate(-200%2c0)%22%20%2f%3e%3c%2fsvg%3e&quot;&gt;\r
+</pre><h4 id="h4-ActiveX">ActiveX</h4><pre>img.img-flip-v { /* 上下反転 */\r
+       filter:                 progid:DXImageTransform.Microsoft.BasicImage( Mirror=1, Rotation=2);\r
+       -ms-filter:             progid:DXImageTransform.Microsoft.BasicImage( Mirror=1, Rotation=2);\r
+}\r
+img.img-flip-h { /* 左右反転 */\r
+       filter:                 progid:DXImageTransform.Microsoft.BasicImage( Mirror=1);\r
+       -ms-filter:             progid:DXImageTransform.Microsoft.BasicImage( Mirror=1);\r
+}\r
+img.img-flip-vh { /* 上下左右反転 */\r
+       filter:                 progid:DXImageTransform.Microsoft.BasicImage( Rotation=2);\r
+       -ms-filter:             progid:DXImageTransform.Microsoft.BasicImage( Rotation=2);\r
+}\r
+</pre><p>ActiveX は、ie6 以下のための pngfix にも使いたいが、反転とAlpha Image Loader を同時に使用することはできない.[[BR]]\r
+<br />ie6では、ActiveX による反転は、png 画像に対しては使用できない.\r
+</p><h4 id="h4-Flash">Flash</h4><p>クロスドメインな画像に対しても、読み込み、反転表示は行える.[[BR]]\r
+<br />なるべく バージョンの古い Flash で用意してサポート範囲を広くしたいが、js と連携する ExternalInterface が使えなくなったりと多難かもしれない.\r
+<a href="http://sourceforge.jp/projects/pettanr/wiki/ExternalInterface">ExternalInterface</a></p><h4 id="h4-Canvas">Canvas</h4><p>同一ドメインの画像のみになるが、画像のピクセルデータを取得し反転しつつ描画することができる.[[BR]]\r
+<br /></p><blockquote class="citation"><p>Canvasによる画像ファイル(img要素)の読み書き[[BR]]\r
+<br /><a href="http://www.programmingmat.jp/webhtml_lab/canvas_image.html" class="external" rel="nofollow">http://www.programmingmat.jp/webhtml_lab/canvas_image.html</a>\r
+</p></blockquote><h4 id="h4-Silverlight">Silverlight</h4><h4 id="h4-.E3.82.B5.E3.83.BC.E3.83.90.E3.83.BC.E3.82.B5.E3.82.A4.E3.83.89.E7.94.BB.E5.83.8F">サーバーサイド画像</h4><p>サーバー側で反転画像を用する.このサーバ画像へのアクセスを極力減らすのが、X Backend Imageの目的のひとつ.\r
+<pre>picture/001.png\r
+picture/v/001.png\r
+picture/h/001.png\r
+picture/vh/001.png\r
+</pre></p><h3 id="h3-.E3.83.96.E3.83.A9.E3.82.A6.E3.82.B6.E6.A9.9F.E8.83.BD.E5.AF.BE.E5.BF.9C.E8.A1.A8">ブラウザ機能対応表</h3><table class="wikitable" border="1"><tbody><tr><td>バックエンド</td><td>ie5+5.5</td><td>ie6</td><td>ie7 &amp; 8</td><td>ie9+</td><td>FF</td><td>Safari</td><td>Chrome</td><td>Opera</td></tr><tr><td>CSS3:transform</td><td>×</td><td>×</td><td>×</td><td>○</td><td>3.5+</td><td>3.1+(?)</td><td>1+</td><td>10.5+</td></tr><tr><td>VML</td><td>▲透過pngの表示が汚い</td><td>△</td><td>△環境による</td><td>?</td><td>×</td><td>×</td><td>×</td><td>×</td></tr><tr><td>Canvas</td><td>×</td><td>×</td><td>×</td><td>○</td><td>1.5+</td><td>1.3+</td><td>1+</td><td>9+</td></tr><tr><td>SVG +DATAスキーム</td><td>×</td><td>×</td><td>×</td><td>?</td><td>?</td><td>?</td><td>?</td><td>8+(?)</td></tr><tr><td>サーバー画像</td><td>△</td><td>△要pngfix</td><td>○</td><td>○</td><td>○</td><td>○</td><td>○</td><td>○</td></tr></tbody></table>]]>\r
+    </content:encoded>\r
+\r
+      </item>\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/AboutModels">\r
+    <title>AboutModels</title>\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/AboutModels</link>\r
+    <dc:identifier>AboutModels</dc:identifier>\r
+    <dc:date>2012-01-05T17:49:46+09:00</dc:date>\r
+        <description>\r
+\r
+      <![CDATA[= ER図\r
+下記のページを参考にすれば生成できるはずだが、Windows環境では画像に落とせない。\r
+\r
+ * http://sawada0903.blogspot.com/2010/10/rails30er.html\r
+ * http://rails-erd.rubyforge.org/install.html\r
+\r
+出力されるERD.dotはdotっていうグラフ描画ツールのマクロ。\r
+\r
+G]]>\r
+    </description>\r
+    <content:encoded>\r
+      <![CDATA[<h1 id="h1-ER.E5.9B.B3">ER図</h1><p>下記のページを参考にすれば生成できるはずだが、Windows環境では画像に落とせない。\r
+</p><ul><li><a href="http://sawada0903.blogspot.com/2010/10/rails30er.html" class="external" rel="nofollow">http://sawada0903.blogspot.com/2010/10/rails30er.html</a>\r
+</li><li><a href="http://rails-erd.rubyforge.org/install.html" class="external" rel="nofollow">http://rails-erd.rubyforge.org/install.html</a>\r
+</li></ul><p>出力されるERD.dotはdotっていうグラフ描画ツールのマクロ。\r
+</p><p><a href="http://sourceforge.jp/projects/pettanr/wiki/GraphViz">GraphViz</a>のbinにdot.exeがあるからこれで画像にできる\r
+<pre>dot.exe -Tgif ERD.dot &gt; erd.gif\r
+</pre></p><h1 id="h1-.E3.83.86.E3.83.BC.E3.83.96.E3.83.AB.E3.81.A8.E3.82.AB.E3.83.A9.E3.83.A0">テーブルとカラム</h1><h2 id="h2-admins.20.E7.AE.A1.E7.90.86.E8.80.85">admins 管理者</h2><table class="wikitable" border="1"><tbody><tr><td>name</td><td>和名</td><td>type</td><td>default</td><td>null</td><td>limit</td><td>note</td></tr><tr><td>email</td><td></td><td>string</td><td>  </td><td>FALSE</td><td> </td><td></td></tr><tr><td>encrypted_password</td><td></td><td>string</td><td> </td><td>FALSE</td><td>128</td><td></td></tr><tr><td>reset_password_token</td><td></td><td>string</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>reset_password_sent_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>remember_created_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>sign_in_count</td><td></td><td>integer</td><td>0</td><td> </td><td> </td><td></td></tr><tr><td>current_sign_in_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>last_sign_in_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>current_sign_in_ip</td><td></td><td>string</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>last_sign_in_ip</td><td></td><td>string</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>confirmation_token</td><td></td><td>string</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>confirmed_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>confirmation_sent_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>created_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>updated_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr></tbody></table><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/AdminModel">AdminModel</a>\r
+</li></ul><h2 id="h2-artists.20.E7.B5.B5.E5.B8.AB">artists 絵師</h2><table class="wikitable" border="1"><tbody><tr><td>name</td><td>和名</td><td>type</td><td>default</td><td>null</td><td>limit</td><td>note</td></tr><tr><td>email</td><td></td><td>string</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>name</td><td>ペンネーム</td><td>string</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>homepage_url</td><td>ホームページURL</td><td>string</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>api_url</td><td>素材配布APIのURL</td><td>string</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>default_lisence_id</td><td>省略時のライセンスid</td><td>integer</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>crowled_at</td><td>素材配布APIの最新呼び出し時刻</td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>created_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>updated_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>author_id</td><td>作家id</td><td>integer</td><td> </td><td> </td><td> </td><td></td></tr></tbody></table><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/ArtistModel">ArtistModel</a>\r
+</li></ul><h2 id="h2-authors.20.E4.BD.9C.E5.AE.B6">authors 作家</h2><table class="wikitable" border="1"><tbody><tr><td>name</td><td>和名</td><td>type</td><td>default</td><td>null</td><td>limit</td><td>note</td></tr><tr><td>name</td><td>ペンネーム</td><td>string</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>email</td><td>メールアドレス</td><td>string</td><td>  </td><td>FALSE</td><td> </td><td></td></tr><tr><td>encrypted_password</td><td></td><td>string</td><td> </td><td>FALSE</td><td>128</td><td></td></tr><tr><td>reset_password_token</td><td></td><td>string</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>reset_password_sent_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>remember_created_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>sign_in_count</td><td></td><td>integer</td><td>0</td><td> </td><td> </td><td></td></tr><tr><td>current_sign_in_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>last_sign_in_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>current_sign_in_ip</td><td></td><td>string</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>last_sign_in_ip</td><td></td><td>string</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>authentication_token</td><td></td><td>string</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>confirmation_token</td><td></td><td>string</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>confirmed_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>confirmation_sent_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>created_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>updated_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr></tbody></table><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/AuthorModel">AuthorModel</a>\r
+</li></ul><h2 id="h2-balloon_templates.20.E3.83.95.E3.82.AD.E3.83.80.E3.82.B7.E6.9E.A0.E3.83.86.E3.83.B3.E3.83.97.E3.83.AC.E3.83.BC.E3.83.88">balloon_templates フキダシ枠テンプレート</h2><table class="wikitable" border="1"><tbody><tr><td>name</td><td>和名</td><td>type</td><td>default</td><td>null</td><td>limit</td><td>note</td></tr><tr><td>speach_balloon_id</td><td>フキダシテンプレートid</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>system_picture_id</td><td>フキダシ素材id</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>tail</td><td>尻尾の向き</td><td>integer</td><td>1</td><td>FALSE</td><td> </td><td></td></tr><tr><td>size</td><td>サイズのバリエーション</td><td>integer</td><td>1</td><td>FALSE</td><td> </td><td></td></tr><tr><td>min_width</td><td>サイズ切り替えしきい値</td><td>integer</td><td>0</td><td>FALSE</td><td> </td><td></td></tr><tr><td>max_width</td><td>サイズ切り替えしきい値</td><td>integer</td><td>0</td><td>FALSE</td><td> </td><td></td></tr><tr><td>min_height</td><td>サイズ切り替えしきい値</td><td>integer</td><td>0</td><td>FALSE</td><td> </td><td></td></tr><tr><td>max_height</td><td>サイズ切り替えしきい値</td><td>integer</td><td>0</td><td>FALSE</td><td> </td><td></td></tr><tr><td>created_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>updated_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr></tbody></table><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/BallonTemplateModel">BallonTemplateModel</a>\r
+</li></ul><h2 id="h2-balloons.20.E3.83.95.E3.82.AD.E3.83.80.E3.82.B7">balloons フキダシ</h2><table class="wikitable" border="1"><tbody><tr><td>name</td><td>和名</td><td>type</td><td>default</td><td>null</td><td>limit</td><td>note</td></tr><tr><td>panel_id</td><td>所属パネルid</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>balloon_template_id</td><td>フキダシ枠テンプレート種id</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>system_picture_id</td><td>フキダシ素材id</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>tail</td><td>尻尾の向き</td><td>integer</td><td>1</td><td>FALSE</td><td> </td><td></td></tr><tr><td>size</td><td>サイズのバリエーション</td><td>integer</td><td>1</td><td>FALSE</td><td> </td><td></td></tr><tr><td>x</td><td>表示開始位置x</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>y</td><td>表示開始位置y</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>z</td><td>表示順位</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>t</td><td>時間軸 順序</td><td>integer</td><td>1</td><td>false</td><td> </td><td> </td></tr><tr><td>width</td><td>表示幅</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>height</td><td>表示高さ</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>created_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>updated_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr></tbody></table><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/BalloonModel">BalloonModel</a>\r
+</li></ul><h2 id="h2-comics.20.E3.82.B3.E3.83.9F.E3.83.83.E3.82.AF">comics コミック</h2><table class="wikitable" border="1"><tbody><tr><td>name</td><td>和名</td><td>type</td><td>default</td><td>null</td><td>limit</td><td>note</td></tr><tr><td>title</td><td>作品名</td><td>string</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>width</td><td>コマの幅デフォルト値</td><td>integer</td><td>200</td><td>FALSE</td><td> </td><td></td></tr><tr><td>height</td><td>コマの高さデフォルト値</td><td>integer</td><td>80</td><td>FALSE</td><td> </td><td></td></tr><tr><td>visible</td><td>公開フラグ</td><td>integer</td><td>0</td><td>false</td><td> </td><td>可視範囲 0:本人のみ 1:友人まで 2:ユーザまで 3:誰でも</td></tr><tr><td>editable</td><td>編集フラグ</td><td>integer</td><td>0</td><td>false</td><td> </td><td>許可範囲 0:本人のみ 1:友人まで 2:ユーザまで 3:誰でも</td></tr><tr><td>author_id</td><td>作者の作家id</td><td>integer</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>created_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>updated_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr></tbody></table><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/ComicModel">ComicModel</a>\r
+</li></ul><h2 id="h2-common_lisences.20.E3.82.B3.E3.83.A2.E3.83.B3.E3.83.A9.E3.82.A4.E3.82.BB.E3.83.B3.E3.82.B9">common_lisences コモンライセンス</h2><table class="wikitable" border="1"><tbody><tr><td>name</td><td>和名</td><td>type</td><td>default</td><td>null</td><td>limit</td><td>note</td></tr><tr><td>lisence_id</td><td>ライセンスid</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>name</td><td>ライセンス名</td><td>string</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>url</td><td>条項ページURL</td><td>string</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>cc_by</td><td>クリエイティブコモンズBYフラグ</td><td>integer</td><td>0</td><td>FALSE</td><td> </td><td></td></tr><tr><td>cc_sa</td><td>クリエイティブコモンズSAフラグ</td><td>integer</td><td>0</td><td>FALSE</td><td> </td><td></td></tr><tr><td>cc_nd</td><td>クリエイティブコモンズNDフラグ</td><td>integer</td><td>0</td><td>FALSE</td><td> </td><td></td></tr><tr><td>cc_nc</td><td>クリエイティブコモンズNCフラグ</td><td>integer</td><td>0</td><td>FALSE</td><td> </td><td></td></tr><tr><td>no_resize</td><td>サイズ変更不可フラグ</td><td>integer</td><td>0</td><td>FALSE</td><td> </td><td></td></tr><tr><td>no_flip</td><td>反転不可フラグ</td><td>integer</td><td>0</td><td>FALSE</td><td> </td><td></td></tr><tr><td>no_convert</td><td>フォーマット・色合い変換の禁止</td><td>integer</td><td> </td><td> </td><td> </td><td> </td></tr><tr><td>keep_aspect_ratio</td><td>縦横比変更不可フラグ</td><td>integer</td><td>0</td><td>FALSE</td><td> </td><td></td></tr><tr><td>created_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>updated_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr></tbody></table><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/CommonLisenceModel">CommonLisenceModel</a>\r
+</li></ul><h2 id="h2-lisences.20.E3.83.A9.E3.82.A4.E3.82.BB.E3.83.B3.E3.82.B9">lisences ライセンス</h2><table class="wikitable" border="1"><tbody><tr><td>name</td><td>和名</td><td>type</td><td>default</td><td>null</td><td>limit</td><td>note</td></tr><tr><td>name</td><td>ライセンス名</td><td>string</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>url</td><td>条項ページURL</td><td>string</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>cc_by</td><td>クリエイティブコモンズBYフラグ</td><td>integer</td><td>0</td><td>FALSE</td><td> </td><td></td></tr><tr><td>cc_sa</td><td>クリエイティブコモンズSAフラグ</td><td>integer</td><td>0</td><td>FALSE</td><td> </td><td></td></tr><tr><td>cc_nd</td><td>クリエイティブコモンズNDフラグ</td><td>integer</td><td>0</td><td>FALSE</td><td> </td><td></td></tr><tr><td>cc_nc</td><td>クリエイティブコモンズNCフラグ</td><td>integer</td><td>0</td><td>FALSE</td><td> </td><td></td></tr><tr><td>no_resize</td><td>サイズ変更不可フラグ</td><td>integer</td><td>0</td><td>FALSE</td><td> </td><td></td></tr><tr><td>no_flip</td><td>反転不可フラグ</td><td>integer</td><td>0</td><td>FALSE</td><td> </td><td></td></tr><tr><td>no_convert</td><td>フォーマット・色合い変換の禁止</td><td>integer</td><td> </td><td> </td><td> </td><td> </td></tr><tr><td>keep_aspect_ratio</td><td>縦横比変更不可フラグ</td><td>integer</td><td>0</td><td>FALSE</td><td> </td><td></td></tr><tr><td>created_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>updated_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr></tbody></table><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/LisenceModel">LisenceModel</a>\r
+</li></ul><h2 id="h2-original_lisences.20.E3.82.AA.E3.83.AA.E3.82.B8.E3.83.8A.E3.83.AB.E3.83.A9.E3.82.A4.E3.82.BB.E3.83.B3.E3.82.B9">original_lisences オリジナルライセンス</h2><table class="wikitable" border="1"><tbody><tr><td>name</td><td>和名</td><td>type</td><td>default</td><td>null</td><td>limit</td><td>note</td></tr><tr><td>artist_id</td><td>ライセンス策定者 絵師id</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>lisence_id</td><td>ライセンスid</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>name</td><td>ライセンス名</td><td>string</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>url</td><td>条項ページURL</td><td>string</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>cc_by</td><td>クリエイティブコモンズBYフラグ</td><td>integer</td><td>0</td><td>FALSE</td><td> </td><td></td></tr><tr><td>cc_sa</td><td>クリエイティブコモンズSAフラグ</td><td>integer</td><td>0</td><td>FALSE</td><td> </td><td></td></tr><tr><td>cc_nd</td><td>クリエイティブコモンズNDフラグ</td><td>integer</td><td>0</td><td>FALSE</td><td> </td><td></td></tr><tr><td>cc_nc</td><td>クリエイティブコモンズNCフラグ</td><td>integer</td><td>0</td><td>FALSE</td><td> </td><td></td></tr><tr><td>no_resize</td><td>サイズ変更不可フラグ</td><td>integer</td><td>0</td><td>FALSE</td><td> </td><td></td></tr><tr><td>no_flip</td><td>反転不可フラグ</td><td>integer</td><td>0</td><td>FALSE</td><td> </td><td></td></tr><tr><td>no_convert</td><td>フォーマット・色合い変換の禁止</td><td>integer</td><td> </td><td> </td><td> </td><td> </td></tr><tr><td>keep_aspect_ratio</td><td>縦横比変更不可フラグ</td><td>integer</td><td>0</td><td>FALSE</td><td> </td><td></td></tr><tr><td>created_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>updated_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr></tbody></table><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/OriginalLisenceModel">OriginalLisenceModel</a>\r
+</li></ul><h2 id="h2-original_pictures.20.E5.8E.9F.E7.94.BB">original_pictures 原画</h2><table class="wikitable" border="1"><tbody><tr><td>name</td><td>和名</td><td>type</td><td>default</td><td>null</td><td>limit</td><td>note</td></tr><tr><td>ext</td><td>画像フォーマット</td><td>string</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>width</td><td>幅ピクセル数</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>height</td><td>高さピクセル数</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>filesize</td><td>画像サイズ</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>artist_id</td><td>投稿者 絵師id</td><td>integer</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>lisence_id</td><td>付与ライセンスid</td><td>integer</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>created_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>updated_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr></tbody></table><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/OriginalPictureModel">OriginalPictureModel</a>\r
+</li></ul><h2 id="h2-system_pictures.20.E3.82.B7.E3.82.B9.E3.83.86.E3.83.A0.E7.94.BB.E5.83.8F">system_pictures システム画像</h2><table class="wikitable" border="1"><tbody><tr><td>name</td><td>和名</td><td>type</td><td>default</td><td>null</td><td>limit</td><td>note</td></tr><tr><td>ext</td><td>画像フォーマット</td><td>string</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>width</td><td>幅ピクセル数</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>height</td><td>高さピクセル数</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>filesize</td><td>画像サイズ</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>created_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>updated_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr></tbody></table><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/SystemPictureModel">SystemPictureModel</a>\r
+</li></ul><h2 id="h2-panel_pictures.20.E3.82.B3.E3.83.9E.E7.B5.B5">panel_pictures コマ絵</h2><table class="wikitable" border="1"><tbody><tr><td>name</td><td>和名</td><td>type</td><td>default</td><td>null</td><td>limit</td><td>note</td></tr><tr><td>panel_id</td><td>所属パネル</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>resource_picture_id</td><td>素材id</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>link</td><td>リンク</td><td>string</td><td> </td><td> </td><td>200</td><td>参照するページをリンクできる</td></tr><tr><td>x</td><td>表示開始位置x</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>y</td><td>表示開始位置y</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>z</td><td>表示順位</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>t</td><td>時間軸 順序</td><td>integer</td><td>1</td><td>false</td><td> </td><td> </td></tr><tr><td>width</td><td>コマ絵の幅</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>height</td><td>コマ絵の高さ</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>flipv</td><td>垂直反転</td><td>integer</td><td>0</td><td>FALSE</td><td> </td><td></td></tr><tr><td>fliph</td><td>水平反転</td><td>integer</td><td>0</td><td>FALSE</td><td> </td><td></td></tr><tr><td>created_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>updated_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr></tbody></table><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/PanelPictureModel">PanelPictureModel</a>\r
+</li></ul><h2 id="h2-panels.20.E3.82.B3.E3.83.9E">panels コマ</h2><table class="wikitable" border="1"><tbody><tr><td>name</td><td>和名</td><td>type</td><td>default</td><td>null</td><td>limit</td><td>note</td></tr><tr><td>comic_id</td><td>所属コミック</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>resource_picture_id</td><td>背景画像 素材id</td><td>integer</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>width</td><td>コマの幅</td><td>integer</td><td>200</td><td>FALSE</td><td> </td><td></td></tr><tr><td>height</td><td>コマの高さ</td><td>integer</td><td>80</td><td>FALSE</td><td> </td><td></td></tr><tr><td>border</td><td>コマの枠線の太さ</td><td>integer</td><td>1</td><td>FALSE</td><td> </td><td></td></tr><tr><td>x</td><td>表示位置x</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td> </td></tr><tr><td>y</td><td>表示位置y</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td> </td></tr><tr><td>z</td><td>表示優先順位</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td> </td></tr><tr><td>t</td><td>コマ番号</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>author_id</td><td>コマの投稿者 作家id</td><td>integer</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>created_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>updated_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr></tbody></table><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/PanelModel">PanelModel</a>\r
+</li></ul><h2 id="h2-resource_pictures.20.E7.B4.A0.E6.9D.90">resource_pictures 素材</h2><table class="wikitable" border="1"><tbody><tr><td>name</td><td>和名</td><td>type</td><td>default</td><td>null</td><td>limit</td><td>note</td></tr><tr><td>ext</td><td>画像フォーマット</td><td>string</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>width</td><td>幅ピクセル数</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>height</td><td>高さピクセル数</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>filesize</td><td>画像サイズ</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>artist_id</td><td>投稿者 絵師id</td><td>integer</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>lisence_id</td><td>付与ライセンスid</td><td>integer</td><td> </td><td> </td><td> </td><td><a href="http://sourceforge.jp/projects/pettanr/wiki/OriginalPicture">OriginalPicture</a>のコピー 変更不可</td></tr><tr><td>original_picture_id</td><td>原画id</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>created_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>updated_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr></tbody></table><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/ResourcePictureModel">ResourcePictureModel</a>\r
+</li></ul><h2 id="h2-speach_balloons.20.E3.83.95.E3.82.AD.E3.83.80.E3.82.B7.E3.83.86.E3.83.B3.E3.83.97.E3.83.AC.E3.83.BC.E3.83.88">speach_balloons フキダシテンプレート</h2><table class="wikitable" border="1"><tbody><tr><td>name</td><td>和名</td><td>type</td><td>default</td><td>null</td><td>limit</td><td>note</td></tr><tr><td>name</td><td>フキダシ名</td><td>string</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>tail_count</td><td>尻尾の向きの数</td><td>integer</td><td>1</td><td>FALSE</td><td> </td><td></td></tr><tr><td>size_count</td><td>サイズのバリエーション数</td><td>integer</td><td>1</td><td>FALSE</td><td> </td><td></td></tr><tr><td>t</td><td>表示順</td><td>integer</td><td>1</td><td>false</td><td> </td><td>ファイルエクスプローラーなどで</td></tr><tr><td>created_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>updated_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr></tbody></table><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/SpeachBalloonModel">SpeachBalloonModel</a>\r
+</li></ul><h2 id="h2-speach_templates.20.E3.82.BB.E3.83.AA.E3.83.95.E3.83.86.E3.83.B3.E3.83.97.E3.83.AC.E3.83.BC.E3.83.88">speach_templates セリフテンプレート</h2><table class="wikitable" border="1"><tbody><tr><td>name</td><td>和名</td><td>type</td><td>default</td><td>null</td><td>limit</td><td>note</td></tr><tr><td>balloon_template_id</td><td>フキダシ枠テンプレートid</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>x</td><td>表示開始位置x</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>y</td><td>表示開始位置y</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>width</td><td>幅</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>height</td><td>高さ</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>created_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>updated_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr></tbody></table><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/SpeachTemplateModel">SpeachTemplateModel</a>\r
+</li></ul><h2 id="h2-speaches.20.E3.82.BB.E3.83.AA.E3.83.95">speaches セリフ</h2><table class="wikitable" border="1"><tbody><tr><td>name</td><td>和名</td><td>type</td><td>default</td><td>null</td><td>limit</td><td>note</td></tr><tr><td>balloon_id</td><td>フキダシ枠id</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>content</td><td>台詞</td><td>string</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>x</td><td>表示開始位置x</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>y</td><td>表示開始位置y</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>t</td><td>時間軸 順序</td><td>integer</td><td>1</td><td>false</td><td> </td><td> </td></tr><tr><td>width</td><td>幅</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>height</td><td>高さ</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td></td></tr><tr><td>created_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr><tr><td>updated_at</td><td></td><td>datetime</td><td> </td><td> </td><td> </td><td></td></tr></tbody></table><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/SpeachModel">SpeachModel</a>\r
+</li></ul>]]>\r
+    </content:encoded>\r
+      </item>\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/JavascriptEditor">\r
+    <title>JavascriptEditor</title>\r
+\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/JavascriptEditor</link>\r
+    <dc:identifier>JavascriptEditor</dc:identifier>\r
+    <dc:date>2012-01-04T22:04:51+09:00</dc:date>\r
+        <description>\r
+      <![CDATA[= Javascript\r
+ js は 閲覧時 に使われるもの、ログイン後に使われるもの、その両方で使われるものがある.\r
+\r
+== common.js\r
+ * pettnar.\r
+ * pettanr.const\r
+ * pettanr.ua\r
+   * ブラウザの情報、プラグインの情報\r
+ * pettnar.util\r
+   * \r
+ * pettnar.overlay\r
+   * ポップア]]>\r
+    </description>\r
+    <content:encoded>\r
+\r
+      <![CDATA[<h1 id="h1-Javascript">Javascript</h1><div class="indent">js は 閲覧時 に使われるもの、ログイン後に使われるもの、その両方で使われるものがある.\r
+</div><h2 id="h2-common.js">common.js</h2><ul><li>pettnar.\r
+</li><li>pettanr.const\r
+</li><li>pettanr.ua\r
+<ul><li>ブラウザの情報、プラグインの情報\r
+</li></ul></li><li>pettnar.util\r
+<ul><li>\r
+</li></ul></li><li>pettnar.overlay\r
+<ul><li>ポップアップオーバーレイを管理する.\r
+</li></ul></li><li>pettnar.key\r
+<ul><li>キーイベントの発行、テキスト入力エリアの管理\r
+</li></ul></li><li>pettnar.balloon\r
+<ul><li>クロスバックエンドな吹きだし画像のためのラッパーの発行.XbackendSpeachBalloon\r
+<a href="http://sourceforge.jp/projects/pettanr/wiki/XbackendSpeachBalloon">XbackendSpeachBalloon</a></li><li>SVG, VML といったベクター画像で吹きだし(balloon)を描画する(ベクター画像のサポートがない場合は代替画像を表示する)\r
+</li><li><a href="http://sourceforge.jp/projects/pettanr/wiki/AboutSpeachBalloon">AboutSpeachBalloon</a>\r
+</li></ul></li><li>pettnar.image\r
+<ul><li>クロスバックエンドな、Reversible Image のためのラッパーを発行.XbackendReversibleImage\r
+<a href="http://sourceforge.jp/projects/pettanr/wiki/XbackendReversibleImage">XbackendReversibleImage</a></li><li>css3, VML, ActiveX, Flash, サーバー側で生成した反転画像 を使用して画像の反転を行う.\r
+</li><li>透過 PNG のサポートが甘い IE6 以下にたいして、VML, Flash, ActiveX+サーバー画像 による描画サポートを行う.PngFix\r
+<a href="http://sourceforge.jp/projects/pettanr/wiki/PngFix">PngFix</a></li><li><a href="http://sourceforge.jp/projects/pettanr/wiki/PictureIo">PictureIo</a>\r
+</li></ul></li><li>pettnar.i18n\r
+<ul><li>マルチ言語情報の保持.言語変更イベントの管理.\r
+</li></ul></li><li>pettnar.io\r
+<ul><li>通信\r
+</li><li>xml としてサーバに置かれた ajax なリソースに対して、ajax feed api を使った json リクエスト(xmlより転送量が少ない)などの 複数経路でリクエストを行うラッパー\r
+</li><li><a href="http://sourceforge.jp/projects/pettanr/wiki/JsonApi">JsonApi</a>\r
+</li></ul></li><li>pettnar.load\r
+<ul><li>work.js と jQuery のロード.min や debag version の切り替え.jQuery version の切り替え.\r
+</li></ul></li></ul><h2 id="h2-work.js">work.js</h2><p>ログイン後のユーザー(管理者)の操作.コミック・画像の管理やコマの作成.\r
+</p><ul><li>pettnar.view\r
+<ul><li>現在のビューを管理する.Window Resize イベントの監視.\r
+</li></ul></li><li>pettnar.editor\r
+<ul><li>コマの編集を行う.\r
+</li></ul></li><li>pettnar.file\r
+<ul><li>サーバから取得したリソース情報を保持し、データの取得やアクセス権のチェック、データのアップデートをラップする.\r
+</li></ul></li><li>pettnar.finder\r
+<ul><li>ファイル(リソース)エクスプローラー\r
+</li><li>コミック、コマ、画像、吹きだし、画像提供絵師情報</li></ul></li></ul>]]>\r
+    </content:encoded>\r
+      </item>\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/ChangeDoc">\r
+    <title>ChangeDoc</title>\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/ChangeDoc</link>\r
+    <dc:identifier>ChangeDoc</dc:identifier>\r
+\r
+    <dc:date>2012-01-04T18:19:48+09:00</dc:date>\r
+        <description>\r
+      <![CDATA[= 改変予告\r
+== モデルの変名\r
+\r
+balloon_templates\r
+ * border &rarr; size\r
+ * min_width &rarr; \r
+ * max_width &rarr; \r
+ * min_height &rarr; \r
+ * max_height &rarr; \r
+balloons \r
+ * border &rarr; size\r
+ * zindex &ra]]>\r
+    </description>\r
+    <content:encoded>\r
+      <![CDATA[<h1 id="h1-.E6.94.B9.E5.A4.89.E4.BA.88.E5.91.8A">改変予告</h1><h2 id="h2-.E3.83.A2.E3.83.87.E3.83.AB.E3.81.AE.E5.A4.89.E5.90.8D">モデルの変名</h2><p>balloon_templates\r
+</p><ul><li>border → size\r
+</li><li>min_width → \r
+</li><li>max_width → \r
+</li><li>min_height → \r
+</li><li>max_height → \r
+</li></ul><p>balloons \r
+</p><ul><li>border → size\r
+</li><li>zindex → z\r
+</li><li>top_offset → y\r
+</li><li>left_offset → x\r
+</li><li>width → \r
+</li><li>height → \r
+</li></ul><p>comics \r
+</p><ul><li>default_width → width\r
+</li><li>default_height → height\r
+</li></ul><p>original_pictures\r
+</p><ul><li>width → \r
+</li><li>height → \r
+</li></ul><p>panel_pictures\r
+</p><ul><li>width → \r
+</li><li>height → \r
+</li><li>top_offset → y\r
+</li><li>left_offset → x\r
+</li><li>zindex → z\r
+</li><li>v → flipv\r
+</li><li>h → fliph\r
+</li></ul><p>panels\r
+</p><ul><li>width → \r
+</li><li>height → \r
+</li><li>seqno → t\r
+</li></ul><p>speach_balloons\r
+</p><ul><li>tail_limit → tail_count\r
+</li><li>border_limit → size_count\r
+</li></ul><p>speach_templates\r
+</p><ul><li>top_offset → y\r
+</li><li>left_offset → x\r
+</li><li>width → \r
+</li><li>height → \r
+</li></ul><p>speaches\r
+</p><ul><li>top_offset → y\r
+</li><li>left_offset → x\r
+</li><li>width → \r
+</li><li>height → \r
+</li></ul><p>balloons \r
+<table class="wikitable" border="1"><tbody><tr><td>t</td><td>時間軸 順序</td><td>integer</td><td>1</td><td>false</td><td> </td><td> </td></tr></tbody></table></p><p>追加理由:ストーリー上の順序も品質に関わるため\r
+</p><p>speaches\r
+<table class="wikitable" border="1"><tbody><tr><td>t</td><td>時間軸 順序</td><td>integer</td><td>1</td><td>false</td><td> </td><td> </td></tr></tbody></table></p><p>追加理由:ストーリー上の順序も品質に関わるため\r
+</p><p>panels\r
+<table class="wikitable" border="1"><tbody><tr><td>x</td><td>表示位置x</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td> </td></tr><tr><td>y</td><td>表示位置y</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td> </td></tr><tr><td>z</td><td>表示優先順位</td><td>integer</td><td> </td><td>FALSE</td><td> </td><td> </td></tr></tbody></table></p><p>追加理由:将来の拡張に備えるため\r
+</p><p>panel_pictures\r
+<table class="wikitable" border="1"><tbody><tr><td>url</td><td>リンク</td><td>string</td><td> </td><td> </td><td>200</td><td>参照するページをリンクできる</td></tr></tbody></table></p><p>追加理由:本家から取り込んでなかった\r
+<table class="wikitable" border="1"><tbody><tr><td>t</td><td>時間軸 順序</td><td>integer</td><td>1</td><td>false</td><td> </td><td> </td></tr></tbody></table></p><p>追加理由:ストーリー上の順序も品質に関わるため\r
+</p><p>lisences\r
+<table class="wikitable" border="1"><tbody><tr><td>no_convert</td><td>フォーマット・色合い変換の禁止</td><td>integer</td><td> </td><td> </td><td> </td><td> </td></tr></tbody></table></p><p>追加理由:ie6がpng透過できないためgif変換の必要ができたため\r
+</p><p>common_lisences\r
+<table class="wikitable" border="1"><tbody><tr><td>no_convert</td><td>フォーマット・色合い変換の禁止</td><td>integer</td><td> </td><td> </td><td> </td><td> </td></tr></tbody></table></p><p>追加理由:ie6がpng透過できないためgif変換の必要ができたため\r
+</p><p>original_lisences\r
+<table class="wikitable" border="1"><tbody><tr><td>no_convert</td><td>フォーマット・色合い変換の禁止</td><td>integer</td><td> </td><td> </td><td> </td><td> </td></tr></tbody></table></p><p>追加理由:ie6がpng透過できないためgif変換の必要ができたため\r
+</p><p>comics\r
+<table class="wikitable" border="1"><tbody><tr><td>visible</td><td>公開フラグ</td><td>integer</td><td>0</td><td>false</td><td> </td><td>可視範囲 0:本人のみ 1:友人まで 2:ユーザまで 3:誰でも</td></tr><tr><td>editable</td><td>編集フラグ</td><td>integer</td><td>0</td><td>false</td><td> </td><td>許可範囲 0:本人のみ 1:友人まで 2:ユーザまで 3:誰でも</td></tr></tbody></table></p><p>追加理由:本家から取り込んでなかった\r
+</p><p>speach_balloons\r
+<table class="wikitable" border="1"><tbody><tr><td>t</td><td>表示順</td><td>integer</td><td>1</td><td>false</td><td> </td><td>ファイルエクスプローラーなどで</td></tr></tbody></table></p>]]>\r
+    </content:encoded>\r
+      </item>\r
+\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/DatabaseSchema">\r
+    <title>DatabaseSchema</title>\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/DatabaseSchema</link>\r
+    <dc:identifier>DatabaseSchema</dc:identifier>\r
+    <dc:date>2012-01-04T18:05:04+09:00</dc:date>\r
+        <description>\r
+      <![CDATA[= 定義\r
+超やっつけだけど、無いよりはマシか。\r
+\r
+{{{\r
+ActiveRecord::Schema.define(:version =&gt; 20120102071851) do\r
+\r
+  create_table &quot;admins&quot;, :force =&gt; true do |t|\r
+    t.string   &quot;email&quot;,        ]]>\r
+\r
+    </description>\r
+    <content:encoded>\r
+      <![CDATA[<h1 id="h1-.E5.AE.9A.E7.BE.A9">定義</h1><p>超やっつけだけど、無いよりはマシか。\r
+</p><pre>ActiveRecord::Schema.define(:version =&gt; 20120102071851) do\r
+\r
+  create_table &quot;admins&quot;, :force =&gt; true do |t|\r
+    t.string   &quot;email&quot;,                                 :default =&gt; &quot;&quot;, :null =&gt; false\r
+    t.string   &quot;encrypted_password&quot;,     :limit =&gt; 128, :default =&gt; &quot;&quot;, :null =&gt; false\r
+    t.string   &quot;reset_password_token&quot;\r
+    t.datetime &quot;reset_password_sent_at&quot;\r
+    t.datetime &quot;remember_created_at&quot;\r
+    t.integer  &quot;sign_in_count&quot;,                         :default =&gt; 0\r
+    t.datetime &quot;current_sign_in_at&quot;\r
+    t.datetime &quot;last_sign_in_at&quot;\r
+    t.string   &quot;current_sign_in_ip&quot;\r
+    t.string   &quot;last_sign_in_ip&quot;\r
+    t.string   &quot;confirmation_token&quot;\r
+    t.datetime &quot;confirmed_at&quot;\r
+    t.datetime &quot;confirmation_sent_at&quot;\r
+    t.string   &quot;authentication_token&quot;\r
+    t.datetime &quot;created_at&quot;\r
+    t.datetime &quot;updated_at&quot;\r
+  end\r
+\r
+  add_index &quot;admins&quot;, [&quot;authentication_token&quot;], :name =&gt; &quot;index_admins_on_authentication_token&quot;, :unique =&gt; true\r
+  add_index &quot;admins&quot;, [&quot;confirmation_token&quot;], :name =&gt; &quot;index_admins_on_confirmation_token&quot;, :unique =&gt; true\r
+  add_index &quot;admins&quot;, [&quot;email&quot;], :name =&gt; &quot;index_admins_on_email&quot;, :unique =&gt; true\r
+  add_index &quot;admins&quot;, [&quot;reset_password_token&quot;], :name =&gt; &quot;index_admins_on_reset_password_token&quot;, :unique =&gt; true\r
+\r
+  create_table &quot;artists&quot;, :force =&gt; true do |t|\r
+    t.string   &quot;email&quot;\r
+    t.string   &quot;name&quot;\r
+    t.string   &quot;homepage_url&quot;\r
+    t.string   &quot;api_url&quot;\r
+    t.integer  &quot;default_lisence_id&quot;\r
+    t.datetime &quot;crowled_at&quot;\r
+    t.datetime &quot;created_at&quot;\r
+    t.datetime &quot;updated_at&quot;\r
+    t.integer  &quot;author_id&quot;\r
+  end\r
+\r
+  create_table &quot;authors&quot;, :force =&gt; true do |t|\r
+    t.string   &quot;name&quot;\r
+    t.string   &quot;email&quot;,                                 :default =&gt; &quot;&quot;, :null =&gt; false\r
+    t.string   &quot;encrypted_password&quot;,     :limit =&gt; 128, :default =&gt; &quot;&quot;, :null =&gt; false\r
+    t.string   &quot;reset_password_token&quot;\r
+    t.datetime &quot;reset_password_sent_at&quot;\r
+    t.datetime &quot;remember_created_at&quot;\r
+    t.integer  &quot;sign_in_count&quot;,                         :default =&gt; 0\r
+    t.datetime &quot;current_sign_in_at&quot;\r
+    t.datetime &quot;last_sign_in_at&quot;\r
+    t.string   &quot;current_sign_in_ip&quot;\r
+    t.string   &quot;last_sign_in_ip&quot;\r
+    t.string   &quot;authentication_token&quot;\r
+    t.string   &quot;confirmation_token&quot;\r
+    t.datetime &quot;confirmed_at&quot;\r
+    t.datetime &quot;confirmation_sent_at&quot;\r
+    t.datetime &quot;created_at&quot;\r
+    t.datetime &quot;updated_at&quot;\r
+  end\r
+\r
+  add_index &quot;authors&quot;, [&quot;authentication_token&quot;], :name =&gt; &quot;index_authors_on_authentication_token&quot;, :unique =&gt; true\r
+  add_index &quot;authors&quot;, [&quot;confirmation_token&quot;], :name =&gt; &quot;index_authors_on_confirmation_token&quot;, :unique =&gt; true\r
+  add_index &quot;authors&quot;, [&quot;email&quot;], :name =&gt; &quot;index_authors_on_email&quot;, :unique =&gt; true\r
+  add_index &quot;authors&quot;, [&quot;reset_password_token&quot;], :name =&gt; &quot;index_authors_on_reset_password_token&quot;, :unique =&gt; true\r
+\r
+  create_table &quot;balloon_templates&quot;, :force =&gt; true do |t|\r
+    t.integer  &quot;speach_balloon_id&quot;,                :null =&gt; false\r
+    t.integer  &quot;system_picture_id&quot;,                :null =&gt; false\r
+    t.integer  &quot;tail&quot;,              :default =&gt; 1, :null =&gt; false\r
+    t.integer  &quot;size&quot;,              :default =&gt; 1, :null =&gt; false\r
+    t.integer  &quot;min_width&quot;,         :default =&gt; 0, :null =&gt; false\r
+    t.integer  &quot;max_width&quot;,         :default =&gt; 0, :null =&gt; false\r
+    t.integer  &quot;min_height&quot;,        :default =&gt; 0, :null =&gt; false\r
+    t.integer  &quot;max_height&quot;,        :default =&gt; 0, :null =&gt; false\r
+    t.datetime &quot;created_at&quot;\r
+    t.datetime &quot;updated_at&quot;\r
+  end\r
+\r
+  add_index &quot;balloon_templates&quot;, [&quot;speach_balloon_id&quot;, &quot;tail&quot;, &quot;size&quot;], :name =&gt; &quot;balloon_templates_idts&quot;, :unique =&gt; true\r
+  add_index &quot;balloon_templates&quot;, [&quot;speach_balloon_id&quot;], :name =&gt; &quot;index_balloon_templates_on_speach_balloon_id&quot;\r
+\r
+  create_table &quot;balloons&quot;, :force =&gt; true do |t|\r
+    t.integer  &quot;panel_id&quot;,                           :null =&gt; false\r
+    t.integer  &quot;balloon_template_id&quot;,                :null =&gt; false\r
+    t.integer  &quot;system_picture_id&quot;,                  :null =&gt; false\r
+    t.integer  &quot;tail&quot;,                :default =&gt; 1, :null =&gt; false\r
+    t.integer  &quot;size&quot;,                :default =&gt; 1, :null =&gt; false\r
+    t.integer  &quot;x&quot;,                                  :null =&gt; false\r
+    t.integer  &quot;y&quot;,                                  :null =&gt; false\r
+    t.integer  &quot;z&quot;,                                  :null =&gt; false\r
+    t.integer  &quot;t&quot;,                   :default =&gt; 1, :null =&gt; false\r
+    t.integer  &quot;width&quot;,                              :null =&gt; false\r
+    t.integer  &quot;height&quot;,                             :null =&gt; false\r
+    t.datetime &quot;created_at&quot;\r
+    t.datetime &quot;updated_at&quot;\r
+  end\r
+\r
+  add_index &quot;balloons&quot;, [&quot;panel_id&quot;, &quot;t&quot;], :name =&gt; &quot;balloon_idt&quot;, :unique =&gt; true\r
+  add_index &quot;balloons&quot;, [&quot;panel_id&quot;], :name =&gt; &quot;index_balloons_on_panel_id&quot;\r
+\r
+  create_table &quot;comics&quot;, :force =&gt; true do |t|\r
+    t.string   &quot;title&quot;\r
+    t.integer  &quot;width&quot;,      :default =&gt; 200, :null =&gt; false\r
+    t.integer  &quot;height&quot;,     :default =&gt; 80,  :null =&gt; false\r
+    t.integer  &quot;visible&quot;,    :default =&gt; 0,   :null =&gt; false\r
+    t.integer  &quot;editable&quot;,   :default =&gt; 0,   :null =&gt; false\r
+    t.integer  &quot;author_id&quot;\r
+    t.datetime &quot;created_at&quot;\r
+    t.datetime &quot;updated_at&quot;\r
+  end\r
+\r
+  add_index &quot;comics&quot;, [&quot;author_id&quot;], :name =&gt; &quot;index_comics_on_author_id&quot;\r
+\r
+  create_table &quot;common_lisences&quot;, :force =&gt; true do |t|\r
+    t.integer  &quot;lisence_id&quot;,                       :null =&gt; false\r
+    t.string   &quot;name&quot;,                             :null =&gt; false\r
+    t.string   &quot;url&quot;,                              :null =&gt; false\r
+    t.integer  &quot;cc_by&quot;,             :default =&gt; 0, :null =&gt; false\r
+    t.integer  &quot;cc_sa&quot;,             :default =&gt; 0, :null =&gt; false\r
+    t.integer  &quot;cc_nd&quot;,             :default =&gt; 0, :null =&gt; false\r
+    t.integer  &quot;cc_nc&quot;,             :default =&gt; 0, :null =&gt; false\r
+    t.integer  &quot;no_resize&quot;,         :default =&gt; 0, :null =&gt; false\r
+    t.integer  &quot;no_flip&quot;,           :default =&gt; 0, :null =&gt; false\r
+    t.integer  &quot;no_convert&quot;,        :default =&gt; 0, :null =&gt; false\r
+    t.integer  &quot;keep_aspect_ratio&quot;, :default =&gt; 0, :null =&gt; false\r
+    t.datetime &quot;created_at&quot;\r
+    t.datetime &quot;updated_at&quot;\r
+  end\r
+\r
+  create_table &quot;lisences&quot;, :force =&gt; true do |t|\r
+    t.string   &quot;name&quot;,                             :null =&gt; false\r
+    t.string   &quot;url&quot;,                              :null =&gt; false\r
+    t.integer  &quot;cc_by&quot;,             :default =&gt; 0, :null =&gt; false\r
+    t.integer  &quot;cc_sa&quot;,             :default =&gt; 0, :null =&gt; false\r
+    t.integer  &quot;cc_nd&quot;,             :default =&gt; 0, :null =&gt; false\r
+    t.integer  &quot;cc_nc&quot;,             :default =&gt; 0, :null =&gt; false\r
+    t.integer  &quot;no_resize&quot;,         :default =&gt; 0, :null =&gt; false\r
+    t.integer  &quot;no_flip&quot;,           :default =&gt; 0, :null =&gt; false\r
+    t.integer  &quot;no_convert&quot;,        :default =&gt; 0, :null =&gt; false\r
+    t.integer  &quot;keep_aspect_ratio&quot;, :default =&gt; 0, :null =&gt; false\r
+    t.datetime &quot;created_at&quot;\r
+    t.datetime &quot;updated_at&quot;\r
+  end\r
+\r
+  add_index &quot;lisences&quot;, [&quot;url&quot;], :name =&gt; &quot;index_lisences_on_url&quot;, :unique =&gt; true\r
+\r
+  create_table &quot;original_lisences&quot;, :force =&gt; true do |t|\r
+    t.integer  &quot;artist_id&quot;,                        :null =&gt; false\r
+    t.integer  &quot;lisence_id&quot;,                       :null =&gt; false\r
+    t.string   &quot;name&quot;,                             :null =&gt; false\r
+    t.string   &quot;url&quot;,                              :null =&gt; false\r
+    t.integer  &quot;cc_by&quot;,             :default =&gt; 0, :null =&gt; false\r
+    t.integer  &quot;cc_sa&quot;,             :default =&gt; 0, :null =&gt; false\r
+    t.integer  &quot;cc_nd&quot;,             :default =&gt; 0, :null =&gt; false\r
+    t.integer  &quot;cc_nc&quot;,             :default =&gt; 0, :null =&gt; false\r
+    t.integer  &quot;no_resize&quot;,         :default =&gt; 0, :null =&gt; false\r
+    t.integer  &quot;no_flip&quot;,           :default =&gt; 0, :null =&gt; false\r
+    t.integer  &quot;no_convert&quot;,        :default =&gt; 0, :null =&gt; false\r
+    t.integer  &quot;keep_aspect_ratio&quot;, :default =&gt; 0, :null =&gt; false\r
+    t.datetime &quot;created_at&quot;\r
+    t.datetime &quot;updated_at&quot;\r
+  end\r
+\r
+  create_table &quot;original_pictures&quot;, :force =&gt; true do |t|\r
+    t.string   &quot;ext&quot;,        :null =&gt; false\r
+    t.integer  &quot;width&quot;,      :null =&gt; false\r
+    t.integer  &quot;height&quot;,     :null =&gt; false\r
+    t.integer  &quot;filesize&quot;,   :null =&gt; false\r
+    t.integer  &quot;artist_id&quot;\r
+    t.integer  &quot;lisence_id&quot;\r
+    t.datetime &quot;created_at&quot;\r
+    t.datetime &quot;updated_at&quot;\r
+  end\r
+\r
+  add_index &quot;original_pictures&quot;, [&quot;artist_id&quot;], :name =&gt; &quot;index_original_pictures_on_artist_id&quot;\r
+\r
+  create_table &quot;panel_pictures&quot;, :force =&gt; true do |t|\r
+    t.integer  &quot;panel_id&quot;,                                          :null =&gt; false\r
+    t.integer  &quot;resource_picture_id&quot;,                               :null =&gt; false\r
+    t.string   &quot;url&quot;,                 :limit =&gt; 200\r
+    t.integer  &quot;x&quot;,                                                 :null =&gt; false\r
+    t.integer  &quot;y&quot;,                                                 :null =&gt; false\r
+    t.integer  &quot;z&quot;,                                                 :null =&gt; false\r
+    t.integer  &quot;t&quot;,                                  :default =&gt; 1, :null =&gt; false\r
+    t.integer  &quot;width&quot;,                                             :null =&gt; false\r
+    t.integer  &quot;height&quot;,                                            :null =&gt; false\r
+    t.integer  &quot;flipv&quot;,                              :default =&gt; 0, :null =&gt; false\r
+    t.integer  &quot;fliph&quot;,                              :default =&gt; 0, :null =&gt; false\r
+    t.datetime &quot;created_at&quot;\r
+    t.datetime &quot;updated_at&quot;\r
+  end\r
+\r
+  add_index &quot;panel_pictures&quot;, [&quot;panel_id&quot;, &quot;t&quot;], :name =&gt; &quot;panel_pictures_idt&quot;, :unique =&gt; true\r
+\r
+  create_table &quot;panels&quot;, :force =&gt; true do |t|\r
+    t.integer  &quot;comic_id&quot;,                             :null =&gt; false\r
+    t.integer  &quot;resource_picture_id&quot;\r
+    t.integer  &quot;width&quot;,               :default =&gt; 200, :null =&gt; false\r
+    t.integer  &quot;height&quot;,              :default =&gt; 80,  :null =&gt; false\r
+    t.integer  &quot;border&quot;,              :default =&gt; 1,   :null =&gt; false\r
+    t.integer  &quot;x&quot;,                                    :null =&gt; false\r
+    t.integer  &quot;y&quot;,                                    :null =&gt; false\r
+    t.integer  &quot;z&quot;,                                    :null =&gt; false\r
+    t.integer  &quot;t&quot;,                   :default =&gt; 1,   :null =&gt; false\r
+    t.integer  &quot;author_id&quot;\r
+    t.datetime &quot;created_at&quot;\r
+    t.datetime &quot;updated_at&quot;\r
+  end\r
+\r
+  add_index &quot;panels&quot;, [&quot;author_id&quot;], :name =&gt; &quot;index_panels_on_author_id&quot;\r
+  add_index &quot;panels&quot;, [&quot;comic_id&quot;, &quot;t&quot;], :name =&gt; &quot;panels_idt&quot;, :unique =&gt; true\r
+\r
+  create_table &quot;resource_pictures&quot;, :force =&gt; true do |t|\r
+    t.string   &quot;ext&quot;,                 :null =&gt; false\r
+    t.integer  &quot;width&quot;,               :null =&gt; false\r
+    t.integer  &quot;height&quot;,              :null =&gt; false\r
+    t.integer  &quot;filesize&quot;,            :null =&gt; false\r
+    t.integer  &quot;artist_id&quot;\r
+    t.integer  &quot;lisence_id&quot;\r
+    t.integer  &quot;original_picture_id&quot;, :null =&gt; false\r
+    t.datetime &quot;created_at&quot;\r
+    t.datetime &quot;updated_at&quot;\r
+  end\r
+\r
+  create_table &quot;speach_balloons&quot;, :force =&gt; true do |t|\r
+    t.string   &quot;name&quot;,                      :null =&gt; false\r
+    t.integer  &quot;tail_count&quot;, :default =&gt; 1, :null =&gt; false\r
+    t.integer  &quot;size_count&quot;, :default =&gt; 1, :null =&gt; false\r
+    t.integer  &quot;t&quot;,          :default =&gt; 1, :null =&gt; false\r
+    t.datetime &quot;created_at&quot;\r
+    t.datetime &quot;updated_at&quot;\r
+  end\r
+\r
+  add_index &quot;speach_balloons&quot;, [&quot;t&quot;], :name =&gt; &quot;speach_balloons_t&quot;, :unique =&gt; true\r
+\r
+  create_table &quot;speach_templates&quot;, :force =&gt; true do |t|\r
+    t.integer  &quot;balloon_template_id&quot;,                :null =&gt; false\r
+    t.integer  &quot;x&quot;,                                  :null =&gt; false\r
+    t.integer  &quot;y&quot;,                                  :null =&gt; false\r
+    t.integer  &quot;t&quot;,                   :default =&gt; 1, :null =&gt; false\r
+    t.integer  &quot;width&quot;,                              :null =&gt; false\r
+    t.integer  &quot;height&quot;,                             :null =&gt; false\r
+    t.datetime &quot;created_at&quot;\r
+    t.datetime &quot;updated_at&quot;\r
+  end\r
+\r
+  add_index &quot;speach_templates&quot;, [&quot;balloon_template_id&quot;, &quot;t&quot;], :name =&gt; &quot;speach_templates_idt&quot;, :unique =&gt; true\r
+\r
+  create_table &quot;speaches&quot;, :force =&gt; true do |t|\r
+    t.integer  &quot;balloon_id&quot;,                :null =&gt; false\r
+    t.string   &quot;content&quot;\r
+    t.integer  &quot;x&quot;,                         :null =&gt; false\r
+    t.integer  &quot;y&quot;,                         :null =&gt; false\r
+    t.integer  &quot;t&quot;,          :default =&gt; 1, :null =&gt; false\r
+    t.integer  &quot;width&quot;,                     :null =&gt; false\r
+    t.integer  &quot;height&quot;,                    :null =&gt; false\r
+    t.datetime &quot;created_at&quot;\r
+    t.datetime &quot;updated_at&quot;\r
+  end\r
+\r
+  add_index &quot;speaches&quot;, [&quot;balloon_id&quot;, &quot;t&quot;], :name =&gt; &quot;speaches_bt&quot;, :unique =&gt; true\r
+  add_index &quot;speaches&quot;, [&quot;balloon_id&quot;], :name =&gt; &quot;index_speaches_on_balloon_id&quot;\r
+\r
+  create_table &quot;system_pictures&quot;, :force =&gt; true do |t|\r
+    t.string   &quot;ext&quot;,        :null =&gt; false\r
+    t.integer  &quot;width&quot;,      :null =&gt; false\r
+    t.integer  &quot;height&quot;,     :null =&gt; false\r
+    t.integer  &quot;filesize&quot;,   :null =&gt; false\r
+    t.datetime &quot;created_at&quot;\r
+    t.datetime &quot;updated_at&quot;\r
+  end\r
+end\r
+\r
+</pre>]]>\r
+    </content:encoded>\r
+      </item>\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/SpeachBalloonsController">\r
+    <title>SpeachBalloonsController</title>\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/SpeachBalloonsController</link>\r
+\r
+    <dc:identifier>SpeachBalloonsController</dc:identifier>\r
+    <dc:date>2012-01-04T07:58:05+09:00</dc:date>\r
+        <description>\r
+      <![CDATA[= フキダシテンプレート\r
+コマ上に添付するためのフキダシ見本と、それを管理する処理。主に二つの使われ方をする。\r
+\r
+ * 作家が使うエディタ上のフキダシエクスプローラーで見本として表示するための情報をjsonで返す。\r
+ * 管理者がフキダシの基礎情報をメンテナンスする。\r
+\r
+メンテナンスはjson経由で行うことが多い。枠テンプレートとセリフテンプレートのすべての情報を同時に更新する必要があ]]>\r
+    </description>\r
+    <content:encoded>\r
+      <![CDATA[<h1 id="h1-.E3.83.95.E3.82.AD.E3.83.80.E3.82.B7.E3.83.86.E3.83.B3.E3.83.97.E3.83.AC.E3.83.BC.E3.83.88">フキダシテンプレート</h1><p>コマ上に添付するためのフキダシ見本と、それを管理する処理。主に二つの使われ方をする。\r
+</p><ul><li>作家が使うエディタ上のフキダシエクスプローラーで見本として表示するための情報をjsonで返す。\r
+</li><li>管理者がフキダシの基礎情報をメンテナンスする。\r
+</li></ul><p>メンテナンスはjson経由で行うことが多い。枠テンプレートとセリフテンプレートのすべての情報を同時に更新する必要があるためである。詳しくはAboutSpeachBalloon。\r
+<a href="http://sourceforge.jp/projects/pettanr/wiki/AboutSpeachBalloon">AboutSpeachBalloon</a></p><p>参考:Spea<a href="http://sourceforge.jp/projects/pettanr/wiki/SpeachBalloonModel">SpeachBalloonModel</a></p><h2 id="h2-index">index</h2><p>一覧形式\r
+<table class="wikitable" border="1"><tbody><tr><td>パラメータ</td><td>なし</td></tr><tr><td>権限</td><td>作家/管理者</td></tr><tr><td>html</td><td>○</td></tr><tr><td>json</td><td>○</td></tr><tr><td>jsonp</td><td>○</td></tr></tbody></table></p><p>主にクライアントのエディタがフキダシリストを得るために使う。全レコードがt順で返る。\r
+</p><p>html形式では、管理者がメンテナンスのために閲覧する。重要なカラムの情報が一覧で表示されるほか、showへの誘導と、削除のボタンが配置される。\r
+</p><h2 id="h2-show">show</h2><p>単票形式\r
+<table class="wikitable" border="1"><tbody><tr><td>パラメータ</td><td>id</td></tr><tr><td>権限</td><td>管理者</td></tr><tr><td>html</td><td>○</td></tr><tr><td>json</td><td>○</td></tr><tr><td>jsonp</td><td>×</td></tr></tbody></table></p><p>管理者がメンテナンスのために閲覧する機能。\r
+</p><h2 id="h2-create">create</h2><p>作成\r
+<table class="wikitable" border="1"><tbody><tr><td>パラメータ</td><td>json形式で</td></tr><tr><td>権限</td><td>管理者</td></tr><tr><td>html</td><td>×</td></tr><tr><td>json</td><td>○</td></tr><tr><td>jsonp</td><td>×</td></tr></tbody></table></p><p>管理者がフキダシを追加するための機能。\r
+</p><p>jsonデータを元にフキダシテンプレートを作成する。データ作成方法はHowToMakeSpeachBalloonを見る。\r
+<a href="http://sourceforge.jp/projects/pettanr/wiki/HowToMakeSpeachBalloon">HowToMakeSpeachBalloon</a></p><h2 id="h2-update">update</h2><p>更新\r
+<table class="wikitable" border="1"><tbody><tr><td>パラメータ</td><td>id</td></tr><tr><td>権限</td><td>管理者</td></tr><tr><td>html</td><td>×</td></tr><tr><td>json</td><td>○</td></tr><tr><td>jsonp</td><td>×</td></tr></tbody></table></p><p>管理者がフキダシを修正するための機能。\r
+</p><p>指定されたidのフキダシテンプレートを、jsonデータを元に更新する。データ作成方法はHowToMakeSpeachBalloonを見る。\r
+<a href="http://sourceforge.jp/projects/pettanr/wiki/HowToMakeSpeachBalloon">HowToMakeSpeachBalloon</a></p><h3 id="h3-.E4.BE.8B.E5.A4.96">例外</h3><p>権限がないアカウントで要求された場合は、処理を中断し、サインインを促すページに遷移する。\r
+指定されたidが存在しない場合は、404エラーコードが返る。\r
+</p><h2 id="h2-destroy">destroy</h2><p>削除\r
+<table class="wikitable" border="1"><tbody><tr><td>パラメータ</td><td>id</td></tr><tr><td>権限</td><td>管理者</td></tr><tr><td>html</td><td>○</td></tr><tr><td>json</td><td>○</td></tr><tr><td>jsonp</td><td>×</td></tr></tbody></table></p><p>指定されたidのフキダシテンプレートを削除する。フキダシテンプレートだけでなく、枠テンプレートとセリフテンプレートも同時に削除される。\r
+</p><h3 id="h3-.E4.BE.8B.E5.A4.96-2">例外</h3><p>権限がないアカウントで要求された場合は、処理を中断し、サインインを促すページに遷移する。\r
+指定されたidが存在しない場合は、404エラーコードが返る。\r
+</p>]]>\r
+    </content:encoded>\r
+\r
+      </item>\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/PanelPictureModel">\r
+    <title>PanelPictureModel</title>\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/PanelPictureModel</link>\r
+    <dc:identifier>PanelPictureModel</dc:identifier>\r
+    <dc:date>2012-01-03T12:34:36+09:00</dc:date>\r
+        <description>\r
+\r
+      <![CDATA[= コマ絵\r
+コマ上に添付された素材に関するデータ。\r
+\r
+参考:PanelPicturesController\r
+\r
+== カラム\r
+\r
+== 作成手順\r
+コマ絵は常にパネル経由で作成されるため、PanelsControllerからjsonフォーマットで送信する。\r
+\r
+コマ絵は素材のコピーなので、素材ResourcePictureModelのデータを元に作成する。行の新規作成時はデフォルト値と]]>\r
+    </description>\r
+    <content:encoded>\r
+      <![CDATA[<h1 id="h1-.E3.82.B3.E3.83.9E.E7.B5.B5">コマ絵</h1><p>コマ上に添付された素材に関するデータ。\r
+</p><p>参考:Pane<a href="http://sourceforge.jp/projects/pettanr/wiki/PanelPicturesController">PanelPicturesController</a></p><h2 id="h2-.E3.82.AB.E3.83.A9.E3.83.A0">カラム</h2><h2 id="h2-.E4.BD.9C.E6.88.90.E6.89.8B.E9.A0.86">作成手順</h2><p>コマ絵は常にパネル経由で作成されるため、PanelsControllerからjsonフォーマットで送信する。\r
+<a href="http://sourceforge.jp/projects/pettanr/wiki/PanelsController">PanelsController</a></p><p>コマ絵は素材のコピーなので、素材ResourcePictureModelのデータを元に作成する。<a href="http://sourceforge.jp/projects/pettanr/wiki/ResourcePictureModel">ResourcePictureModel</a>のように値をコピーすること。\r
+</p><table class="wikitable" border="1"><tbody><tr><td><a href="http://sourceforge.jp/projects/pettanr/wiki/PanelPicture">PanelPicture</a></td><td><a href="http://sourceforge.jp/projects/pettanr/wiki/ResourcePicture">ResourcePicture</a></td></tr><tr><td>width</td><td>width</td></tr></tbody></table>]]>\r
+    </content:encoded>\r
+      </item>\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/ResourcePictureModel">\r
+    <title>ResourcePictureModel</title>\r
+\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/ResourcePictureModel</link>\r
+    <dc:identifier>ResourcePictureModel</dc:identifier>\r
+    <dc:date>2012-01-03T11:56:43+09:00</dc:date>\r
+        <description>\r
+      <![CDATA[= 素材\r
+絵師から提供された原画OriginalPictureModelをコマPanel上で扱いやすいように整えた画像に関するデータ。\r
+\r
+参考:ResourcePicturesController\r
+\r
+== カラム\r
+\r
+== 作成手順\r
+]]>\r
+    </description>\r
+    <content:encoded>\r
+\r
+      <![CDATA[<h1 id="h1-.E7.B4.A0.E6.9D.90">素材</h1><p>絵師から提供された原画OriginalPictureModelをコ<a href="http://sourceforge.jp/projects/pettanr/wiki/OriginalPictureModel">OriginalPictureModel</a>像に関するデータ。\r
+</p><p>参考:Reso<a href="http://sourceforge.jp/projects/pettanr/wiki/ResourcePicturesController">ResourcePicturesController</a></p><h2 id="h2-.E3.82.AB.E3.83.A9.E3.83.A0">カラム</h2><h2 id="h2-.E4.BD.9C.E6.88.90.E6.89.8B.E9.A0.86">作成手順</h2>]]>\r
+    </content:encoded>\r
+      </item>\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/PanelPicturesController">\r
+    <title>PanelPicturesController</title>\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/PanelPicturesController</link>\r
+    <dc:identifier>PanelPicturesController</dc:identifier>\r
+\r
+    <dc:date>2012-01-03T11:39:51+09:00</dc:date>\r
+        <description>\r
+      <![CDATA[= コマ絵\r
+コマ上に添付された素材に関する処理。\r
+\r
+コマ絵の操作はパネル経由でしか許可されていないので、処理することはない。かろうじて管理者がレコード値を閲覧できるのみである。\r
+\r
+参考:PanelPictureModel\r
+\r
+== index\r
+一覧形式\r
+||パラメータ||なし||\r
+||権限||管理者||\r
+\r
+== show\r
+単票形式\r
+||パラメータ||id||\r
+||権限|]]>\r
+    </description>\r
+    <content:encoded>\r
+      <![CDATA[<h1 id="h1-.E3.82.B3.E3.83.9E.E7.B5.B5">コマ絵</h1><p>コマ上に添付された素材に関する処理。\r
+</p><p>コマ絵の操作はパネル経由でしか許可されていないので、処理することはない。かろうじて管理者がレコード値を閲覧できるのみである。\r
+</p><p>参考:Pane<a href="http://sourceforge.jp/projects/pettanr/wiki/PanelPictureModel">PanelPictureModel</a></p><h2 id="h2-index">index</h2><p>一覧形式\r
+<table class="wikitable" border="1"><tbody><tr><td>パラメータ</td><td>なし</td></tr><tr><td>権限</td><td>管理者</td></tr></tbody></table></p><h2 id="h2-show">show</h2><p>単票形式\r
+<table class="wikitable" border="1"><tbody><tr><td>パラメータ</td><td>id</td></tr><tr><td>権限</td><td>管理者</td></tr></tbody></table></p>]]>\r
+    </content:encoded>\r
+      </item>\r
+\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/ForDevelopers">\r
+    <title>ForDevelopers</title>\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/ForDevelopers</link>\r
+    <dc:identifier>ForDevelopers</dc:identifier>\r
+    <dc:date>2012-01-02T13:28:58+09:00</dc:date>\r
+        <description>\r
+      <![CDATA[= 開発者向けドキュメント\r
+== 開発環境\r
+=== サーバーサイド\r
+ * Ruby1.9+Rails3.1\r
+==== 構築\r
+ * InstallRubyAndRails\r
+ * DownloadSourceCode\r
+ * PictureIo\r
+ * RmagickAndDmagick\r
+\r
+=== クライアントサイド\r
+ * html4.01 + css2.1 に加え css3, SV]]>\r
+\r
+    </description>\r
+    <content:encoded>\r
+      <![CDATA[<h1 id="h1-.E9.96.8B.E7.99.BA.E8.80.85.E5.90.91.E3.81.91.E3.83.89.E3.82.AD.E3.83.A5.E3.83.A1.E3.83.B3.E3.83.88">開発者向けドキュメント</h1><h2 id="h2-.E9.96.8B.E7.99.BA.E7.92.B0.E5.A2.83">開発環境</h2><h3 id="h3-.E3.82.B5.E3.83.BC.E3.83.90.E3.83.BC.E3.82.B5.E3.82.A4.E3.83.89">サーバーサイド</h3><ul><li>Ruby1.9+Rails3.1\r
+</li></ul><h4 id="h4-.E6.A7.8B.E7.AF.89">構築</h4><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/InstallRubyAndRails">InstallRubyAndRails</a>\r
+</li><li><a href="http://sourceforge.jp/projects/pettanr/wiki/DownloadSourceCode">DownloadSourceCode</a>\r
+</li><li><a href="http://sourceforge.jp/projects/pettanr/wiki/PictureIo">PictureIo</a>\r
+</li><li><a href="http://sourceforge.jp/projects/pettanr/wiki/RmagickAndDmagick">RmagickAndDmagick</a>\r
+</li></ul><h3 id="h3-.E3.82.AF.E3.83.A9.E3.82.A4.E3.82.A2.E3.83.B3.E3.83.88.E3.82.B5.E3.82.A4.E3.83.89">クライアントサイド</h3><ul><li>html4.01 + css2.1 に加え css3, SVG, XML, ActiveX, Flash のうちのいくつか.\r
+<ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/ClientSide">ClientSide</a>\r
+</li><li><a href="http://sourceforge.jp/projects/pettanr/wiki/XbackendReversibleImage">XbackendReversibleImage</a>\r
+</li><li><a href="http://sourceforge.jp/projects/pettanr/wiki/XbackendSpeachBalloon">XbackendSpeachBalloon</a>\r
+</li><li><a href="http://sourceforge.jp/projects/pettanr/wiki/PngFix">PngFix</a>\r
+</li><li><a href="http://sourceforge.jp/projects/pettanr/wiki/HtmlAndCss2">HtmlAndCss2</a>\r
+</li></ul></li><li>javascript( jQuery + plugin)\r
+<ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/JavascriptEditor">JavascriptEditor</a>\r
+</li></ul></li></ul><h3 id="h3-.E3.83.87.E3.83.BC.E3.82.BF.E3.83.99.E3.83.BC.E3.82.B9">データベース</h3><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/AboutModels">AboutModels</a>\r
+</li><li><a href="http://sourceforge.jp/projects/pettanr/wiki/DatabaseSchema">DatabaseSchema</a> \r
+</li></ul><h2 id="h2-.E6.A9.9F.E8.83.BD">機能</h2><ul><li>サーバ側の機能 RailsControllers<a href="http://sourceforge.jp/projects/pettanr/wiki/RailsControllers">RailsControllers</a></li><li>JsonAPI Js<a href="http://sourceforge.jp/projects/pettanr/wiki/JsonApi">JsonApi</a></li></ul><h2 id="h2-.E6.94.B9.E5.A4.89.E4.BA.88.E5.91.8A">改変予告</h2><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/ChangeDoc">ChangeDoc</a></li></ul>]]>\r
+    </content:encoded>\r
+      </item>\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/XbackendSpeachBalloon">\r
+    <title>XbackendSpeachBalloon</title>\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/XbackendSpeachBalloon</link>\r
+\r
+    <dc:identifier>XbackendSpeachBalloon</dc:identifier>\r
+    <dc:date>2012-01-02T01:06:05+09:00</dc:date>\r
+        <description>\r
+      <![CDATA[= クロスバックエンドな吹きだし表示機能\r
+\r
+ぺったんRの吹きだしは、さまざまな尻尾の向きを持つ吹きだし画像を用意します.[[BR]]\r
+また、吹き出しが巨大になったときに、吹きだしの枠線も太ってしまわないように、枠線のバリエーションも複数用意します.[[BR]]\r
+\r
+吹きだし画像は gif で注意深く用意されるため一枚につき、数キロバイトという軽量なものです.しかしコマの編集時にはユーザーが]]>\r
+    </description>\r
+    <content:encoded>\r
+      <![CDATA[<h1 id="h1-.E3.82.AF.E3.83.AD.E3.82.B9.E3.83.90.E3.83.83.E3.82.AF.E3.82.A8.E3.83.B3.E3.83.89.E3.81.AA.E5.90.B9.E3.81.8D.E3.81.A0.E3.81.97.E8.A1.A8.E7.A4.BA.E6.A9.9F.E8.83.BD">クロスバックエンドな吹きだし表示機能</h1><p>ぺったんRの吹きだしは、さまざまな尻尾の向きを持つ吹きだし画像を用意します.[[BR]]\r
+<br />また、吹き出しが巨大になったときに、吹きだしの枠線も太ってしまわないように、枠線のバリエーションも複数用意します.[[BR]]\r
+<br /></p><p>吹きだし画像は gif で注意深く用意されるため一枚につき、数キロバイトという軽量なものです.しかしコマの編集時にはユーザーが操作している間にそのすべてのバリエーションを読み込んでしまう事態になります.[[BR]]\r
+<br />また、マンガという表現スタイルを考えると、キャラクター画像一枚に対して、ひとつ程度の吹き出しが登場する、と仮定するという仮定で、ぺったんのページ読み込み時の全画像アクセスのうち、半分を吹きだし画像が締めることになる試算です.[[BR]]\r
+<br />(もちろん、キャラクター画像の方がはるかにファイルサイズが大きくなります.注意深く容量を抑えて作られた場合でも 10KB ~ 20KB という試算です.)[[BR]]\r
+<br /></p><p>このような、吹きだし画像へのアクセスを抑止して、サービスの安定を図るためベクター画像をサポートするブラウザについては、ブラウザ側で吹きだし画像を用意します.\r
+</p><h1 id="h1-.E3.83.96.E3.83.A9.E3.82.A6.E3.82.B6.E6.A9.9F.E8.83.BD.E5.AF.BE.E5.BF.9C.E8.A1.A8">ブラウザ機能対応表</h1><table class="wikitable" border="1"><tbody><tr><td>バックエンド</td><td>ie5~8</td><td>ie9+</td><td>FF</td><td>safari</td><td>chrome</td><td>Opera</td></tr><tr><td>VML</td><td>○</td><td>?</td><td>×</td><td>×</td><td>×</td><td>×</td></tr><tr><td>SVG</td><td>×</td><td>○</td><td>1.5+</td><td>3.0+</td><td>1+</td><td>8+</td></tr></tbody></table>]]>\r
+    </content:encoded>\r
+\r
+      </item>\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/HtmlAndCss2">\r
+    <title>HtmlAndCss2</title>\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/HtmlAndCss2</link>\r
+    <dc:identifier>HtmlAndCss2</dc:identifier>\r
+    <dc:date>2012-01-02T00:24:05+09:00</dc:date>\r
+        <description>\r
+\r
+      <![CDATA[= Html + css2.1\r
+ぺったんR は、html4.01 + css2.1 をサポートするブラウザで作者の意図したとおりのコンテンツの表示を目指す.[[BR]]\r
+しかし、これは最低限の環境であるため、ぺったんR が用意する便利でパワフルな機能の恩恵のすべてを必ずしも享けられるわけではない.\r
+\r
+== マンガの表示に使用する css プロパティ\r
+ * overflow:hidden\r
+]]>\r
+    </description>\r
+    <content:encoded>\r
+      <![CDATA[<h1 id="h1-Html.20.2B.20css2.1">Html + css2.1</h1><p>ぺったんR は、html4.01 + css2.1 をサポートするブラウザで作者の意図したとおりのコンテンツの表示を目指す.[[BR]]\r
+<br />しかし、これは最低限の環境であるため、ぺったんR が用意する便利でパワフルな機能の恩恵のすべてを必ずしも享けられるわけではない.\r
+</p><h2 id="h2-.E3.83.9E.E3.83.B3.E3.82.AC.E3.81.AE.E8.A1.A8.E7.A4.BA.E3.81.AB.E4.BD.BF.E7.94.A8.E3.81.99.E3.82.8B.20css.20.E3.83.97.E3.83.AD.E3.83.91.E3.83.86.E3.82.A3">マンガの表示に使用する css プロパティ</h2><ul><li>overflow:hidden\r
+<ul><li>コマの外にはみ出してしまう部分を隠す.コマの枠となる div に指定.\r
+</li><li><a href="http://www5e.biglobe.ne.jp/~access_r/hp/css/css_look_001.html" class="external" rel="nofollow">http://www5e.biglobe.ne.jp/~access_r/hp/css/css_look_001.html</a>\r
+</li></ul></li><li>position:absolute, left, top\r
+<ul><li>コミック要素(画像や吹きだし)の配置に使用.\r
+</li><li><a href="http://www5e.biglobe.ne.jp/~access_r/hp/css/css_property.html#position" class="external" rel="nofollow">http://www5e.biglobe.ne.jp/~access_r/hp/css/css_property.html#position</a>\r
+</li></ul></li><li>z-index\r
+<ul><li>html要素の順を無視して、コミック要素の重ね順を変更するときに使用.\r
+</li><li>html要素は意味順(時系列順)に並ぶが、コミックでは演出によって、最後に起こったことが奥に行くことも手前に来ることもある.\r
+</li><li><a href="http://www5e.biglobe.ne.jp/~access_r/hp/css/css_position_003.html" class="external" rel="nofollow">http://www5e.biglobe.ne.jp/~access_r/hp/css/css_position_003.html</a>\r
+</li></ul></li><li>display:table, display:teble-cell\r
+<ul><li>吹きだし内テキストの上下中央配置に使用を考えたが、、、ぺったんでは、table 要素を使用していた.\r
+</li><li><a href="http://www5e.biglobe.ne.jp/~access_r/hp/css/css_look_003.html" class="external" rel="nofollow">http://www5e.biglobe.ne.jp/~access_r/hp/css/css_look_003.html</a>\r
+</li></ul></li></ul><h2 id="h2-.E5.AF.BE.E5.BF.9C.E3.83.96.E3.83.A9.E3.82.A6.E3.82.B6">対応ブラウザ</h2><table class="wikitable" border="1"><tbody><tr><td>プロパティ</td><td>ie</td><td>NN</td><td>firefox</td><td>safari</td><td>chrome</td><td>opera</td></tr><tr><td>overflow:hidden</td><td>5+</td><td>6+</td><td>1+</td><td>?</td><td>1+</td><td>6+</td></tr><tr><td>position:absolute, top, left</td><td>position&amp;top:4+, left:5+</td><td>4+</td><td>1+</td><td>?</td><td>1+</td><td>6+</td></tr><tr><td>z-index</td><td>4+</td><td>4+</td><td>1+</td><td>4+</td><td>1+</td><td>6+</td></tr><tr><td>display:table,table-cell</td><td>8+</td><td>6+</td><td>2+</td><td>2+</td><td>1+</td><td>9+</td></tr></tbody></table><h3 id="h3-.E5.90.B9.E3.81.8D.E3.81.A0.E3.81.97.E5.86.85.E3.83.86.E3.82.AD.E3.82.B9.E3.83.88.E3.81.AE.E4.B8.8A.E4.B8.8B.E4.B8.AD.E5.A4.AE.E9.85.8D.E7.BD.AE">吹きだし内テキストの上下中央配置</h3><p>display:table, display:table-cell は、吹きだし内のテキストの上下中央配置に使用が検討されるが...[[BR]]\r
+<br />ie7 以下については、条件付コメントで、tableタグを使用.\r
+</p><p>html中\r
+<pre>&lt;!--[if lte IE 7]&gt;&lt;a href=&quot;#&quot;&gt;&lt;table&gt;&lt;tr&gt;&lt;td&gt;&lt;![endif]--&gt;\r
+ &lt;span&gt;Hello&lt;/span&gt;\r
+&lt;!--[if lte IE 7]&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;&lt;/a&gt;&lt;![endif]--&gt;\r
+</pre></p><p>xsl中で使うと\r
+<pre>&lt;xsl:comment&gt;&lt;![CDATA[[if lte IE 7]&gt;&lt;table&gt;&lt;tr&gt;&lt;td&gt;&lt;![endif]]]&gt;&lt;/xsl:comment&gt;\r
+ &lt;span&gt;&lt;xsl:apply-templates/&gt;&lt;/span&gt;\r
+&lt;xsl:comment&gt;&lt;![CDATA[[if lte IE 7]&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;&lt;![endif]]]&gt;&lt;/xsl:comment&gt;\r
+</pre></p><p>また、firefox3.5 について、display:table 周りのバグについて報告されている.\r
+</p><blockquote class="citation"><p>Project IE: Firefox 3.5 の display: table;(table-row; table-cell;) 関連の挙動について[[BR]]\r
+<br /><a href="http://ie-style.blogspot.com/2009/08/firefox-35-display-tabletable-row-table.html" class="external" rel="nofollow">http://ie-style.blogspot.com/2009/08/firefox-35-display-tabletable-row-table.html</a><br />\r
+CSSで display: table-cell; を指定してマルチカラムレイアウトを行っている場合に Firefox 3.5 だとまれにカラム落ちしてしまうという現象が起きてしまいます。\r
+</p></blockquote><p>記事によると、display:table-cell に対して、display:table でなく、display:table-row を使っておくのがいいそうだ.</p>]]>\r
+    </content:encoded>\r
+      </item>\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/HowToMakeSpeachBalloon">\r
+    <title>HowToMakeSpeachBalloon</title>\r
+\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/HowToMakeSpeachBalloon</link>\r
+    <dc:identifier>HowToMakeSpeachBalloon</dc:identifier>\r
+    <dc:date>2012-01-01T01:59:53+09:00</dc:date>\r
+        <description>\r
+      <![CDATA[== フキダシテンプレート\r
+[[Embed(http://static.sourceforge.jp/thumb/g/2/949/640x640_0.png)]]\r
+フキダシテンプレートを追加するには尻尾の向きと枠のサイズのバリエーションがいくつになるかを決定しなければなりません。\r
+尻尾のバリエーション数をtail_limit、枠のバリエーション数を_limitとして決定してください。\r
+そし]]>\r
+    </description>\r
+    <content:encoded>\r
+\r
+      <![CDATA[<h2 id="h2-.E3.83.95.E3.82.AD.E3.83.80.E3.82.B7.E3.83.86.E3.83.B3.E3.83.97.E3.83.AC.E3.83.BC.E3.83.88">フキダシテンプレート</h2><img src="http://static.sourceforge.jp/thumb/g/2/949/640x640_0.png" alt="640x640_0.png" id="emb-http:2f2fstatic.sourceforge.jp2fthumb2fg2f22f9492f640x640_0.png-1" title="640x640_0.png" class="embed-image"><p>\r
+フキダシテンプレートを追加するには尻尾の向きと枠のサイズのバリエーションがいくつになるかを決定しなければなりません。\r
+尻尾のバリエーション数をtail_limit、枠のバリエーション数を_limitとして決定してください。\r
+そして、それらすべての組み合わせの枠テンプレートとテキストテンプレートを用意してください。一つでも欠けると追加できません。\r
+</p><p>例えば、尻尾が上下左右ならtail_limitが4。サイズが大中小ならで_limitが3で、4*3で合計12の枠テンプレートとテキストテンプレートを用意します。\r
+</p><p>→tail ↓Border\r
+<table class="wikitable" border="1"><tbody><tr><td> </td><td>1</td><td>2</td><td>3</td><td>4</td></tr><tr><td>1</td><td>小-上</td><td>小-右</td><td>小-下</td><td>小-左</td></tr><tr><td>2</td><td>中-上</td><td>中-右</td><td>中-下</td><td>中-左</td></tr><tr><td>3</td><td>大-上</td><td>大-右</td><td>大-下</td><td>大-左</td></tr></tbody></table></p><p>フキダシテンプレートに必要な項目は以下です。\r
+<table class="wikitable" border="1"><tbody><tr><td>項目名</td><td>意味</td><td>備考</td></tr><tr><td>name</td><td>フキダシの名前</td><td> </td></tr><tr><td>tail_limit</td><td>尻尾のバリエーション数</td><td> </td></tr><tr><td>border_limit</td><td>サイズのバリエーション数</td><td> </td></tr></tbody></table></p><h2 id="h2-.E6.9E.A0.E3.83.86.E3.83.B3.E3.83.97.E3.83.AC.E3.83.BC.E3.83.88">枠テンプレート</h2><p>枠は画像で用意します。フキダシ用の画像を用意して素材として投稿します。\r
+各種フキダシ素材を投稿したらIDをメモします。\r
+</p><p>枠テンプレートに必要な項目は以下です。\r
+<table class="wikitable" border="1"><tbody><tr><td>項目名</td><td>意味</td><td>備考</td></tr><tr><td>resource_picture_id</td><td>フキダシ素材のID</td><td> </td></tr><tr><td>tail</td><td>尻尾の番号</td><td>1から始まりtail_limit-1で終わること</td></tr><tr><td>border</td><td>サイズの番号</td><td>1から始まり_limit-1で終わること</td></tr><tr><td>min_width</td><td>横方向のサイズが小さい方に切り替わる幅</td><td>0のとき、切り替えは発生しない</td></tr><tr><td>max_width</td><td>横方向のサイズが大きい方に切り替わる幅</td><td>0のとき、切り替えは発生しない</td></tr><tr><td>min_height</td><td>縦方向のサイズが小さい方に切り替わる高さ</td><td>0のとき、切り替えは発生しない</td></tr><tr><td>max_height</td><td>縦方向のサイズが大きい方に切り替わる高さ</td><td>0のとき、切り替えは発生しない</td></tr></tbody></table></p><h2 id="h2-.E3.83.86.E3.82.AD.E3.82.B9.E3.83.88.E3.83.86.E3.83.B3.E3.83.97.E3.83.AC.E3.83.BC.E3.83.88">テキストテンプレート</h2><p>枠画像のどの位置にテキストを表示するかを決めて座標をメモします。\r
+</p><table class="wikitable" border="1"><tbody><tr><td>項目名</td><td>意味</td><td>備考</td></tr><tr><td>top_offset</td><td>テキストの表示を開始するx座標</td><td> </td></tr><tr><td>left_offset</td><td>テキストの表示を開始するy座標</td><td> </td></tr><tr><td>width</td><td>テキストの表示幅</td><td> </td></tr><tr><td>height</td><td>テキストの表示高さ</td><td> </td></tr></tbody></table><p>offset と width, height ですが、単位は % になりますか??(itozyun)\r
+</p><h3 id="h3-.E3.83.87.E3.83.BC.E3.82.BF.E4.BD.9C.E6.88.90">データ作成</h3><p>これまでのメモからデータを作成します。データはjsonで作成します。\r
+</p>]]>\r
+    </content:encoded>\r
+      </item>\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/ClientSide">\r
+    <title>ClientSide</title>\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/ClientSide</link>\r
+    <dc:identifier>ClientSide</dc:identifier>\r
+\r
+    <dc:date>2011-12-31T22:34:44+09:00</dc:date>\r
+        <description>\r
+      <![CDATA[= クライアント側\r
\r
+ぺったんR におけるユーザーの行動はマンガの閲覧 と マンガの編集に大きく分けられる.[[BR]]\r
+マンガの閲覧がすべてのユーザーに可能であるのに対し、マンガの編集は原則ログインしたユーザーが可能となる。[[BR]]\r
+またログイン以降のユーザーの操作は、javascriptを有効にする必要がある.[[BR]]\r
+\r
+== マンガの閲覧\r
+ぺったんR において、ブラウ]]>\r
+    </description>\r
+    <content:encoded>\r
+      <![CDATA[<h1 id="h1-.E3.82.AF.E3.83.A9.E3.82.A4.E3.82.A2.E3.83.B3.E3.83.88.E5.81.B4">クライアント側</h1><div class="indent">\r
+</div><p>ぺったんR におけるユーザーの行動はマンガの閲覧 と マンガの編集に大きく分けられる.[[BR]]\r
+<br />マンガの閲覧がすべてのユーザーに可能であるのに対し、マンガの編集は原則ログインしたユーザーが可能となる。[[BR]]\r
+<br />またログイン以降のユーザーの操作は、javascriptを有効にする必要がある.[[BR]]\r
+<br /></p><h2 id="h2-.E3.83.9E.E3.83.B3.E3.82.AC.E3.81.AE.E9.96.B2.E8.A6.A7">マンガの閲覧</h2><p>ぺったんR において、ブラウザでのマンガ状コンテンツの閲覧のために、ユーザーは Flash も含めて特別なプラグインを必要としない.\r
+</p><h3 id="h3-html.20.2B.20css2.1">html + css2.1</h3><p>ぺったんと、ぺったんを元にする ぺったんRは、マンガ状のコンテンツの表示に css2.1 でレイアウトする.[[BR]]\r
+<br />以上をサポートするブラウザであれば、ぺったん 及び ぺったんR のコンテンツは閲覧ができる.[[BR]]\r
+<br /></p><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/HtmlAndCss2">HtmlAndCss2</a>\r
+</li></ul><h3 id="h3-javascript">javascript</h3><p>ぺったんR で新たに追加された機能や、ぺったんRサーバへの負荷を抑えるため、javascript に加え css3, SVG といった新しいWeb標準が使われる.[[BR]]\r
+<br />これらをサポートしないブラウザも少なくなく、VML, ActiveX, flash といった非Web標準も利用する.[[BR]]\r
+<br /></p><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/XbackendReversibleImage">XbackendReversibleImage</a>\r
+</li><li><a href="http://sourceforge.jp/projects/pettanr/wiki/XbackendSpeachBalloon">XbackendSpeachBalloon</a>\r
+</li><li><a href="http://sourceforge.jp/projects/pettanr/wiki/PngFix">PngFix</a>\r
+</li></ul><h2 id="h2-.E3.82.B3.E3.83.9F.E3.83.83.E3.82.AF.E3.81.AE.E7.AE.A1.E7.90.86.E3.83.BB.E7.94.BB.E5.83.8F.E3.81.AE.E7.AE.A1.E7.90.86.E3.83.BB.E3.82.B3.E3.83.9E.E3.81.AE.E7.B7.A8.E9.9B.86.E3.83.BB.E3.83.A6.E3.83.BC.E3.82.B6.E3.83.BC.E8.A8.AD.E5.AE.9A">コミックの管理・画像の管理・コマの編集・ユーザー設定</h2><p>これらのログインユーザーのための機能は、javascript が前提となる.[[BR]]\r
+<br />画面は Ajax で用意されるため、サーバ側はユーザのデータの管理とクライアントとの通信に専念できる.[[BR]]\r
+<br /></p><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/JavascriptEditor">JavascriptEditor</a>\r
+</li><li><a href="http://sourceforge.jp/projects/pettanr/wiki/JsonApi">JsonApi</a>\r
+</li></ul><h2 id="h2-.E5.AF.BE.E5.BF.9C.E3.83.96.E3.83.A9.E3.82.A6.E3.82.B6">対応ブラウザ</h2><h3 id="h3-.E3.83.96.E3.83.A9.E3.82.A6.E3.82.B6.E3.82.B7.E3.82.A7.E3.82.A2">ブラウザシェア</h3><p>IE系では、css3 や SVG をサポートしない IE8 以下がまだまだ多く、IE6 でそのシェアは10%近く.ブラウザシェアは国毎にばらつきがあり、お隣の中国・韓国では IE のシェアが多く、IE6 でも 20~30% になる.[[BR]]\r
+<br /></p><blockquote class="citation"><p>今なおブラウザシェア10.1%もあるIE6とどう向き合えばいいのか[[BR]]\r
+<br /><a href="http://weboook.blog22.fc2.com/blog-entry-248.html" class="external" rel="nofollow">http://weboook.blog22.fc2.com/blog-entry-248.html</a>\r
+</p></blockquote><p>javascript を切っているブラウザは 1% ほどらしい.[[BR]]\r
+<br /></p><blockquote class="citation"><p><a href="http://sourceforge.jp/projects/pettanr/wiki/JavaScript">JavaScript</a>をオフにしているブラウザは1%前後。米ヤフー調べ[[BR]]\r
+<br /><a href="http://www.publickey1.jp/blog/10/javascript1.html" class="external" rel="nofollow">http://www.publickey1.jp/blog/10/javascript1.html</a>\r
+</p></blockquote>]]>\r
+    </content:encoded>\r
+      </item>\r
+\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/PngFix">\r
+    <title>PngFix</title>\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/PngFix</link>\r
+    <dc:identifier>PngFix</dc:identifier>\r
+    <dc:date>2011-12-29T16:31:59+09:00</dc:date>\r
+        <description>\r
+      <![CDATA[= Internet Exproler 6 以下での PNG 画像の表示について\r
+ie6 以下のブラウザでは 透過情報付の png 画像を正しく表示することができない.[[BR]]\r
+このため ぺったん では、png 画像を非推奨としてきた.[[BR]]\r
+ぺったんRでも それを踏襲することは変わりない.[[BR]]\r
+しかし、可能な限り作者の意図したとおりに作品を閲覧してもらうため、クロスバッ]]>\r
+\r
+    </description>\r
+    <content:encoded>\r
+      <![CDATA[<h1 id="h1-Internet.20Exproler.206.20.E4.BB.A5.E4.B8.8B.E3.81.A7.E3.81.AE.20PNG.20.E7.94.BB.E5.83.8F.E3.81.AE.E8.A1.A8.E7.A4.BA.E3.81.AB.E3.81.A4.E3.81.84.E3.81.A6">Internet Exproler 6 以下での PNG 画像の表示について</h1><p>ie6 以下のブラウザでは 透過情報付の png 画像を正しく表示することができない.[[BR]]\r
+<br />このため ぺったん では、png 画像を非推奨としてきた.[[BR]]\r
+<br />ぺったんRでも それを踏襲することは変わりない.[[BR]]\r
+<br />しかし、可能な限り作者の意図したとおりに作品を閲覧してもらうため、クロスバックエンドな png 表示サポートを実施する.[[BR]]\r
+<br />とはいえ、必要なプラグイン等がインストールされていない、機能が無効になっている場合、透過情報は正しく反映されない.[[BR]]\r
+<br /></p><h2 id="h2-.E3.81.AF.E3.81.98.E3.82.81.E3.81.AB">はじめに</h2><h2 id="h2-VML">VML</h2><h2 id="h2-ActiveX.20Alpha.20Image.20Loader">ActiveX Alpha Image Loader</h2><h2 id="h2-Flash">Flash</h2>]]>\r
+    </content:encoded>\r
+      </item>\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/ForWebmasters">\r
+    <title>ForWebmasters</title>\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/ForWebmasters</link>\r
+\r
+    <dc:identifier>ForWebmasters</dc:identifier>\r
+    <dc:date>2011-12-28T09:07:11+09:00</dc:date>\r
+        <description>\r
+      <![CDATA[= 管理者向け\r
+\r
+== フキダシテンプレートのメンテナンス\r
+ * フキダシテンプレートについて AboutSpeachBalloon\r
+ * フキダシテンプレートの追加 HowToMakeSpeachBalloon\r
+\r
+== ライセンスのメンテナンス\r
+ * ライセンスについて]]>\r
+    </description>\r
+    <content:encoded>\r
+      <![CDATA[<h1 id="h1-.E7.AE.A1.E7.90.86.E8.80.85.E5.90.91.E3.81.91">管理者向け</h1><h2 id="h2-.E3.83.95.E3.82.AD.E3.83.80.E3.82.B7.E3.83.86.E3.83.B3.E3.83.97.E3.83.AC.E3.83.BC.E3.83.88.E3.81.AE.E3.83.A1.E3.83.B3.E3.83.86.E3.83.8A.E3.83.B3.E3.82.B9">フキダシテンプレートのメンテナンス</h2><ul><li>フキダシテンプレートについて AboutSpeachBalloon\r
+<a href="http://sourceforge.jp/projects/pettanr/wiki/AboutSpeachBalloon">AboutSpeachBalloon</a></li><li>フキダシテンプレートの追加 HowToMakeSpeachBalloon\r
+<a href="http://sourceforge.jp/projects/pettanr/wiki/HowToMakeSpeachBalloon">HowToMakeSpeachBalloon</a></li></ul><h2 id="h2-.E3.83.A9.E3.82.A4.E3.82.BB.E3.83.B3.E3.82.B9.E3.81.AE.E3.83.A1.E3.83.B3.E3.83.86.E3.83.8A.E3.83.B3.E3.82.B9">ライセンスのメンテナンス</h2><ul><li>ライセンスについて</li></ul>]]>\r
+    </content:encoded>\r
+\r
+      </item>\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/AboutSpeachBalloon">\r
+    <title>AboutSpeachBalloon</title>\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/AboutSpeachBalloon</link>\r
+    <dc:identifier>AboutSpeachBalloon</dc:identifier>\r
+    <dc:date>2011-12-28T08:57:17+09:00</dc:date>\r
+        <description>\r
+\r
+      <![CDATA[= フキダシテンプレート\r
+フキダシとは、線で囲まれた枠の中に文章が書かれたものです。つまり、枠と文章を合わせたものがフキダシとなるわけです。\r
+\r
+ぺったんでフキダシを作るには、枠の素材をコマに貼り、その上にテキストを貼ります。\r
+\r
+しかし、このような作り方は操作に手数がかかり、扱いも煩雑になります。漫画はフキダシで絵をしゃべらすことで初めて成立するものです。漫画ツールとしては当たり前の機能で]]>\r
+    </description>\r
+    <content:encoded>\r
+      <![CDATA[<h1 id="h1-.E3.83.95.E3.82.AD.E3.83.80.E3.82.B7.E3.83.86.E3.83.B3.E3.83.97.E3.83.AC.E3.83.BC.E3.83.88">フキダシテンプレート</h1><p>フキダシとは、線で囲まれた枠の中に文章が書かれたものです。つまり、枠と文章を合わせたものがフキダシとなるわけです。\r
+</p><p>ぺったんでフキダシを作るには、枠の素材をコマに貼り、その上にテキストを貼ります。\r
+</p><p>しかし、このような作り方は操作に手数がかかり、扱いも煩雑になります。漫画はフキダシで絵をしゃべらすことで初めて成立するものです。漫画ツールとしては当たり前の機能ですから、最小限の操作でフキダシを扱えなければ困ります。そこで、ぺったんはオーソドックスなフキダシをテンプレート化して用意しました。もちろんテンプレートは自由に追加できます。\r
+</p><h1 id="h1-.E3.83.95.E3.82.AD.E3.83.80.E3.82.B7.E3.83.86.E3.83.B3.E3.83.97.E3.83.AC.E3.83.BC.E3.83.88.E3.81.AE.E6.A7.8B.E6.88.90">フキダシテンプレートの構成</h1><p>フキダシテンプレートは次の三つの階層で構成されています。\r
+</p><ul><li>フキダシテンプレート SpeachBalloon\r
+<a href="http://sourceforge.jp/projects/pettanr/wiki/SpeachBalloon">SpeachBalloon</a></li><li>枠テンプレート BalloonTemplate\r
+<a href="http://sourceforge.jp/projects/pettanr/wiki/BalloonTemplate">BalloonTemplate</a></li><li>テキストテンプレート SpeachTemplate\r
+<a href="http://sourceforge.jp/projects/pettanr/wiki/SpeachTemplate">SpeachTemplate</a></li></ul><p>フキダシは枠とテキストから構成されます。枠テンプレートとテキストテンプレートがそれです。ただし、フキダシには大抵吹き出し口(ぺったんでは尻尾と言います)が付きますから、同じフキダシでもいくつかのバリエーションができます。それをグループ化するのがフキダシテンプレートです。\r
+</p><h2 id="h2-.E6.83.B3.E5.AE.9A.E3.81.99.E3.82.8B.E3.83.90.E3.83.AA.E3.82.A8.E3.83.BC.E3.82.B7.E3.83.A7.E3.83.B3">想定するバリエーション</h2><p>ぺったんでは次の二つのバリエーションを想定しています。\r
+</p><ul><li>尻尾の向き\r
+</li><li>枠のサイズ\r
+</li></ul><p>尻尾の向きはフキダシの使われ方によって変わりますが、上下左右や角の四隅などに付くことが多いでしょうか。このバリエーションが多いほど融通が利くフキダシになります。\r
+</p><p>ぺったんはコマに貼ったフキダシを自由にサイズ調整できますが、フキダシを極端に拡大あるいは縮小すると、枠の画像によっては線が太ってしまったり、かすれてしまうことがあります。枠の画像には適正なサイズが要求されますので、より良いテンプレートはいくつかのサイズのバリエーションを用意する必要があります。\r
+</p>]]>\r
+    </content:encoded>\r
+      </item>\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/JsonApi">\r
+    <title>JsonApi</title>\r
+\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/JsonApi</link>\r
+    <dc:identifier>JsonApi</dc:identifier>\r
+    <dc:date>2011-12-26T19:13:24+09:00</dc:date>\r
+        <description>\r
+      <![CDATA[= JsonAPI\r
+ぺったんはjsonを利用したAPIに対応している。というよりRailsの仕様に乗っかっている。Rails知ってる人はよまなくていい。\r
+\r
+JsonAPIを使えば、ブラウザから操作せずとも直接データを操作できる。外部のプログラムからぺったんを楽しめる。\r
+\r
+APIにはCRUD、つまり、create,read,update,deleteがあり、それぞれがHTTPのPOST,G]]>\r
+    </description>\r
+    <content:encoded>\r
+\r
+      <![CDATA[<h1 id="h1-JsonAPI">JsonAPI</h1><p>ぺったんはjsonを利用したAPIに対応している。というよりRailsの仕様に乗っかっている。Rails知ってる人はよまなくていい。\r
+</p><p>JsonAPIを使えば、ブラウザから操作せずとも直接データを操作できる。外部のプログラムからぺったんを楽しめる。\r
+</p><p>APIにはCRUD、つまり、create,read,update,deleteがあり、それぞれがHTTPのPOST,GET,PUT,DELETEに対応しているが、普通のブラウザからはGETしかできないので、手っ取り早くJsonAPIで遊ぶならcurlをインストールすると良い。\r
+</p><p>なお、railsではjsonでのやり取りを次のように規定している。\r
+</p><ul><li>URLの末尾を拡張子のように.jsonする\r
+</li><li>リクエストヘッダはContent-Type: application/jsonとする\r
+</li></ul><h2 id="h2-json.E3.83.87.E3.83.BC.E3.82.BF.E3.81.AE.E5.8F.96.E5.BE.97">jsonデータの取得</h2><p>例えば、ID:2のコマPanelのデータをcurlで取得するには次のようにする。\r
+</p><pre>curl http://hostname/panels/2.json -X GET -H &quot;Content-Type: application/json&quot;\r
+</pre><h2 id="h2-json.E3.81.A7.E3.81.AE.E6.8A.95.E7.A8.BF">jsonでの投稿</h2><p>例えば、コミックをcurlで作成するには次のようにする。このとき、作成するためのjsonデータはcomic_create.jsonファイルに用意されているものとする。\r
+</p><pre>curl http://hostname/comics.json  -X POST -H &quot;Content-Type: application/json&quot; -d @comic_create.json\r
+</pre><h2 id="h2-json.E3.81.A7.E3.81.AE.E6.9B.B4.E6.96.B0">jsonでの更新</h2><p>例えば、コミックをcurlで更新するには次のようにする。このとき、更新するためのjsonデータはcomic_update.jsonファイルに用意されているものとする。\r
+</p><pre>curl http://hostname/comics.json  -X PUT -H &quot;Content-Type: application/json&quot; -d @comic_update.json\r
+</pre><h2 id="h2-json.E3.81.A7.E3.81.AE.E5.89.8A.E9.99.A4">jsonでの削除</h2><p>例えば、コミックをcurlで削除するには次のようにする。このとき、削除するためのjsonデータはcomic_delete.jsonファイルに用意されているものとする。\r
+</p><pre>curl http://hostname/comics.json  -X DELETE -H &quot;Content-Type: application/json&quot; -d @comic_delete.json\r
+</pre><p>※普通に削除するだけならDELETEメソッドだけで削除できる。jsonデータcomic_delete.jsonは必要ないはずだが、誰でも削除できるのはおかしな話なので、大抵の場合は認証がいるだろう。認証に必要なauth_tokenを渡すのだが、auth_tokenについては後述する。\r
+</p><h2 id="h2-json.E3.83.87.E3.83.BC.E3.82.BF.E3.81.AE.E4.BD.9C.E3.82.8A.E6.96.B9">jsonデータの作り方</h2><p>jsonデータがどんなものかはググッてもらうとして、rails風なところを…\r
+</p><p>コミック作成に使ったcomic_create.jsonを例とすると次のようになる。\r
+<pre>{\r
+  &quot;comic&quot;: {\r
+    &quot;title&quot;: &quot;コミック作るテスト&quot;,\r
+    &quot;default_width&quot;: 400,\r
+    &quot;default_height&quot;: 200\r
+  },\r
+  &quot;auth_token&quot;: &quot;XXXXXXXXXXXXXXXX&quot;\r
+}\r
+</pre>comicはコミックのmodel、titleなどはmodelのカラム。モデルの下に必要なカラムをキーにして値を記述する。\r
+</p><p>auth_tokenは認証が必要な操作をする場合に記述する。\r
+</p><h3 id="h3-auth_token">auth_token</h3><p>認証が必要な操作をする場合にはauth_tokenを用意する。auth_tokenはログイン後にプロフィールページを開くと書いてある。今のところは。\r
+</p><h3 id="h3-.E3.83.8D.E3.82.B9.E3.83.88.E3.81.97.E3.81.9F.E3.83.87.E3.83.BC.E3.82.BF.E3.81.AE.E4.BD.9C.E3.82.8A.E6.96.B9">ネストしたデータの作り方</h3><p>コマの投稿など、複数のモデルを一つのトランザクションで更新するような操作はjsonデータも複数のモデルについて記述しなければならない。\r
+</p><p>ネストされている子のデータはモデル名+_attributesをキーとしたハッシュ型の値をペアにして記述する。例えば、コマ絵のモデルpanel_picturesはpanel_pictures_attributesとなる。値側は複数のレコードを含むことが想定されるので、これもハッシュ型とする。こちらのキーは一意であれば何でもよく、値がレコードのデータである。文章じゃよくわからんので、コマ絵panel_pictures一つを含んだコマpanelを作成する場合の実際のデータを示す。\r
+</p><pre>{\r
+  &quot;panel&quot;: {\r
+    &quot;border&quot;: 1,\r
+    &quot;comic_id&quot;: 5,\r
+    &quot;resource_picture_id&quot;: 1,\r
+    &quot;width&quot;: 400,\r
+    &quot;height&quot;: 200,\r
+    &quot;panel_pictures_attributes&quot;: {\r
+      &quot;new1&quot;: {\r
+        &quot;width&quot;: 100,\r
+        &quot;height&quot;: 103,\r
+        &quot;resource_picture_id&quot;: 4,\r
+        &quot;top_offset&quot;: 10,\r
+        &quot;left_offset&quot;: 135,\r
+        &quot;zindex&quot;: 1,\r
+        &quot;v&quot;: 1,\r
+        &quot;h&quot;: 0\r
+      }\r
+    }\r
+  },\r
+  &quot;auth_token&quot;: &quot;XXXXXXXXXXXXXXXX&quot;\r
+}\r
+</pre><p>コマ絵が二枚だと、こんな感じ。\r
+<pre>{\r
+  &quot;panel&quot;: {\r
+    &quot;border&quot;: 1,\r
+    &quot;comic_id&quot;: 5,\r
+    &quot;resource_picture_id&quot;: 1,\r
+    &quot;width&quot;: 400,\r
+    &quot;height&quot;: 200,\r
+    &quot;panel_pictures_attributes&quot;: {\r
+      &quot;new1&quot;: {\r
+        &quot;width&quot;: 100,\r
+        &quot;height&quot;: 103,\r
+        &quot;resource_picture_id&quot;: 4,\r
+        &quot;top_offset&quot;: 10,\r
+        &quot;left_offset&quot;: 135,\r
+        &quot;zindex&quot;: 1,\r
+        &quot;v&quot;: 1,\r
+        &quot;h&quot;: 0\r
+      },\r
+      &quot;new2&quot;: {\r
+        &quot;width&quot;: 50,\r
+        &quot;height&quot;: 75,\r
+        &quot;resource_picture_id&quot;: 1,\r
+        &quot;top_offset&quot;: 30,\r
+        &quot;left_offset&quot;: 14,\r
+        &quot;zindex&quot;: 2,\r
+        &quot;v&quot;: 0,\r
+        &quot;h&quot;: 0\r
+      }\r
+    }\r
+  },\r
+  &quot;auth_token&quot;: &quot;XXXXXXXXXXXXXXXX&quot;\r
+}\r
+</pre></p><p>キーの&quot;new1&quot;と&quot;new2&quot;は適当な命名なんであるが、こんな要領で列挙していけばまとめて作成できる。\r
+</p><p>では、次にコマ絵だけでなくフキダシとセリフも含むデータを作成してみるが、その前に各モデルの関係を整理しておく。\r
+<pre>panel\r
+  panel_pictures\r
+  balloons\r
+    speaches\r
+</pre>だったね。\r
+<pre>{\r
+  &quot;panel&quot;: {\r
+    &quot;border&quot;: 1,\r
+    &quot;comic_id&quot;: 5,\r
+    &quot;resource_picture_id&quot;: 1,\r
+    &quot;width&quot;: 400,\r
+    &quot;height&quot;: 200,\r
+    &quot;panel_pictures_attributes&quot;: {\r
+      &quot;new1&quot;: {\r
+        &quot;width&quot;: 100,\r
+        &quot;height&quot;: 103,\r
+        &quot;resource_picture_id&quot;: 4,\r
+        &quot;top_offset&quot;: 10,\r
+        &quot;left_offset&quot;: 135,\r
+        &quot;zindex&quot;: 3,\r
+        &quot;v&quot;: 1,\r
+        &quot;h&quot;: 0\r
+      }\r
+    },\r
+    &quot;balloons_attributes&quot;: {\r
+      &quot;newf1&quot;: {\r
+        &quot;balloon_template_id&quot;: 1,\r
+        &quot;resource_picture_id&quot;: 2,\r
+        &quot;tail&quot;: 1,\r
+        &quot;border&quot;: 1,\r
+        &quot;zindex&quot;: 5,\r
+        &quot;width&quot;: 81,\r
+        &quot;height&quot;: 63,\r
+        &quot;top_offset&quot;: 120,\r
+        &quot;left_offset&quot;: 35,\r
+        &quot;speaches_attributes&quot;: {\r
+          &quot;newf1s1&quot;: {\r
+            &quot;content&quot;: &quot;test&quot;,\r
+            &quot;width&quot;: 61,\r
+            &quot;height&quot;: 43,\r
+            &quot;top_offset&quot;: 10,\r
+            &quot;left_offset&quot;: 10\r
+          }\r
+        }\r
+      }\r
+    }\r
+  },\r
+  &quot;auth_token&quot;: &quot;XXXXXXXXXXXXXXXX&quot;\r
+}\r
+</pre></p><h3 id="h3-.E3.83.8D.E3.82.B9.E3.83.88.E3.81.97.E3.81.9F.E3.83.87.E3.83.BC.E3.82.BF.E3.81.AE.E6.9B.B4.E6.96.B0">ネストしたデータの更新</h3><p>あるコマのセリフを変更したいとする。セリフはspeachなのでspeaches経由で更新したいところだが、ぺったんの仕様はコマ全体で更新することになっているので、speachesのAPIは用意されていない。コマの変更はpanel経由で行う。このとき、jsonデータでは、どのように変更対象のセリフを指示するのだろうか。\r
+</p><p>結論としてはidをデータに含めて指定する。例えば、セリフのidが3のときは次のようになる。\r
+</p><pre>{\r
+  &quot;panel&quot;: {\r
+    &quot;balloons_attributes&quot;: {\r
+      &quot;b2&quot;: {\r
+        &quot;id&quot;: 2,\r
+        &quot;speaches_attributes&quot;: {\r
+          &quot;s3&quot;: {\r
+            &quot;id&quot;: 3,\r
+            &quot;content&quot;: &quot;modify&quot;\r
+          }\r
+        }\r
+      }\r
+    }\r
+  },\r
+  &quot;auth_token&quot;: &quot;XXXXXXXXXXXXXXXX&quot;\r
+}\r
+</pre><p>idが指定されていないと新規追加となってしまう。\r
+</p><h3 id="h3-.E3.83.8D.E3.82.B9.E3.83.88.E3.81.97.E3.81.9F.E3.83.87.E3.83.BC.E3.82.BF.E3.81.AE.E5.89.8A.E9.99.A4">ネストしたデータの削除</h3><p>削除する場合、更新のときと同じようにidを指定しつつ_destroyにフラグを立てる。例えば、idが2のフキダシをコマから削除する場合、次のようにする。\r
+</p><pre>{\r
+  &quot;panel&quot;: {\r
+    &quot;balloons_attributes&quot;: {\r
+      &quot;b2&quot;: {\r
+        &quot;id&quot;: 2,\r
+        &quot;_destroy&quot;: 1\r
+      }\r
+    }\r
+  },\r
+  &quot;auth_token&quot;: &quot;XXXXXXXXXXXXXXXX&quot;\r
+}\r
+</pre><h2 id="h2-.E7.94.BB.E5.83.8F.E3.81.AE.E6.8A.95.E7.A8.BF">画像の投稿</h2><p>auth_tokenを含みながらのファイル送信がよくわからん。いろんなパターンで試してみたが素直にはいかなかった。苦肉の策が画像データを一度Base64でエンコードしたものをテキストとして送信すること。次の例は当然エンコードテキストは省略されている。\r
+<pre>{\r
+  &quot;original_picture&quot;: {\r
+    &quot;file&quot;: \r
+&quot;iVBORw0KGgoAAAANSUhEUgAAAWIAAAF7CAYAAADohYEpAAAcW0lEQVR4nO3d\r
+  :\r
+  :\r
+ghgAlP0/Bxl7hN5Zu0EAAAAASUVORK5CYII=\r
+&quot;\r
+  },\r
+  &quot;auth_token&quot;: &quot;XXXXXXXXXXXXXXXX&quot;\r
+}\r
+</pre></p>]]>\r
+    </content:encoded>\r
+      </item>\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/AboutLisence">\r
+    <title>AboutLisence</title>\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/AboutLisence</link>\r
+    <dc:identifier>AboutLisence</dc:identifier>\r
+\r
+    <dc:date>2011-12-25T12:47:25+09:00</dc:date>\r
+        <description>\r
+      <![CDATA[= ライセンスについて\r
+※ここはぺったんに投稿された画像の著作権に関する話題です。\r
+\r
+== 選べるライセンス\r
+ぺったんには、あらかじめ一般的なライセンスを用意してあります。パブリックドメインやクリエイティブコモンズなどです。\r
+\r
+絵師は提供する素材にこれらのライセンスを付与して明記することができます。\r
+\r
+== 用意されたライセンス\r
+ * Public Domain\r
+   * ライ]]>\r
+    </description>\r
+    <content:encoded>\r
+      <![CDATA[<h1 id="h1-.E3.83.A9.E3.82.A4.E3.82.BB.E3.83.B3.E3.82.B9.E3.81.AB.E3.81.A4.E3.81.84.E3.81.A6">ライセンスについて</h1><p>※ここはぺったんに投稿された画像の著作権に関する話題です。\r
+</p><h2 id="h2-.E9.81.B8.E3.81.B9.E3.82.8B.E3.83.A9.E3.82.A4.E3.82.BB.E3.83.B3.E3.82.B9">選べるライセンス</h2><p>ぺったんには、あらかじめ一般的なライセンスを用意してあります。パブリックドメインやクリエイティブコモンズなどです。\r
+</p><p>絵師は提供する素材にこれらのライセンスを付与して明記することができます。\r
+</p><h2 id="h2-.E7.94.A8.E6.84.8F.E3.81.95.E3.82.8C.E3.81.9F.E3.83.A9.E3.82.A4.E3.82.BB.E3.83.B3.E3.82.B9">用意されたライセンス</h2><ul><li>Public Domain\r
+<ul><li>ライセンス表示 http://ja.wiki<a href="http://ja.wikipedia.org/wiki/%E3%83%91%E3%83%96%E3%83%AA%E3%83%83%E3%82%AF%E3%83%89%E3%83%A1%E3%82%A4%E3%83%B3" class="external" rel="nofollow">http://ja.wikipedia.org/wiki/%E3%83%91%E3%83%96%E3%83%AA%E3%83%83%E3%82%AF%E3%83%89%E3%83%A1%E3%82%A4%E3%83%B3</a></li></ul></li><li>Creative Commons 3.0(by)\r
+<ul><li>ライセンス表示 http://creativ<a href="http://creativecommons.org/licenses/by/3.0/legalcode" class="external" rel="nofollow">http://creativecommons.org/licenses/by/3.0/legalcode</a></li></ul></li><li>Creative Commons 3.0(by_sa)\r
+<ul><li>ライセンス表示 http://creativ<a href="http://creativecommons.org/licenses/by-sa/3.0/legalcode" class="external" rel="nofollow">http://creativecommons.org/licenses/by-sa/3.0/legalcode</a></li></ul></li><li>Creative Commons 3.0(by_nd)\r
+<ul><li>ライセンス表示 http://creativ<a href="http://creativecommons.org/licenses/by-nd/3.0/legalcode" class="external" rel="nofollow">http://creativecommons.org/licenses/by-nd/3.0/legalcode</a></li></ul></li><li>Creative Commons 3.0(by_nc)\r
+<ul><li>ライセンス表示 http://creativ<a href="http://creativecommons.org/licenses/by-nc/3.0/legalcode" class="external" rel="nofollow">http://creativecommons.org/licenses/by-nc/3.0/legalcode</a></li></ul></li><li>Creative Commons 3.0(by_nc_sa)\r
+<ul><li>ライセンス表示 http://creativ<a href="http://creativecommons.org/licenses/by-nc-sa/3.0/legalcode" class="external" rel="nofollow">http://creativecommons.org/licenses/by-nc-sa/3.0/legalcode</a></li></ul></li><li>Creative Commons 3.0(by_nc_nd)\r
+<ul><li>ライセンス表示 http://creativ<a href="http://creativecommons.org/licenses/by-nc-nd/3.0/legalcode" class="external" rel="nofollow">http://creativecommons.org/licenses/by-nc-nd/3.0/legalcode</a></li></ul></li><li>Unknown\r
+<ul><li>著作権がはっきりしないもの\r
+</li></ul></li></ul><h2 id="h2-.E5.90.88.E3.81.A3.E3.81.9F.E3.83.A9.E3.82.A4.E3.82.BB.E3.83.B3.E3.82.B9.E3.81.8C.E3.81.AA.E3.81.84">合ったライセンスがない</h2><p>自前の作品に特殊なライセンスを付与したいと考えるケースもあるでしょう。そういった場合、絵師がライセンスを作成することができます。このような特殊なライセンスをぺったんではオリジナルライセンスと言います。それに対して、ぺったんにあらかじめ用意されたライセンスをコモンライセンスと言います。\r
+</p><p>特に区別したい場合は、コモンライセンス・オリジナルライセンスと言いますが、ただライセンスと言った場合は、両者を合わせたものとなります。\r
+</p><h2 id="h2-.E3.82.B3.E3.83.A2.E3.83.B3.E3.83.A9.E3.82.A4.E3.82.BB.E3.83.B3.E3.82.B9">コモンライセンス</h2><p>コモンライセンスをメンテナンスできるのは管理者だけです。\r
+</p><h2 id="h2-.E3.82.AA.E3.83.AA.E3.82.B8.E3.83.8A.E3.83.AB.E3.83.A9.E3.82.A4.E3.82.BB.E3.83.B3.E3.82.B9">オリジナルライセンス</h2><p>絵師はオリジナルライセンスを作成できます。また、自分が作成したオリジナルライセンスを更新できます。\r
+</p><h3 id="h3-.E3.82.B3.E3.83.A2.E3.83.B3.E3.83.A9.E3.82.A4.E3.82.BB.E3.83.B3.E3.82.B9.E3.81.B8.E3.81.AE.E6.98.87.E6.A0.BC">コモンライセンスへの昇格</h3><p>何かと信頼の薄いオリジナルライセンスですが、ある程度の評価が得られ、ぺったん管理者が有用性を認めればコモンライセンスへ昇格することもあります。\r
+</p><h2 id="h2-.E3.83.A9.E3.82.A4.E3.82.BB.E3.83.B3.E3.82.B9.E3.81.8C.E5.89.8A.E9.99.A4.E3.81.95.E3.82.8C.E3.82.8B.E3.81.A8">ライセンスが削除されると</h2><p>ライセンスを削除してしまうと、そのライセンスを適用した素材はすべてライセンスなしになってしまいます。それを避けるために一枚でも適用されているライセンスは削除できません。\r
+</p><h2 id="h2-.E3.82.AA.E3.83.AA.E3.82.B8.E3.83.8A.E3.83.AB.E3.83.A9.E3.82.A4.E3.82.BB.E3.83.B3.E3.82.B9.E3.81.A7.E6.98.8E.E7.A4.BA.E3.81.A7.E3.81.8D.E3.82.8B.E3.81.93.E3.81.A8">オリジナルライセンスで明示できること</h2><ul><li>cc_by\r
+<ul><li>作者の表示\r
+</li></ul></li><li>cc_sa\r
+</li><li>cc_nd\r
+</li><li>cc_nc\r
+</li><li>no_resize\r
+<ul><li>サイズ変更の禁止\r
+</li><li>値が 0のとき無効 1のとき有効\r
+</li><li>素材をコマ上でリサイズしてはならない\r
+</li></ul></li><li>no_flip\r
+<ul><li>反転の禁止\r
+</li><li>値が 0のとき無効 1のとき有効\r
+</li><li>素材をコマ上で垂直反転水平反転してはならない\r
+</li></ul></li><li>keep_aspect_ratio\r
+<ul><li>縦横比変更の禁止\r
+</li><li>値が 0のとき無効 1のとき有効\r
+</li><li>素材をコマ上でリサイズしてもよいが縦横比を変えてはならない\r
+</li></ul></li></ul><p>クリエイティブコモンズの属性はすべて用意しましたが、ぺったん上ではあまり効果を発揮できません。というのも、ぺったんには画像を改変する機能が備わっていませんから、改変しようがないし、投稿された素材が改変されたものであるかを判別する手立てがないのです。非営利についても似たようなもので、web上の配布に営利はありません。もちろんアフィリエイトも禁止されているわけではありません。\r
+</p><p>作者の表示については必ず同一ページ内に表示します。ただし、ぺったんRはオープンソースライセンスですから、ソースコードが改変された場合は、その限りではありません。\r
+</p>]]>\r
+    </content:encoded>\r
+      </item>\r
+\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/CommonLisencesController">\r
+    <title>CommonLisencesController</title>\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/CommonLisencesController</link>\r
+    <dc:identifier>CommonLisencesController</dc:identifier>\r
+    <dc:date>2011-12-24T11:03:09+09:00</dc:date>\r
+        <description>\r
+      <![CDATA[= CommonLisencesController \r
+管理者以外に用はないから、すべての機能で管理者だけが認証をパスする。\r
+]]>\r
+\r
+    </description>\r
+    <content:encoded>\r
+      <![CDATA[<h1 id="h1-CommonLisencesController"><a href="http://sourceforge.jp/projects/pettanr/wiki/CommonLisencesController">CommonLisencesController</a></h1><p>管理者以外に用はないから、すべての機能で管理者だけが認証をパスする。\r
+</p>]]>\r
+    </content:encoded>\r
+      </item>\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/LisencesController">\r
+    <title>LisencesController</title>\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/LisencesController</link>\r
+\r
+    <dc:identifier>LisencesController</dc:identifier>\r
+    <dc:date>2011-12-24T10:46:17+09:00</dc:date>\r
+        <description>\r
+      <![CDATA[= LisencesController \r
+コモンライセンスとオリジナルライセンスを統合するためだけにある。閲覧のみで操作はできない。変更作業はすべてCommonLisencesControllerとOriginalLisencesController側にある。\r
+\r
+常識で考えれば、こんな冗長な設計はないんだけど、絵師が作家機能を切り捨てた「絵師サーバ」を独自に稼働させる予定なので切り離してお]]>\r
+    </description>\r
+    <content:encoded>\r
+      <![CDATA[<h1 id="h1-LisencesController"><a href="http://sourceforge.jp/projects/pettanr/wiki/LisencesController">LisencesController</a></h1><p>コモンライセンスとオリジナルライセンスを統合するためだけにある。閲覧のみで操作はできない。変更作業はすべてCommonLisencesControllerとOriginalLisencesController側にある。\r
+<a href="http://sourceforge.jp/projects/pettanr/wiki/CommonLisencesController">CommonLisencesController</a></p><p>常識で考えれば、こんな冗長な設計はないんだけど、絵師が作家機能を切り捨てた「絵師サーバ」を独自に稼働させる予定なので切り離しておいた。\r
+</p>]]>\r
+    </content:encoded>\r
+\r
+      </item>\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/RailsControllers">\r
+    <title>RailsControllers</title>\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/RailsControllers</link>\r
+    <dc:identifier>RailsControllers</dc:identifier>\r
+    <dc:date>2011-12-24T10:26:53+09:00</dc:date>\r
+        <description>\r
+\r
+      <![CDATA[= サーバ側の機能\r
+== コミック関係\r
+ * ComicsController\r
+ * PanelsController\r
+ * PanelPicturesController\r
+ * BalloonsController\r
+ * SpeachsController\r
+== 素材関係\r
+ * OriginalPicturesController\r
+ * ResourcePicturesCont]]>\r
+    </description>\r
+    <content:encoded>\r
+      <![CDATA[<h1 id="h1-.E3.82.B5.E3.83.BC.E3.83.90.E5.81.B4.E3.81.AE.E6.A9.9F.E8.83.BD">サーバ側の機能</h1><h2 id="h2-.E3.82.B3.E3.83.9F.E3.83.83.E3.82.AF.E9.96.A2.E4.BF.82">コミック関係</h2><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/ComicsController">ComicsController</a>\r
+</li><li><a href="http://sourceforge.jp/projects/pettanr/wiki/PanelsController">PanelsController</a>\r
+</li><li><a href="http://sourceforge.jp/projects/pettanr/wiki/PanelPicturesController">PanelPicturesController</a>\r
+</li><li><a href="http://sourceforge.jp/projects/pettanr/wiki/BalloonsController">BalloonsController</a>\r
+</li><li><a href="http://sourceforge.jp/projects/pettanr/wiki/SpeachsController">SpeachsController</a>\r
+</li></ul><h2 id="h2-.E7.B4.A0.E6.9D.90.E9.96.A2.E4.BF.82">素材関係</h2><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/OriginalPicturesController">OriginalPicturesController</a>\r
+</li><li><a href="http://sourceforge.jp/projects/pettanr/wiki/ResourcePicturesController">ResourcePicturesController</a>\r
+</li></ul><h2 id="h2-.E3.83.95.E3.82.AD.E3.83.80.E3.82.B7.E3.83.86.E3.83.B3.E3.83.97.E3.83.AC.E3.83.BC.E3.83.88.E9.96.A2.E4.BF.82">フキダシテンプレート関係</h2><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/SpeachBalloonsController">SpeachBalloonsController</a>\r
+</li><li><a href="http://sourceforge.jp/projects/pettanr/wiki/BallonTemplatesController">BallonTemplatesController</a>\r
+</li><li><a href="http://sourceforge.jp/projects/pettanr/wiki/SpeachTemplatesController">SpeachTemplatesController</a>\r
+</li></ul><h2 id="h2-.E3.83.A9.E3.82.A4.E3.82.BB.E3.83.B3.E3.82.B9.E9.96.A2.E4.BF.82">ライセンス関係</h2><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/LisencesController">LisencesController</a>\r
+</li><li><a href="http://sourceforge.jp/projects/pettanr/wiki/CommonLisencesController">CommonLisencesController</a>\r
+</li><li><a href="http://sourceforge.jp/projects/pettanr/wiki/OriginalLisencesController">OriginalLisencesController</a>\r
+</li></ul><h2 id="h2-.E5.BD.B9.E5.89.B2.E9.96.A2.E4.BF.82">役割関係</h2><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/AuthorsController">AuthorsController</a>\r
+</li><li><a href="http://sourceforge.jp/projects/pettanr/wiki/ArtistsController">ArtistsController</a>\r
+</li><li><a href="http://sourceforge.jp/projects/pettanr/wiki/AdminsController">AdminsController</a>\r
+</li></ul>]]>\r
+    </content:encoded>\r
+      </item>\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/WhatsPettan">\r
+    <title>WhatsPettan</title>\r
+\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/WhatsPettan</link>\r
+    <dc:identifier>WhatsPettan</dc:identifier>\r
+    <dc:date>2011-12-24T09:18:24+09:00</dc:date>\r
+        <description>\r
+      <![CDATA[= ぺったんとは\r
+以下からは一般向け文書。ヘルプとかマニュアルです。\r
+== 絵師\r
+ * GuidanceForArtist\r
+== 作家\r
+ * GuidanceForAuthor\r
+== ライセンス\r
+ * AboutLisence\r
+]]>\r
+    </description>\r
+    <content:encoded>\r
+\r
+      <![CDATA[<h1 id="h1-.E3.81.BA.E3.81.A3.E3.81.9F.E3.82.93.E3.81.A8.E3.81.AF">ぺったんとは</h1><p>以下からは一般向け文書。ヘルプとかマニュアルです。\r
+</p><h2 id="h2-.E7.B5.B5.E5.B8.AB">絵師</h2><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/GuidanceForArtist">GuidanceForArtist</a>\r
+</li></ul><h2 id="h2-.E4.BD.9C.E5.AE.B6">作家</h2><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/GuidanceForAuthor">GuidanceForAuthor</a>\r
+</li></ul><h2 id="h2-.E3.83.A9.E3.82.A4.E3.82.BB.E3.83.B3.E3.82.B9">ライセンス</h2><ul><li><a href="http://sourceforge.jp/projects/pettanr/wiki/AboutLisence">AboutLisence</a>\r
+</li></ul>]]>\r
+    </content:encoded>\r
+      </item>\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/GuidanceForArtist">\r
+    <title>GuidanceForArtist</title>\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/GuidanceForArtist</link>\r
+    <dc:identifier>GuidanceForArtist</dc:identifier>\r
+\r
+    <dc:date>2011-12-23T17:08:22+09:00</dc:date>\r
+        <description>\r
+      <![CDATA[= 絵師さん向け文書?\r
+== 絵師の役割\r
+== 絵師になるには\r
+== 絵のライセンス\r
+\r
+== 絵の活用\r
+ぺったんは投稿された画像を次のように扱います\r
+ * 画像をサーバ内のディスクスペースに保存します\r
+   * この画像を原画と言います\r
+ * 原画を縮小・反転などの加工を施したものをサーバ内のディスクスペースに保存します\r
+   * これらの画像を素材と言います\r
+   * 原画]]>\r
+    </description>\r
+    <content:encoded>\r
+      <![CDATA[<h1 id="h1-.E7.B5.B5.E5.B8.AB.E3.81.95.E3.82.93.E5.90.91.E3.81.91.E6.96.87.E6.9B.B8.EF.BC.9F">絵師さん向け文書?</h1><h2 id="h2-.E7.B5.B5.E5.B8.AB.E3.81.AE.E5.BD.B9.E5.89.B2">絵師の役割</h2><h2 id="h2-.E7.B5.B5.E5.B8.AB.E3.81.AB.E3.81.AA.E3.82.8B.E3.81.AB.E3.81.AF">絵師になるには</h2><h2 id="h2-.E7.B5.B5.E3.81.AE.E3.83.A9.E3.82.A4.E3.82.BB.E3.83.B3.E3.82.B9">絵のライセンス</h2><h2 id="h2-.E7.B5.B5.E3.81.AE.E6.B4.BB.E7.94.A8">絵の活用</h2><p>ぺったんは投稿された画像を次のように扱います\r
+</p><ul><li>画像をサーバ内のディスクスペースに保存します\r
+<ul><li>この画像を原画と言います\r
+</li></ul></li><li>原画を縮小・反転などの加工を施したものをサーバ内のディスクスペースに保存します\r
+<ul><li>これらの画像を素材と言います\r
+</li><li>原画が反転禁止のライセンスを採用しているときは反転画像を保存しません\r
+</li></ul></li><li>素材は作家がコマ上に添付されます\r
+<ul><li>利用するコマエディタの\r
+</li></ul></li></ul><p>コマ上での扱い\r
+</p><ul><li><ul><li>原画が拡縮禁止のライセンスを採用しているときは拡縮画像を保存しません\r
+<ul><li>ただし、サムネイル画像のサイズに収まらない画像については縮小して表示します\r
+</li></ul></li></ul></li></ul><p>素材→コマ絵\r
+</p><h2 id="h2-.E9.85.8D.E5.B8.83.E3.81.AE.E5.81.9C.E6.AD.A2">配布の停止</h2><h2 id="h2-.E7.B4.A0.E6.9D.90.E3.82.B5.E3.83.BC.E3.83.90">素材サーバ</h2>]]>\r
+    </content:encoded>\r
+      </item>\r
+\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/GuidanceForAuthor">\r
+    <title>GuidanceForAuthor</title>\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/GuidanceForAuthor</link>\r
+    <dc:identifier>GuidanceForAuthor</dc:identifier>\r
+    <dc:date>2011-12-23T16:48:50+09:00</dc:date>\r
+        <description>\r
+      <![CDATA[= 作家さん向け文書?\r
+== 作家とは\r
+ぺったんサーバが提供する素材とフキダシを利用して漫画状のコマを作ることで表現する人を作家と言います。\r
+\r
+作家となるには、サイトへの登録が必要です。\r
+\r
+== 作家ができる表現\r
+ * コマを作る\r
+ * コミックを作る\r
+ * コミックの配布範囲を決める\r
+=== コマを作る\r
+=== コミックを作る\r
+=== コミックの配布範囲を決める\r
+\r
+=]]>\r
+\r
+    </description>\r
+    <content:encoded>\r
+      <![CDATA[<h1 id="h1-.E4.BD.9C.E5.AE.B6.E3.81.95.E3.82.93.E5.90.91.E3.81.91.E6.96.87.E6.9B.B8.EF.BC.9F">作家さん向け文書?</h1><h2 id="h2-.E4.BD.9C.E5.AE.B6.E3.81.A8.E3.81.AF">作家とは</h2><p>ぺったんサーバが提供する素材とフキダシを利用して漫画状のコマを作ることで表現する人を作家と言います。\r
+</p><p>作家となるには、サイトへの登録が必要です。\r
+</p><h2 id="h2-.E4.BD.9C.E5.AE.B6.E3.81.8C.E3.81.A7.E3.81.8D.E3.82.8B.E8.A1.A8.E7.8F.BE">作家ができる表現</h2><ul><li>コマを作る\r
+</li><li>コミックを作る\r
+</li><li>コミックの配布範囲を決める\r
+</li></ul><h3 id="h3-.E3.82.B3.E3.83.9E.E3.82.92.E4.BD.9C.E3.82.8B">コマを作る</h3><h3 id="h3-.E3.82.B3.E3.83.9F.E3.83.83.E3.82.AF.E3.82.92.E4.BD.9C.E3.82.8B">コミックを作る</h3><h3 id="h3-.E3.82.B3.E3.83.9F.E3.83.83.E3.82.AF.E3.81.AE.E9.85.8D.E5.B8.83.E7.AF.84.E5.9B.B2.E3.82.92.E6.B1.BA.E3.82.81.E3.82.8B">コミックの配布範囲を決める</h3><h2 id="h2-.E7.B4.A0.E6.9D.90.E3.82.92.E7.94.A8.E6.84.8F.E3.81.99.E3.82.8B">素材を用意する</h2><h3 id="h3-.E7.B4.A0.E6.9D.90.E3.81.AE.E5.89.8D.E3.81.AB.E7.B5.B5.E5.B8.AB.E7.99.BB.E9.8C.B2">素材の前に絵師登録</h3><p>作家は素材を投稿することができません。素材は絵師が投稿することになっています。なぜなら、ぺったんはあなたの素材を容易に他のぺったんサイトに提供できるようになっているからです。少々面倒な構成にはなっていますが、心配には及びません。絵師の登録はワンクリック程度で完了します。\r
+</p><p>登録に必要な情報は下記の項目です。\r
+</p><ul><li>ペンネーム デフォルトで作家名が設定されます\r
+</li><li>デフォルトのライセンス\r
+</li></ul><h3 id="h3-.E7.B4.A0.E6.9D.90.E3.81.AE.E6.8A.95.E7.A8.BF">素材の投稿</h3><p>絵師登録が完了すると、素材エクスプローラーに投稿フォームが現れます。\r
+</p><p>素材を投稿するにあたっての注意事項はGuidanceForArtistをご覧下さい。\r
+<a href="http://sourceforge.jp/projects/pettanr/wiki/GuidanceForArtist">GuidanceForArtist</a></p>]]>\r
+    </content:encoded>\r
+      </item>\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/TranslationComicElements">\r
+    <title>TranslationComicElements</title>\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/TranslationComicElements</link>\r
+\r
+    <dc:identifier>TranslationComicElements</dc:identifier>\r
+    <dc:date>2011-12-23T11:41:06+09:00</dc:date>\r
+        <description>\r
+      <![CDATA[= 資料・マンガ要素の日英対訳\r
+ * コーディング中の命名や、国際化対応のための資料にする.\r
+\r
+== マンガの部品名の対訳\r
+ * コママンガ(jp) - comic strip(en)\r
+ * コマ(jp) - panel(en)\r
+ * 枠線(jp) -(en)\r
+ * 吹き出し(jp) - speach balloon, speach bubble(en)\r
+ * ]]>\r
+    </description>\r
+    <content:encoded>\r
+      <![CDATA[<h1 id="h1-.E8.B3.87.E6.96.99.E3.83.BB.E3.83.9E.E3.83.B3.E3.82.AC.E8.A6.81.E7.B4.A0.E3.81.AE.E6.97.A5.E8.8B.B1.E5.AF.BE.E8.A8.B3">資料・マンガ要素の日英対訳</h1><ul><li>コーディング中の命名や、国際化対応のための資料にする.\r
+</li></ul><h2 id="h2-.E3.83.9E.E3.83.B3.E3.82.AC.E3.81.AE.E9.83.A8.E5.93.81.E5.90.8D.E3.81.AE.E5.AF.BE.E8.A8.B3">マンガの部品名の対訳</h2><ul><li>コママンガ(jp) - comic strip(en)\r
+</li><li>コマ(jp) - panel(en)\r
+</li><li>枠線(jp) -(en)\r
+</li><li>吹き出し(jp) - speach balloon, speach bubble(en)\r
+</li><li></li></ul>]]>\r
+    </content:encoded>\r
+\r
+      </item>\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/PictureIo">\r
+    <title>PictureIo</title>\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/PictureIo</link>\r
+    <dc:identifier>PictureIo</dc:identifier>\r
+    <dc:date>2011-12-23T11:28:56+09:00</dc:date>\r
+        <description>\r
+\r
+      <![CDATA[= PictureIO\r
+== 画像はPictureIOが出し入れする\r
+投稿された素材はデータベースではなく、ファイルに保管される。保管先は大抵の場合ローカルマシンになるが、herokuのようにローカルファイルを触れないホストもあるので、ファイルの入出力は柔軟に切り替わるようにPictureIOとして分離した。\r
+\r
+差し当たってローカルファイル用のLocalPictureIOとAmazonAW]]>\r
+    </description>\r
+    <content:encoded>\r
+      <![CDATA[<h1 id="h1-PictureIO">PictureIO</h1><h2 id="h2-.E7.94.BB.E5.83.8F.E3.81.AFPictureIO.E3.81.8C.E5.87.BA.E3.81.97.E5.85.A5.E3.82.8C.E3.81.99.E3.82.8B">画像はPictureIOが出し入れする</h2><p>投稿された素材はデータベースではなく、ファイルに保管される。保管先は大抵の場合ローカルマシンになるが、herokuのようにローカルファイルを触れないホストもあるので、ファイルの入出力は柔軟に切り替わるようにPictureIOとして分離した。\r
+</p><p>差し当たってローカルファイル用のLocalPictureIOとAmazonAWS用のS3Pict<a href="http://sourceforge.jp/projects/pettanr/wiki/LocalPicture">LocalPicture</a>意した。\r
+</p><p>デフォルトでは、開発・テスト環境ではLocalPictureIOを使い、本番ではS3PictureIOを使っ<a href="http://sourceforge.jp/projects/pettanr/wiki/LocalPicture">LocalPicture</a>環境に合わせて設定を変える必要がある。設定は下記のファイルを書き換える。\r
+<pre>config/environments/development.rb \r
+config/environments/production.rb\r
+</pre></p><h2 id="h2-LocalPictureIO"><a href="http://sourceforge.jp/projects/pettanr/wiki/LocalPicture">LocalPicture</a>IO</h2><p><a href="http://sourceforge.jp/projects/pettanr/wiki/LocalPicture">LocalPicture</a>IOを使う場合は、config/environments/development.rb で、以下のように書く。\r
+<pre>require 'local_picture'\r
+PictureIO.setup do |config|\r
+  config.original_picture_io = PictureIO::LocalPicture.new '/pettanr/original/'\r
+  config.resource_picture_io = PictureIO::LocalPicture.new  '/pettanr/resource/'\r
+end\r
+</pre></p><p>これで原画は/pettanr/original/に保管され、素材は/pettanr/resource/に保管される。\r
+</p><p>※パス処理がショボいのでスラッシュの有無に大きな違いがある。あと、ディレクトリ掘ってないとコケる。\r
+</p><h2 id="h2-S3PictureIO"><a href="http://sourceforge.jp/projects/pettanr/wiki/S3Picture">S3Picture</a>IO</h2><p>AmazonAWSを使うなら、当然S3が使えるよう、準備しておく。Amazonからキーがもらえるので設定する。\r
+</p><p>まず、config/aws.yaml.orgをコピーする。\r
+<pre>cp config/aws.yaml.org config/aws.yaml\r
+</pre>コピーしたaws.yamlを編集。\r
+<pre>access_key_id: XXXXXXXXXXXXXXXXXXXX\r
+secret_access_key: xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx\r
+</pre></p><p><a href="http://sourceforge.jp/projects/pettanr/wiki/S3Picture">S3Picture</a>IOを使う場合は、config/environments/production.rbで、以下のように書く。\r
+<pre>require 'aws/s3'\r
+require 'yaml'\r
+\r
+y = YAML.load(open(Rails.root + 'config/aws.yaml').read)\r
+AWS::S3::Base.establish_connection!(\r
+  :access_key_id =&gt; y[&quot;access_key_id&quot;], \r
+  :secret_access_key =&gt; y[&quot;secret_access_key&quot;]\r
+)\r
+require 's3_picture'\r
+PictureIO.setup do |config|\r
+  config.original_picture_io = PictureIO::S3Picture.new 'pettanr-original'\r
+  config.resource_picture_io = PictureIO::S3Picture.new 'pettanr-stable'\r
+end\r
+</pre>これで原画はpettanr-original/に保管され、素材はpettanr-stable/に保管される。\r
+</p>]]>\r
+    </content:encoded>\r
+      </item>\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/RmagickAndDmagick">\r
+    <title>RmagickAndDmagick</title>\r
+\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/RmagickAndDmagick</link>\r
+    <dc:identifier>RmagickAndDmagick</dc:identifier>\r
+    <dc:date>2011-12-23T10:53:11+09:00</dc:date>\r
+        <description>\r
+      <![CDATA[= RMagickとDMagick\r
+== 画像処理はRMagick\r
+絵師から預かった素材はRMagickで処理される。主にサムネイル画像の生成などで。\r
+\r
+== RMagickは案外地獄\r
+Windows環境では。\r
+\r
+コンパイラを持たずバイナリインストールしていると、大抵RMagickのインストールでコケる。\r
+\r
+= 仕方ないからDMagick\r
+RMagickなしでは丸で動かないので]]>\r
+    </description>\r
+    <content:encoded>\r
+\r
+      <![CDATA[<h1 id="h1-RMagick.E3.81.A8DMagick">RMagickとDMagick</h1><h2 id="h2-.E7.94.BB.E5.83.8F.E5.87.A6.E7.90.86.E3.81.AFRMagick">画像処理はRMagick</h2><p>絵師から預かった素材はRMagickで処理される。主にサムネイル画像の生成などで。\r
+</p><h2 id="h2-RMagick.E3.81.AF.E6.A1.88.E5.A4.96.E5.9C.B0.E7.8D.84">RMagickは案外地獄</h2><p>Windows環境では。\r
+</p><p>コンパイラを持たずバイナリインストールしていると、大抵RMagickのインストールでコケる。\r
+</p><h1 id="h1-.E4.BB.95.E6.96.B9.E3.81.AA.E3.81.84.E3.81.8B.E3.82.89DMagick">仕方ないからDMagick</h1><p>RMagickなしでは丸で動かないので、あたかもRMagickがあるかのように振る舞う空箱を用意した。それがDMagick。\r
+</p><p>デフォルトでは開発環境でDMagickを使うようにしてあるので、RMagickが使えるなら、config/environments/development.rbを書き換える。\r
+</p>]]>\r
+    </content:encoded>\r
+      </item>\r
+        <item rdf:about="http://sourceforge.jp/projects/pettanr/wiki/InstallRubyAndRails">\r
+    <title>InstallRubyAndRails</title>\r
+    <link>http://sourceforge.jp/projects/pettanr/wiki/InstallRubyAndRails</link>\r
+    <dc:identifier>InstallRubyAndRails</dc:identifier>\r
+\r
+    <dc:date>2011-12-22T18:14:49+09:00</dc:date>\r
+        <description>\r
+      <![CDATA[= 環境構築\r
+== Ruby\r
+ruby1.9系が入っていることを確認\r
+&gt; ruby -v[[BR]]\r
+&gt; ruby 1.9.2p290 (2011-07-09) [i386-mingw32]\r
+\r
+== gem\r
+&gt; gem install bundler\r
+\r
+== source code\r
+&gt; git clone git://git.sourceforge.jp]]>\r
+    </description>\r
+    <content:encoded>\r
+      <![CDATA[<h1 id="h1-.E7.92.B0.E5.A2.83.E6.A7.8B.E7.AF.89">環境構築</h1><h2 id="h2-Ruby">Ruby</h2><p>ruby1.9系が入っていることを確認\r
+</p><blockquote class="citation"><p>ruby -v<br />\r
+ruby 1.9.2p290 (2011-07-09) <a href="http://sourceforge.jp/projects/pettanr/wiki/i386-mingw32">i386-mingw32</a>\r
+</p></blockquote><h2 id="h2-gem">gem</h2><blockquote class="citation"><p>gem install bundler\r
+</p></blockquote><h2 id="h2-source.20code">source code</h2><blockquote class="citation"><p>git clone git://git.sourceforge.jp/gitroot/pettanr/pettanr.git peta\r
+cd peta\r
+</p></blockquote><h2 id="h2-gem.20library.20install">gem library install</h2><blockquote class="citation"><p>bundle install --without production\r
+</p></blockquote><h2 id="h2-init.20database">init database</h2><blockquote class="citation"><p>rake db:migrate\r
+</p></blockquote><h2 id="h2-create.20admin.20account">create admin account</h2><blockquote class="citation"><p>rails r &quot;Admin.start('admin@mail.adr.ess', 'admin_password')&quot;\r
+</p></blockquote><h2 id="h2-configure.20file.20io">configure file io</h2>]]>\r
+    </content:encoded>\r
+      </item>\r
+\r
+    </rdf:RDF>\r
diff --git a/0.3.0/wiki/wiki.xsl b/0.3.0/wiki/wiki.xsl
new file mode 100644 (file)
index 0000000..27fb84a
--- /dev/null
@@ -0,0 +1,162 @@
+<?xml version="1.0" encoding="utf-8"?>\r
+<xsl:stylesheet version="1.0"\r
+  xmlns:xsl="http://www.w3.org/1999/XSL/Transform"\r
+  xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"\r
+  xmlns="http://www.w3.org/1999/xhtml"\r
+  xmlns:rss="http://purl.org/rss/1.0/"\r
+  xmlns:dc="http://purl.org/dc/elements/1.1/"\r
+  xmlns:content="http://purl.org/rss/1.0/modules/content/"\r
+  exclude-result-prefixes="rdf rss dc content"\r
+>\r
+    <xsl:output \r
+        omit-xml-declaration="no" \r
+        encoding="utf-8" \r
+        method="html" \r
+        version="1.0" \r
+        doctype-public="-//W3C//DTD HTML 4.01 Transitional//EN" \r
+        doctype-system="http://www.w3.org/TR/html4/loose.dtd" \r
+        indent="yes" />\r
+        \r
+<xsl:template match="rdf:RDF">\r
+  <html xml:lang="ja" lang="ja">\r
+  <head>\r
+                       <meta http-equiv="content-type" content="text/html; charset=UTF-8" />\r
+                       <meta http-equiv="Content-Style-Type" content="text/css" />\r
+                       <meta http-equiv="imagetoolbar" content="no" />\r
+                       <meta name="description">\r
+                               <xsl:attribute name="content">\r
+                                       <xsl:value-of select="rss:channel/rss:description" />\r
+                               </xsl:attribute>\r
+                       </meta>\r
+                       <title><xsl:value-of select="rss:channel/rss:title"/></title>\r
+                       \r
+                       <link rel="stylesheet" href="../common.css" type="text/css" />\r
+                       <link rel="stylesheet" href="wiki.css" type="text/css" />\r
+  </head>\r
+  <body>\r
+                       <div id="general-content">\r
+                               <div id="outer-wrapper">\r
+                                       \r
+                                       <div id="header">\r
+                                               <div class="base-content-width" style="position:relative;">\r
+                                                       <h1><a href="../index.html"><xsl:value-of select="rss:channel/rss:title"/></a></h1>\r
+                                                       <div id="global-navi">\r
+                                                               <noscript id="noscript-alert">You need to have JavaScript enabled.</noscript>\r
+                                                       </div>\r
+                                               </div>\r
+                                       </div>\r
+                                       \r
+                                       <div id="inner-wrapper" class="base-content-width">                                             \r
+                                               <div id="wiki-container" class="clearfix">\r
+                                                       <div id="page-navi-container">\r
+                                                               <div id="page-total">\r
+                                                                       <xsl:value-of select="count(rss:item)"/> pages\r
+                                                               </div>\r
+                                                               <xsl:for-each select="./rss:item">\r
+                                                                       <xsl:variable name="index" select="position()"/>\r
+                                                                       <xsl:variable name="top" select="25*$index"/>\r
+                                                                       <div class="page-navi">\r
+                                                                               <xsl:attribute name="style">\r
+                                                                                       <xsl:value-of select="concat('top:',$top,'px;')"/>\r
+                                                                               </xsl:attribute>\r
+                                                                               <a>\r
+                                                                                       <xsl:attribute name="href">\r
+                                                                                               <xsl:value-of select="concat('#page',$index)"/>\r
+                                                                                       </xsl:attribute>        \r
+                                                                                       <xsl:value-of select="rss:title"/>\r
+                                                                               </a>\r
+                                                                       </div>                                                                          \r
+                                                               </xsl:for-each>\r
+                                                       </div>\r
+                                                       <div id="page-body-container">\r
+                                                               <xsl:for-each select="./rss:item">\r
+                                                                       <div class="page-wrapper">\r
+                                                                               <xsl:variable name="index" select="position()"/>\r
+                                                                               <xsl:variable name="top" select="25*$index"/>\r
+                                                                               <xsl:attribute name="id">\r
+                                                                                       <xsl:value-of select="concat('page',$index)"/>\r
+                                                                               </xsl:attribute>\r
+\r
+                                                                               <div class="page-header clearfix">\r
+                                                                                       <span class="page-title"><xsl:value-of select="rss:title"/></span>\r
+                                                                                       <span class="page-date"><xsl:value-of select="substring(dc:date, 1, 10)" /></span>\r
+                                                                               </div>\r
+                                                                               \r
+                                                                               <div class="page-body clearfix">\r
+                                                                                       <xsl:value-of select="content:encoded" disable-output-escaping="yes"/>\r
+                                                                               </div>\r
+                                                                               <a href="#page-total" class="jump-to-top">top</a>\r
+                                                                       </div>\r
+                                                               </xsl:for-each>\r
+                                                       </div>\r
+                                               </div>\r
+                                       </div>\r
+                                       \r
+                               </div>\r
+                       </div>\r
+\r
+       \r
+                       <div id="footer-content">\r
+                               <div id="footer">\r
+                                       <div id="footer-item-container" class="base-content-width clearfix">\r
+                                               <div class="footer-item-wrapper">\r
+                                                       <div class="footer-item">\r
+                                                               <h2>ぺったんR にようこそ</h2>\r
+                                                               <ul>\r
+                                                                       <li>サンプル</li>\r
+                                                                       <li>ぺったんRの特徴</li>\r
+                                                                       <li>沿革</li>\r
+                                                               </ul>\r
+                                                       </div>\r
+                                               </div>\r
+                                               <div class="footer-item-wrapper">\r
+                                                       <div class="footer-item">\r
+                                                               <h2>ドキュメント</h2>\r
+                                                               <ul>\r
+                                                                       <li>作家向けドキュメント</li>\r
+                                                                       <li>絵師向けドキュメント</li>                                                 \r
+                                                                       <li><a href="http://sourceforge.jp/projects/pettanr/wiki/ForDevelopers" rel="me">開発者向けドキュメント</a></li>\r
+                                                                       <li><a href="http://sourceforge.jp/projects/pettanr/wiki/ForWebmasters" rel="me">編集長向けドキュメント</a></li>\r
+                                                               </ul>\r
+                                                       </div>\r
+                                               </div>\r
+                                               <div class="footer-item-wrapper">\r
+                                                       <div class="footer-item">\r
+                                                               <h2>プロトタイプ</h2>\r
+                                                               <ul>\r
+                                                                       <li>pettanr</li>\r
+                                                                       <li><a href="../work.html" rel="editor">js editor</a></li>\r
+                                                               </ul>\r
+                                                               <h2>Ajax contents</h2>\r
+                                                               <ul>\r
+                                                                       <li><a href="jp.xml">help | jp</a></li>\r
+                                                               </ul>\r
+                                                       </div>\r
+                                               </div>\r
+                                               <div class="footer-item-wrapper" style="width:170px;">\r
+                                                       <div class="footer-item" style="padding-right:0;">\r
+                                                               <h2>ぺったんRチーム</h2>\r
+                                                               <ul>\r
+                                                                       <li>わたしたちについて</li>\r
+                                                                       <li>ミッション</li>\r
+                                                                       <li><a href="../diary/itozyun.xml">itozyun's diary</a></li>\r
+                                                                       <li>個人情報保護方針</li>\r
+                                                                       <li>作品の取り扱い</li>\r
+                                                                       <li>お問い合わせ</li>\r
+                                                               </ul>\r
+                                                       </div>\r
+                                               </div>\r
+                                       </div>\r
+                                       <div id="copyright">\r
+                                               Copyright (c) 2011-2012 pettanR team, some rights reserved.\r
+                                       </div>\r
+                               </div>\r
+                       </div>\r
+                       \r
+    <script type="text/javascript" src="wiki.js"></script>\r
+    <script type="text/javascript" src="../common.js"></script>\r
+  </body>\r
+  </html>\r
+</xsl:template>\r
+\r
+</xsl:stylesheet>
\ No newline at end of file
index eda088d..f525eae 100644 (file)
         * ieでは、背景を設定しないと、mouse-operation-catcherが働かない。\r
         * activeX有効の場合は背景を着色してfilterで透明に。\r
         * activeX無効の場合は透明gifを使用\r
-        * background:                  url(4x4.gif) fixed repeat;
+        * background:                  url(4x4.gif) fixed repeat;\r
         */\r
 \r
 /*  comic-element\r
                }\r
                \r
                /*\r
-                * page contents
+                * page contents\r
                 */\r
                        .sidenavi {\r
                                width:                          100px;\r
                #toolbox-edit-bg-button,\r
                #toolbox-switch-grid,\r
                #toolbox-popup-help-button,\r
-               #toolbox-publish-button {\r
+               #toolbox-post-button {\r
                        position:                               absolute;\r
                        left:                                   10px;\r
                        width:                                  90px;\r
                        left:                                   65px !important;\r
                }\r
                \r
-               #toolbox-publish-button {\r
+               #toolbox-post-button {\r
                        top:                                    190px;\r
                        height:                                 50px;\r
                        line-height:                    50px;\r
index 7b51fcf..870ddda 100644 (file)
@@ -23,7 +23,7 @@
                                })();                           \r
                </script>\r
        <![endif]-->\r
-\r
+               \r
                <!-- 改行コード 取得用 -->\r
 <form>\r
 <textarea id="shadowTxtarea" style="display:none;">\r
 \r
                        <!-- home -->\r
                                <div id="home" style="display:block;">\r
-                                       <div style="overflow: auto;height: 100%;">\r
-                                               <h2>boot editor</h2>\r
-                                               <a href="work.html?view=editor">Boot Editor ⇒</a>\r
-                                                       \r
-                                       <h3>boot editor on debug mode</h3>\r
-                                               <h4>Reversible Image Backend test</h4>\r
-                                       <a href="work.html?view=editor&rimg=CSS3">Boot Editor (ReversibleImageBackend is CSS3) ⇒</a><br>\r
-                                       <a href="work.html?view=editor&rimg=VML">Boot Editor (ReversibleImageBackend is VML) ⇒</a><br>\r
-                                       <a href="work.html?view=editor&rimg=ActiveX">Boot Editor (ReversibleImageBackend is ActiveX) ⇒</a>\r
+                                       <h2>boot editor</h2>\r
+                                       <a href="work.html?view=editor">Boot Editor ⇒</a>\r
                                                \r
-                                               <h4>vector test</h4>\r
-                                               <a href="work.html?view=editor&vector=false">Boot Editor (Vector Disabled) ⇒</a><br>\r
-                                               \r
-                                               <h2>ajax contents</h2>\r
-                                               <h3>help documents</h3>\r
-                                               <a href="help/jp.xml">help contents | jp.xml</a>\r
-                                                       \r
-                                               <h3>xml seo test</h3>\r
-                                               <a href="diary/itozyun.xml">itozyn's diary</a>\r
+                               <h3>boot editor on debug mode</h3>\r
+                                       <h4>Reversible Image Backend test</h4>\r
+                               <a href="work.html?view=editor&rimg=CSS3">Boot Editor (ReversibleImageBackend is CSS3) ⇒</a><br>\r
+                               <a href="work.html?view=editor&rimg=VML">Boot Editor (ReversibleImageBackend is VML) ⇒</a><br>\r
+                               <a href="work.html?view=editor&rimg=ActiveX">Boot Editor (ReversibleImageBackend is ActiveX) ⇒</a>\r
+                                       \r
+                                       <h4>vector test</h4>\r
+                                       <a href="work.html?view=editor&vector=false">Boot Editor (Vector Disabled) ⇒</a><br>\r
+                                       \r
+                                       <h2>ajax contents</h2>\r
+                                       <h3>help documents</h3>\r
+                                       <a href="help/jp.xml">help contents | jp.xml</a>\r
                                                \r
-                                               <h2>other</h2>\r
-                                               <a href="sitemap/sitemap.xml">sitemap.xml</a>\r
-                                       </div>\r
+                                       <h3>xml seo test</h3>\r
+                                       <a href="diary/itozyun.xml">itozyn's diary</a>\r
+                                       \r
+                                       <h2>other</h2>\r
+                                       <a href="sitemap/sitemap.xml">sitemap.xml</a>\r
                                </div>\r
                                \r
                        <!-- comic list -->\r
 \r
                        <!-- layer-window -->\r
                        <!-- dom-console-window -->\r
-                       <!-- publish-window -->\r
+                       <!-- post-window -->\r
                        <!-- wellcome-window -->\r
                        \r
 \r
                                <div id="toolbox-edit-bg-button">edit bg</div>\r
                                <div id="toolbox-switch-grid">grid</div>\r
                                <div id="toolbox-popup-help-button">?</div>\r
-                               <div id="toolbox-publish-button">publish!</div>\r
+                               <div id="toolbox-post-button">post</div>\r
                        </script>\r
                        \r
                </div>\r
index a123a5b..7b58e86 100644 (file)
@@ -5,7 +5,7 @@
  * author:\r
  *   itozyun\r
  * licence:\r
- *   BSD\r
+ *   new BSD\r
  *\r
  * \r
  * ----------------------------------------\r
  * \r
  */\r
 \r
-/*\r
- *     if (!document.namespaces["v"]) { // VMLネームスペースが定義されていないなら\r
-        // ネームスペース(v) をVMLとして認識させる\r
-        document.namespaces.add("v", "urn:schemas-microsoft-com:vml", "#default#VML");\r
-    }\r
-    // スタイルシートを生成し、<v:rect> と <v:fill> をVMLとして紐付ける\r
-    document.createStyleSheet().cssText = "v\:rect,v\:fill{behavior:url(#default#VML);";\r
-\r
- */\r
-\r
 var h2c = ( function(){\r
        var     FUNCTION_ARRAY = [],\r
                URL = document.location.href.split( '#')[ 0],\r
@@ -117,21 +107,6 @@ var h2c = ( function(){
                ieMode = ieVersion === 8 ? document.documentMode : 0,\r
                isStanderdMode = document.compatMode === 'CSS1Compat',\r
                jqWindow , jqDocument , jqBody;\r
-               \r
-               ( function(){\r
-                       var _elms = document.getElementsByTagName( '*'),\r
-                               _elm,\r
-                               i = 0;\r
-                       while( i < _elms.length){\r
-                               _elm = _elms[ i];\r
-                               if( _elm.nodeType === 8 && _elm.parentNode){\r
-                                       _elm.parentNode.removeChild( _elm);\r
-                               } else {\r
-                                       ++i;\r
-                               }\r
-                       }\r
-               })();\r
-               \r
        return {\r
                version: '0.3.0',\r
                init: function(){\r
@@ -182,6 +157,27 @@ var h2c = ( function(){
                        }\r
                        return !!test;\r
                })(),\r
+               VML: ( function(){\r
+                       if( isIE === false || ieVersion > 8) return false;\r
+                       var globalObjectName = '_global',\r
+                               script;\r
+                       document.write( [ '<!--[if gte vml 1]><script>window', globalObjectName, '=1;<\/script><![endif]-->'].join( ''));\r
+                       if( window[globalObjectName] === 1){\r
+                               //script = document.getElementById( globalObjectName);\r
+                               //script.parentNode.removeChild( script);\r
+                               window[globalObjectName] = undefined;\r
+                               return true;\r
+                       }\r
+                       return false;\r
+               })(),\r
+               startVML: function(){\r
+                       if( h2c.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
+                   delete this.startVML;\r
+               },\r
                jqWindow: function(){\r
                        return jqWindow;\r
                },\r
@@ -215,7 +211,6 @@ var h2c = ( function(){
  * getImageSize()\r
  * \r
  */\r
-\r
 h2c.util = ( function(){\r
        var ELM_SIZE_GETTER = ( function(){\r
                        var ret = document.createElement( 'DIV'),\r
@@ -235,6 +230,21 @@ h2c.util = ( function(){
                        return ret;\r
                })(),\r
                CLEAN_TARGET_ELEMENT = 'script,style,object,applet,embed,iframe,frame,base,bgsound,frameset,listing'.split( ',');\r
+               \r
+       // cleanCommnetNode();\r
+       function cleanCommnetNode( _targetElm){\r
+               var _elms = ( _targetElm || document).getElementsByTagName( '*'),\r
+                       _elm,\r
+                       i = 0;\r
+               while( i < _elms.length){\r
+                       _elm = _elms[ i];\r
+                       if( _elm.nodeType === 8 && _elm.parentNode){\r
+                               _elm.parentNode.removeChild( _elm);\r
+                       } else {\r
+                               ++i;\r
+                       }\r
+               }\r
+       }\r
        return {\r
                extend: function( baseInstance, extend){\r
                        for( var key in extend){\r
@@ -242,11 +252,12 @@ h2c.util = ( function(){
                        }\r
                        return baseInstance;\r
                },\r
+               cleanCommnetNode: cleanCommnetNode,\r
                cleanElement: function( _targetElm){\r
                        var l = CLEAN_TARGET_ELEMENT.length,\r
                                elms, elm, j;\r
                        for( var i=0; i<l; ++i){\r
-                               elms = _targetElm.getElementsByTagName( CLEAN_TARGET_ELEMENT[ 0]);\r
+                               elms = _targetElm.getElementsByTagName( CLEAN_TARGET_ELEMENT[ i]);\r
                                if( elms.length > 0){\r
                                        for( j=0; i<elms.length; ++j){\r
                                                elm = elms[ 0];\r
@@ -254,6 +265,7 @@ h2c.util = ( function(){
                                        }\r
                                }\r
                        }\r
+                       cleanCommnetNode( _targetElm);\r
                        if( h2c.isIE === false) return;\r
                        elms = document.getElementsByName( '*');\r
                        l = elms.length;\r
@@ -474,7 +486,7 @@ h2c.util = ( function(){
 /*\r
  * window resize event, overlay と currentなviewに流す\r
  * view modeの保持\r
- *      editor, overlay, comic-viewer, image-explorer\r
+ *      editor, overlay, comic-viewer, image-explorer\r
  * fadeIn, faseOut\r
  */\r
 h2c.view = ( function(){\r
@@ -938,7 +950,7 @@ h2c.key = ( function(){
  * ie5.5-8\r
  * \r
  * 内部の角度計算は radian で統一したい。\r
- * 当初 vectorEnabled = true で一度書いてみる。\r
+ * 当初 vectorEnabled = true で一度書いてみる。\r
  * 駄目なら、代替のイメージのsrcの用意もここで担当。\r
  * 閲覧と編集両方で使う。\r
  * \r
@@ -980,18 +992,26 @@ h2c.balloon = ( function() {
                })(),\r
                NUM_BALLOON_IMAGE = 24,\r
                vectorEnabled = ELM_BALLOON_ORIGIN !== null && h2c.URL_PARAMS.vector !== false;\r
+       if( IS_VML === true && h2c.VML === false) vectorEnabled = false;\r
 \r
        var XBROWSER_BALLOON_CLASS = function( w, h, a){\r
                var balloonElm = vectorEnabled === true ? ELM_BALLOON_ORIGIN.cloneNode( true) : document.createElement( 'IMG'), // h2c.imageに変更\r
-                       PI = Math.PI, cos = Math.cos, sin = Math.sin,\r
-                       abs = Math.abs, pow = Math.pow;\r
+                       path = balloonElm.getElementsByTagName( 'path')[ 0],\r
+                       shape = balloonElm.getElementsByTagName( 'shape')[ 0],\r
+                       cos = Math.cos, sin = Math.sin,\r
+                       abs = Math.abs, pow = Math.pow,\r
+                       round = Math.round,\r
+                       floor = Math.floor,\r
+                       TARGET = TAIL_WIDTH * TAIL_WIDTH,\r
+                       DEG_TO_RAD = Math.PI / 180,\r
+                       l = ',';\r
                \r
                draw( a, w, h);\r
                \r
                function draw( _a, _w, _h){\r
                        a = _a !== undefined ? _a : a;\r
-                       w = _w ? _w -PADDING_TOP *2 : w;\r
-                       h = _h ? _h -PADDING_LEFT *2 : h;\r
+                       w = _w !== undefined ? _w -PADDING_TOP *2 : w;\r
+                       h = _h !== undefined ? _h -PADDING_LEFT *2 : h;\r
 \r
                        if( vectorEnabled === false){\r
                                balloonElm.setAttribute( 'src', balloonUrlBuilder( a));\r
@@ -1000,69 +1020,63 @@ h2c.balloon = ( function() {
                        \r
                        var rx = w /2,\r
                                ry = h /2,\r
-                               tailRad = a * PI / 180,\r
+                               tailRad = a * DEG_TO_RAD,\r
                                tailX = rx +( rx +TAIL_HEIGHT) * cos( tailRad),\r
                                tailY = ry +( ry +TAIL_HEIGHT) * sin( tailRad),\r
                                startX, startY, endX, endY;\r
                /*\r
                 * tailの太さをTAIL_WIDTHに一致させるため、角度を絞りつつ計算\r
                 */\r
-                       ( function( a, rx, ry, sin, cos, pow){\r
-                               var startRad, endRad,\r
-                                       _startX, _startY, _endX, _endY,\r
-                                       tailDeg = 0, d,\r
-                                       TARGET = TAIL_WIDTH * TAIL_WIDTH,\r
-                                       DEG_TO_RAD = PI / 180;\r
+                       var startRad, endRad,\r
+                               _startX, _startY, _endX, _endY,\r
+                               tailDeg = 0, d;\r
+                       \r
+                       for( var i = 45; i > 0.01; i /= 2){\r
+                               d = ( tailDeg +i) /2;\r
+                               startRad = ( a +d) * DEG_TO_RAD;\r
+                               endRad = ( a -d) * DEG_TO_RAD;\r
                                \r
-                               for( var i = 45; i > 0.01; i /= 2){\r
-                                       d = ( tailDeg +i) /2;\r
-                                       startRad = ( a +d) * DEG_TO_RAD;\r
-                                       endRad = ( a -d) * DEG_TO_RAD;\r
+                               _startX = rx +cos( startRad) *rx;\r
+                               _startY = ry +sin( startRad) *ry;\r
+                               _endX = rx +cos( endRad) *rx;\r
+                               _endY = ry +sin( endRad) *ry;   //円弧上のY位置=円中心Y+sin(角度×PI÷180)×円半径\r
                                        \r
-                                       _startX = rx +cos( startRad) *rx;\r
-                                       _startY = ry +sin( startRad) *ry;\r
-                                       _endX = rx +cos( endRad) *rx;\r
-                                       _endY = ry +sin( endRad) *ry;   //円弧上のY位置=円中心Y+sin(角度×PI÷180)×円半径\r
-                                               \r
-                                       if( pow( ( _startX -_endX), 2) + pow( ( _startY -_endY), 2) < TARGET){\r
-                                               tailDeg += i;\r
-                                               startX = _startX;\r
-                                               startY = _startY;\r
-                                               endX = _endX;\r
-                                               endY = _endY;                                           \r
-                                       }\r
-                               }                               \r
-                       })( a, rx, ry, sin, cos, pow);\r
+                               if( pow( ( _startX -_endX), 2) + pow( ( _startY -_endY), 2) < TARGET){\r
+                                       tailDeg += i;\r
+                                       startX = _startX;\r
+                                       startY = _startY;\r
+                                       endX = _endX;\r
+                                       endY = _endY;                                           \r
+                               }\r
+                       }\r
 \r
                /*\r
                 * \r
                 */                     \r
-                       IS_VML === true ?\r
-                       ( function ( tailX, tailY, startX, startY, rx, ry, endX, endY, _w, _h){\r
-                               var l = ',',\r
-                                       round = Math.round,\r
-                                       shape = balloonElm.getElementsByTagName( 'shape')[ 0];\r
+                       if( IS_VML === true){\r
+                               var _tailX = tailX *10,\r
+                                       _tailY = tailY *10,\r
+                                       __startX = startX *10,\r
+                                       __startY = startY *10,\r
+                                       __endX = endX *10,\r
+                                       __endY = endY *10,\r
+                                       __w = w *10,\r
+                                       __h = h *10;\r
                                \r
                                shape.style.width = w +'px';\r
                                shape.style.height = h +'px';\r
-                               shape.coordsize = [ _w, _h].join( l);\r
+                               shape.coordsize = [ __w, __h].join( l);\r
                                shape.path = [\r
-                                       ' ar ', 0, l, 0, l, _w, l, _h, l,\r
-                                       round( startX), l, round( startY), l,\r
-                                       round( endX), l, round( endY),\r
-                                       ' l ', round( tailX), l, round( tailY),\r
+                                       ' ar ', 0, l, 0, l, __w, l, __h, l,\r
+                                       round( __endX), l, round( __endY), l,\r
+                                       round( __startX), l, round( __startY),\r
+                                       ' l ', round( _tailX), l, round( _tailY),\r
                                        ' x e'\r
                                ].join( '');\r
 \r
-                               balloonElm.style.marginTop =  tailY < 0 ? Math.floor( ( 60 +tailY) /10) : 10;\r
-                               balloonElm.style.marginLeft = tailX < 0 ? Math.floor( ( 60 +tailX) /10) : 10;\r
-                               \r
-                       })( tailX *10, tailY *10, endX *10, endY *10, rx *10, ry *10, startX *10, startY *10, w *10, h *10)\r
-                       :\r
-                       ( function (){\r
-                               var l = ',',\r
-                                       path = balloonElm.getElementsByTagName( 'path')[ 0];\r
-                               \r
+                               balloonElm.style.marginTop =  _tailY < 0 ? floor( ( 60 +_tailY) /10) : 10;\r
+                               balloonElm.style.marginLeft = _tailX < 0 ? floor( ( 60 +_tailX) /10) : 10;\r
+                       } else {\r
                                balloonElm.setAttribute( 'width', w +PADDING_LEFT *2);\r
                                balloonElm.setAttribute( 'height', h +PADDING_TOP *2);\r
                                path.setAttribute( 'd', [\r
@@ -1073,18 +1087,17 @@ h2c.balloon = ( function() {
                                        cround( endX +PADDING_LEFT), l, cround( endY +PADDING_TOP),\r
                                        'z'\r
                                ].join( ' '));\r
-                               \r
-                               function cround( v, r){\r
-                                       r = r || ACCURACY;\r
-                                       return Math.round( v *pow( 10.0, r)) /pow( 10.0, r);\r
-                               }                       \r
-                       })();\r
+                       }\r
+                       function cround( v, r){\r
+                               r = r || ACCURACY;\r
+                               return round( v *pow( 10.0, r)) /pow( 10.0, r);\r
+                       }\r
                }\r
                \r
                function balloonUrlBuilder( _a){\r
                        var d = 360 /NUM_BALLOON_IMAGE;\r
                        _a += 90 +d /2;\r
-                       return [ 'balloon\/_w', _a < 360 -d /2 ? Math.floor( _a /d) : 0, '.gif'].join( '');\r
+                       return [ 'balloon\/_w', _a < 360 -d /2 ? floor( _a /d) : 0, '.gif'].join( '');\r
                }\r
                return {\r
                        elm: balloonElm,\r
@@ -1108,12 +1121,12 @@ h2c.balloon = ( function() {
                }\r
        };\r
        \r
-       vectorEnabled === true && ( function(){\r
+       IS_VML === false && vectorEnabled === true && ( function(){\r
                var detect = XBROWSER_BALLOON_CLASS.apply( {}, [ 100, 100, 0]),\r
-                       size = h2c.util.getElementSize( detect.elm.firstChild ? detect.elm.firstChild : detect.elm);\r
+                       size = h2c.util.getElementSize( detect.elm);\r
                vectorEnabled = size.width !== 0 && size.height !== 0;\r
                detect.destroy();\r
-               detect = size = null;   \r
+               detect = size = null;\r
        })();\r
 \r
        return {\r
@@ -1176,7 +1189,7 @@ h2c.image = ( function(){
                                if( rimg === 'vml') return IS_VML;\r
                        }\r
                        if( h2c.isIE === false || h2c.ieVersion >= 9) return IS_CSS3; // 不十分!\r
-                       if( h2c.balloon.VML === true) return IS_VML;\r
+                       if( h2c.VML === true) return IS_VML;\r
                        if( h2c.ACTIVEX === true) return IS_ACTIVEX;\r
                        if( h2c.FLASH === true) return IS_FLASH;\r
                        if( h2c.SILVERLIGHT === true) return IS_SILVERLIGHT;\r
@@ -1207,9 +1220,12 @@ h2c.image = ( function(){
                        h2c.util.loadImage( url, onLoad, onError, 100, 10000);\r
                        function onLoad( _url, _actualW, _actualH){\r
                                if( elmWrap === null) return;\r
-                               elmImg = document.createElement( 'IMG');\r
-                               elmWrap.appendChild( elmImg); // load後にimg\r
-                               elmImg.src = url;\r
+                               elmImg = new Image;\r
+                               /*\r
+                                * createElement 直後に append しないと、ie(ActiveX)で img が正しく表示されない.\r
+                                */\r
+                               elmWrap.appendChild( elmImg);\r
+                               elmImg.setAttribute( 'src', url);\r
                                elmWrap.className = CLASS_NAME;\r
                                onLoadCallback && onLoadCallback( _url, _actualW, _actualH);\r
                                onLoadCallback = null;\r
@@ -1348,7 +1364,7 @@ h2c.image = ( function(){
  *       - COMIC_ELEMENT_CONTROL\r
  *          - PanelResizerClass\r
  *          - COMIC_ELEMENT_OPERATOR\r
- *             - TAIL_MOVER\r
+ *             - TAIL_CONTROLER\r
  *          - ImageElementClass\r
  *          - TextElementClass\r
  * \r
@@ -1400,11 +1416,10 @@ h2c.editor = ( function(){
                        })(),\r
                        EMPTY_FUNCTION = new Function,\r
                        ITEM_ARRAY = [],\r
-                       barH,\r
+                       barH = h2c.util.getElementSize( ELM_BAR).height,\r
                        itemW = h2c.util.getElementSize( ELM_ITEM_ORIGN).width,\r
                        selectionW = h2c.util.getElementSize( ELM_ITEM_ORIGN.getElementsByTagName( 'UL')[ 0]).width,\r
                        jqStage, jqBar;\r
-               barH = h2c.util.getElementSize( ELM_BAR).height;\r
                ELM_BAR.style.top = ( -barH) +'px';\r
 \r
                var MenubarSelectionClass = function( container, title, shortcut, visible, separateAfter){\r
@@ -1526,6 +1541,7 @@ h2c.editor = ( function(){
 \r
                                delete MENU_BAR_CONTROL.init;\r
                        },\r
+                       h: barH,\r
                        onMouseMove: function( _mouseX, _mouseY){\r
                                if( barH >= _mouseY){\r
                                        return true;\r
@@ -1560,33 +1576,28 @@ h2c.editor = ( function(){
                        QUIT: createMenubarItem( 'Quit'),\r
                        EDIT: createMenubarItem( 'Edit'),\r
                        WINDOW: createMenubarItem( 'Window'),\r
-                       HELP: ( function(){\r
-                                       var SELECTION_CALLBACK_ARRAY = [];\r
-                                       return h2c.util.extend( createMenubarItem( 'Help', SELECTION_CALLBACK_ARRAY), {\r
-                                               createAjaxSelection: function( callback){\r
-                                                       var elmLoading = document.createElement( 'li'),\r
-                                                               that = this,\r
-                                                               elmSelection = this.elm.getElementsByTagName( 'UL')[ 0];\r
-                                                       elmSelection.appendChild( elmLoading);\r
-                                                       elmLoading.className = 'loading';\r
-                                                       elmLoading.style.height = '90px';                                                       \r
-                                                       \r
-                                                       //SELECTION_CALLBACK_ARRAY.push( callback);\r
-                                                       this.onShow = callback;\r
-                                                       callback = null;\r
-                                                       \r
-                                                       delete this.createAjaxSelection;\r
-                                                       return function(){\r
-                                                               //SELECTION_CALLBACK_ARRAY.shift();\r
-                                                               elmSelection.removeChild( elmLoading);\r
-                                                               $( elmSelection).children( 'li').click( that.onClick);\r
-                                                               elmLoading = elmSelection = null;\r
-                                                               delete that.onShow;\r
-                                                               that = null;\r
-                                                       }\r
+                       HELP: h2c.util.extend( createMenubarItem( 'Help'), {\r
+                                       createAjaxSelection: function( callback){\r
+                                               var elmLoading = document.createElement( 'li'),\r
+                                                       that = this,\r
+                                                       elmSelection = this.elm.getElementsByTagName( 'UL')[ 0];\r
+                                               elmSelection.appendChild( elmLoading);\r
+                                               elmLoading.className = 'loading';\r
+                                               elmLoading.style.height = '90px';                                                       \r
+\r
+                                               this.onShow = callback;\r
+                                               callback = null;\r
+                                               \r
+                                               delete this.createAjaxSelection;\r
+                                               return function(){\r
+                                                       elmSelection.removeChild( elmLoading);\r
+                                                       $( elmSelection).children( 'li').click( that.onClick);\r
+                                                       elmLoading = elmSelection = null;\r
+                                                       delete that.onShow;\r
+                                                       that = null;\r
                                                }\r
-                                       });\r
-                               })()\r
+                                       }\r
+                               })\r
                }\r
        })();\r
 \r
@@ -1673,22 +1684,6 @@ h2c.editor = ( function(){
 \r
 \r
 /* ----------------------------------------\r
- * HELP_DOCUMENTS_CONTROL\r
- *  * menubar の help 下に help documents の index を挿入\r
- *  * help window に  help documents を挿入\r
- */\r
-       var HELP_DOCUMENTS_CONTROL = ( function(){\r
-               \r
-               return {\r
-                       load: function( titleArray){\r
-                               var help = MENU_BAR_CONTROL.HELP;\r
-                               //help.createSelection();\r
-                               //onLoadFunction();\r
-                       }\r
-               }\r
-       })();\r
-\r
-/* ----------------------------------------\r
  *     Save Control\r
  */\r
 \r
@@ -1696,6 +1691,7 @@ h2c.editor = ( function(){
                var SAVE = MENU_BAR_CONTROL.QUIT.createSelection( 'save', 'ctrl + S', quit, false),\r
                        SAVE_AND_QUIT = MENU_BAR_CONTROL.QUIT.createSelection( 'save & quit', null, quit, false, false, true),\r
                        SAVE_AS_HTML = MENU_BAR_CONTROL.QUIT.createSelection( 'get as html', null, outputAsHtml, true, false, true),\r
+                       SAVE_AS_JSON_STRING = MENU_BAR_CONTROL.QUIT.createSelection( 'get JsonStr', null, outputAsJsonString, true, false, true),\r
                        QUIT = MENU_BAR_CONTROL.QUIT.createSelection( 'quit', null, quit, true, true),\r
                        updated = false;\r
                \r
@@ -1705,7 +1701,9 @@ h2c.editor = ( function(){
                function outputAsHtml(){\r
                        alert( CANVAS_CONTROL.getAsHTML( true, false));\r
                }\r
-               \r
+               function outputAsJsonString(){\r
+                       alert( CANVAS_CONTROL.getAsJsonString());\r
+               }\r
                return {\r
                        quit: quit,\r
                        panelUpdated: function( _updated){\r
@@ -2190,7 +2188,7 @@ h2c.editor = ( function(){
                        log;\r
 \r
                var jqWindowOrigin,\r
-                       windowCloseButtonWidth;\r
+                       closeButtonWidth;\r
                var WindowClass = function( bodyTempleteID, title, x, y, w, h, visible, CLOSE_BUTTON_ENABLED, RESIZE_BUTTON_ENABLED, minWindowW, minWindowH){\r
                        var MOUSE_CURSOR = updateMouseCursor,\r
                                MENUBAR_SELWCTION = MENU_BAR_CONTROL.WINDOW.createSelection( \r
@@ -2212,10 +2210,11 @@ h2c.editor = ( function(){
                        \r
                        function update( _x, _y, _w, _h){\r
                                ( w !== _w || h !== _h) && instance.onResize && instance.onResize( _w, _h);\r
-                               x = _x || x;\r
-                               y = _y || y;\r
-                               w = _w || w;\r
-                               h = _h || h;\r
+                               x = _x !== undefined ? _x : x;\r
+                               y = _y !== undefined ? _y : y;\r
+                               w = _w !== undefined ? _w : w;\r
+                               h = _h !== undefined ? _h : h;\r
+                               y = y > MENU_BAR_CONTROL.h ? y : MENU_BAR_CONTROL.h;\r
                                jqWrapper.css( {\r
                                        left:           x,\r
                                        top:            y,\r
@@ -2226,6 +2225,7 @@ h2c.editor = ( function(){
                                elmBodyStyle.height = bodyH +'px';\r
                        }\r
                        function bodyBackOrForward( isBack){\r
+                               if( !instance) return;\r
                                if( bodyIsTachable === !isBack) return;\r
                                elmBodyStyle.position = isBack === true ? 'relative' : 'absolute';\r
                                elmBodyStyle.left =             isBack === true ? 0  : x +'px';\r
@@ -2234,15 +2234,30 @@ h2c.editor = ( function(){
                                bodyIsTachable === isBack && isBack === true ? jqWrapper.append( elmBody) : jqStage.append( elmBody);\r
                                bodyIsTachable = !isBack;\r
                        }\r
-                       \r
+                       function onWindowResize( e){\r
+                               bodyBackOrForward( true);\r
+                               isResizing = true;\r
+                               startX = x;\r
+                               startY = y;\r
+                               startW = w;\r
+                               startH = h;\r
+                               xOffset = e.pageX;\r
+                               yOffset = e.pageY;\r
+                               MOUSE_CURSOR( 'nw-resize');\r
+                               e.stopPropagation();\r
+                               return false;\r
+                       }\r
                        return {\r
                                init: function( jqContainer){\r
+                                       /*\r
+                                        * setTimeout で呼ばれるグローバルメソッドは、this でなく instance を使う.\r
+                                        */\r
                                        instance = this;\r
                                        \r
                                        jqWindowOrigin = jqWindowOrigin || ( function(){\r
                                                return $( $( '#windowTemplete').remove().html());\r
                                        })();\r
-                                       windowCloseButtonWidth = windowCloseButtonWidth || ( function(){\r
+                                       closeButtonWidth = closeButtonWidth || ( function(){\r
                                                return h2c.util.getElementSize( jqWindowOrigin.clone( true).find( '.window-close-button').get( 0)).width;\r
                                        })();\r
                                        \r
@@ -2274,23 +2289,8 @@ h2c.editor = ( function(){
                                },\r
                                visible: visible,\r
                                firstOpen: function(){\r
-                                       //jqContainer.append( jqWrapper); // domに追加しないと、this.onInit()が正しく動かない.\r
-                                       //jqWrapper.fadeIn(); // appendした後に fadeIn() しないと ie で filterが適用されない.\r
                                        if( RESIZE_BUTTON_ENABLED === true){\r
-                                               jqWrapper.find( '.window-resize-button').eq( 0)\r
-                                                       .mousedown( function( e){\r
-                                                               bodyBackOrForward( true);\r
-                                                               isResizing = true;\r
-                                                               startX = x;\r
-                                                               startY = y;\r
-                                                               startW = w;\r
-                                                               startH = h;\r
-                                                               xOffset = e.pageX;\r
-                                                               yOffset = e.pageY;\r
-                                                               MOUSE_CURSOR( 'nw-resize');\r
-                                                               e.stopPropagation();\r
-                                                               return false;\r
-                                                       });\r
+                                               jqWrapper.find( '.window-resize-button').eq( 0).mousedown( onWindowResize);\r
                                        } else {\r
                                                jqWrapper.find( '.window-resize-button').remove();\r
                                        }\r
@@ -2302,21 +2302,30 @@ h2c.editor = ( function(){
                                },\r
                                open: function(){\r
                                        if( visible === true) return;\r
-                                       this.visible = visible = true;\r
-                                       openWindow( this);\r
-                                       \r
+                                       instance.visible = visible = true;\r
+                                       openWindow( instance);\r
                                        MENUBAR_SELWCTION.title( 'hide ' +title);\r
+                                       \r
+                                       for( var i=0, l = WINDOW_ARRAY.length; i<l; ++i){\r
+                                               if( WINDOW_ARRAY[ i] === instance){\r
+                                                       WINDOW_ARRAY.splice( i, 1);\r
+                                                       WINDOW_ARRAY.unshift( instance);\r
+                                                       currentWindow = null;\r
+                                                       currentWindowIndex = -1;\r
+                                               }\r
+                                       }\r
                                },\r
                                close: function(){\r
                                        if( visible === false) return;\r
-                                       this.visible = visible = false;\r
-                                       this.onClose && setTimeout( this.onClose, 0);\r
-                                       closeWindow( this);\r
+                                       instance.visible = visible = false;\r
+                                       instance.onClose && setTimeout( instance.onClose, 0);\r
+                                       closeWindow( instance);\r
                                        MENUBAR_SELWCTION.title( 'show ' +title);\r
                                },\r
+                               bodyBackOrForward: bodyBackOrForward,\r
                                onMouseDown: function( _mouseX, _mouseY){\r
                                        if( x > _mouseX || y > _mouseY || x +w < _mouseX || y +headerH < _mouseY ) return;\r
-                                       if( CLOSE_BUTTON_ENABLED === true && x +w -windowCloseButtonWidth < _mouseX){\r
+                                       if( CLOSE_BUTTON_ENABLED === true && x +w -closeButtonWidth < _mouseX){\r
                                                this.close();\r
                                                return;\r
                                        }\r
@@ -2390,22 +2399,24 @@ h2c.editor = ( function(){
                        return currentWindowIndex;\r
                }\r
                function openWindow( _window){\r
-                       if( _window.firstOpen && h2c.isIE === true && h2c.ieVersion < 9){\r
-                               jqContainer.append( _window.$.stop());\r
-                               _window.firstOpen();\r
-                       }\r
-                       _window.visible === true && jqContainer.append( _window.$.stop().fadeIn(\r
+                       if( _window.visible !== true) return;\r
+                       var _jqWindow = _window.$;\r
+                       jqContainer.append( _jqWindow);// appendした後に fadeIn() しないと ie で filterが適用されない.\r
+                       _jqWindow.fadeIn(\r
                                function(){\r
                                        _window.firstOpen && _window.firstOpen();\r
                                        _window.onOpen && setTimeout( _window.onOpen, 0);\r
                                }\r
-                       ));\r
+                       );\r
+                       return;\r
                }\r
                function closeWindow( _window){\r
+                       if( _window.visible !== false) return;\r
                        var l = WINDOW_ARRAY.length;\r
                        for( var i=0; i<l; ++i){\r
                                if( WINDOW_ARRAY[ i] === _window){\r
                                        //WINDOW_ARRAY.splice( i, 1);\r
+                                       //WINDOW_ARRAY.push( _window);\r
                                        _window.$.stop().fadeOut( function(){\r
                                                this.parentNode.removeChild( this);\r
                                        });\r
@@ -2494,8 +2505,9 @@ h2c.editor = ( function(){
  * TOOL_BOX_WINDOW\r
  */\r
        var TOOL_BOX_WINDOW = ( function(){\r
-               var addImageButton, addTextButton, editBgButton, switchGridButton, popupHelpButton, publishButton,\r
-                       gridSwitchFunction;\r
+               var addImageButton, addTextButton, editBgButton, switchGridButton, popupHelpButton, postButton,\r
+                       gridSwitchFunction,\r
+                       instance;\r
                        \r
                h2c.key.addKeyDownEvent( h2c.view.EDITOR, 73, false, true, addImage);\r
                MENU_BAR_CONTROL.EDIT.createSelection( 'Add Image', 'ctrl + I', addImage, true, true, false);\r
@@ -2522,7 +2534,14 @@ h2c.editor = ( function(){
                        return false;\r
                }\r
                function popupHelp( e){\r
-                       setTimeout( HELP_DOCUMENTS_WINDOW.open, 0);\r
+                       instance.bodyBackOrForward( true);\r
+                       setTimeout( HELP_DOCUMENTS_WINDOW.open, 0); // setTimeout で囲むと window が開かない\r
+                       e && e.preventDefault();\r
+                       return false;\r
+               }\r
+               function editBG( e){\r
+                       instance.bodyBackOrForward( true);\r
+                       setTimeout( INFOMATION_WINDOW.open, 0); \r
                        e && e.preventDefault();\r
                        return false;\r
                }\r
@@ -2530,20 +2549,18 @@ h2c.editor = ( function(){
                return WINDOWS_CONTROL.createWindow(\r
                        this,\r
                        {\r
+                               onInit: function(){\r
+                                       instance = this;\r
+                                       delete this.onInit;\r
+                               },\r
                                onFirstOpen: function(){\r
                                        addImageButton = $( '#toolbox-add-image-button').click( addImage);\r
                                        addTextButton = $( '#toolbox-add-text-button').click( addText);\r
-                                       \r
-                                       editBgButton = $( '#toolbox-edit-bg-button').click( function( e){\r
-                                               setTimeout( INFOMATION_WINDOW.open, 0); \r
-                                               e.preventDefault();\r
-                                               return false;\r
-                                       });\r
-                                       \r
+                                       editBgButton = $( '#toolbox-edit-bg-button').click( editBG);\r
                                        switchGridButton = $( '#toolbox-switch-grid').click( switchGrid);\r
                                        popupHelpButton = $( '#toolbox-popup-help-button').click( popupHelp);\r
                                        \r
-                                       publishButton = $( '#toolbox-publish-button');\r
+                                       postButton = $( '#toolbox-post-button');\r
                                        \r
                                        delete this.onFirstOpen;\r
                                },\r
@@ -2554,7 +2571,6 @@ h2c.editor = ( function(){
                        'toolbox-window', 'Tool box', 0, 215, 110, 290, true\r
                );\r
        })();\r
-\r
 /* ----------------------------------------\r
  * INFOMATION_WINDOW\r
  */                    \r
@@ -2564,8 +2580,8 @@ h2c.editor = ( function(){
                        FADE_OUT_EFFECT = FADE_EFFECT_ENABLED === true ? 'fadeOut' : 'hide',\r
                        backgroundInfomationElm,\r
                        jqComicElementInformation,\r
-                       xValueElm, yValueElm, zValueElm, aValueElm, wValueElm, hValueElm, aspectElm,\r
-                       wPercentElm, hPercentElm,\r
+                       elmValueX, elmValueY, elmValueZ, elmValueA, elmValueW, elmValueH, elmAspect,\r
+                       elmPercentW, elmPercentH,\r
                        currentComicElement = null,\r
                        currentElementType = -1;\r
 \r
@@ -2580,15 +2596,15 @@ h2c.editor = ( function(){
                                        });\r
                                        var TAB_GROUP_ID = 'comic-element-attribute';\r
                                        var CREATER = h2c.key.createEditableText;\r
-                                       xValueElm = CREATER( $( '#comic-element-x'), null, TAB_GROUP_ID);\r
-                                       yValueElm = CREATER( $( '#comic-element-y'), null, TAB_GROUP_ID);\r
-                                       zValueElm = CREATER( $( '#comic-element-z'), null, TAB_GROUP_ID);\r
-                                       aValueElm = CREATER( $( '#comic-element-a'), null, TAB_GROUP_ID);\r
-                                       wValueElm = CREATER( $( '#comic-element-w'), null, TAB_GROUP_ID);\r
-                                       hValueElm = CREATER( $( '#comic-element-h'), null, TAB_GROUP_ID);\r
-                                       wPercentElm = CREATER( $( '#comic-element-w-percent'), null, TAB_GROUP_ID);\r
-                                       hPercentElm = CREATER( $( '#comic-element-h-percent'), null, TAB_GROUP_ID);\r
-                                       aspectElm = $( '#comic-element-keep-aspect');\r
+                                       elmValueX = CREATER( $( '#comic-element-x'), null, TAB_GROUP_ID);\r
+                                       elmValueY = CREATER( $( '#comic-element-y'), null, TAB_GROUP_ID);\r
+                                       elmValueZ = CREATER( $( '#comic-element-z'), null, TAB_GROUP_ID);\r
+                                       elmValueA = CREATER( $( '#comic-element-a'), null, TAB_GROUP_ID);\r
+                                       elmValueW = CREATER( $( '#comic-element-w'), null, TAB_GROUP_ID);\r
+                                       elmValueH = CREATER( $( '#comic-element-h'), null, TAB_GROUP_ID);\r
+                                       elmPercentW = CREATER( $( '#comic-element-w-percent'), null, TAB_GROUP_ID);\r
+                                       elmPercentH = CREATER( $( '#comic-element-h-percent'), null, TAB_GROUP_ID);\r
+                                       elmAspect = $( '#comic-element-keep-aspect');\r
                                        delete this.onFirstOpen;\r
                                },\r
                                onResize: function( w, h){\r
@@ -2596,20 +2612,20 @@ h2c.editor = ( function(){
                                                height: this.bodyHeight()\r
                                        });\r
                                },\r
-                               update: function( _currentElementType, x, y, z, a, w, h, wPercent, hPercent, keepAspect){\r
-                                       if( this.onFirstOpen) return;\r
-                                       if( currentElementType !== _currentElementType){\r
-                                               if( _currentElementType !== -1){\r
-                                                       if( _currentElementType === 1){\r
-                                                               aValueElm.show();\r
-                                                               wPercentElm.hide();\r
-                                                               hPercentElm.hide();\r
-                                                               aspectElm.hide();\r
+                               update: function( _elementType, x, y, z, a, w, h, wPercent, hPercent, keepAspect){\r
+                                       if( !backgroundInfomationElm) return; // なぜか !backgroundInfomationElm が必要\r
+                                       if( currentElementType !== _elementType){\r
+                                               if( _elementType !== -1){\r
+                                                       if( _elementType === 1){\r
+                                                               elmValueA.show();\r
+                                                               elmPercentW.hide();\r
+                                                               elmPercentH.hide();\r
+                                                               elmAspect.hide();\r
                                                        } else {\r
-                                                               aValueElm.hide();\r
-                                                               wPercentElm.show();\r
-                                                               hPercentElm.show();\r
-                                                               aspectElm.show();\r
+                                                               elmValueA.hide();\r
+                                                               elmPercentW.show();\r
+                                                               elmPercentH.show();\r
+                                                               elmAspect.show();\r
                                                        }\r
                                                        currentElementType === -1 && jqComicElementInformation.stop().css( {\r
                                                                filter:         '',\r
@@ -2621,17 +2637,17 @@ h2c.editor = ( function(){
                                                                opacity:        ''\r
                                                        })[ FADE_OUT_EFFECT]();\r
                                                }\r
-                                               currentElementType = _currentElementType;\r
+                                               currentElementType = _elementType;\r
                                        }\r
                                        if( currentElementType !== -1){\r
-                                               xValueElm.update( x);\r
-                                               yValueElm.update( y);\r
-                                               zValueElm.update( z);\r
-                                               _currentElementType === 1 && aValueElm.update( a);\r
-                                               wValueElm.update( w);\r
-                                               hValueElm.update( h);\r
-                                               _currentElementType === 0 && wPercentElm.update( wPercent);\r
-                                               _currentElementType === 0 && hPercentElm.update( hPercent);                                     \r
+                                               elmValueX.update( x);\r
+                                               elmValueY.update( y);\r
+                                               elmValueZ.update( z);\r
+                                               _elementType === 1 && elmValueA.update( a);\r
+                                               elmValueW.update( w);\r
+                                               elmValueH.update( h);\r
+                                               _elementType === 0 && elmPercentW.update( wPercent);\r
+                                               _elementType === 0 && elmPercentH.update( hPercent);                                    \r
                                        } else {\r
                                                \r
                                        }\r
@@ -2662,8 +2678,8 @@ h2c.editor = ( function(){
                                $.ajax({\r
                                        url:            'help/jp.xml',\r
                                        dataType:       'xml',\r
-                                       success:        function( xml){\r
-                                               var jqXML = $( xml),\r
+                                       success:        function( _xml){\r
+                                               var jqXML = $( _xml),\r
                                                        helpTitle = jqXML.find( 'pages').eq( 0).attr( 'title'),\r
                                                        elmNavi = document.createElement( 'DIV'),\r
                                                        elmItemOrigin = document.createElement( 'A'),\r
@@ -3017,144 +3033,7 @@ h2c.editor = ( function(){
                                        currentIsTextElement = false,\r
                                        currentControler = null,\r
                                        currentElement = null,\r
-                                       x, y, w, h, angle, flipV, flipH,                                \r
-                                       RESIZER = ( function( HIT_AREA){\r
-                                               var POSITION_ARRAY = [],\r
-                                                       FLOOR = Math.floor,\r
-                                                       CURSOR_AND_FLIP = [\r
-                                                               { cursor:       'n-resize',             v: 3},\r
-                                                               { cursor:       'e-resize',             h: 2},\r
-                                                               { cursor:       'e-resize',             h: 1},\r
-                                                               { cursor:       'n-resize',             v: 0},\r
-                                                               { cursor:       'nw-resize',    h: 5, v: 6, vh: 7},\r
-                                                               { cursor:       'ne-resize',    h: 4, v: 7, vh: 6},\r
-                                                               { cursor:       'ne-resize',    h: 7, v: 4, vh: 5},\r
-                                                               { cursor:       'nw-resize',    h: 6, v: 5, vh: 4}\r
-                                                       ],      \r
-                                                       elmResizerContainerStyle = document.getElementById( 'comic-element-resizer-container').style,\r
-                                                       elmResizerTopStyle = document.getElementById( 'comic-element-resizer-top').style,\r
-                                                       elmResizerLeftStyle = document.getElementById( 'comic-element-resizer-left').style,\r
-                                                       elmResizerRightStyle = document.getElementById( 'comic-element-resizer-right').style,\r
-                                                       elmResizerBottomStyle = document.getElementById( 'comic-element-resizer-bottom').style,\r
-                                                       x, y, w, h,\r
-                                                       currentIndex;\r
-                                               elmResizerContainerStyle.display = 'none';\r
-                                               return {\r
-                                                       x: function(){ return x;},\r
-                                                       y: function(){ return y;},\r
-                                                       w: function(){ return w;},\r
-                                                       h: function(){ return h;},\r
-                                                       update: function( _x, _y, _w, _h){\r
-                                                               x = _x !== undefined ? _x : x;\r
-                                                               y = _y !== undefined ? _y : y;\r
-                                                               w = _w !== undefined ? _w : w;\r
-                                                               h = _h !== undefined ? _h : h;\r
-                                                               elmResizerContainerStyle.left = x +'px';\r
-                                                               elmResizerContainerStyle.top = y +'px';\r
-                                                               elmResizerContainerStyle.width = w +'px';\r
-                                                               elmResizerContainerStyle.height = h +'px';\r
-                                                               elmResizerTopStyle.left = FLOOR( w /2 -10 /2) +'px';\r
-                                                               elmResizerLeftStyle.top = FLOOR( h /2 -10 /2) +'px';\r
-                                                               elmResizerRightStyle.top = FLOOR( h /2 -10 /2) +'px';\r
-                                                               elmResizerBottomStyle.left = FLOOR( w /2 -10 /2) +'px';\r
-                                                               \r
-                                                               POSITION_ARRAY.splice( 0, POSITION_ARRAY.length);\r
-                                                               POSITION_ARRAY.push(\r
-                                                                       {x:     x +5,                                   y:      y -HIT_AREA,            w:      w -5 *2,                h:      HIT_AREA +5},\r
-                                                                       {x: x -HIT_AREA,                        y:      y +HIT_AREA +5,         w:      HIT_AREA +5,    h:      h -5 *2},\r
-                                                                       {x: x +w -5,                            y:      y +HIT_AREA +5,         w:      HIT_AREA +5,    h:      h -5 *2},\r
-                                                                       {x:     x +5,                                   y:      y +h -5,                        w:      w -5 *2,                h:      HIT_AREA +5},\r
-                                                                       {x:     x -HIT_AREA,                    y:      y -HIT_AREA,            w:      HIT_AREA +5,    h:      HIT_AREA +5},\r
-                                                                       {x: x +w -HIT_AREA,                     y:      y -HIT_AREA,            w:      HIT_AREA +5,    h:      HIT_AREA +5},\r
-                                                                       {x:     x -HIT_AREA,                    y:      y +h -5,                        w:      HIT_AREA +5,    h:      HIT_AREA +5},\r
-                                                                       {x:     x +w -5,                                y:      y +h -5,                        w:      HIT_AREA +5,    h:      HIT_AREA +5}\r
-                                                               );\r
-                                                       },\r
-                                                       index: function( _mouseX, _mouseY){\r
-                                                               var     p,\r
-                                                                       l = POSITION_ARRAY.length;\r
-                                                               for( var i=0; i<l; i++){\r
-                                                                       p = POSITION_ARRAY[ i];\r
-                                                                       if( p.x <= _mouseX && p.y <= _mouseY && p.x + p.w >= _mouseX && p.y +p.h >= _mouseY){\r
-                                                                               MOUSE_CURSOR( CURSOR_AND_FLIP[ i].cursor);\r
-                                                                               return currentIndex = i;\r
-                                                                       }\r
-                                                               }\r
-                                                               return -1;\r
-                                                       },\r
-                                                       flip: function( _flipV, _flipH){\r
-                                                               var p = CURSOR_AND_FLIP[ currentIndex];\r
-                                                               currentIndex = _flipH === true || _flipV === true ? p[\r
-                                                                       _flipH === true && _flipV === true ? 'vh' : ( _flipH === true ? 'h' : 'v')\r
-                                                               ] : currentIndex;\r
-                                                               MOUSE_CURSOR( CURSOR_AND_FLIP[ currentIndex].cursor);\r
-                                                               return currentIndex;\r
-                                                       },\r
-                                                       show: function(){\r
-                                                               elmResizerContainerStyle.display = '';\r
-                                                       },\r
-                                                       hide: function(){\r
-                                                               elmResizerContainerStyle.display = 'none';\r
-                                                       }\r
-                                               }\r
-                                       })( HIT_AREA),\r
-                                       TAIL_MOVER = ( function(){\r
-                                               var     ELM_MOVER = document.getElementById( 'balloon-tail-mover'),\r
-                                                       SIZE = h2c.util.getElementSize( ELM_MOVER).width,\r
-                                                       SIN = Math.sin,\r
-                                                       COS = Math.cos,\r
-                                                       ATAN = Math.atan,\r
-                                                       FLOOR = Math.floor,\r
-                                                       DEG_TO_RAD = Math.PI / 180,\r
-                                                       RAD_TO_DEG = 1 /DEG_TO_RAD,\r
-                                                       currentText = null,\r
-                                                       x, y, w, h, a, radA,\r
-                                                       visible = false;\r
-                                               \r
-                                               function draw( _w, _h, _a){\r
-                                                       w = _w !== undefined ? _w : w;\r
-                                                       h = _h !== undefined ? _h : h;\r
-                                                       a = _a !== undefined ? _a : a;\r
-                                                       radA = a *DEG_TO_RAD;\r
-                                                       x = FLOOR( ( ( COS( radA) /2 +0.5) *( w +SIZE)) -SIZE /2);\r
-                                                       y = FLOOR( ( ( SIN( radA) /2 +0.5) *( h +SIZE)) -SIZE /2);\r
-                                                       ELM_MOVER.style.left = x +'px';\r
-                                                       ELM_MOVER.style.top = y +'px';\r
-                                                       log.html( [ w, h, a].join());\r
-                                               }\r
-                                               \r
-                                               return {\r
-                                                       update: draw,\r
-                                                       show: function( _currentText){\r
-                                                               /*\r
-                                                                * visibilityのほうがいい, display:none だと ie で描画が狂う\r
-                                                                */\r
-                                                               ELM_MOVER.style.visibility = '';\r
-                                                               draw( _currentText.w, _currentText.h, _currentText.angle());\r
-                                                               currentText = _currentText;\r
-                                                       },\r
-                                                       hide: function(){\r
-                                                               ELM_MOVER.style.visibility = 'hidden';\r
-                                                               currentText = null;\r
-                                                       },\r
-                                                       hitTest: function( _mouseX, _mouseY){\r
-                                                               var _x = x -SIZE /2,\r
-                                                                       _y = y -SIZE /2;\r
-                                                                       ret = currentIsTextElement === true && _x <= _mouseX && _y <= _mouseY && _x +SIZE >= _mouseX && _y +SIZE >= _mouseY;\r
-                                                               ret === true && MOUSE_CURSOR( 'move');\r
-                                                               return ret;\r
-                                                       },\r
-                                                       onDrag: function( _mouseX, _mouseY){\r
-                                                               draw( w, h,\r
-                                                                       _mouseX !== 0 ?\r
-                                                                               ATAN( _mouseY /_mouseX) *RAD_TO_DEG +( _mouseX < 0 ? 180 : 0) :\r
-                                                                               _mouseY > 0 ? 90 : -90\r
-                                                               );\r
-                                                               currentText && currentText.angle( a);\r
-                                                               updateInfomation( undefined, undefined, undefined, a);\r
-                                                       }\r
-                                               }\r
-                                       })(),\r
+                                       x, y, w, h, angle, flipV, flipH,\r
                                        COMIC_ELEMENT_CONSOLE = ( function(){\r
                                                var LAYER_BACK_BUTTON = MENU_BAR_CONTROL.EDIT.createSelection( 'layer back', 'ctrl + B', layerBack, false, true, false),\r
                                                        LAYER_FORWARD_BUTTON = MENU_BAR_CONTROL.EDIT.createSelection( 'layer forward', 'ctrl + F', layerForward, false, false, false),\r
@@ -3316,21 +3195,77 @@ h2c.editor = ( function(){
                                                }\r
                                        })(),\r
                                        TAIL_CONTROLER = ( function(){\r
-                                               var startA;\r
+                                               var     ELM_MOVER = document.getElementById( 'balloon-tail-mover'),\r
+                                                       SIZE = h2c.util.getElementSize( ELM_MOVER).width,\r
+                                                       SIN = Math.sin,\r
+                                                       COS = Math.cos,\r
+                                                       ATAN = Math.atan,\r
+                                                       FLOOR = Math.floor,\r
+                                                       DEG_TO_RAD = Math.PI / 180,\r
+                                                       RAD_TO_DEG = 1 /DEG_TO_RAD,\r
+                                                       currentText = null,\r
+                                                       tailX, tailY,\r
+                                                       balloonW, balloonH, balloonA, radA,\r
+                                                       visible = false,\r
+                                                       startA;\r
+                                               \r
+                                               function draw( _w, _h, _a){\r
+                                                       balloonW = _w !== undefined ? _w : balloonW;\r
+                                                       balloonH = _h !== undefined ? _h : balloonH;\r
+                                                       balloonA = _a !== undefined ? _a : balloonA;\r
+                                                       radA = balloonA *DEG_TO_RAD;\r
+                                                       tailX = FLOOR( ( ( COS( radA) /2 +0.5) *( balloonW +SIZE)) -SIZE /2);\r
+                                                       tailY = FLOOR( ( ( SIN( radA) /2 +0.5) *( balloonH +SIZE)) -SIZE /2);\r
+                                                       ELM_MOVER.style.left = tailX +'px';\r
+                                                       ELM_MOVER.style.top = tailY +'px';\r
+                                                       log.html( [ balloonW, balloonH, balloonA].join());\r
+                                               }\r
+                                               function hitTest( _mouseX, _mouseY){\r
+                                                       var _x = tailX -SIZE /2,\r
+                                                               _y = tailY -SIZE /2;\r
+                                                               ret = currentIsTextElement === true && _x <= _mouseX && _y <= _mouseY && _x +SIZE >= _mouseX && _y +SIZE >= _mouseY;\r
+                                                       ret === true && MOUSE_CURSOR( 'move');\r
+                                                       return ret;\r
+                                               }\r
                                                return {\r
-                                                       onStart: function( _mouseX, _mouseY){\r
-                                                               if( TAIL_MOVER.hitTest( _mouseX -x, _mouseY -y) === true){\r
-                                                                       startA = currentElement.angle();\r
+                                                       update: draw,\r
+                                                       show: function( _currentText){\r
+                                                               /*\r
+                                                                * visibilityのほうがいい, display:none だと ie で描画が狂う\r
+                                                                */\r
+                                                               ELM_MOVER.style.visibility = '';\r
+                                                               draw( _currentText.w, _currentText.h, _currentText.angle());\r
+                                                               currentText = _currentText;\r
+                                                       },\r
+                                                       hitTest: hitTest,\r
+                                                       hide: function(){\r
+                                                               ELM_MOVER.style.visibility = 'hidden';\r
+                                                               currentText = null;\r
+                                                       },\r
+                                                       onStart: function( _currentText, _mouseX, _mouseY){\r
+                                                               if( hitTest( _mouseX -x, _mouseY -y) === true){\r
+                                                                       currentText = _currentText;\r
+                                                                       startA = _currentText.angle();\r
                                                                        return true;\r
                                                                }\r
+                                                               currentText = null;\r
                                                                return false;\r
                                                        },\r
                                                        onDrag: function( _mouseX, _mouseY){\r
-                                                               TAIL_MOVER.onDrag( _mouseX -x -w /2, _mouseY -y -h /2); //Balloonの中心を0,0とする座標系に変換\r
+                                                               _mouseX = _mouseX -currentText.x -w /2;\r
+                                                               _mouseY = _mouseY -currentText.y -h /2; //Balloonの中心を0,0とする座標系に変換\r
+                                                               \r
+                                                               draw( w, h,\r
+                                                                       _mouseX !== 0 ?\r
+                                                                               ATAN( _mouseY /_mouseX) *RAD_TO_DEG +( _mouseX < 0 ? 180 : 0) :\r
+                                                                               _mouseY > 0 ? 90 : -90\r
+                                                               );\r
+                                                               currentText && currentText.angle( balloonA);\r
+                                                               updateInfomation( undefined, undefined, undefined, balloonA);\r
                                                        },\r
                                                        onFinish: function(){\r
-                                                               if( startA === currentElement.angle()) return;\r
-                                                               saveComicElementStatus( x, y, w, h, startA);\r
+                                                               startA !== currentText.angle() && saveComicElementStatus( x, y, w, h, startA);\r
+                                                               currentText = null;\r
                                                        },\r
                                                        onCancel: function(){\r
                                                                resize( undefined, undefined, undefined, undefined, startA);\r
@@ -3338,6 +3273,30 @@ h2c.editor = ( function(){
                                                }\r
                                        })(),\r
                                        RESIZE_CONTROLER = ( function(){\r
+                                               var POSITION_ARRAY = [],\r
+                                                       FLOOR = Math.floor,\r
+                                                       CURSOR_AND_FLIP = [\r
+                                                               { cursor:       'n-resize',             v: 3},\r
+                                                               { cursor:       'e-resize',             h: 2},\r
+                                                               { cursor:       'e-resize',             h: 1},\r
+                                                               { cursor:       'n-resize',             v: 0},\r
+                                                               { cursor:       'nw-resize',    h: 5, v: 6, vh: 7},\r
+                                                               { cursor:       'ne-resize',    h: 4, v: 7, vh: 6},\r
+                                                               { cursor:       'ne-resize',    h: 7, v: 4, vh: 5},\r
+                                                               { cursor:       'nw-resize',    h: 6, v: 5, vh: 4}\r
+                                                       ],      \r
+                                                       elmResizerContainerStyle = document.getElementById( 'comic-element-resizer-container').style,\r
+                                                       elmResizerTopStyle = document.getElementById( 'comic-element-resizer-top').style,\r
+                                                       elmResizerLeftStyle = document.getElementById( 'comic-element-resizer-left').style,\r
+                                                       elmResizerRightStyle = document.getElementById( 'comic-element-resizer-right').style,\r
+                                                       elmResizerBottomStyle = document.getElementById( 'comic-element-resizer-bottom').style,\r
+                                                       x, y, w, h,\r
+                                                       currentIndex = -1,\r
+                                                       currentElement,\r
+                                                       currentIsTextElement = false;\r
+                                               \r
+                                               elmResizerContainerStyle.display = 'none';\r
+                                               \r
                                                var RESIZE_WORK_ARRAY = [\r
                                                                { x:    0, w:    0, y:  1, h:   -1}, //top\r
                                                                { x:    1, w:   -1, y:  0, h:    0}, //left\r
@@ -3348,59 +3307,118 @@ h2c.editor = ( function(){
                                                                { x:    1, w:   -1, y:  0, h:    1}, //bottom-left\r
                                                                { x:    0, w:    1, y:  0, h:    1}  //bottom-right\r
                                                        ],\r
-                                                       currentResizerIndex = -1,\r
                                                        startX, startY, startW, startH, startFilpV, startFilpH, startAspect,\r
                                                        baseX, baseY, baseW, baseH,\r
                                                        currentX, currentY, currentW, currentH,\r
                                                        transX, transY, transW, transH,\r
-                                                       xOffset, yOffset;\r
+                                                       xOffset, yOffset,\r
+                                                       error = 0;\r
+                                               \r
+                                               function draw( _x, _y, _w, _h){\r
+                                                       x = _x !== undefined ? _x : x;\r
+                                                       y = _y !== undefined ? _y : y;\r
+                                                       w = _w !== undefined ? _w : w;\r
+                                                       h = _h !== undefined ? _h : h;\r
+                                                       elmResizerContainerStyle.left = x +'px';\r
+                                                       elmResizerContainerStyle.top = y +'px';\r
+                                                       elmResizerContainerStyle.width = w +'px';\r
+                                                       elmResizerContainerStyle.height = h +'px';\r
+                                                       elmResizerTopStyle.left = FLOOR( w /2 -10 /2) +'px';\r
+                                                       elmResizerLeftStyle.top = FLOOR( h /2 -10 /2) +'px';\r
+                                                       elmResizerRightStyle.top = FLOOR( h /2 -10 /2) +'px';\r
+                                                       elmResizerBottomStyle.left = FLOOR( w /2 -10 /2) +'px';\r
                                                        \r
+                                                       POSITION_ARRAY.splice( 0, POSITION_ARRAY.length);\r
+                                                       POSITION_ARRAY.push(\r
+                                                               {x:     x +5,                                   y:      y -HIT_AREA,            w:      w -5 *2,                h:      HIT_AREA +5},\r
+                                                               {x: x -HIT_AREA,                        y:      y +HIT_AREA +5,         w:      HIT_AREA +5,    h:      h -5 *2},\r
+                                                               {x: x +w -5,                            y:      y +HIT_AREA +5,         w:      HIT_AREA +5,    h:      h -5 *2},\r
+                                                               {x:     x +5,                                   y:      y +h -5,                        w:      w -5 *2,                h:      HIT_AREA +5},\r
+                                                               {x:     x -HIT_AREA,                    y:      y -HIT_AREA,            w:      HIT_AREA +5,    h:      HIT_AREA +5},\r
+                                                               {x: x +w -HIT_AREA,                     y:      y -HIT_AREA,            w:      HIT_AREA +5,    h:      HIT_AREA +5},\r
+                                                               {x:     x -HIT_AREA,                    y:      y +h -5,                        w:      HIT_AREA +5,    h:      HIT_AREA +5},\r
+                                                               {x:     x +w -5,                                y:      y +h -5,                        w:      HIT_AREA +5,    h:      HIT_AREA +5}\r
+                                                       );\r
+                                               }\r
+                                               \r
                                                function update( _x, _y, _w, _h){\r
-                                                       _x = _x !== undefined ? _x : currentX;\r
-                                                       _y = _y !== undefined ? _y : currentY;\r
-                                                       _w = _w !== undefined ? _w : currentW;\r
-                                                       _h = _h !== undefined ? _h : currentH;\r
+                                                       transX = _x !== undefined ? _x : currentX;\r
+                                                       transY = _y !== undefined ? _y : currentY;\r
+                                                       transW = _w !== undefined ? _w : currentW;\r
+                                                       transH = _h !== undefined ? _h : currentH;\r
                                                        \r
-                                                       if( currentIsTextElement === false && currentResizerIndex > 3 && h2c.key.shiftEnabled() === true){\r
+                                                       if( currentIsTextElement === false && currentIndex > 3 && h2c.key.shiftEnabled() === true){\r
                                                                if( startAspect >= 1){\r
-                                                                       var __w = _w;\r
-                                                                       _w = Math.floor( startAspect * _h);\r
-                                                                       _x += currentResizerIndex % 2 === 0 ? __w -_w : 0;\r
+                                                                       _w = transW;\r
+                                                                       transW = Math.floor( startAspect * transH);\r
+                                                                       transX = transX +( currentIndex % 2 === 0 ? _w -transW : 0);\r
                                                                } else {\r
-                                                                       var __h = _h;\r
-                                                                       _h = Math.floor( _w / startAspect);\r
-                                                                       _y += currentResizerIndex <= 5 ? __h -_h : 0;\r
+                                                                       _h = transH;\r
+                                                                       transH = Math.floor( transW / startAspect);\r
+                                                                       transY = transY + ( currentIndex <= 5 ? _h -transH : 0);\r
                                                                }\r
                                                        }\r
-                                                       transX = _x;\r
-                                                       transY = _y;\r
-                                                       transW = _w;\r
-                                                       transH = _h;\r
-                                                       RESIZER.update( _x, _y, _w, _h);\r
-                                                       currentElement.resize( _x, _y, _w, _h);\r
-                                                       currentIsTextElement === true && TAIL_MOVER.update( _w, _h);\r
-                                                       COMIC_ELEMENT_CONSOLE.show( currentElement, _w, _h);\r
-                                                       updateInfomation( _x, _y, undefined, undefined, _w, _h);\r
+                                                       draw( transX, transY, transW, transH);\r
+                                                       currentElement.resize( transX, transY, transW, transH);\r
+                                                       currentIsTextElement === true && TAIL_CONTROLER.update( transW, transH);\r
+                                                       COMIC_ELEMENT_CONSOLE.show( currentElement, transW, transH);\r
+                                                       updateInfomation( transX, transY, undefined, undefined, transW, transH);\r
+                                               }\r
+                                               function getIndex( _mouseX, _mouseY){\r
+                                                       var     p,\r
+                                                               l = POSITION_ARRAY.length;\r
+                                                       for( var i=0; i<l; i++){\r
+                                                               p = POSITION_ARRAY[ i];\r
+                                                               if( p.x <= _mouseX && p.y <= _mouseY && p.x + p.w >= _mouseX && p.y +p.h >= _mouseY){\r
+                                                                       MOUSE_CURSOR( CURSOR_AND_FLIP[ i].cursor);\r
+                                                                       return currentIndex = i;\r
+                                                               }\r
+                                                       }\r
+                                                       return -1;\r
+                                               }\r
+                                               function flip( _flipV, _flipH){\r
+                                                       var p = CURSOR_AND_FLIP[ currentIndex];\r
+                                                       currentIndex = _flipH === true || _flipV === true ? p[\r
+                                                               _flipH === true && _flipV === true ? 'vh' : ( _flipH === true ? 'h' : 'v')\r
+                                                       ] : currentIndex;\r
+                                                       MOUSE_CURSOR( CURSOR_AND_FLIP[ currentIndex].cursor);\r
+                                                       currentElement.flip( _flipV, _flipH);\r
                                                }\r
-                                                       \r
                                                return {\r
-                                                       onStart: function( _mouseX, _mouseY){\r
-                                                               if( currentElement.keepSize === true) return false;\r
-                                                               currentResizerIndex = RESIZER.index( _mouseX, _mouseY);\r
-                                                               if( currentResizerIndex === -1) return false;\r
+                                                       x: function(){ return x;},\r
+                                                       y: function(){ return y;},\r
+                                                       w: function(){ return w;},\r
+                                                       h: function(){ return h;},\r
+                                                       update: draw,\r
+                                                       index: getIndex,\r
+                                                       show: function( _currentElement){\r
+                                                               currentElement = _currentElement;\r
+                                                               currentIsTextElement = _currentElement.type === COMIC_ELEMENT_TYPE_TEXT;\r
+                                                               elmResizerContainerStyle.display = '';\r
+                                                       },\r
+                                                       hide: function(){\r
+                                                               currentElement = null;\r
+                                                               elmResizerContainerStyle.display = 'none';\r
+                                                       },\r
+                                                       onStart: function( _currentElement, _mouseX, _mouseY){\r
+                                                               currentElement = _currentElement;\r
+                                                               currentIsTextElement = _currentElement.type === COMIC_ELEMENT_TYPE_TEXT;\r
+                                                               if( _currentElement.keepSize === true) return false;\r
+                                                               currentIndex = getIndex( _mouseX, _mouseY);\r
+                                                               if( currentIndex === -1) return false;\r
                                                                xOffset = _mouseX;\r
                                                                yOffset = _mouseY;\r
-                                                               startX = baseX = x;\r
-                                                               startY = baseY = y;\r
-                                                               startW = baseW = w;\r
-                                                               startH = baseH = h;\r
+                                                               startX = baseX = _currentElement.x;\r
+                                                               startY = baseY = _currentElement.y;\r
+                                                               startW = baseW = _currentElement.w;\r
+                                                               startH = baseH = _currentElement.h;\r
                                                                startFilpV = flipV;\r
                                                                startFilpH = flipH;\r
                                                                startAspect = startW /startH;\r
                                                                return true;\r
                                                        },\r
                                                        onDrag: function( _mouseX, _mouseY){\r
-                                                               var com = RESIZE_WORK_ARRAY[ currentResizerIndex],\r
+                                                               var com = RESIZE_WORK_ARRAY[ currentIndex],\r
                                                                        moveX = _mouseX -xOffset,\r
                                                                        moveY = _mouseY -yOffset,\r
                                                                        _x = baseX +moveX *com.x,\r
@@ -3408,18 +3426,25 @@ h2c.editor = ( function(){
                                                                        _w = baseW +moveX *com.w,\r
                                                                        _h = baseH +moveY *com.h,\r
                                                                        _updated = moveX !== 0 || moveY !== 0;\r
-\r
+                                                               \r
+                                                               // opera がときどき baseH の値を忘れる ??\r
+                                                               if( _x === undefined || _y === undefined || _w === undefined || _h === undefined){\r
+                                                                       ++error;\r
+                                                                       return;\r
+                                                               }\r
+                                                               \r
                                                                if( _w >= MIN_OBJECT_SIZE && _h >= MIN_OBJECT_SIZE){\r
                                                                        \r
                                                                } else \r
                                                                if( _w >= -MIN_OBJECT_SIZE && _h >= -MIN_OBJECT_SIZE){\r
                                                                        return;\r
                                                                } else \r
-                                                               if( currentIsTextElement === true){\r
-                                                                       \r
+                                                               if( currentElement.type === COMIC_ELEMENT_TYPE_TEXT){\r
+                                                                       return;\r
                                                                } else \r
                                                                if( _w < -MIN_OBJECT_SIZE || _h < -MIN_OBJECT_SIZE){\r
-                                                                       var __x, __y;\r
+                                                                       var __x = 0,\r
+                                                                               __y = 0;\r
                                                                        if( _w < -MIN_OBJECT_SIZE && _h > MIN_OBJECT_SIZE){\r
                                                                        // flipH\r
                                                                                __x = _x;\r
@@ -3427,8 +3452,7 @@ h2c.editor = ( function(){
                                                                                baseY = _y;\r
                                                                                baseW = _w = __x -_x;\r
                                                                                baseH = _h;\r
-                                                                               currentElement.flip( false, true);\r
-                                                                               currentResizerIndex = RESIZER.flip( false, true);\r
+                                                                               flip( false, true);\r
                                                                                flipV = currentElement.flipV();\r
                                                                        } else \r
                                                                        if( _w > MIN_OBJECT_SIZE && _h < -MIN_OBJECT_SIZE){\r
@@ -3438,8 +3462,7 @@ h2c.editor = ( function(){
                                                                                baseY = _y = _y +_h;\r
                                                                                baseW = _w;\r
                                                                                baseH = _h = __y -_y;\r
-                                                                               currentElement.flip( true, false);\r
-                                                                               currentResizerIndex = RESIZER.flip( true, false);\r
+                                                                               flip( true, false);\r
                                                                                flipH = currentElement.flipH();\r
                                                                        } else {\r
                                                                        // flipVH\r
@@ -3449,8 +3472,7 @@ h2c.editor = ( function(){
                                                                                baseY = _y = _y +_h;\r
                                                                                baseW = _w = __x -_x;\r
                                                                                baseH = _h = __y -_y;\r
-                                                                               currentElement.flip( true, true);\r
-                                                                               currentResizerIndex = RESIZER.flip( true, true);\r
+                                                                               flip( true, true);\r
                                                                                flipV = currentElement.flipV();\r
                                                                                flipH = currentElement.flipH();\r
                                                                        }\r
@@ -3463,6 +3485,18 @@ h2c.editor = ( function(){
                                                                currentW = _w;\r
                                                                currentH = _h;\r
                                                                _updated === true && update( _x, _y, _w, _h);\r
+                                                               \r
+                                                               log.html( [\r
+                                                                               'currentIndex:', currentIndex, \r
+                                                                               'baseW', baseW, 'baseH', baseH,'<br>',\r
+                                                                               'mouse', _mouseX, _mouseY,'<br>',\r
+                                                                               'move', moveX, moveY,'<br>',\r
+                                                                               'xy', _x, _y, 'wh',_w, _h,'<br>',\r
+                                                                               'com.w', com.w, 'com.h', com.h,'<br>',\r
+                                                                               'current',currentW, currentH,'<br>',\r
+                                                                               'trans', transY, transH,\r
+                                                                               'err', error\r
+                                                               ].join( ' , '));\r
                                                        },\r
                                                        onFinish: function(){\r
                                                                MOUSE_CURSOR( '');\r
@@ -3483,7 +3517,8 @@ h2c.editor = ( function(){
                                                }\r
                                        })(),\r
                                        POSITION_CONTROLER = ( function(){\r
-                                               var startX, startY,\r
+                                               var currentElement,\r
+                                                       startX, startY,\r
                                                        currentX, currentY,\r
                                                        xOffset, yOffset,\r
                                                        isCopy = false;\r
@@ -3491,13 +3526,14 @@ h2c.editor = ( function(){
                                                function update( _x, _y){\r
                                                        _x = currentX = _x !== undefined ? _x : currentX;\r
                                                        _y = currentY = _y !== undefined ? _y : currentY;\r
-                                                       RESIZER.update( _x, _y);\r
+                                                       RESIZE_CONTROLER.update( _x, _y);\r
                                                        currentElement.resize( _x, _y);\r
                                                        updateInfomation( _x, _y);                                                      \r
                                                }\r
                                                \r
                                                return {\r
-                                                       onStart: function( _mouseX, _mouseY){\r
+                                                       onStart: function( _currentElement, _mouseX, _mouseY){\r
+                                                               currentElement = _currentElement;\r
                                                                xOffset = _mouseX;\r
                                                                yOffset = _mouseY;\r
                                                                startX = currentX = x;\r
@@ -3539,8 +3575,8 @@ h2c.editor = ( function(){
                                                h = _h !== undefined ? _h : h;\r
                                                angle = _angle !== undefined ? _angle : angle;\r
 \r
-                                               RESIZER.update( x, y, w, h);\r
-                                               currentIsTextElement === true && TAIL_MOVER.update( w, h, angle);\r
+                                               RESIZE_CONTROLER.update( x, y, w, h);\r
+                                               currentIsTextElement === true && TAIL_CONTROLER.update( w, h, angle);\r
                                                COMIC_ELEMENT_CONSOLE.show( currentElement, w, h);\r
                                                updateInfomation( x, y, currentElement.z, angle, w, h);\r
                                        }\r
@@ -3561,12 +3597,12 @@ h2c.editor = ( function(){
                                                );\r
                                        }\r
                                        function show( _currentElement){\r
-                                               currentElement === null && RESIZER.show();\r
+                                               currentElement === null && RESIZE_CONTROLER.show( _currentElement);\r
                                                if( currentElement !== _currentElement){\r
                                                        currentElement = _currentElement;\r
                                                        \r
                                                        currentIsTextElement = ( _currentElement.type === COMIC_ELEMENT_TYPE_TEXT);\r
-                                                       currentIsTextElement === true ? TAIL_MOVER.show( _currentElement) : TAIL_MOVER.hide();\r
+                                                       currentIsTextElement === true ? TAIL_CONTROLER.show( _currentElement) : TAIL_CONTROLER.hide();\r
                                                        \r
                                                        flipV = currentIsTextElement === false ? _currentElement.flipV() : 0;\r
                                                        flipH = currentIsTextElement === false ? _currentElement.flipH() : 0;\r
@@ -3578,10 +3614,10 @@ h2c.editor = ( function(){
                                                }\r
                                        }\r
                                        function hide(){\r
-                                               currentElement !== null && RESIZER.hide();\r
+                                               currentElement !== null && RESIZE_CONTROLER.hide();\r
                                                currentElement = null;\r
                                                MOUSE_CURSOR( '');\r
-                                               TAIL_MOVER.hide();\r
+                                               TAIL_CONTROLER.hide();\r
                                                COMIC_ELEMENT_CONSOLE.hide();\r
                                                updateInfomation();\r
                                        }\r
@@ -3657,13 +3693,13 @@ h2c.editor = ( function(){
                                        },\r
                                        onMouseDown: function( _currentElement, _mouseX, _mouseY){\r
                                                //show( _currentElement);\r
-                                               if( currentIsTextElement === true && TAIL_CONTROLER.onStart( _mouseX, _mouseY) === true){\r
+                                               if( currentIsTextElement === true && TAIL_CONTROLER.onStart( _currentElement, _mouseX, _mouseY) === true){\r
                                                        currentControler = TAIL_CONTROLER;\r
                                                } else\r
-                                               if( RESIZE_CONTROLER.onStart( _mouseX, _mouseY) === true){\r
+                                               if( RESIZE_CONTROLER.onStart( _currentElement, _mouseX, _mouseY) === true){\r
                                                        currentControler = RESIZE_CONTROLER;\r
                                                } else {\r
-                                                       POSITION_CONTROLER.onStart( _mouseX, _mouseY)\r
+                                                       POSITION_CONTROLER.onStart( _currentElement, _mouseX, _mouseY)\r
                                                        currentControler = POSITION_CONTROLER;\r
                                                }\r
                                        },\r
@@ -3673,7 +3709,7 @@ h2c.editor = ( function(){
                                                        currentControler.onDrag( _mouseX, _mouseY);                                             \r
                                                } else {\r
                                                        currentElement && COMIC_ELEMENT_CONSOLE.onMouseMove( _mouseX -x, _mouseY -y);\r
-                                                       TAIL_MOVER.hitTest( _mouseX -x, _mouseY -y) === false && RESIZER.index( _mouseX, _mouseY) === -1 && MOUSE_CURSOR( '');\r
+                                                       TAIL_CONTROLER.hitTest( _mouseX -x, _mouseY -y) === false && RESIZE_CONTROLER.index( _mouseX, _mouseY) === -1 && MOUSE_CURSOR( '');\r
                                                }\r
                                        },\r
                                        onMouseUp: function( _currentElement, _mouseX, _mouseY){\r
@@ -3823,8 +3859,21 @@ h2c.editor = ( function(){
                                                                isXHTML !== true ? '>' : ' \/>'\r
                                                        ].join( '');\r
                                                },\r
-                                               getAsJson: function(){\r
-                                                       \r
+                                               getAsJsonString: function(){\r
+                                                       var cr = h2c.LINE_FEED_CODE_TEXTAREA;\r
+                                                       return [\r
+                                                               '"new', this.timing, '": {', cr,\r
+                                                                       '"resource_picture_id": "', url, '",', cr,\r
+                                                                       '"x": ', x, ',', cr,\r
+                                                                       '"y": ', y, ',', cr,\r
+                                                                       '"z": ', z, ',', cr,\r
+                                                                       '"w": ', w, ',', cr,\r
+                                                                       '"h": ', h, ',', cr,\r
+                                                                       '"flipv": ', flipV === true ? 1 : 0, ',', cr,\r
+                                                                       '"fliph": ', flipH === true ? 1 : 0, ',', cr,\r
+                                                                       '"t": ', this.timing, cr,\r
+                                                               '}'\r
+                                                       ].join( '');\r
                                                },\r
                                                destroy: function(){\r
                                                        reversibleImage.destroy();\r
@@ -3945,7 +3994,30 @@ h2c.editor = ( function(){
                                                        \r
                                                },\r
                                                getAsJsonString: function(){\r
-                                                       \r
+                                                       var cr = h2c.LINE_FEED_CODE_TEXTAREA;\r
+                                                       return [\r
+                                                               '"new', this.timing, '": {', cr,\r
+                                                                       '"balloon_template_id": ', 1, ',', cr,\r
+                                                                       '"resource_picture_id": ', 1, ',', cr,\r
+                                                                       '"border": ', 1, ',', cr,\r
+                                                                       '"tail": ', a, ',', cr,\r
+                                                                       '"x": ', x, ',', cr,\r
+                                                                       '"y": ', y, ',', cr,\r
+                                                                       '"z": ', z, ',', cr,\r
+                                                                       '"w": ', w, ',', cr,\r
+                                                                       '"h": ', h, ',', cr,\r
+                                                                       '"t": ', this.timing, ',', cr,\r
+                                                               '"speaches_attributes": {', cr,\r
+                                                                       '"newf', this.timing, '": {', cr,\r
+                                                                       '"content": "', text, '",', cr,\r
+                                                                                       '"x": ', x, ',', cr,\r
+                                                                                       '"y": ', y, ',', cr,\r
+                                                                                       '"w": ', w, ',', cr,\r
+                                                                                       '"h": ', h, cr,\r
+                                                                               '}', cr,\r
+                                                                       '}', cr,\r
+                                                               '}'\r
+                                                       ].join( '');\r
                                                },\r
                                                getAsHTML: function( isAbsoluteUrl, isXHTML){\r
                                                        var url = XBROWSER_BALLOON.getURL();\r
@@ -4221,15 +4293,15 @@ h2c.editor = ( function(){
                                        });\r
                                },\r
                                getAsHTML: function( isAbsoluteUrl, isXHTML){\r
-                                       var HTML_CONTAINER = [],\r
+                                       var HTML_ARRAY = [],\r
                                                l = DRAGGABLE_ELEMENT_ARRAY.length,\r
                                                _timing = 0,\r
                                                _comicElement;\r
 \r
-                                       while( HTML_CONTAINER.length < l -NUM_RESIZER){\r
+                                       while( HTML_ARRAY.length < l -NUM_RESIZER){\r
                                                _comicElement = getComicElementByTiming();\r
                                                if( _comicElement === null) break;\r
-                                               HTML_CONTAINER.push( _comicElement.getAsHTML( isAbsoluteUrl, isXHTML));\r
+                                               HTML_ARRAY.push( _comicElement.getAsHTML( isAbsoluteUrl, isXHTML));\r
                                        }\r
                                        function getComicElementByTiming(){\r
                                                while( _timing < l *2){\r
@@ -4243,7 +4315,7 @@ h2c.editor = ( function(){
                                                }\r
                                                return null;\r
                                        }\r
-                                       HTML_CONTAINER.unshift(\r
+                                       HTML_ARRAY.unshift(\r
                                                [\r
                                                        '<div class="panel" ',\r
                                                                'style="',\r
@@ -4253,9 +4325,55 @@ h2c.editor = ( function(){
                                                        '>'\r
                                                ].join( '')\r
                                        );              \r
-                                       HTML_CONTAINER.push( '</div>');\r
+                                       HTML_ARRAY.push( '</div>');\r
                                        \r
-                                       return HTML_CONTAINER.join( h2c.LINE_FEED_CODE_TEXTAREA);\r
+                                       return HTML_ARRAY.join( h2c.LINE_FEED_CODE_TEXTAREA);\r
+                               },\r
+                               getAsJsonString: function(){\r
+                                       var JSON_STRING_ARRAY = [],\r
+                                               IMAGE_ARRAY = [],\r
+                                               BALLOON_ARRAY = [],\r
+                                               l = DRAGGABLE_ELEMENT_ARRAY.length,\r
+                                               _timing = 0,\r
+                                               _comicElement,\r
+                                               cr = h2c.LINE_FEED_CODE_TEXTAREA;\r
+                                               \r
+                                       while( IMAGE_ARRAY.length + BALLOON_ARRAY.length < l -NUM_RESIZER){\r
+                                               _comicElement = getComicElementByTiming();\r
+                                               if( _comicElement === null) break;\r
+                                               _comicElement.type === COMIC_ELEMENT_TYPE_IMAGE ? \r
+                                                       IMAGE_ARRAY.push( _comicElement.getAsJsonString()) :\r
+                                                       BALLOON_ARRAY.push( _comicElement.getAsJsonString());\r
+                                       }\r
+                                       function getComicElementByTiming(){\r
+                                               while( _timing < l *2){\r
+                                                       for(var i=NUM_RESIZER; i<l; ++i){\r
+                                                               if( _timing === DRAGGABLE_ELEMENT_ARRAY[ i].timing){\r
+                                                                       ++_timing;\r
+                                                                       return DRAGGABLE_ELEMENT_ARRAY[ i];\r
+                                                               }\r
+                                                       }\r
+                                                       ++_timing;\r
+                                               }\r
+                                               return null;\r
+                                       }\r
+                                       return [\r
+                                               '{', cr,\r
+                                                       '"panel": {', cr,\r
+                                                           '"border": 1,', cr,\r
+                                                           '"comic_id": 5,', cr,\r
+                                                           '"resource_picture_id": 1,', cr,\r
+                                                           '"width": ', canvasW, ',', cr,\r
+                                                           '"height": ', canvasH, ',', cr,\r
+                                                           '"panel_pictures_attributes": {', cr,\r
+                                                               IMAGE_ARRAY.join( ',' +cr), cr,\r
+                                                           '},', cr,\r
+                                                           '"balloons_attributes": {', cr,\r
+                                                               BALLOON_ARRAY.join( ',' +cr), cr,\r
+                                                           '}', cr,\r
+                                                       '}', cr,\r
+                                               '}'\r
+                                       ].join( '');\r
                                }\r
                        }\r
                })( resize);\r
@@ -4343,7 +4461,8 @@ h2c.editor = ( function(){
                        createTextElement: function( type, angle, text, x, y, w, h, z){\r
                                COMIC_ELEMENT_CONTROL.createTextElement( type, angle, text, x, y, w, h, z);\r
                        },\r
-                       getAsHTML: COMIC_ELEMENT_CONTROL.getAsHTML\r
+                       getAsHTML: COMIC_ELEMENT_CONTROL.getAsHTML,\r
+                       getAsJsonString: COMIC_ELEMENT_CONTROL.getAsJsonString\r
                }\r
        })();\r
 \r
@@ -4351,7 +4470,11 @@ h2c.editor = ( function(){
        function updateMouseCursor( _cursor){\r
                if( currentCursor !== _cursor){\r
                        currentCursor = _cursor;\r
-                       ELM_MOUSE_EVENT_CHATCHER.style.cursor = _cursor;\r
+                       setTimeout(\r
+                               function(){\r
+                                       ELM_MOUSE_EVENT_CHATCHER.style.cursor = _cursor;\r
+                               }, 0\r
+                       );\r
                }\r
        }\r
        function centering(){\r
@@ -4479,7 +4602,7 @@ h2c.io = ( function(){
  *  キャラクター画像庫 > アニマル系 > tag:ペン次郎 > ペン次郎:笑う\r
  *  風景画像庫 >\r
  *  効果画像庫 >\r
- *  アイテム画像庫 >\r
+ *  アイテム画像庫 >\r
  *  \r
  * 画像一覧を読み込むタイミング\r
  */\r