src/newslash_web/templates/common/components/comment_tree.html.tt2

   1 <script type="text/x-template" id="comment-header-template">
   2   <div id="comment-header">
   3     <div v-if="archived" class="alert alert-info">
   4       この議論は賞味期限が切れたので、アーカイブ化されています。 新たにコメントを付けることはできません。
   5     </div>
   6     <div v-else-if="!commentAllowed" class="alert alert-info">
   7       設定によりコメント投稿は許可されていません。
   8     </div>
   9     <form class="form">
  10       [%#
  11       <button type="button" class="inline">コメント元ページを表示</button>
  12       %]
  13       <button type="button" class="inline" v-if="commentAllowed && !archived">
  14         <span class="glyphicon glyphicon-comment" aria-hidden="true"></span>
  15         <span class="btn-text"> コメントを書く</span>
  16       </button>
  17       <label aria-label="表示するコメント" class="inline">
  18         <select id="comment-filter" name="comment-filter" v-model="config.comment.show_threshold">
  19           <option value="-1">全コメントを表示</option>
  20           <option value="0">スコア0以上のコメントのみ表示</option>
  21           <option value="1">スコア1以上のコメントのみ表示</option>
  22           <option value="2">スコア2以上のコメントのみ表示</option>
  23           <option value="3">スコア3以上のコメントのみ表示</option>
  24           <option value="4">スコア4以上のコメントのみ表示</option>
  25           <option value="5">スコア5以上のコメントのみ表示</option>
  26         </select>
  27       </label>
  28
  29       <label aria-label="コメント表示方法" class="inline">
  30         <select id="body-filter" name="body-filter" v-model="config.comment.fold_threshold">
  31           <option value="-1">すべての本文を表示</option>
  32           <option value="0">スコア0未満のコメントは抜粋表示</option>
  33           <option value="1">スコア1未満のコメントは抜粋表示</option>
  34           <option value="2">スコア2未満のコメントは抜粋表示</option>
  35           <option value="3">スコア3未満のコメントは抜粋表示</option>
  36           <option value="4">スコア4未満のコメントは抜粋表示</option>
  37           <option value="5">スコア5未満のコメントは抜粋表示</option>
  38         </select>
  39       </label>
  40
  41       <button type="button" class="inline" aria-label="表示設定"
  42               v-on:click="showPrefs=!showPrefs" :class="{active: showPrefs}">
  43         <span class="glyphicon glyphicon-cog" aria-hidden="true"></span>
  44         <span class="btn-text">表示設定</span>
  45       </button>
  46     </form>
  47
  48     <form class="form" id="comment-header-advanced" v-show="showPrefs">
  49       <div class="checkbox">
  50         <label>
  51           <input type="checkbox" id="enable-hotkey" name="enable-hotkey" value="1" v-model="config.ui.enable_hotkey" />
  52           ショートカットキーの割り当てを有効にする
  53         </label>
  54       </div>
  55
  56       <div class="checkbox">
  57         <label>
  58           <input type="checkbox" id="auto-fold" name="auto-fold" value="1" v-model="config.comment.auto_fold" />
  59           既読コメントを折りたたむ
  60         </label>
  61       </div>
  62
  63       <div class="checkbox">
  64         <label>
  65           <input type="checkbox" id="hide-signature" name="hide-signature" value="1" v-model="config.comment.hide_signature" />
  66           署名を非表示
  67         </label>
  68       </div>
  69
  70       <div class="checkbox">
  71         <label>
  72           <input type="checkbox" id="hide-score" name="hide-score" value="1" v-model="config.comment.hide_score" />
  73           スコアを非表示
  74         </label>
  75       </div>
  76
  77       <div class="form-inline">
  78         <button type="button" class="btn form-control btn-default"
  79                 v-on:click="saveConfig()" :class="{disabled: !savable}">
  80           現在の表示設定をデフォルトとして保存
  81         </button>
  82       </div>
  83     </form>
  84   </div>
  85 </script>
  86
  87 <script type="text/x-template" id="comment-tree-template">
  88   <div id="comment-tree">
  89     <div class="comment-header-wrap">
  90       <comment-header></comment-header>
  91     </div>
  92     <div class="comment-tree-body">
  93       <ol class="comment-tree">
  94         <li v-for="comment in comments" v-if="!comment.pid || comment.pid == rootId">
  95           <comment :comment="comment"></comment>
  96         </li>
  97       </ol>
  98     </div>
  99     <comment-form v-if="commentAllowed" :target="comments"></comment-form>
 100   </div>
 101 </script>
 102
 103 <script type="text/x-template" id="comment-template">
 104   <div class="comment-wrap">
 105     [%- INCLUDE common/comment/comment comment={}  x_template=1 -%]
 106     <ol class="comment-tree">
 107       <li v-if="isFormVisible">
 108         <comment-form :reply-to="comment" v-on:finish-edit="hideReplyForm()"></comment-form>
 109       </li>
 110       <li v-for="comment in comment._children">
 111         <comment :comment="comment"></comment>
 112       </li>
 113     </ol>
 114   </div>
 115 </script>
 116
 117 <script type="text/x-template" id="comment-form-template">
 118   <div class="comment-form">
 119     <div class="preview" v-if="isPreviewVisible">
 120       <comment :comment="preview" :preview="true"></comment>
 121     </div>
 122     [%- INCLUDE common/comment/comment_form -%]
 123   </div>
 124 </script>
 125
 126
 127 [% helpers.load_js("comment-tree.js") %]
 128