Open in new tabs: Add support for links in text

Adds a new sub-option to the "Open links in new tabs" setting which uses
javascript to find external links in the text of topics, comments, and
messages and sets them to open in new tabs.

tildes/alembic/versions/de83b8750123_add_setting_to_open_text_links_in_new_.py

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

tildes/static/js/behaviors/external-links-new-tabs.js

@@ -0,0 +1,8 @@
+$.onmount('[data-js-external-links-new-tabs]', function() {
+    // Open external links in topic, comment, and message text in new tabs
+    $(this).find('a').each(function() {
+        if (this.host !== window.location.host) {
+          $(this).attr('target', '_blank');
+        }
+    });
+});

tildes/tildes/models/user/user.py

@@ -86,6 +86,8 @@ class User(DatabaseModel):
         Boolean, nullable=False, server_default='false')
     open_new_tab_internal: bool = Column(
         Boolean, nullable=False, server_default='false')
+    open_new_tab_text: 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/comments.jinja2

@@ -94,7 +94,11 @@
         </ul>
       {% endif %}
 
-      <div class="comment-text">
+      <div class="comment-text"
+        {% if request.user and request.user.open_new_tab_text %}
+        data-js-external-links-new-tabs
+        {% endif %}
+      >
         {% if comment.is_removed and 'admin' in request.effective_principals %}
           <p class="text-warning">Comment removed</p>
         {% endif %}

tildes/tildes/templates/macros/messages.jinja2

@@ -13,6 +13,10 @@
       {{ time_ago(message.created_time) }}
     </header>
 
-    <div class="message-text">{{ message.rendered_html|safe }}</div>
+    <div class="message-text"
+      {% if request.user and request.user.open_new_tab_text %}
+      data-js-external-links-new-tabs
+      {% endif %}
+    >{{ message.rendered_html|safe }}</div>
   </article>
 {% endmacro %}

tildes/tildes/templates/macros/topics.jinja2

@@ -51,7 +51,11 @@
       {% if not topic.get_content_metadata('excerpt').endswith('...') %}
         <p class="topic-text-excerpt">{{ topic.get_content_metadata('excerpt') }}</p>
       {% else %}
-        <details class="topic-text-excerpt">
+        <details class="topic-text-excerpt"
+          {% if request.user and request.user.open_new_tab_text %}
+          data-js-external-links-new-tabs
+          {% endif %}
+        >
           <summary>
             <span>{{ topic.get_content_metadata('excerpt') }}</span>
           </summary>

tildes/tildes/templates/settings.jinja2

@@ -73,6 +73,20 @@
               </label>
             </div>
           </li>
+          <li>
+            <div class="form-group">
+              <label class="form-checkbox">
+                <input
+                  type="checkbox"
+                  id="open_new_tab_text"
+                  name="open_new_tab_text"
+                  data-js-autosubmit-on-change
+                  {% if request.user.open_new_tab_text %}checked{% endif %}
+                >
+                <i class="form-icon"></i> External links in topic, comment, and message text
+              </label>
+            </div>
+          </li>
         </ul>
       </form>
     </li>

tildes/tildes/templates/topic.jinja2

@@ -40,7 +40,11 @@
 
 {% if request.has_permission('view_content', topic) %}
   {% if topic.is_text_type %}
-    <div class="topic-full-text">{{ topic.rendered_html|safe }}</div>
+    <div class="topic-full-text"
+      {% if request.user and request.user.open_new_tab_text %}
+      data-js-external-links-new-tabs
+      {% endif %}
+    >{{ topic.rendered_html|safe }}</div>
   {% elif topic.is_link_type %}
     <div class="topic-full-link">
       <div class="topic-icon topic-icon-{{ topic.link_domain.replace('.', '_') }}"></div>

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

@@ -116,8 +116,10 @@ def change_open_links_new_tab(request: Request) -> Response:
 
     external = bool(request.params.get('open_new_tab_external'))
     internal = bool(request.params.get('open_new_tab_internal'))
+    text = bool(request.params.get('open_new_tab_text'))
     user.open_new_tab_external = external
     user.open_new_tab_internal = internal
+    user.open_new_tab_text = text
 
     return IC_NOOP