From 8d010eaf3b3f2af330088733a03e2c7a1a1a5fd8 Mon Sep 17 00:00:00 2001 From: Godwin Date: Thu, 7 Jul 2016 21:16:01 -0700 Subject: [PATCH] User settings page --- app/assets/javascripts/main.js | 13 +- app/assets/stylesheets/_application.scss | 151 +++++++----------- app/controllers/application_controller.rb | 16 +- app/controllers/oauths_controller.rb | 2 +- app/helpers/application_helper.rb | 31 +++- app/views/application/user_settings.html.haml | 23 +++ app/views/layouts/application.html.haml | 16 +- app/views/shared/_footer.html.haml | 16 +- app/views/shared/_navbar.html.haml | 5 - config/locales/en.yml | 12 ++ config/routes.rb | 6 +- ...160707034050_add_is_subscribed_to_users.rb | 5 + db/schema.rb | 3 +- 13 files changed, 189 insertions(+), 110 deletions(-) create mode 100644 app/views/application/user_settings.html.haml create mode 100644 db/migrate/20160707034050_add_is_subscribed_to_users.rb diff --git a/app/assets/javascripts/main.js b/app/assets/javascripts/main.js index a49b1b8..99175b4 100644 --- a/app/assets/javascripts/main.js +++ b/app/assets/javascripts/main.js @@ -32,7 +32,10 @@ }, true); function openDlg(dlg, link) { body.setAttribute('style', 'width: ' + body.clientWidth + 'px'); - dlg.querySelector('.message').innerHTML = link.querySelector('.message').innerHTML + var msg = link.querySelector('.message'); + if (msg) { + dlg.querySelector('.message').innerHTML = msg.innerHTML + } if (link.dataset.infoTitle) { dlg.querySelector('.title').innerHTML = decodeURI(link.dataset.infoTitle); } @@ -95,6 +98,14 @@ return false; }); }); + var loginDlg = document.getElementById('login-dlg'); + forEachElement('[data-sign-in]', function(link) { + link.addEventListener('click', function(event) { + event.preventDefault(); + openDlg(loginDlg, link); + return false; + }); + }); } var htmlNode = document.documentElement; diff --git a/app/assets/stylesheets/_application.scss b/app/assets/stylesheets/_application.scss index 806691b..f6113a4 100644 --- a/app/assets/stylesheets/_application.scss +++ b/app/assets/stylesheets/_application.scss @@ -183,7 +183,7 @@ button, background-color: $colour-1; } - #main &.subdued { + &.subdued, #main &.subdued { background-color: #888; } @@ -597,8 +597,10 @@ input { content: '+'; border: 0; font-size: 2.5em; - top: -0.125em; - left: 0.05em; + top: 0;//-0.25em; + left: 0.175em; + // top: -0.125em; + // left: 0.05em; line-height: 1em; color: #FFF; height: 1em; @@ -760,6 +762,19 @@ fieldset { margin-top: 3em; text-align: center; } + + &.right-help { + text-align: center; + + .input-field { + margin: 0; + } + + + .input-field-help { + overflow: auto; + margin-bottom: 2em; + } + } } .fieldgroup { @@ -1031,37 +1046,6 @@ ul.warnings li, .logo { font-size: 5em; } - - .user-nav-bar { - position: absolute; - right: 0; - text-align: right; - top: 1em; - font-size: 0.9em; - width: 100%; - padding-left: 13em; - padding-right: 1em; - - a { - display: block; - padding: 0.5em 0; - color: $black; - z-index: 1; - - &:after { - display: none; - } - } - - .my-account { - overflow: hidden; - text-overflow: ellipsis; - } - - body.error-locale-not-available & { - display: none; - } - } } .flow-steps { @@ -1853,25 +1837,31 @@ $header-tilt: 8deg; footer { @include _-(display, flex); @include _(flex-flow, row wrap); + @include _(align-items, flex-end); font-size: 4.1vw; } - .github, - ul.locales { + .github { @include _(flex, 1); @include _(flex-basis, 50%); } - .copy { + .site-info { @include clearfix; - text-align: right; - white-space: nowrap; + text-align: center; + width: 100%; a { + text-align: right; + white-space: nowrap; color: #666; } } + .user-controls { + line-height: 2.5em; + } + .facebook { @include _(flex, none); margin: 0.5em; @@ -1908,7 +1898,6 @@ $header-tilt: 8deg; padding: 0.5em 0.5em 0.5em 2em; text-align: center; z-index: $zindex-base + 2; - margin-bottom: 1em; a { margin: 0 0.5em; @@ -1930,9 +1919,12 @@ $header-tilt: 8deg; } ul.locales { - margin: 0; + @include _(flex, 1); + @include _(flex-basis, 100%); padding: 0; + margin: 1em 0; list-style: none; + text-align: center; } body.error-locale-not-available & { @@ -2074,6 +2066,11 @@ body { font-size: 0.8em; } } + + #login-dlg .title { + font-size: 2em; + margin-bottom: 1em; + } } @include keyframes(fade-out) { @@ -3130,6 +3127,14 @@ html[data-ontop] { font-size: 1.25em; } + fieldset { + &.right-help { + float: left; + text-align: left; + margin-right: 1.5em; + } + } + form { &.flex-form { @include _-(display, flex); @@ -3282,42 +3287,6 @@ html[data-ontop] { @include _(transform, none); } } - - .user-nav-bar { - top: 0; - left: 0; - right: auto; - width: auto; - float: none; - text-align: left; - background-color: #EEE; - @include _(border-radius, 0 0 0.5em 0); - font-size: 0.8em; - padding: 0 1em 0 0.5em; - @include default-box-shadow(top, 2); - - a { - display: inline-block; - padding: 0.25em 0; - - &:hover { - color: lighten($black, 25%); - } - } - - .my-account { - max-width: none; - overflow: visible; - - @include after { - content: '|'; - display: inline; - @include _(opacity, 0.25); - position: static; - margin: 0 0.5em; - } - } - } } #banner { @@ -3375,12 +3344,14 @@ html[data-ontop] { margin-bottom: -2em; li { - &:first-child { - @include _(border-radius, 0 0.15em 0 0); + &:last-child { + @include _(border-bottom-right-radius, 0.15em); + @include _(border-bottom-left-radius, 0.15em); } - &:last-child { - @include _(border-radius, 0 0 0.15em 0.15em); + &:first-child { + @include _(border-top-right-radius, 0.15em); + @include _(border-bottom-left-radius, 0); } } } @@ -3512,18 +3483,26 @@ html[data-ontop] { .github { @include _(flex, none); @include _(flex-basis, auto); - bottom: 0.5em; + //bottom: 0.5em; float: left; margin-right: 1em; margin-left: 1em; + margin-bottom: -0.3333em; } .facebook { margin: 0; } + + .site-info { + width: auto; + text-align: right; + } + ul.locales { @include _(flex, none); @include _(flex-basis, auto); @include _(flex-grow, 1); + margin: 0; } } @@ -3557,12 +3536,6 @@ html[data-ontop] { font-size: 1.9em; margin-top: 0; } - - .user-nav-bar { - @include _(border-radius, 0 0 0.5em 0.5em); - padding: 0 1em; - font-size: 1em; - } } #banner { @@ -3618,7 +3591,7 @@ html[data-ontop] { overflow: visible; padding: 0; width: 100%; - height: 3em; + height: 4.5em; footer { max-width: $row-width; diff --git a/app/controllers/application_controller.rb b/app/controllers/application_controller.rb index 7d3c286..4f1d334 100644 --- a/app/controllers/application_controller.rb +++ b/app/controllers/application_controller.rb @@ -221,6 +221,20 @@ class ApplicationController < LinguaFrancaApplicationController end end + def user_settings + @main_title = @page_title = 'page_titles.user_settings.Your_Account' + end + + def update_user_settings + return do_403 unless logged_in? + current_user.firstname = params[:name] + current_user.lastname = nil + current_user.languages = params[:languages].keys + current_user.is_subscribed = params[:email_subscribe].present? + current_user.save + redirect_to settings_path + end + def do_confirm(settings = nil) settings ||= {:template => 'login_confirmation_sent'} if params[:email] @@ -242,7 +256,7 @@ class ApplicationController < LinguaFrancaApplicationController end # generate the confirmation, send the email and show the 403 - referrer = request.referer.gsub(/^.*?\/\/.*?\//, '/') + referrer = params[:dest] || request.referer.gsub(/^.*?\/\/.*?\//, '/') generate_confirmation(params[:email], referrer) template = 'login_confirmation_sent' @page_title ||= 'page_titles.403.Please_Check_Email' diff --git a/app/controllers/oauths_controller.rb b/app/controllers/oauths_controller.rb index 376bc9e..8e1fedf 100644 --- a/app/controllers/oauths_controller.rb +++ b/app/controllers/oauths_controller.rb @@ -5,7 +5,7 @@ class OauthsController < ApplicationController # and after authorizing there back to the callback url. def oauth set_callback - session[:oauth_last_url] = request.referer + session[:oauth_last_url] = params[:dest] || request.referer login_at(auth_params[:provider]) end diff --git a/app/helpers/application_helper.rb b/app/helpers/application_helper.rb index 44c2e88..d592a74 100644 --- a/app/helpers/application_helper.rb +++ b/app/helpers/application_helper.rb @@ -857,6 +857,17 @@ module ApplicationHelper return html.html_safe end + def broadcast_methods + [ + :registered, + :confirmed_registrations, + :unconfirmed_registrations, + :unconfirmed_registrations, + :workshop_facilitators, + :everyone, + ] + end + def admin_steps [:edit, :stats, :broadcast, :housing, :locations, :meals, :events, :workshop_times, :schedule] end @@ -914,6 +925,11 @@ module ApplicationHelper return { html: html.html_safe, class: classes.join(' ') } end + def signin_link + @login_dlg ||= true + link_to (_'forms.actions.generic.login'), settings_path, data: { 'sign-in': true } + end + def link_with_confirmation(link_text, confirmation_text, path, args = {}) @confirmation_dlg ||= true args[:data] ||= {} @@ -1143,11 +1159,15 @@ module ApplicationHelper html += content_tag(:h3, _(options[:heading], :t), id: label_id) end + help = nil + if options[:help].present? description_id ||= unique_id("#{name.to_s}-desc") - html += content_tag(:div, _(options[:help], :s, 2), class: 'input-field-help', id: description_id) + help = content_tag(:div, _(options[:help], :s, 2), class: 'input-field-help', id: description_id) end + html += help if help.present? && !options[:right_help] + boxes_html = '' is_single = !values.is_a?(Array) @@ -1201,14 +1221,19 @@ module ApplicationHelper options[:vertical] ? 'vertical' : nil, options[:inline] ? 'inline' : nil, options[:small] ? 'small' : nil - ]).html_safe, + ].compact).html_safe, aria: { labeledby: label_id, describedby: description_id }, - class: options[:centered] ? 'centered' : nil + class: [ + options[:centered] ? 'centered' : nil, + options[:right_help] ? 'right-help' : nil + ].compact ) + html += help if help.present? && options[:right_help] + return html.html_safe end diff --git a/app/views/application/user_settings.html.haml b/app/views/application/user_settings.html.haml new file mode 100644 index 0000000..ee07852 --- /dev/null +++ b/app/views/application/user_settings.html.haml @@ -0,0 +1,23 @@ += render :partial => 'application/header', :locals => {:image_file => @banner_image || 'grafitti.jpg'} +%article + = row do + = columns do + - if logged_in? + %h2=_'articles.user_settings.headings.Your_Account' + - if @conference.present? && (@conference.registration_status == :pre || @conference.registration_status == :open) + %p=_'articles.user_settings.paragraphs.conference_registration', :t + = link_to (_'actions.conference.edit_registration'), register_path(@conference.slug), class: :button + + = form_tag update_settings_path do + = textfield :name, current_user.name, required: true, heading: 'articles.conference_registration.headings.name', big: true + = checkboxes :languages, [:en, :es, :fr], current_user.languages || [I18n.locale], 'languages', heading: 'articles.conference_registration.headings.languages' + = radiobuttons :preferred_language, [:en, :es, :fr], current_user.locale || I18n.locale, 'languages', heading: 'articles.conference_registration.headings.preferred_language' + = checkbox :email_subscribe, current_user.is_subscribed != false, 'articles.user_settings.email_subscribe', heading: 'articles.user_settings.headings.email_subscribe', help: 'articles.user_settings.paragraphs.email_subscribe', inline: true, right_help: true + .actions + = button_tag :save, value: :save + - else + %h2=_'forms.actions.generic.login' + = form_tag do_confirm_path, class: 'flex-form' do + = emailfield :email, nil, big: true + = button_tag :continue, :value => :confirm_email + = link_to (_'forms.actions.generic.facebook_sign_in','Facebook Sign In'), auth_at_provider_path(provider: :facebook), class: [:button, :facebook] diff --git a/app/views/layouts/application.html.haml b/app/views/layouts/application.html.haml index 02f4d61..c83f86d 100644 --- a/app/views/layouts/application.html.haml +++ b/app/views/layouts/application.html.haml @@ -27,8 +27,6 @@ - if content_for?(:side_bar) %nav#side-bar = yield :side_bar - -# - flash.each do |key, msg| - -# = content_tag :div, msg, :id => key %header#banner=yield :banner - if @submenu =row do @@ -42,7 +40,7 @@ = yield #footer %footer= render 'shared/footer' - - if @confirmation_dlg.present? || @info_dlg.present? + - if @confirmation_dlg.present? || @info_dlg.present? || @login_dlg.present? #content-overlay #overlay - if @confirmation_dlg.present? @@ -60,6 +58,18 @@ .dlg-inner %p.message='' %button.close=_'modals.done_button' + - if @login_dlg.present? + .dlg#login-dlg + .dlg-content + %h2.title=_'forms.actions.generic.login' + .dlg-inner + = form_tag do_confirm_path, class: 'flex-form' do + = hidden_field_tag :dest, settings_path + = emailfield :email, nil, big: true + = button_tag :continue, :value => :confirm_email + .flex-form + = link_to (_'forms.actions.generic.facebook_sign_in','Facebook Sign In'), auth_at_provider_path(provider: :facebook, dest: settings_path), class: [:button, :facebook] + %button.close.subdued=_'forms.actions.generic.cancel' = yield :footer_scripts if content_for?(:footer_scripts) = inline_scripts diff --git a/app/views/shared/_footer.html.haml b/app/views/shared/_footer.html.haml index 9cc9934..2e97146 100644 --- a/app/views/shared/_footer.html.haml +++ b/app/views/shared/_footer.html.haml @@ -15,7 +15,15 @@ - locale_translation = language(locale, true) %a{href: url, lang: locale} =_'translate.content.change_locale', "Read in #{locale_translation}", vars: {language: locale_translation}, locale: locale if locale != I18n.locale.to_s -.copy - =_'links.footer.help_text.contributors', 'Who contributed to building this website' do |title| - =link_to :humans_txt, {title: title} do - =((_!"©#{Date.today.strftime("%Y")} Bike!Bike!") || '').html_safe +.site-info + .user-controls + - if logged_in? + = link_to (_!current_user.name), settings_path, class: 'my-account' + = _!' | ' + = link_to (_'forms.actions.generic.Log_out'), logout_path + - else + = signin_link + .copy + =_'links.footer.help_text.contributors', 'Who contributed to building this website' do |title| + =link_to :humans_txt, {title: title} do + =((_!"©#{Date.today.strftime("%Y")} Bike!Bike!") || '').html_safe diff --git a/app/views/shared/_navbar.html.haml b/app/views/shared/_navbar.html.haml index 0f7eb29..9649949 100644 --- a/app/views/shared/_navbar.html.haml +++ b/app/views/shared/_navbar.html.haml @@ -2,11 +2,6 @@ #main-nav - begin = row(class: 'inner-nav') do - - if logged_in? - = columns(medium: 12, class: 'user-nav') do - .user-nav-bar - =link_to (_!current_user.name), register_step_path(@conference.slug, :contact_info), class: 'my-account' - =link_to (_'forms.actions.generic.Log_out'), logout_path = columns(medium: 4, class: 'inner-nav') do = link_to home_path, :class => 'logo' do = svg_sprite('icons', "bb-icon-logo", "Logo") diff --git a/config/locales/en.yml b/config/locales/en.yml index 9c718b6..c27f311 100644 --- a/config/locales/en.yml +++ b/config/locales/en.yml @@ -5355,6 +5355,7 @@ en: food: What are your eating habits? housing: Do you need a place to stay? languages: Which languages do you speak? + preferred_language: What is your preferred language? location: Where are you coming from? name: What is your name? Payment: Payment @@ -5585,6 +5586,14 @@ en: one: You and one other are interested in this workshop other: You and %{count} others are interested in this workshop zero: You are interested in this workshop + user_settings: + headings: + Your_Account: Account Settings + email_subscribe: Notifications + paragraphs: + conference_registration: Looking to register or modify your current registration? + email_subscribe: Would you like to be notified about upcoming conferences? If you have registered for a conference we will always send you notifications and announcements until the conference. + email_subscribe: Subscribe to email announcements section_content: bikebike: about_bikebike: Bike!Bike! is an international annual gathering organized by @@ -5685,6 +5694,8 @@ en: Pre_Register: 'Pre-Register' '500': An_Error_Occurred: An Error Occurred + user_settings: + Your_Account: Your Account links: footer: help_text: @@ -5734,6 +5745,7 @@ en: View: View this workshop View_All: View all workshops conference: + edit_registration: My registration Translate: Edit %{language} version error: '403': diff --git a/config/routes.rb b/config/routes.rb index c75ae6a..d8931a0 100644 --- a/config/routes.rb +++ b/config/routes.rb @@ -47,10 +47,12 @@ BikeBike::Application.routes.draw do get '/confirm/:token' => 'application#confirm', :as => :confirm match '/doconfirm' => 'application#do_confirm', :as => :do_confirm, via: [:get, :post] #post '/doconfirm' => 'application#do_confirm', :as => :do_confirm - match '/logout' => 'application#user_logout', :as => :logout, :via => [:get, :post] + match '/user/logout' => 'application#user_logout', :as => :logout, :via => [:get, :post] + get '/user' => 'application#user_settings', :as => :settings + post '/user/update' => 'application#update_user_settings', :as => :update_settings match '/oauth/callback' => 'oauths#callback', :via => [:get, :post] get '/oauth/:provider' => 'oauths#oauth', :as => :auth_at_provider - post '/translator-request' => 'application#translator_request', :as => :translator_request + # post '/translator-request' => 'application#translator_request', :as => :translator_request # patch '/capture_view' => 'application#capture_view' post '/js_error' => 'application#js_error' diff --git a/db/migrate/20160707034050_add_is_subscribed_to_users.rb b/db/migrate/20160707034050_add_is_subscribed_to_users.rb new file mode 100644 index 0000000..6f9bc20 --- /dev/null +++ b/db/migrate/20160707034050_add_is_subscribed_to_users.rb @@ -0,0 +1,5 @@ +class AddIsSubscribedToUsers < ActiveRecord::Migration + def change + add_column :users, :is_subscribed, :boolean + end +end diff --git a/db/schema.rb b/db/schema.rb index 51c4109..08510f2 100644 --- a/db/schema.rb +++ b/db/schema.rb @@ -11,7 +11,7 @@ # # It's strongly recommended that you check this file into your version control system. -ActiveRecord::Schema.define(version: 20160703044620) do +ActiveRecord::Schema.define(version: 20160707034050) do # These are extensions that must be enabled in order to support this database enable_extension "plpgsql" @@ -328,6 +328,7 @@ ActiveRecord::Schema.define(version: 20160703044620) do t.boolean "is_translator" t.json "languages" t.string "locale" + t.boolean "is_subscribed" end add_index "users", ["activation_token"], name: "index_users_on_activation_token", using: :btree