Add account-default theme setting

7 years ago · 601773e60e
9 changed files with 103 additions and 10 deletions
--- a/tildes/alembic/versions/347859b0355e_added_account_default_theme_setting.py
+++ b/tildes/alembic/versions/347859b0355e_added_account_default_theme_setting.py
@ -0,0 +1,24 @@
+"""Added account default theme setting
+
+Revision ID: 347859b0355e
+Revises: fab922a8bb04
+Create Date: 2018-08-11 16:23:13.297883
+
+"""
+from alembic import op
+import sqlalchemy as sa
+
+
+# revision identifiers, used by Alembic.
+revision = '347859b0355e'
+down_revision = 'fab922a8bb04'
+branch_labels = None
+depends_on = None
+
+
+def upgrade():
+    op.add_column('users', sa.Column('theme_account_default', sa.Text(), server_default='', nullable=False))
+
+
+def downgrade():
+    op.drop_column('users', 'theme_account_default')
--- a/tildes/scss/modules/_form.scss
+++ b/tildes/scss/modules/_form.scss
@ -38,6 +38,10 @@ select.form-select:not([multiple]) {
  }
 }

+.form-buttons.no-flex-reverse {
+  flex-direction: row;
+}
+
 textarea.form-input {
  height: 8rem;
  line-height: 1.5;
--- a/tildes/static/js/behaviors/theme-selector.js
+++ b/tildes/static/js/behaviors/theme-selector.js
@ -3,6 +3,9 @@ $.onmount('[data-js-theme-selector]', function() {
        event.preventDefault();

        var new_theme = $(this).val();
+        var selected_text = $(this).find('option:selected').text()
+        var $setDefaultLink = $('#button-set-default-theme')
+        var $formDefaultValue = $('#input-set-default-theme')

        // persist the new theme for the user in their cookie
        document.cookie = 'theme=' + new_theme + ';' +
@ -22,5 +25,15 @@ $.onmount('[data-js-theme-selector]', function() {
        if (new_theme) {
            $body.addClass('theme-' + new_theme);
        }
+
+        // set the IC hidden input with the new value
+        $formDefaultValue.val(new_theme)
+
+        // set visibility of 'Set as account default' link
+        if (selected_text.indexOf('(account default)') !== -1) {
+            $setDefaultLink.css('visibility', 'hidden')
+        } else {
+            $setDefaultLink.css('visibility', 'visible')
+        }
    });
 });
--- a/tildes/tildes/models/user/user.py
+++ b/tildes/tildes/models/user/user.py
@ -88,6 +88,8 @@ class User(DatabaseModel):
        Boolean, nullable=False, server_default='false')
    open_new_tab_text: bool = Column(
        Boolean, nullable=False, server_default='false')
+    theme_account_default: str = Column(
+        Text, nullable=False, server_default='')
    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(
--- a/tildes/tildes/templates/base.jinja2
+++ b/tildes/tildes/templates/base.jinja2
@ -38,6 +38,8 @@
 {% block body_tag %}
  {% if request.cookies.get('theme', '') %}
  <body class="theme-{{ request.cookies.get('theme', '') }}">
+  {% elif request.user and request.user.theme_account_default %}
+  <body class="theme-{{ request.user.theme_account_default }}">
  {% else %}
  <body>
  {% endif %}
--- a/tildes/tildes/templates/base_no_sidebar.jinja2
+++ b/tildes/tildes/templates/base_no_sidebar.jinja2
@ -3,6 +3,8 @@
 {% block body_tag %}
  {% if request.cookies.get('theme', '') %}
  <body class="l-no-sidebar theme-{{ request.cookies.get('theme', '') }}">
+  {% elif request.user and request.user.theme_account_default %}
+  <body class="l-no-sidebar theme-{{ request.user.theme_account_default }}">
  {% else %}
  <body class="l-no-sidebar">
  {% endif %}
--- a/tildes/tildes/templates/settings.jinja2
+++ b/tildes/tildes/templates/settings.jinja2
@ -8,14 +8,36 @@
  <ul class="settings-list">
    <li>
      <label for="theme">Choose a display theme:</label>
-      <select class="form-select" name="theme" id="theme" data-js-theme-selector>
-        {% for theme, description in theme_options.items() %}
-          <option
-            value="{{ theme }}"
-            {{ 'selected' if theme == current_theme else ''}}
-          >{{ description }}</option>
-        {% endfor %}
-      </select>
+      <div class="listing-options">
+        <menu class="tab-listing-order" style="flex: 2;">
+          <select class="form-select" name="theme" id="theme" data-js-theme-selector>
+            {% for theme, description in theme_options.items() %}
+              <option
+                value="{{ theme }}"
+                {{ 'selected' if theme == current_theme else ''}}
+              >{{ description }}</option>
+            {% endfor %}
+          </select>
+        </menu>
+        <form
+          name="account-default-theme"
+          data-ic-patch-to="{{ request.route_url(
+            'ic_user',
+            username=request.user.username
+          ) }}"
+          class="form-listing-options"
+        >
+          <input type="hidden" name="theme" id="input-set-default-theme" value="{{ current_theme }}">
+          <div class="form-buttons no-flex-reverse">
+            <button class="btn btn-link" id="button-set-default-theme"
+              style="{% if current_theme == request.user.theme_account_default %}visibility: hidden;{% endif %}"
+              data-js-set-account-default-theme
+            >
+              Set as account default
+            </button>
+          </div>
+        </form>
+      </div>
    </li>
    <li>
      <form
--- a/tildes/tildes/views/api/web/user.py
+++ b/tildes/tildes/views/api/web/user.py
@ -143,6 +143,22 @@ def change_track_comment_visits(request: Request) -> Response:
    return Response("Disabled tracking of last comment visit.")


+@ic_view_config(
+    route_name='user',
+    request_method='PATCH',
+    request_param='ic-trigger-name=account-default-theme',
+    permission='change_account_default_theme_setting',
+)
+def change_account_default_theme(request: Request) -> Response:
+    """Change the user's "theme account default" setting."""
+    user = request.context
+
+    new_theme = request.params.get('theme')
+    user.theme_account_default = new_theme
+
+    return IC_NOOP
+
+
@ic_view_config(
    route_name='user_invite_code',
    request_method='GET',
--- a/tildes/tildes/views/settings.py
+++ b/tildes/tildes/views/settings.py
@ -9,19 +9,27 @@ from webargs.pyramidparser import use_kwargs
 from tildes.schemas.user import EMAIL_ADDRESS_NOTE_MAX_LENGTH, UserSchema


+DEFAULT_THEME_NAME = 'white'
 PASSWORD_FIELD = UserSchema(only=('password',)).fields['password']


@view_config(route_name='settings', renderer='settings.jinja2')
 def get_settings(request: Request) -> dict:
    """Generate the user settings page."""
-    current_theme = request.cookies.get('theme', '')
+    current_theme = (request.cookies.get('theme', '')
+                     or request.user.theme_account_default)
    theme_options = {
-        '': 'White (default)',
+        'white': 'White',
        'light': 'Solarized Light',
        'dark': 'Solarized Dark',
        'black': 'Black',
    }
+    if DEFAULT_THEME_NAME == request.user.theme_account_default:
+        theme_options[DEFAULT_THEME_NAME] += ' (site and account default)'
+    else:
+        theme_options[request.user.theme_account_default] += (
+            ' (account default)')
+        theme_options[DEFAULT_THEME_NAME] += ' (site default)'

    return {'current_theme': current_theme, 'theme_options': theme_options}