From a7328526a8ec010a4510e193654361e81faf4357 Mon Sep 17 00:00:00 2001 From: Connor Turland Date: Tue, 21 Oct 2014 20:31:59 -0400 Subject: [PATCH] got profile picture uploading working, as well as profile picture removing, as well as password changing --- UbuntuInstallation.md | 14 +- app/assets/javascripts/src/Metamaps.js | 53 +++++- app/assets/stylesheets/application.css | 188 ++++++++++++++-------- app/controllers/application_controller.rb | 6 +- app/controllers/users_controller.rb | 48 +++++- app/models/user.rb | 10 ++ app/views/users/edit.html.erb | 22 ++- realtime/npm-debug.log | 22 --- 8 files changed, 258 insertions(+), 105 deletions(-) delete mode 100644 realtime/npm-debug.log diff --git a/UbuntuInstallation.md b/UbuntuInstallation.md index 0e1e8ebb..f5292f58 100644 --- a/UbuntuInstallation.md +++ b/UbuntuInstallation.md @@ -72,6 +72,9 @@ now there is a couple other things we are going to need which is phantomjs, node sudo apt-get install redis-server +Furthermore, if you want to be able to work on profile picture uploading, or use it +you'll need ImageMagick. On Ubuntu, you can just go find ImageMagick in the Ubuntu Software Centre + Install the specific version of ruby needed this will take some time rvm install ruby-2.1.3 @@ -110,12 +113,19 @@ Execute the server: rails s -and dont forget to run realtime too open a new terminal - +and dont forget to run the two other servers, for sidekiq, and realtime... +open a new terminal navigate to ./realtime and run + sudo apt-get install npm + npm install nodejs realtime-server.js +open a new terminal +navigate to the main directory and run + + sidekiq + Now you're all set enjoy your personal server of metamaps :) Navigate your browser to localhost:3000 once you have the server running diff --git a/app/assets/javascripts/src/Metamaps.js b/app/assets/javascripts/src/Metamaps.js index 74974814..734efdb5 100644 --- a/app/assets/javascripts/src/Metamaps.js +++ b/app/assets/javascripts/src/Metamaps.js @@ -3962,10 +3962,61 @@ Metamaps.Map.InfoBox = { * */ Metamaps.Account = { + listenersInitialized: false, init: function () { var self = Metamaps.Account; - + + }, + initListeners: function(){ + var self = Metamaps.Account; + + $('#user_image').change(self.showImagePreview); + self.listenersInitialized = true; + }, + toggleChangePicture: function(){ + var self = Metamaps.Account; + + $('.userImageMenu').toggle(); + if (!self.listenersInitialized) self.initListeners(); + }, + openChangePicture: function(){ + var self = Metamaps.Account; + + $('.userImageMenu').show(); + if (!self.listenersInitialized) self.initListeners(); + }, + closeChangePicture: function(){ + var self = Metamaps.Account; + + $('.userImageMenu').hide(); + }, + showImagePreview: function(){ + var self = Metamaps.Account; + + var file = $('#user_image')[0].files[0]; + + var reader = new FileReader(); + + reader.onload = function(e) { + $('.userImageDiv img').attr('src', reader.result); + }; + + if (file) { + reader.readAsDataURL(file); + $('.userImageMenu').hide(); + $('#remove_image').val('0'); + } + }, + removePicture: function(){ + var self = Metamaps.Account; + + $('.userImage img').attr('src', '/assets/user.png'); + $('.userImageMenu').hide(); + + var input = $('#user_image'); + input.replaceWith(input.val('').clone(true)); + $('#remove_image').val('1'); }, changeName: function(){ $('.accountName').hide(); diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css index c6002195..bffeed66 100644 --- a/app/assets/stylesheets/application.css +++ b/app/assets/stylesheets/application.css @@ -76,73 +76,6 @@ body, .wrapper.mapPage { overflow: hidden; } -/* scrollbar override */ - -.mCS_no_scrollbar { - padding-right: 0px !important; -} -.mCSB_container { - margin-right: 15px !important; -} -/* forgot password fix */ - -.forgotPassword input[type="submit"] { - width: 300px; - color: #f5f5f5; - font-family: din-regular; - top: 118px; - position: absolute; -} - -.new_user input[type="submit"] { - width: 96px; - padding: 0px; - font-family: din-regular; - text-transform: uppercase; - color: #f5f5f5; - margin-top:16px; - float: right; -} - -.login input[type="submit"]{ - width:84px; - margin-top: 16px; - font-family: din-regular; - text-transform: uppercase; -} - -.edit_user input[type="submit"]{ - width: 96px; - padding: 0px; - font-family: din-regular; - text-transform: uppercase; - color: #f5f5f5; - margin-top:16px; - float: right; -} - -.edit_user .userImage { - width: 84px; - margin: 0 auto; - position: relative; - margin-top: 32px; -} -.edit_user .userImage img { - border-radius: 42px; -} -.edit_user .editPhoto { - display: none; - width: 40px; - height: 40px; - background-image: url(photo.png); - position: absolute; - top: 22px; - left: 22px; - cursor: pointer; -} -.edit_user .userImage:hover .editPhoto { - display: block; -} html { @@ -310,6 +243,127 @@ input[type="submit"]:active { line-height: 18px; } +/* forgot password fix */ + +.forgotPassword input[type="submit"] { + width: 300px; + color: #f5f5f5; + font-family: din-regular; + top: 118px; + position: absolute; +} + +.new_user input[type="submit"] { + width: 96px; + padding: 0px; + font-family: din-regular; + text-transform: uppercase; + color: #f5f5f5; + margin-top:16px; + float: right; +} + +.login input[type="submit"]{ + width:84px; + margin-top: 16px; + font-family: din-regular; + text-transform: uppercase; +} + +.edit_user input[type="submit"]{ + width: 96px; + padding: 0px; + font-family: din-regular; + text-transform: uppercase; + color: #f5f5f5; + margin-top:16px; + float: right; +} + +.edit_user .userImage { + width: 84px; + margin: 0 auto; + position: relative; + margin-top: 32px; + cursor: pointer; +} +.edit_user .userImage img { + border-radius: 42px; +} +.edit_user .editPhoto { + display: none; + width: 40px; + height: 40px; + background-image: url(photo.png); + position: absolute; + top: 22px; + left: 22px; +} +.edit_user .userImageDiv:hover .editPhoto { + display: block; +} +.userImageMenu { + position: absolute; + top: 88px; + left: -18px; + display: none; +} +.userMenuArrow { + border-color: transparent; + border-bottom-color: #202020; + border-style: dashed dashed solid; + border-width: 0 8px 8px; + display: block; + position: absolute; + left: 52px; + top: 0px; + z-index: 1; + height: 0; + width: 0; +} +.userImageMenu ul { + background: #202020; + list-style: none; + text-align: center; + font-size: 14px; + line-height: 14px; + color: #FFFFFF; + width: 120px; + border-radius: 2px; + position: absolute; + top: 8px; + overflow: hidden; + z-index: 1; +} +.userImageMenu li { + height:14px; + padding: 5px 0; + position: relative; +} +.userImageMenu li:hover { + background-color: #757575; +} +.edit_user #user_image { + width: 120px; + height: 24px; + position: absolute; + top: 0; + left: 0; + opacity: 0; + cursor: pointer; +} +.edit_user .upload label { + width: 120px; + height: 24px; + position: absolute; + top: 0; + left: 0; + opacity: 0; + cursor: pointer; + margin: 0; + padding: 0; +} + .edit_user label.firstFieldText { padding-top: 8px; } diff --git a/app/controllers/application_controller.rb b/app/controllers/application_controller.rb index bd95bd64..511ab723 100644 --- a/app/controllers/application_controller.rb +++ b/app/controllers/application_controller.rb @@ -24,16 +24,14 @@ private def require_no_user if authenticated? - flash[:warning] = "You must be logged out." - store and redirect_to edit_user_path(user) + redirect_to edit_user_path(user), notice: "You must be logged out." return false end end def require_user unless authenticated? - flash[:warning] = "You must be logged in." - store_location and redirect_to new_user_session_path + redirect_to new_user_session_path, notice: "You must be logged in." return false end end diff --git a/app/controllers/users_controller.rb b/app/controllers/users_controller.rb index 26085e6b..a8989bc6 100644 --- a/app/controllers/users_controller.rb +++ b/app/controllers/users_controller.rb @@ -21,13 +21,49 @@ class UsersController < ApplicationController # PUT /users/:id def update @user = current_user - @user.attributes = params[:user] - - @user.save - sign_in(@user, :bypass => true) - - respond_with(@user, location: session[:previous_url]) do |format| + if params[:user][:password] == "" && params[:user][:password_confirmation] == "" + # not trying to change the password + if @user.update_attributes(params[:user]) + if params[:remove_image] == "1" + @user.image = nil + end + @user.save + sign_in(@user, :bypass => true) + respond_to do |format| + format.html { redirect_to root_url, notice: "Account updated!" } + end + else + sign_in(@user, :bypass => true) + respond_to do |format| + format.html { redirect_to edit_user_path(@user), notice: @user.errors.to_a[0] } + end + end + else + # trying to change the password + correct_pass = @user.valid_password?(params[:current_password]) + + if correct_pass && @user.update_attributes(params[:user]) + if params[:remove_image] == "1" + @user.image = nil + end + @user.save + sign_in(@user, :bypass => true) + respond_to do |format| + format.html { redirect_to root_url, notice: "Account updated!" } + end + else + respond_to do |format| + if correct_pass + u = User.find(@user.id) + sign_in(u, :bypass => true) + format.html { redirect_to edit_user_path(@user), notice: @user.errors.to_a[0] } + else + sign_in(@user, :bypass => true) + format.html { redirect_to edit_user_path(@user), notice: "Incorrect current password" } + end + end + end end end diff --git a/app/models/user.rb b/app/models/user.rb index 9ec41cab..5cecdbc8 100644 --- a/app/models/user.rb +++ b/app/models/user.rb @@ -15,6 +15,16 @@ class User < ActiveRecord::Base serialize :settings, UserPreference + validates :password, :presence => true, + :length => { :within => 8..40 }, + :on => :create + validates :password, :length => { :within => 8..40 }, + :allow_blank => true, + :on => :update + validates_confirmation_of :password + + validates_presence_of :name # done by devise + validates_presence_of :email # done by devise validates_uniqueness_of :name # done by devise validates_uniqueness_of :email # done by devise diff --git a/app/views/users/edit.html.erb b/app/views/users/edit.html.erb index 069a28a4..9b963045 100644 --- a/app/views/users/edit.html.erb +++ b/app/views/users/edit.html.erb @@ -6,11 +6,27 @@ <% content_for :title, @user.name + "'s Settings | Metamaps" %>
-<%= form_for @user, url: user_url, :html =>{ :class => "edit_user centerGreyForm"} do |form| %> +<%= form_for @user, url: user_url, :html =>{ :multipart => true, :class => "edit_user centerGreyForm"} do |form| %>

Edit Account

- <%= image_tag @user.image.url(:round), :size => "84x84" %> -
+
+ <%= image_tag @user.image.url(:round), :size => "84x84" %> +
+
+
+
+
    +
  • + Upload Photo + <%= hidden_field_tag "remove_image", "0" %> + <%= form.file_field :image %> + <%= form.label :image %> +
    • +
  • Remove
    • +
  • Cancel
    • +
+
+
<%= @user.name %>
diff --git a/realtime/npm-debug.log b/realtime/npm-debug.log deleted file mode 100644 index ca2096d2..00000000 --- a/realtime/npm-debug.log +++ /dev/null @@ -1,22 +0,0 @@ -0 info it worked if it ends with ok -1 verbose cli [ '/usr/bin/node', '/usr/bin/npm', 'install' ] -2 info using npm@1.4.28 -3 info using node@v0.10.32 -4 verbose node symlink /usr/bin/node -5 error install Couldn't read dependencies -6 error Failed to parse json -6 error Unexpected token } -7 error File: /home/sandra/metamaps_gen002/realtime/package.json -8 error Failed to parse package.json data. -8 error package.json must be actual JSON, not just JavaScript. -8 error -8 error This is not a bug in npm. -8 error Tell the package author to fix their package.json file. JSON.parse -9 error System Linux 3.13.0-36-generic -10 error command "/usr/bin/node" "/usr/bin/npm" "install" -11 error cwd /home/sandra/metamaps_gen002/realtime -12 error node -v v0.10.32 -13 error npm -v 1.4.28 -14 error file /home/sandra/metamaps_gen002/realtime/package.json -15 error code EJSONPARSE -16 verbose exit [ 1, true ]