Allow users to configure to use night mode (beta) and sans-serif article body (#2072)

* Initial work for config

* Add config for users

* Fix schema
This commit is contained in:
Ben Halpern 2019-03-15 13:11:53 -04:00 committed by GitHub
parent 365a3513dc
commit d6ab255a45
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
12 changed files with 115 additions and 16 deletions

View file

@ -1,18 +1,14 @@
function browserStoreCache(action,userData) {
function browserStoreCache(action, userData) {
try {
if (action === "set") {
localStorage.setItem("current_user",userData);
if (action === 'set') {
localStorage.setItem('current_user', userData);
localStorage.setItem('config_body_class', JSON.parse(userData)['config_body_class']);
} else if (action === 'remove') {
localStorage.removeItem('current_user');
} else {
return localStorage.getItem('current_user');
}
else if (action === "remove") {
localStorage.removeItem("current_user");
}
else {
return localStorage.getItem("current_user");
}
}
catch(err) {
browserStoreCache("remove");
} catch (err) {
browserStoreCache('remove');
}
}

View file

@ -209,6 +209,10 @@
}
}
}
select {
display: block;
font-size: 1.3em;
}
button.big-action {
width: 130px;
padding: 3px 0px;

View file

@ -57,3 +57,10 @@ body.night-theme {
}
}
}
body.sans-serif-article-body {
.body p {
font-family: $helvetica;
font-size: 0.98em;
}
}

View file

@ -47,7 +47,8 @@ class AsyncInfoController < ApplicationController
number_of_comments: @user.comments.count,
display_sponsors: @user.display_sponsors,
trusted: @user.trusted,
experience_level: @user.experience_level
experience_level: @user.experience_level,
config_body_class: @user.config_body_class
}
end
end

View file

@ -31,6 +31,13 @@ class UserDecorator < ApplicationDecorator
end
end
def config_body_class
body_class = ""
body_class = body_class + config_theme.gsub("_", "-")
body_class = body_class + " " + config_font.gsub("_", "-") + "-article-body"
body_class
end
def assigned_color
colors = [
{

View file

@ -112,6 +112,13 @@ class User < ApplicationRecord
validates :editor_version,
inclusion: { in: %w(v1 v2),
message: "%{value} must be either v1 or v2" }
validates :config_theme,
inclusion: { in: %w(default night_theme),
message: "%{value} must be either default or night theme" }
validates :config_font,
inclusion: { in: %w(default sans_serif),
message: "%{value} must be either default or sans serif" }
validates :shipping_country,
length: { in: 2..2 },
allow_blank: true
@ -138,6 +145,7 @@ class User < ApplicationRecord
after_create :estimate_default_language!
before_update :mentorship_status_update
before_validation :set_username
before_validation :set_config_input
before_validation :downcase_email
before_validation :check_for_username_change
before_destroy :remove_from_algolia_index
@ -440,6 +448,11 @@ class User < ApplicationRecord
self.email = email.downcase if email
end
def set_config_input
self.config_theme = config_theme.gsub(" ", "_")
self.config_font = config_font.gsub(" ", "_")
end
def check_for_username_change
if username_changed?
self.old_old_username = old_username

View file

@ -55,6 +55,8 @@ class UserPolicy < ApplicationPolicy
%i[available_for
behance_url
bg_color_hex
config_theme
config_font
contact_consent
currently_hacking_on
currently_learning

View file

@ -77,6 +77,15 @@
<% end %>
</head>
<body data-user-status="<%= user_logged_in_status %>" data-pusher-key="<%= ApplicationConfig["PUSHER_KEY"] %>">
<% if user_signed_in? && !internal_navigation? %>
<script>
try {
document.body.className = localStorage.getItem('config_body_class');
} catch(e) {
console.log(e)
}
</script>
<% end %>
<% unless internal_navigation? %>
<div id="audiocontent">
<%= yield(:audio) %>

View file

@ -35,6 +35,24 @@
<%= f.submit "SUBMIT", class: "cta" %>
</div>
<% end %>
<h2>Style Customization</h2>
<%= form_for(@user) do |f| %>
<div class="sub-field">
<%= f.label :config_theme, "Site Theme" %>
<%= f.select(:config_theme, options_for_select(["default", "night theme"], @user.config_theme.gsub("_", " "))) %>
<sub><em>Default is light style. Night theme is in public alpha.</em></sub>
</div>
<div class="sub-field">
<%= f.label :config_font, "Base Post Font" %>
<%= f.select(:config_font, options_for_select(["default", "sans serif"], @user.config_font.gsub("_", " "))) %>
<sub><em>Default is serif style.</em></sub>
</div>
<div class="field">
<label></label>
<%= f.hidden_field :tab, value: @tab %>
<%= f.submit "SUBMIT", class: "cta" %>
</div>
<% end %>
<h2>Languages</h2>
<h3>Select which languages you'd prefer to see in your feed <span style="color:#e05252">(beta)</span></h3>
<h4 style="font-weight:400">

View file

@ -0,0 +1,6 @@
class AddConfigToUsers < ActiveRecord::Migration[5.1]
def change
add_column :users, :config_theme, :string, default: "default"
add_column :users, :config_font, :string, default: "default"
end
end

View file

@ -10,7 +10,7 @@
#
# It's strongly recommended that you check this file into your version control system.
ActiveRecord::Schema.define(version: 20190306082543) do
ActiveRecord::Schema.define(version: 20190315151829) do
# These are extensions that must be enabled in order to support this database
enable_extension "plpgsql"
@ -747,6 +747,8 @@ ActiveRecord::Schema.define(version: 20190306082543) do
t.string "bg_color_hex"
t.boolean "checked_code_of_conduct", default: false
t.integer "comments_count", default: 0, null: false
t.string "config_font", default: "default"
t.string "config_theme", default: "default"
t.datetime "confirmation_sent_at"
t.string "confirmation_token"
t.datetime "confirmed_at"

View file

@ -265,6 +265,26 @@ RSpec.describe User, type: :model do
user.summary = "0" * 999
expect(user).not_to be_valid
end
it "accepts valid theme" do
user.config_theme = "night theme"
expect(user).to be_valid
end
it "does not accept invalid theme" do
user.config_theme = "no night mode"
expect(user).not_to be_valid
end
it "accepts valid font" do
user.config_font = "sans serif"
expect(user).to be_valid
end
it "does not accept invalid font" do
user.config_theme = "goobledigook"
expect(user).not_to be_valid
end
end
## Registration
@ -401,6 +421,20 @@ RSpec.describe User, type: :model do
end
end
it "creates proper body class with defaults" do
expect(user.decorate.config_body_class).to eq("default default-article-body")
end
it "creates proper body class with sans serif config" do
user.config_font = "sans_serif"
expect(user.decorate.config_body_class).to eq("default sans-serif-article-body")
end
it "creates proper body class with night theme" do
user.config_theme = "night_theme"
expect(user.decorate.config_body_class).to eq("night-theme default-article-body")
end
it "inserts into mailchimp" do
expect(user.subscribe_to_mailchimp_newsletter_without_delay).to eq true
end