Add user settings for opening links in new tabs

Adds two separate user settings. One only affects "external" links (the
actual links for link topics), while the other will also affect links to
comments pages (including text topics).

tildes/alembic/versions/2512581c91b3_add_setting_to_open_links_in_new_tab.py

@@ -0,0 +1,26 @@
+"""Add setting to open links in new tab
+
+Revision ID: 2512581c91b3
+Revises:
+Create Date: 2018-07-21 22:23:49.563318
+
+"""
+from alembic import op
+import sqlalchemy as sa
+
+
+# revision identifiers, used by Alembic.
+revision = '2512581c91b3'
+down_revision = None
+branch_labels = None
+depends_on = None
+
+
+def upgrade():
+    op.add_column('users', sa.Column('open_new_tab_external', sa.Boolean(), server_default='false', nullable=False))
+    op.add_column('users', sa.Column('open_new_tab_internal', sa.Boolean(), server_default='false', nullable=False))
+
+
+def downgrade():
+    op.drop_column('users', 'open_new_tab_internal')
+    op.drop_column('users', 'open_new_tab_external')

tildes/scss/modules/_settings.scss

@@ -4,4 +4,9 @@
   li {
     margin-bottom: 1rem;
   }
+
+  // Nested settings list
+  ul li {
+    margin-bottom: unset;
+  }
 }

tildes/tildes/models/user/user.py

@@ -82,6 +82,10 @@ class User(DatabaseModel):
         Boolean, nullable=False, server_default='false')
     auto_mark_notifications_read: bool = Column(
         Boolean, nullable=False, server_default='false')
+    open_new_tab_external: bool = Column(
+        Boolean, nullable=False, server_default='false')
+    open_new_tab_internal: bool = Column(
+        Boolean, nullable=False, server_default='false')
     is_banned: bool = Column(Boolean, nullable=False, server_default='false')
     is_admin: bool = Column(Boolean, nullable=False, server_default='false')
     home_default_order: Optional[TopicSortOption] = Column(

tildes/tildes/templates/macros/topics.jinja2

@@ -11,9 +11,15 @@
       <div>
         <h1 class="topic-title">
           {% if topic.is_text_type %}
-            <a href="{{ topic.permalink }}">{{ topic.title }}</a>
+            <a
+              href="{{ topic.permalink }}"
+              {% if request.user.open_new_tab_internal %}target="_blank"{% endif %}
+            >{{ topic.title }}</a>
           {% elif topic.is_link_type %}
-            <a href="{{ topic.link }}">{{ topic.title }}</a>
+            <a
+              href="{{ topic.link }}"
+              {% if request.user.open_new_tab_external %}target="_blank"{% endif %}
+            >{{ topic.title }}</a>
           {% endif %}
         </h1>
         <span class="topic-content-metadata">({{ topic.content_metadata_for_display }})</span>
@@ -56,7 +62,10 @@
 
     <footer class="topic-info">
       <div class="topic-info-comments">
-        <a href="{{ topic.permalink }}">
+        <a
+          href="{{ topic.permalink }}"
+          {% if request.user.open_new_tab_internal %}target="_blank"{% endif %}
+        >
           {% trans num_comments=topic.num_comments %}
           {{ num_comments }} comment
           {% pluralize %}

tildes/tildes/templates/settings.jinja2

@@ -37,6 +37,45 @@
         </div>
       </form>
     </li>
+    <li>
+      <h4>Open links in new tabs</h4>
+      <form
+        name="open-links-new-tab"
+        autocomplete="off"
+        data-ic-patch-to="{{ request.route_url('ic_user', username=request.user.username) }}"
+      >
+        <ul class="settings-list">
+          <li>
+            <div class="form-group">
+              <label class="form-checkbox">
+                <input
+                  type="checkbox"
+                  id="open_new_tab_external"
+                  name="open_new_tab_external"
+                  data-js-autosubmit-on-change
+                  {% if request.user.open_new_tab_external %}checked{% endif %}
+                >
+                <i class="form-icon"></i> Topic links to other websites
+              </label>
+            </div>
+          </li>
+          <li>
+            <div class="form-group">
+              <label class="form-checkbox">
+                <input
+                  type="checkbox"
+                  id="open_new_tab_internal"
+                  name="open_new_tab_internal"
+                  data-js-autosubmit-on-change
+                  {% if request.user.open_new_tab_internal %}checked{% endif %}
+                >
+                <i class="form-icon"></i> Links to text topics and comments
+              </label>
+            </div>
+          </li>
+        </ul>
+      </form>
+    </li>
     <li><a href="/settings/password_change">Change your password</a></li>
     <li>
       <a href="/settings/account_recovery">Set up account recovery</a>

tildes/tildes/templates/topic.jinja2

@@ -44,7 +44,10 @@
   {% elif topic.is_link_type %}
     <div class="topic-full-link">
       <div class="topic-icon topic-icon-{{ topic.link_domain.replace('.', '_') }}"></div>
-      <a href="{{ topic.link }}">{{ topic.link }}</a>
+      <a
+        href="{{ topic.link }}"
+        {% if request.user.open_new_tab_external %}target="_blank"{% endif %}
+      >{{ topic.link }}</a>
     </div>
   {% endif %}
 {% endif %}

tildes/tildes/views/api/web/user.py

@@ -104,6 +104,24 @@ def change_auto_mark_notifications(request: Request) -> Response:
     return IC_NOOP
 
 
+@ic_view_config(
+    route_name='user',
+    request_method='PATCH',
+    request_param='ic-trigger-name=open-links-new-tab',
+    permission='change_open_links_new_tab_setting',
+)
+def change_open_links_new_tab(request: Request) -> Response:
+    """Change the user's "open links in new tabs" setting."""
+    user = request.context
+
+    external = bool(request.params.get('open_new_tab_external'))
+    internal = bool(request.params.get('open_new_tab_internal'))
+    user.open_new_tab_external = external
+    user.open_new_tab_internal = internal
+
+    return IC_NOOP
+
+
 @ic_view_config(
     route_name='user',
     request_method='PATCH',