Changeset 15579

Show
Ignore:
Timestamp:
07/09/08 23:51:32 (5 years ago)
Author:
kumatch
Message:

Adjusted the popup style.

Location:
events/phpframework/piece_framework/trunk/web/frontend
Files:
9 modified

Legend:

Unmodified
Added
Removed

  • events/phpframework/piece_framework/trunk/web/frontend/htdocs/css/style.css

    r14870 r15579  
    258258 
    259259 
     260/*---------------------------------------------------- 
     261        #pop up 
     262----------------------------------------------------*/ 
     263#flash .desc { 
     264        background:url(../img/share/up_arrow.gif) no-repeat 20px top; 
     265        padding-top:10px; 
     266} 
     267 
     268#flash .desc p { 
     269        background:#FFFFFF none repeat scroll 0% 0%; 
     270        display:block; 
     271        font-size:2.12em; 
     272        font-weight:bold; 
     273        line-height:1.2em; 
     274        padding:7px; 
     275} 

  • events/phpframework/piece_framework/trunk/web/frontend/webapp/actions/Account/PasswordAction.php

    r15136 r15579  
    7575                                            ); 
    7676 
     77            $this->_context->getViewElement()->setElement('updated', 1); 
    7778            return 'DisplayForm'; 
    7879 

  • events/phpframework/piece_framework/trunk/web/frontend/webapp/actions/Account/PictureAction.php

    r15222 r15579  
    8585        $this->_context->getSession()->setAttributeByRef('self', $this->_self); 
    8686        $this->_context->getViewElement()->setElementByRef('self', $this->_self); 
     87        $this->_context->getViewElement()->setElement('updated', 1); 
    8788 
    8889        return 'DisplayForm'; 
    … …  
    101102        $this->_context->getSession()->setAttributeByRef('self', $this->_self); 
    102103        $this->_context->getViewElement()->setElementByRef('self', $this->_self); 
     104        $this->_context->getViewElement()->setElement('deleted', 1); 
    103105 
    104106        return 'DisplayForm'; 

  • events/phpframework/piece_framework/trunk/web/frontend/webapp/actions/Account/SettingsAction.php

    r15136 r15579  
    9595            $this->_self->privateFlag = $this->_user->privateFlag; 
    9696 
     97            $this->_context->getViewElement()->setElement('updated', 1); 
    9798            return 'DisplayForm'; 
    9899 

  • events/phpframework/piece_framework/trunk/web/frontend/webapp/actions/SelfAction.php

    r15526 r15579  
    4343    var $_view; 
    4444    var $_page; 
     45    var $_type; 
    4546    var $_hasOlderStatus; 
    4647 
    … …  
    8384        $viewElement->setElement('newerPage', $this->_page - 1); 
    8485        $viewElement->setElement('view', $this->_view); 
     86        $viewElement->setElement('type', $this->_type); 
    8587        $viewElement->setElementByRef('tab', $this->_tab); 
    8688 
    … …  
    125127        case 'home': 
    126128            $statusList = $this->_self->listByFollowers($page); 
     129            $this->_type = 'insertion'; 
    127130            break; 
    128131        case 'replies': 
    129132            $statusList = $this->_self->listReplies($page); 
     133            $this->_type = 'popup'; 
    130134            break; 
    131135        case 'archive': 
    132136            $statusList = $this->_self->listArchives($page); 
     137            $this->_type = 'insertion'; 
    133138            break; 
    134139        case 'public_timeline': 
    135140        default: 
    136141            $statusList = $this->_self->listPublicTimeline($page); 
     142            $this->_type = 'popup'; 
    137143            break; 
    138144        } 

  • events/phpframework/piece_framework/trunk/web/frontend/webapp/templates/Account/Password/Form.html

    r15019 r15579  
    1 <div id="wrapper"> 
    2   <div id="main"> 
     1<div id="flash" style="display: none;"> 
     2  <div class="desc"><p>パスワードを変更しました。</p></div> 
     3</div> 
    34 
    4     <h2 style="margin-bottom: 25px;" class="thumb"> 
     5<div id="contents"> 
     6  <div id="wrapper"> 
     7    <div id="main"> 
    58 
    6       <img src="/profile_images/{self.id}/{self.imageNormal}" id="profile-image" alt="{self.userName}" class="friendicon" if="self.image" /> 
    7       <img src="/profile_images/default_profile_normal.png" id="profile-image" alt="Default_profile_normal" class="friendicon" if="!self.image" /> 
     9      <h2 style="margin-bottom: 25px;" class="thumb"> 
    810 
    9       <span key="self.userName">Username</span> 
    10     </h2> 
     11        <img src="/profile_images/{self.id}/{self.imageNormal}" id="profile-image" alt="{self.userName}" class="friendicon" if="self.image" /> 
     12        <img src="/profile_images/default_profile_normal.png" id="profile-image" alt="Default_profile_normal" class="friendicon" if="!self.image" /> 
    1113 
    12     <ul class="tabNav"> 
    13       <li><a href="/account/settings">ユーザ情報</a></li> 
    14       <li><a href="/account/password" class="on">パスワード</a></li> 
    15       <li><a href="/account/picture">アイコン</a></li> 
    16     </ul> 
     14        <span key="self.userName">Username</span> 
     15      </h2> 
    1716 
    18     <div id="timeline"> 
    19       <form name="AccountPassword"> 
     17      <ul class="tabNav"> 
     18        <li><a href="/account/settings">ユーザ情報</a></li> 
     19        <li><a href="/account/password" class="on">パスワード</a></li> 
     20        <li><a href="/account/picture">アイコン</a></li> 
     21      </ul> 
    2022 
    21         <table cellspacing="0"> 
    22           <tbody> 
    23             <tr> 
    24               <th><label for="password">新しいパスワード:</label></th> 
    25               <td> 
    26                 <input autocomplete="off" id="user_password" name="password" type="password" /><br /> 
    27                 <small if="__Account_PasswordResults.isError('password')" class="error" key="__Account_PasswordResults.getErrorMessage('password')"></small> 
    28               </td> 
    29             </tr> 
    30             <tr> 
    31               <th><label for="password_confirmation">新しいパスワードを再入力:</label></th> 
    32               <td> 
    33                 <input autocomplete="off" id="user_password_confirmation" name="passwordConfirmation" type="password" /><br /> 
    34                 <small style="display: none;" id="nomatch" class="error">パスワードが一致していません。</small> 
    35               </td> 
    36             </tr> 
    37             <tr> 
    38               <th/>              
    39               <td><input id="commit" name="commit" type="submit" value="変更する" disabled="disabled" p:event="change" /></td> 
    40             </tr> 
    41           </tbody> 
    42         </table> 
    43       </form> 
     23      <div id="timeline"> 
     24        <form name="AccountPassword"> 
    4425 
     26          <table cellspacing="0"> 
     27            <tbody> 
     28              <tr> 
     29                <th><label for="password">新しいパスワード:</label></th> 
     30                <td> 
     31                  <input autocomplete="off" id="user_password" name="password" type="password" /><br /> 
     32                  <small if="__Account_PasswordResults.isError('password')" class="error" key="__Account_PasswordResults.getErrorMessage('password')"></small> 
     33                </td> 
     34              </tr> 
     35              <tr> 
     36                <th><label for="password_confirmation">新しいパスワードを再入力:</label></th> 
     37                <td> 
     38                  <input autocomplete="off" id="user_password_confirmation" name="passwordConfirmation" type="password" /><br /> 
     39                  <small style="display: none;" id="nomatch" class="error">パスワードが一致していません。</small> 
     40                </td> 
     41              </tr> 
     42              <tr> 
     43                <th/>            
     44                <td><input id="commit" name="commit" type="submit" value="変更する" disabled="disabled" p:event="change" /></td> 
     45              </tr> 
     46            </tbody> 
     47          </table> 
     48        </form> 
     49 
     50      </div> 
    4551    </div> 
    4652  </div> 
     53 
    4754</div> 
    48  
    4955<script type="text/javascript"> 
    5056new Form.Element.Observer('user_password_confirmation', 0.5, function(element, value) { 
    … …  
    5864}); 
    5965</script> 
     66 
     67<script type="text/javascript"> 
     68$('flash').hide(); 
     69Event.observe(window, 'load', function() { 
     70    if ('{updated}') { 
     71        jQuery('#flash').fadeIn("slow"); 
     72        var fadeOut = function() { 
     73            jQuery('#flash').fadeOut("slow"); 
     74        } 
     75        fadeOut.delay(8); 
     76    } 
     77}); 
     78</script> 

  • events/phpframework/piece_framework/trunk/web/frontend/webapp/templates/Account/Picture/Form.html

    r15222 r15579  
    1 <div id="wrapper"> 
    2   <div id="main"> 
     1<div id="flash" style="display: none;" if="updated"> 
     2  <div class="desc"><p>これはいい画像ですね！</p></div> 
     3</div> 
    34 
    4     <h2 style="margin-bottom: 25px;" class="thumb"> 
     5<div id="flash" style="display: none;" if="deleted"> 
     6  <div class="desc"><p>もう画像がありません。</p></div> 
     7</div> 
    58 
    6       <img src="/profile_images/{self.id}/{self.imageNormal}" id="profile-image" alt="{self.userName}" class="friendicon" if="self.image" /> 
    7       <img src="/profile_images/default_profile_normal.png" id="profile-image" alt="Default_profile_normal" class="friendicon" if="!self.image" /> 
     9<div id="contents"> 
     10  <div id="wrapper"> 
     11    <div id="main"> 
    812 
    9       <span key="self.userName">Username</span> 
    10     </h2> 
     13      <h2 style="margin-bottom: 25px;" class="thumb"> 
    1114 
    12     <ul class="tabNav"> 
    13       <li><a href="/account/settings">ユーザ情報</a></li> 
    14       <li><a href="/account/password">パスワード</a></li> 
    15       <li><a href="/account/picture" class="on">アイコン</a></li> 
    16     </ul> 
     15        <img src="/profile_images/{self.id}/{self.imageNormal}" id="profile-image" alt="{self.userName}" class="friendicon" if="self.image" /> 
     16        <img src="/profile_images/default_profile_normal.png" id="profile-image" alt="Default_profile_normal" class="friendicon" if="!self.image" /> 
    1717 
    18     <div id="timeline"> 
    19       <form name="AccountPicture"> 
     18        <span key="self.userName">Username</span> 
     19      </h2> 
    2020 
    21         <table cellspacing="0"> 
    22           <tbody> 
    23             <tr> 
    24               <th> 
    25                 <label for="user_profile_image"> 
    26                   <img src="/profile_images/{self.id}/{self.imageNormal}" id="profile-image" alt="{self.userName}" class="friendicon" if="self.image" /> 
    27                   <img src="/profile_images/default_profile_normal.png" id="profile-image" alt="Default_profile_normal" class="friendicon" if="!self.image" /> 
    28                 </label> 
    29               </th> 
    30               <td> 
    31                 <input id="profile_image_uploaded_data" name="uploadedData" size="30" type="file" /> 
    32                 <p><small>画像は700KB以下でなくてはいけません。対応フォーマットはGIF、JPEG、PNGです。</small></p> 
    33               </td> 
    34             </tr> 
    35             <tr> 
    36               <th/> 
    37               <td> 
    38                 <a href="/account/delete_picture?{__eventNameKey}_delete&{__flowExecutionTicketKey}={__flowExecutionTicket}">削除する</a>  
    39                 <input name="commit" type="submit" value="Save" p:event="save" /> 
    40               </td> 
    41             </tr> 
    42           </tbody> 
    43         </table> 
    44       </form> 
     21      <ul class="tabNav"> 
     22        <li><a href="/account/settings">ユーザ情報</a></li> 
     23        <li><a href="/account/password">パスワード</a></li> 
     24        <li><a href="/account/picture" class="on">アイコン</a></li> 
     25      </ul> 
     26 
     27      <div id="timeline"> 
     28        <form name="AccountPicture"> 
     29 
     30          <table cellspacing="0"> 
     31            <tbody> 
     32              <tr> 
     33                <th> 
     34                  <label for="user_profile_image"> 
     35                    <img src="/profile_images/{self.id}/{self.imageNormal}" id="profile-image" alt="{self.userName}" class="friendicon" if="self.image" /> 
     36                    <img src="/profile_images/default_profile_normal.png" id="profile-image" alt="Default_profile_normal" class="friendicon" if="!self.image" /> 
     37                  </label> 
     38                </th> 
     39                <td> 
     40                  <input id="profile_image_uploaded_data" name="uploadedData" size="30" type="file" /> 
     41                  <p><small>画像は700KB以下でなくてはいけません。対応フォーマットはGIF、JPEG、PNGです。</small></p> 
     42                </td> 
     43              </tr> 
     44              <tr> 
     45                <th/> 
     46                <td> 
     47                  <a href="/account/delete_picture?{__eventNameKey}_delete&{__flowExecutionTicketKey}={__flowExecutionTicket}">削除する</a>  
     48                  <input name="commit" type="submit" value="Save" p:event="save" /> 
     49                </td> 
     50              </tr> 
     51            </tbody> 
     52          </table> 
     53        </form> 
     54      </div> 
    4555    </div> 
    4656  </div> 
    4757</div> 
     58 
     59<script type="text/javascript"> 
     60$('flash').hide(); 
     61Event.observe(window, 'load', function() { 
     62    if ('{updated}' || '{deleted}') { 
     63        jQuery('#flash').fadeIn("slow"); 
     64        var fadeOut = function() { 
     65            jQuery('#flash').fadeOut("slow"); 
     66        } 
     67        fadeOut.delay(8); 
     68    } 
     69}); 
     70</script> 

  • events/phpframework/piece_framework/trunk/web/frontend/webapp/templates/Account/Settings/Form.html

    r15018 r15579  
    1 <div id="wrapper"> 
    2   <div id="main"> 
    31 
    4     <h2 style="margin-bottom: 25px;" class="thumb"> 
     2<div id="flash" style="display: none;"> 
     3  <div class="desc"><p>ありがとう。設定を保存しました。</p></div> 
     4</div> 
    55 
    6       <img src="/profile_images/{self.id}/{self.imageNormal}" id="profile-image" alt="{self.userName}" class="friendicon" if="self.image" /> 
    7       <img src="/profile_images/default_profile_normal.png" id="profile-image" alt="Default_profile_normal" class="friendicon" if="!self.image" /> 
     6<div id="contents"> 
    87 
    9       <span key="self.userName">Username</span> 
    10     </h2> 
     8  <div id="wrapper"> 
     9    <div id="main"> 
    1110 
    12     <ul class="tabNav"> 
    13       <li><a href="/account/settings" class="on">ユーザ情報</a></li> 
    14       <li><a href="/account/password">パスワード</a></li> 
    15       <li><a href="/account/picture">アイコン</a></li> 
    16     </ul> 
     11      <h2 style="margin-bottom: 25px;" class="thumb"> 
    1712 
    18     <div id="timeline"> 
    19       <form name="AccountSettings"> 
    20         <table cellspacing="0"> 
    21           <tbody> 
    22             <tr> 
    23               <th><label for="user_username">ユーザー名:</label></th> 
    24               <td> 
    25                 <input id="user_screen_name" maxlength="255" name="userName" onkeyup="updateUrl(this.value)" size="15" type="text" /><br /> 
    26                 <small>あなたのURL: http://phwittr/<span id="username_url">ユーザー名</span></small><br /> 
    27                 <small id="username_msg">ユーザ名は英数字と'_'が使えます</small><br /> 
    28                 <small if="__SignupResults.isError('userName')" class="error" key="__SignupResults.getErrorMessage('userName')"></small><br /> 
    29               </td> 
    30             </tr> 
    31             <tr> 
    32               <th><label for="user_email">メールアドレス:</label></th> 
    33               <td> 
    34                 <input id="user_email" name="email" size="30" type="text" /> 
    35               </td> 
    36             </tr> 
     13        <img src="/profile_images/{self.id}/{self.imageNormal}" id="profile-image" alt="{self.userName}" class="friendicon" if="self.image" /> 
     14        <img src="/profile_images/default_profile_normal.png" id="profile-image" alt="Default_profile_normal" class="friendicon" if="!self.image" /> 
    3715 
    38             <tr> 
    39               <th/> 
    40               <td> 
    41                 <input id="user_private_flag" name="privateFlag" type="checkbox" value="1" /> 
    42                 つぶやきを非公開にする 
    43                 <p><small>つぶやきを非公開に設定すると、あなたのつぶやきを友だちにだけに見せることができます。また、「公開中のつぶやき」に表示されることもありません。<br /> 
    44                 <a href="/public_timeline"><br/>公開中</a>.</small></p> 
    45               </td> 
    46             </tr> 
    47             <tr> 
    48               <th/>              
    49               <td><input id="commit" name="commit" type="submit" value="保存する" p:event="save" /></td> 
    50             </tr> 
    51           </tbody> 
    52         </table> 
    53       </form> 
     16        <span key="self.userName">Username</span> 
     17      </h2> 
    5418 
     19      <ul class="tabNav"> 
     20        <li><a href="/account/settings" class="on">ユーザ情報</a></li> 
     21        <li><a href="/account/password">パスワード</a></li> 
     22        <li><a href="/account/picture">アイコン</a></li> 
     23      </ul> 
     24 
     25      <div id="timeline"> 
     26        <form name="AccountSettings"> 
     27          <table cellspacing="0"> 
     28            <tbody> 
     29              <tr> 
     30                <th><label for="user_username">ユーザー名:</label></th> 
     31                <td> 
     32                  <input id="user_screen_name" maxlength="255" name="userName" onkeyup="updateUrl(this.value)" size="15" type="text" /><br /> 
     33                  <small>あなたのURL: http://phwittr/<span id="username_url">ユーザー名</span></small><br /> 
     34                  <small id="username_msg">ユーザ名は英数字と'_'が使えます</small><br /> 
     35                  <small if="__SignupResults.isError('userName')" class="error" key="__SignupResults.getErrorMessage('userName')"></small><br /> 
     36                </td> 
     37              </tr> 
     38              <tr> 
     39                <th><label for="user_email">メールアドレス:</label></th> 
     40                <td> 
     41                  <input id="user_email" name="email" size="30" type="text" /> 
     42                </td> 
     43              </tr> 
     44 
     45              <tr> 
     46                <th/> 
     47                <td> 
     48                  <input id="user_private_flag" name="privateFlag" type="checkbox" value="1" /> 
     49                  つぶやきを非公開にする 
     50                  <p><small>つぶやきを非公開に設定すると、あなたのつぶやきを友だちにだけに見せることができます。また、「公開中のつぶやき」に表示されることもありません。<br /> 
     51                  <a href="/public_timeline"><br/>公開中</a>.</small></p> 
     52                </td> 
     53              </tr> 
     54              <tr> 
     55                <th/>            
     56                <td><input id="commit" name="commit" type="submit" value="保存する" p:event="save" /></td> 
     57              </tr> 
     58            </tbody> 
     59          </table> 
     60        </form> 
     61 
     62      </div> 
    5563    </div> 
    5664  </div> 
    … …  
    8391} 
    8492</script> 
     93 
     94<script type="text/javascript"> 
     95$('flash').hide(); 
     96Event.observe(window, 'load', function() { 
     97    if ('{updated}') { 
     98        jQuery('#flash').fadeIn("slow"); 
     99        var fadeOut = function() { 
     100            jQuery('#flash').fadeOut("slow"); 
     101        } 
     102        fadeOut.delay(8); 
     103    } 
     104}); 
     105</script> 

  • events/phpframework/piece_framework/trunk/web/frontend/webapp/templates/Self/Form.html

    r15529 r15579  
    1 <div id="wrapper"> 
    2   <div id="main"> 
    3     <form id="StatusUpdate" name="StatusUpdate" 
    4           onsubmit="if( $('status').value.length > 140 ) { alert('That update is over 140 characters!'); return false;}; new Ajax.Request('/status/update', { asynchronous:true, evalScripts:true, requestHeaders: { Accept: 'application/x-piece-html-fragment'}, onComplete: function(transport){ $('timeline_table').insert({ top: transport.responseText }); var status = jQuery('span.murmur:first'); status.html(replace_name_to_link(status.html())).html(replace_url_to_link(status.html())); $('status').value = '';updateStatusTextCharCounter($('status').value);$('status').focus();},parameters: Form.serialize(this) }); return false;"> 
    5       <div id="post"> 
    6         <span class="whatdoing">イマナニシテル？</span> 
    7         <span class="textCount" id="js_textcount">140</span> 
    8         <textarea 
    9             onkeyup="return updateStatusTextCharCounter(this.value, event);" 
    10             onfocus="return updateStatusTextCharCounter(this.value, event);" 
    11             onblur="return updateStatusTextCharCounter(this.value, event);" 
    12             class="message" name="status" id="status"></textarea> 
    13         <p class="btn btnSpace"> 
    14           <input name="commit" id="commit" class="formBtn" type="button" value="つぶやく" p:event="update" onclick="$('StatusUpdate').onsubmit();" /> 
    15         </p> 
    16       </div> 
    17     </form> 
     1<div id="flash" style="display: none;" if="type == 'popup'"> 
     2  <div class="desc"><p>更新しました！</p></div> 
     3</div> 
    184 
    19     <ul class="tabNav"> 
    20       <li><a href="/home" class="{tab.home}">みんなのつぶやき</a></li> 
    21       <li><a href="/replies"  class="{tab.replies}">あなた宛のつぶやき</a></li> 
    22       <li><a href="/account/archive" class="{tab.archive}">あなたのつぶやき</a></li> 
    23       <li><a href="/public_timeline" class="{tab.public_timeline}">公開つぶやき</a></li> 
    24     </ul> 
     5<div id="contents"> 
    256 
    26     <div id="timeline"> 
    27       <table class="statuslist" id="timeline_table"> 
    28          
    29         <tr foreach="statusList" as="status"> 
    30           <td class="friendicon"> 
    31             <img src="/profile_images/{status.userId}/{status.imageNormal}" id="profile-image" alt="{status.userName}" class="friendicon" if="status.image" /> 
    32             <img src="/profile_images/default_profile_normal.png" id="profile-image" alt="Default_profile_normal" class="friendicon" if="!status.image" /> 
    33           </td> 
    34           <td class="status"> 
    35             <a href="/{status.userName}" key="status.userName">username</a> 
     7  <div id="wrapper"> 
     8    <div id="main"> 
     9      <form id="StatusUpdate" name="StatusUpdate" 
     10            onsubmit="if( $('status').value.length > 140 ) { 
     11    alert('That update is over 140 characters!'); 
     12    return false; 
     13}; 
    3614 
    37             <span class="murmur" key="status.comment"> 
    38               <a href="#replySample">@hogehoge</a> 漢字、ひらがな、カタカナ、数字の123、Alphabetが混ざったサンプルテキストです。 
    39             </span> 
     15new Ajax.Request('/status/update', 
     16                 { asynchronous:true, 
     17                   evalScripts:true, 
     18                   parameters: Form.serialize(this), 
     19                   requestHeaders: { Accept: 'application/x-piece-html-fragment'}, 
     20                   onComplete: function(transport) { 
     21                       if (transport.responseText.match(/friendicon/)) updateSelfPage(transport.responseText); 
     22                   } 
     23                 }); 
     24return false;"> 
     25        <div id="post"> 
     26          <span class="whatdoing">イマナニシテル？</span> 
     27          <span class="textCount" id="js_textcount">140</span> 
     28          <textarea 
     29              onkeyup="return updateStatusTextCharCounter(this.value, event);" 
     30              onfocus="return updateStatusTextCharCounter(this.value, event);" 
     31              onblur="return updateStatusTextCharCounter(this.value, event);" 
     32              class="message" name="status" id="status"></textarea> 
     33          <p class="btn btnSpace"> 
     34            <input name="commit" id="commit" class="formBtn" type="button" value="つぶやく" p:event="update" onclick="$('StatusUpdate').onsubmit();" /> 
     35          </p> 
     36        </div> 
     37      </form> 
    4038 
    41             <span> 
    42               <a href="/{user.userName}/statuses/{status.statusId}"  key="status.createdAt">YYYY-MM-DD hh:mm:ss</a> 
    43             </span> 
     39      <ul class="tabNav"> 
     40        <li><a href="/home" class="{tab.home}">みんなのつぶやき</a></li> 
     41        <li><a href="/replies"  class="{tab.replies}">あなた宛のつぶやき</a></li> 
     42        <li><a href="/account/archive" class="{tab.archive}">あなたのつぶやき</a></li> 
     43        <li><a href="/public_timeline" class="{tab.public_timeline}">公開つぶやき</a></li> 
     44      </ul> 
    4445 
    45           </td> 
    46           <td class="action"> 
    47             <a title="Reply to {status.userName}" 
    48                onclick="replyTo('{status.userName}');" 
    49                href="#" 
    50                if="status.userId != self.id"> 
    51               <img src="/img/share/reply_icon.gif" alt="Reply" class="icon16" /> 
    52             </a> 
     46      <div id="timeline"> 
     47        <table class="statuslist" id="timeline_table"> 
     48           
     49          <tr foreach="statusList" as="status"> 
     50            <td class="friendicon"> 
     51              <img src="/profile_images/{status.userId}/{status.imageNormal}" id="profile-image" alt="{status.userName}" class="friendicon" if="status.image" /> 
     52              <img src="/profile_images/default_profile_normal.png" id="profile-image" alt="Default_profile_normal" class="friendicon" if="!status.image" /> 
     53            </td> 
     54            <td class="status"> 
     55              <a href="/{status.userName}" key="status.userName">username</a> 
    5356 
    54             <a title="Delete this update?" 
    55                onclick="if (confirm('削除してもよいですか？取り消しできません！')) { return true; } else { return false;}" 
    56                href="/status/destroy/{status.statusId}" 
    57                if="status.userId == self.id"> 
    58               <img src="/img/share/trash_icon.gif" alt="Delete" class="icon16" /> 
    59             </a> 
    60           </td> 
    61         </tr> 
     57              <span class="murmur" key="status.comment"> 
     58                <a href="#replySample">@hogehoge</a> 漢字、ひらがな、カタカナ、数字の123、Alphabetが混ざったサンプルテキストです。 
     59              </span> 
    6260 
    63       </table> 
     61              <span> 
     62                <a href="/{user.userName}/statuses/{status.statusId}"  key="status.createdAt">YYYY-MM-DD hh:mm:ss</a> 
     63              </span> 
    6464 
    65       <p class="paraR bottombtn" if="user.hasNextPage()"><a href="?page={olderPage}">前へ</a></p> 
    66       <p class="paraR bottombtn" if="newerPage > 0"><a href="?page={newerPage}">後へ</a></p> 
    67       <p class="paraL bottombtn"><a href="#rss">RSS</a></p> 
    68     <!-- / #timeline --></div> 
    69   <!-- / #main --></div> 
    70 <!-- / #wrapper --></div> 
     65            </td> 
     66            <td class="action"> 
     67              <a title="Reply to {status.userName}" 
     68                 onclick="replyTo('{status.userName}');" 
     69                 href="#" 
     70                 if="status.userId != self.id"> 
     71                <img src="/img/share/reply_icon.gif" alt="Reply" class="icon16" /> 
     72              </a> 
    7173 
    72 <div id="sub"> 
    73   <div class="subsection_title"> 
    74     <h3>プロフィール</h3> 
    75   </div> 
     74              <a title="Delete this update?" 
     75                 onclick="if (confirm('削除してもよいですか？取り消しできません！')) { return true; } else { return false;}" 
     76                 href="/status/destroy/{status.statusId}" 
     77                 if="status.userId == self.id"> 
     78                <img src="/img/share/trash_icon.gif" alt="Delete" class="icon16" /> 
     79              </a> 
     80            </td> 
     81          </tr> 
    7682 
    77   <div class="subsection_body"> 
    78     <address> 
    79       <ul class="about vcard entry-author"> 
    80         <li><span class="label">名前</span> <span class="fn" key="user.userName">username</span></li> 
    81       </ul> 
    82     </address> 
    83   </div> 
     83        </table> 
    8484 
    85   <div class="subsection_title"> 
    86     <h3>ステータス</h3> 
    87   </div> 
    88   <div class="subsection_body"> 
    89     <ul class="status"> 
    90       <li> 
    91         <span class="label"><a href="/friends">このユーザーがフォロー</a></span> 
    92         <span key="user.countFriends()">999</span> 
    93       </li> 
    94       <li> 
    95         <span class="label"><a href="/followers">このユーザーをフォロー</a></span> 
    96         <span key="user.countFollowers()">999</span> 
    97       </li> 
    98       <li> 
    99         <span class="label"><a href="/account/archive">これまでの投稿</a></span> 
    100         <span key="user.countArchives()">999</span> 
    101       </li> 
    102     </ul> 
    103   </div> 
     85        <p class="paraR bottombtn" if="user.hasNextPage()"><a href="?page={olderPage}">前へ</a></p> 
     86        <p class="paraR bottombtn" if="newerPage > 0"><a href="?page={newerPage}">後へ</a></p> 
     87        <p class="paraL bottombtn"><a href="#rss">RSS</a></p> 
     88      <!-- / #timeline --></div> 
     89    <!-- / #main --></div> 
     90  <!-- / #wrapper --></div> 
    10491 
    105   <div class="subsection_body"> 
    106     <div if="self.countFriendRequests()"> 
    107       <a href="/friend_requests">新しいフォロー<span key="self.countFriendRequests()">0</span>件！</a> 
     92  <div id="sub"> 
     93    <div class="subsection_title"> 
     94      <h3>プロフィール</h3> 
    10895    </div> 
    10996 
    110     <span class="vcard" foreach="user.listFriendsImage()" as="friend"> 
    111       <a href="/{friend.userName}"> 
    112         <img height="24" width="24" src="/profile_images/{friend.id}/{friend.imageMini}" alt="{friend.username}" id="profile-image" class="photo fn" if="friend.image" /> 
    113         <img height="24" width="24" src="/profile_images/default_profile_mini.png" alt="{friend.username}" id="profile-image" class="photo fn" if="!friend.image" /> 
    114       </a> 
    115     </span> 
     97    <div class="subsection_body"> 
     98      <address> 
     99        <ul class="about vcard entry-author"> 
     100          <li><span class="label">名前</span> <span class="fn" key="user.userName">username</span></li> 
     101        </ul> 
     102      </address> 
     103    </div> 
     104 
     105    <div class="subsection_title"> 
     106      <h3>ステータス</h3> 
     107    </div> 
     108    <div class="subsection_body"> 
     109      <ul class="status"> 
     110        <li> 
     111          <span class="label"><a href="/friends">このユーザーがフォロー</a></span> 
     112          <span key="user.countFriends()">999</span> 
     113        </li> 
     114        <li> 
     115          <span class="label"><a href="/followers">このユーザーをフォロー</a></span> 
     116          <span key="user.countFollowers()">999</span> 
     117        </li> 
     118        <li> 
     119          <span class="label"><a href="/account/archive">これまでの投稿</a></span> 
     120          <span key="user.countArchives()">999</span> 
     121        </li> 
     122      </ul> 
     123    </div> 
     124 
     125    <div class="subsection_body"> 
     126      <div if="self.countFriendRequests()"> 
     127        <a href="/friend_requests">新しいフォロー<span key="self.countFriendRequests()">0</span>件！</a> 
     128      </div> 
     129 
     130      <span class="vcard" foreach="user.listFriendsImage()" as="friend"> 
     131        <a href="/{friend.userName}"> 
     132          <img height="24" width="24" src="/profile_images/{friend.id}/{friend.imageMini}" alt="{friend.username}" id="profile-image" class="photo fn" if="friend.image" /> 
     133          <img height="24" width="24" src="/profile_images/default_profile_mini.png" alt="{friend.username}" id="profile-image" class="photo fn" if="!friend.image" /> 
     134        </a> 
     135      </span> 
     136    </div> 
     137 
    116138  </div> 
    117  
     139  <!-- / #sub --> 
    118140</div> 
    119 <!-- / #sub --> 
    120141 
    121142<script type="text/javascript"> 
    … …  
    131152</script> 
    132153 
    133 <script type="text/javascript"> 
     154<script type="text/javascript" if="type == 'popup'"> 
     155function updateSelfPage(text) { 
     156    jQuery('#flash').fadeIn("slow"); 
     157    var fadeOut = function() { 
     158        jQuery('#flash').fadeOut("slow"); 
     159    } 
     160    fadeOut.delay(8); 
     161    $('status').value = ''; 
     162    updateStatusTextCharCounter($('status').value); 
     163    $('status').focus(); 
     164} 
    134165</script> 
     166 
     167<script type="text/javascript" if="type == 'insertion'"> 
     168function updateSelfPage(text) { 
     169    $('timeline_table').insert({ top: text }); 
     170 
     171    var status = jQuery('span.murmur:first'); 
     172    status.html(replace_name_to_link(status.html())).html(replace_url_to_link(status.html())); 
     173 
     174    $('status').value = ''; 
     175    updateStatusTextCharCounter($('status').value); 
     176    $('status').focus(); 
     177} 
     178</script>