Răsfoiți Sursa

Bookmark on portal page

Sotaro KARASAWA 10 ani în urmă
părinte
comite
80352efffb

+ 2 - 115
lib/views/page.html

@@ -215,124 +215,11 @@
 {% endblock %}
 
 {% block side_header %}
-
-{% if page %} {# {{{ if page #}
-<div class="page-meta">
-  <div class="row">
-    {# default(author) としているのは、v1.1.1 以前に page.creator データが入ってないから。暫定として最新更新ユーザーを表示しちゃう。 #}
-    <div class="col-md-3 creator-picture">
-      <img src="{{ page.creator|default(author)|picture }}" class="picture picture-lg picture-rounded"><br>
-    </div>
-    <div class="col-md-9">
-      <p class="creator">
-        {{ page.creator.name|default(author.name) }}
-      </p>
-      <p class="created-at">
-        作成日: {{ page.createdAt|datetz('Y/m/d H:i:s') }}<br>
-        最終更新: {{ page.updatedAt|datetz('Y/m/d H:i:s') }} <a href="/user/{{ author.username }}"><img src="{{ author|picture }}" class="picture picture-xs picture-rounded" alt="{{ author.name }}"></a>
-      </p>
-    </div>
-  </div>
-
-  <div class="like-box">
-    <dl class="dl-horizontal">
-      <dt>
-        <i class="fa fa-thumbs-o-up"></i> いいね!
-      </dt>
-      <dd>
-        <p class="liker-count">
-        {{ page.liker.length }}
-          {% if page.isLiked(user) %}
-            <button data-liked="1" class="btn btn-default btn-sm active" id="pageLikeButton"><i class="fa fa-thumbs-up"></i> いいね!</button>
-          {% else %}
-            <button data-liked="0" class="btn btn-default btn-sm" id="pageLikeButton"><i class="fa fa-thumbs-o-up"></i> いいね!</button>
-          {% endif %}
-        </p>
-        <p class="liker-list">
-          {% for liker in page.liker %}
-            <a href="{{ user_page_root(liker) }}" title="{{ liker.name }}"><img alt="{{ liker.name }}" src="{{ liker|picture }}" class="picture picture-xs picture-rounded"></a>
-          {% endfor %}
-          {% if page.liker.length > 10 %}
-            (...)
-          {% endif %}
-        </p>
-      </dd>
-
-      <dt><i class="fa fa-eye"></i> 見た人</dt>
-      <dd>
-        <p class="seen-user-count">
-          {{ page.seenUsers.length }}
-        </p>
-        <p class="seen-user-list">
-          {% for seenUser in page.seenUsers %}
-          <a href="{{ user_page_root(seenUser) }}" title="{{ seenUser.name }}"><img alt="{{ seenUser.name }}" src="{{ seenUser|picture }}" class="picture picture-xs picture-rounded"></a>
-          {% endfor %}
-          {% if page.seenUsers.length > 10 %}
-            (...)
-          {% endif %}
-        </p>
-      </dd>
-    </dl>
-  </div>
-<script>
-$(function() {
-  $('#pageLikeButton').click(function() {
-    var pageId = {{page._id|json|safe}};
-    $.post('/_api/page/{{ page._id.toString() }}/like', function(data) {
-    });
-  });
-});
-</script>
-</div>
-{% endif %} {# if page }}} #}
+  {% include 'widget/page_side_header.html' %}
 {% endblock %} {# side_header #}
 
 {% block side_content %}
-
-  <h3><i class="fa fa-link"></i> Share</h3>
-  <ul class="fitted-list">
-    <li data-toggle="tooltip" data-placement="bottom" title="共有用リンク" class="input-group">
-      <span class="input-group-addon">共有用</span>
-      <input class="copy-link form-control" type="text" value="{{ config.crowi['app:title'] }} {{ path }}  {{ baseUrl }}/_r/{{ page._id.toString() }}">
-    </li>
-    <li data-toggle="tooltip" data-placement="bottom" title="Markdown形式のリンク" class="input-group">
-      <span class="input-group-addon">Markdown</span>
-      <input class="copy-link form-control" type="text" value="[{{ path }}]({{ baseUrl }}/_r/{{ revision._id.toString() }})">
-    </li>
-  </ul>
-
-  <h3><i class="fa fa-comment"></i> Comments</h3>
-  <div class="page-comments">
-    <form class="form page-comment-form" id="page-comment-form">
-      <div class="comment-form">
-        <div class="comment-form-main">
-          <div class="comment-write" id="comment-write">
-            <textarea class="comment-form-comment form-control" id="comment-form-comment" name="commentForm[comment]"></textarea>
-          </div>
-          <div class="comment-submit">
-            <input type="hidden" name="commentForm[page_id]" value="{{ page._id.toString() }}">
-            <input type="hidden" name="commentForm[revision_id]" value="{{ revision._id.toString() }}">
-            <span class="text-danger" id="comment-form-message"></span>
-            <input type="submit" id="commenf-form-button" value="Comment" class="btn btn-primary btn-sm form-inline">
-          </div>
-        </div>
-      </div>
-    </form>
-
-    <div class="page-comments-list" id="page-comments-list">
-      <div class="page-comments-list-newer collapse" id="page-comments-list-newer"></div>
-
-      <a class="page-comments-list-toggle-newer text-center" data-toggle="collapse" href="#page-comments-list-newer"><i class="fa fa-angle-double-up"></i> Comments for Newer Revision <i class="fa fa-angle-double-up"></i></a>
-
-      <div class="page-comments-list-current" id="page-comments-list-current"></div>
-
-      <a class="page-comments-list-toggle-older text-center" data-toggle="collapse" href="#page-comments-list-older"><i class="fa fa-angle-double-down"></i> Comments for Older Revision <i class="fa fa-angle-double-down"></i></a>
-
-      <div class="page-comments-list-older collapse in" id="page-comments-list-older"></div>
-    </div>
-  </div>
-
-
+  {% include 'widget/page_side_content.html' %}
 {% endblock %}
 
 {% block footer %}

+ 20 - 4
lib/views/page_list.html

@@ -7,11 +7,24 @@
 {% block content_head_before %}
 {% endblock %}
 
-  <header>
-  <h1 class="title" id="revision-path">
-    {{ path }}
-  </h1>
+<div class="header-wrap">
+  <header class="portal-header {% if page %}has-page{% endif %}">
+    {% if page %}
+      <a href="#" title="Bookmark" class="bookmark-link" id="bookmark-button" data-bookmarked="0"><i class="fa fa-star-o"></i></a>
+    {% endif %}
+
+    <h1 class="title" id="revision-path">
+      {{ path }}
+    </h1>
+
+    {% if page %}
+      <p class="portal-label">
+      PORTAL
+      </p>
+    {% endif %}
   </header>
+</div>
+
 {% endblock %}
 
 {% block content_head_after %}
@@ -23,6 +36,7 @@
 {% endblock %}
 
 <div class="page-list content-main {% if req.body.pageForm %}on-edit{% endif %}"
+  id="content-main"
   data-page-portal="{% if page and page.isPortal() %}1{% else %}0{% endif %}"
   data-page-id="{% if page %}{{ page._id.toString() }}{% endif %}"
   data-current-user="{% if user %}{{ user._id.toString() }}{% endif %}"
@@ -183,6 +197,8 @@
   </div>
 
 </div>
+{% else %}
+  {% include 'widget/page_side_header.html' %}
 {% endif %}
 
 {% endblock %} {# side_header #}

+ 42 - 0
lib/views/widget/page_side_content.html

@@ -0,0 +1,42 @@
+<h3><i class="fa fa-link"></i> Share</h3>
+<ul class="fitted-list">
+  <li data-toggle="tooltip" data-placement="bottom" title="共有用リンク" class="input-group">
+    <span class="input-group-addon">共有用</span>
+    <input class="copy-link form-control" type="text" value="{{ config.crowi['app:title'] }} {{ path }}  {{ baseUrl }}/_r/{{ page._id.toString() }}">
+  </li>
+  <li data-toggle="tooltip" data-placement="bottom" title="Markdown形式のリンク" class="input-group">
+    <span class="input-group-addon">Markdown</span>
+    <input class="copy-link form-control" type="text" value="[{{ path }}]({{ baseUrl }}/_r/{{ revision._id.toString() }})">
+  </li>
+</ul>
+
+<h3><i class="fa fa-comment"></i> Comments</h3>
+<div class="page-comments">
+  <form class="form page-comment-form" id="page-comment-form">
+    <div class="comment-form">
+      <div class="comment-form-main">
+        <div class="comment-write" id="comment-write">
+          <textarea class="comment-form-comment form-control" id="comment-form-comment" name="commentForm[comment]"></textarea>
+        </div>
+        <div class="comment-submit">
+          <input type="hidden" name="commentForm[page_id]" value="{{ page._id.toString() }}">
+          <input type="hidden" name="commentForm[revision_id]" value="{{ revision._id.toString() }}">
+          <span class="text-danger" id="comment-form-message"></span>
+          <input type="submit" id="commenf-form-button" value="Comment" class="btn btn-primary btn-sm form-inline">
+        </div>
+      </div>
+    </div>
+  </form>
+
+  <div class="page-comments-list" id="page-comments-list">
+    <div class="page-comments-list-newer collapse" id="page-comments-list-newer"></div>
+
+    <a class="page-comments-list-toggle-newer text-center" data-toggle="collapse" href="#page-comments-list-newer"><i class="fa fa-angle-double-up"></i> Comments for Newer Revision <i class="fa fa-angle-double-up"></i></a>
+
+    <div class="page-comments-list-current" id="page-comments-list-current"></div>
+
+    <a class="page-comments-list-toggle-older text-center" data-toggle="collapse" href="#page-comments-list-older"><i class="fa fa-angle-double-down"></i> Comments for Older Revision <i class="fa fa-angle-double-down"></i></a>
+
+    <div class="page-comments-list-older collapse in" id="page-comments-list-older"></div>
+  </div>
+</div>

+ 69 - 0
lib/views/widget/page_side_header.html

@@ -0,0 +1,69 @@
+{% if page %} {# {{{ if page #}
+<div class="page-meta">
+  <div class="row">
+    {# default(author) としているのは、v1.1.1 以前に page.creator データが入ってないから。暫定として最新更新ユーザーを表示しちゃう。 #}
+    <div class="col-md-3 creator-picture">
+      <img src="{{ page.creator|default(author)|picture }}" class="picture picture-lg picture-rounded"><br>
+    </div>
+    <div class="col-md-9">
+      <p class="creator">
+        {{ page.creator.name|default(author.name) }}
+      </p>
+      <p class="created-at">
+        作成日: {{ page.createdAt|datetz('Y/m/d H:i:s') }}<br>
+        最終更新: {{ page.updatedAt|datetz('Y/m/d H:i:s') }} <a href="/user/{{ author.username }}"><img src="{{ author|picture }}" class="picture picture-xs picture-rounded" alt="{{ author.name }}"></a>
+      </p>
+    </div>
+  </div>
+
+  <div class="like-box">
+    <dl class="dl-horizontal">
+      <dt>
+        <i class="fa fa-thumbs-o-up"></i> いいね!
+      </dt>
+      <dd>
+        <p class="liker-count">
+        {{ page.liker.length }}
+          {% if page.isLiked(user) %}
+            <button data-liked="1" class="btn btn-default btn-sm active" id="pageLikeButton"><i class="fa fa-thumbs-up"></i> いいね!</button>
+          {% else %}
+            <button data-liked="0" class="btn btn-default btn-sm" id="pageLikeButton"><i class="fa fa-thumbs-o-up"></i> いいね!</button>
+          {% endif %}
+        </p>
+        <p class="liker-list">
+          {% for liker in page.liker %}
+            <a href="{{ user_page_root(liker) }}" title="{{ liker.name }}"><img alt="{{ liker.name }}" src="{{ liker|picture }}" class="picture picture-xs picture-rounded"></a>
+          {% endfor %}
+          {% if page.liker.length > 10 %}
+            (...)
+          {% endif %}
+        </p>
+      </dd>
+
+      <dt><i class="fa fa-eye"></i> 見た人</dt>
+      <dd>
+        <p class="seen-user-count">
+          {{ page.seenUsers.length }}
+        </p>
+        <p class="seen-user-list">
+          {% for seenUser in page.seenUsers %}
+          <a href="{{ user_page_root(seenUser) }}" title="{{ seenUser.name }}"><img alt="{{ seenUser.name }}" src="{{ seenUser|picture }}" class="picture picture-xs picture-rounded"></a>
+          {% endfor %}
+          {% if page.seenUsers.length > 10 %}
+            (...)
+          {% endif %}
+        </p>
+      </dd>
+    </dl>
+  </div>
+<script>
+$(function() {
+  $('#pageLikeButton').click(function() {
+    var pageId = {{page._id|json|safe}};
+    $.post('/_api/page/{{ page._id.toString() }}/like', function(data) {
+    });
+  });
+});
+</script>
+</div>
+{% endif %} {# if page }}} #}

+ 1 - 0
resource/css/_page.scss

@@ -273,6 +273,7 @@
         margin-left: 40px;
 
         .revision-history-author {
+          color: #666;
         }
         .revision-history-comment {
         }

+ 21 - 2
resource/css/_portal.scss

@@ -1,6 +1,25 @@
+.portal-header {
+  &.has-page {
+    border-bottom: solid 3px #5bc0de; // TODO: is this color defined as variable?
+  }
+
+  .portal-label {
+    background: #5bc0de;
+    float: right;
+    font-weight: bold;
+    padding: 2px 4px;
+    font-size: .8em;
+    color: #fff;
+    border-bottom-left-radius: 4px;
+    border-bottom-right-radius: 4px;
+  }
+}
+
 .portal {
-  margin-bottom: 16px;
-  padding-bottom: 16px;
+  .wiki {
+    margin-bottom: 16px;
+    padding-bottom: 16px;
+  }
 
   .portal-form {