From c5907914e3b855d7176d4d279e4e1cfb56e5f409 Mon Sep 17 00:00:00 2001 From: Connor Turland Date: Tue, 4 Nov 2014 12:37:17 -0500 Subject: [PATCH] fixed user images, set up map updates for realtime --- .../javascripts/src/Metamaps.Backbone.js | 52 +++++++++++- app/assets/javascripts/src/Metamaps.js | 83 +++++++++++++++---- app/helpers/users_helper.rb | 2 +- app/models/user.rb | 17 +--- app/views/layouts/_account.html.erb | 2 +- app/views/layouts/_upperelements.html.erb | 4 +- app/views/maps/_mapinfobox.html.erb | 6 +- app/views/shared/_filterBox.html.erb | 2 +- app/views/users/edit.html.erb | 2 +- 9 files changed, 130 insertions(+), 40 deletions(-) diff --git a/app/assets/javascripts/src/Metamaps.Backbone.js b/app/assets/javascripts/src/Metamaps.Backbone.js index f8c89493..7ed0adfe 100644 --- a/app/assets/javascripts/src/Metamaps.Backbone.js +++ b/app/assets/javascripts/src/Metamaps.Backbone.js @@ -5,6 +5,34 @@ Metamaps.Backbone.Map = Backbone.Model.extend({ toJSON: function (options) { return _.omit(this.attributes, this.blacklist); }, + save: function (key, val, options) { + + var attrs; + + // Handle both `"key", value` and `{key: value}` -style arguments. + if (key == null || typeof key === 'object') { + attrs = key; + options = val; + } else { + (attrs = {})[key] = val; + } + + var newOptions = options || {}; + var s = newOptions.success; + + newOptions.success = function (model, response, opt) { + if (s) s(model, response, opt); + model.trigger('saved'); + }; + return Backbone.Model.prototype.save.call(this, attrs, newOptions); + }, + initialize: function () { + this.on('changeByOther', this.updateView); + this.on('saved', this.savedEvent); + }, + savedEvent: function() { + Metamaps.Realtime.sendMapChange(this); + }, authorizeToEdit: function (mapper) { if (mapper && (this.get('permission') === "commons" || this.get('user_id') === mapper.get('id'))) return true; else return false; @@ -24,11 +52,12 @@ Metamaps.Backbone.Map = Backbone.Model.extend({ that.set('topics', new bb.TopicCollection(data.topics)); that.set('synapses', new bb.SynapseCollection(data.synapses)); that.set('mappings', new bb.MappingCollection(data.mappings)); - } + }; - $.ajax({ + var e = $.ajax({ url: "/maps/" + this.id + "/contains.json", success: start, + error: errorFunc, async: false }); }, @@ -75,6 +104,25 @@ Metamaps.Backbone.Map = Backbone.Model.extend({ screenshot: '' }; return obj; + }, + updateView: function() { + var map = Metamaps.Active.Map; + var isActiveMap = this.id === map.id; + var authorized = map && map.authorizeToEdit(Metamaps.Active.Mapper) ? 'canEditMap' : ''; + var commonsMap = map && map.get('permission') === 'commons' ? 'commonsMap' : ''; + if (isActiveMap) { + Metamaps.Map.InfoBox.updateNameDescPerm(this.get('name'), this.get('desc'), this.get('permission')); + this.updateMapWrapper(); + } + }, + updateMapWrapper: function() { + var map = Metamaps.Active.Map; + var isActiveMap = this.id === map.id; + var authorized = map && map.authorizeToEdit(Metamaps.Active.Mapper) ? 'canEditMap' : ''; + var commonsMap = map && map.get('permission') === 'commons' ? 'commonsMap' : ''; + if (isActiveMap) { + $('.wrapper').removeClass('canEditMap commonsMap').addClass(authorized + ' ' + commonsMap); + } } }); Metamaps.Backbone.MapsCollection = Backbone.Collection.extend({ diff --git a/app/assets/javascripts/src/Metamaps.js b/app/assets/javascripts/src/Metamaps.js index 87d6e020..afddbd4d 100644 --- a/app/assets/javascripts/src/Metamaps.js +++ b/app/assets/javascripts/src/Metamaps.js @@ -1835,11 +1835,15 @@ Metamaps.Realtime = { if (Metamaps.Active.Map) { var commonsMap = Metamaps.Active.Map.get('permission') === 'commons'; + var publicMap = Metamaps.Active.Map.get('permission') === 'public'; if (commonsMap) { self.turnOn(); self.setupSocket(); } + else if (publicMap) { + self.attachMapListener(); + } } }, endActiveMap: function () { @@ -1872,11 +1876,11 @@ Metamaps.Realtime = { $(".collabCompass").show(); } }, - turnOff: function () { + turnOff: function (silent) { var self = Metamaps.Realtime; if (self.status) { - self.sendRealtimeOff(); + if (!silent) self.sendRealtimeOff(); $(".rtMapperSelf").removeClass('littleRtOn').addClass('littleRtOff'); self.status = false; $(".sidebarCollaborateIcon").removeClass("blue"); @@ -1934,7 +1938,7 @@ Metamaps.Realtime = { socket.on('topicChangeFromServer', self.topicChange); socket.on('synapseChangeFromServer', self.synapseChange); - socket.on('mapChangeFromServer', self.mapChange); + self.attachMapListener(); // local event listeners that trigger events var sendCoords = function (event, coords) { @@ -1993,6 +1997,12 @@ Metamaps.Realtime = { $(document).on(Metamaps.JIT.events.removeSynapse, sendRemoveSynapse); }, + attachMapListener: function(){ + var self = Metamaps.Realtime; + var socket = Metamaps.Realtime.socket; + + socket.on('mapChangeFromServer', self.mapChange); + }, sendRealtimeOn: function () { var self = Metamaps.Realtime; var socket = Metamaps.Realtime.socket; @@ -2334,18 +2344,32 @@ Metamaps.Realtime = { socket.emit('mapChangeFromClient', data); }, mapChange: function (data) { - /*var map = Metamaps.Topics.get(data.topicId); - if (map) { - var node = topic.get('node'); - topic.fetch({ - success: function (model) { - // must be set using silent:true otherwise - // will trigger a change event and an infinite - // loop with other clients of change events - model.set({ node: node }); + var map = Metamaps.Active.Map; + var isActiveMap = map && data.mapId === map.id; + if (isActiveMap) { + var permBefore = map.get('permission'); + var idBefore = map.id; + map.fetch({ + success: function (model, response) { + + var idNow = model.id; + var permNow = model.get('permission'); + if (idNow !== idBefore) { + Metamaps.Map.leavePrivateMap(); // this means the map has been changed to private + } + else if (permNow === 'public' && permBefore === 'commons') { + Metamaps.Map.commonsToPublic(); + } + else if (permNow === 'commons' && permBefore === 'public') { + Metamaps.Map.publicToCommons(); + } + else { + model.fetchContained(); + model.trigger('changeByOther'); + } } }); - }*/ + } }, // newTopic sendNewTopic: function (data) { @@ -4084,6 +4108,26 @@ Metamaps.Map = { Metamaps.GlobalUI.CreateMap.topicsToMap = nodes_data; Metamaps.GlobalUI.CreateMap.synapsesToMap = synapses_data; }, + leavePrivateMap: function(){ + var map = Metamaps.Active.Map; + Metamaps.Maps.Active.remove(map); + Metamaps.Maps.Featured.remove(map); + Metamaps.Router.home(); + Metamaps.GlobalUI.notifyUser('Sorry! That map has been changed to Private.'); + }, + commonsToPublic: function(){ + Metamaps.Realtime.turnOff(true); // true is for 'silence' + Metamaps.GlobalUI.notifyUser('Map was changed to Public. Editing is disabled.'); + Metamaps.Active.Map.trigger('changeByOther'); + }, + publicToCommons: function(){ + var confirmString = "This map permission has been changed to Commons! "; + confirmString += "Do you want to reload and enable realtime collaboration?"; + var c = confirm(confirmString); + if (c) { + Metamaps.Router.maps(Metamaps.Active.Map.id); + } + }, editedByActiveMapper: function () { if (Metamaps.Active.Mapper) { Metamaps.Mappers.add(Metamaps.Active.Mapper); @@ -4292,11 +4336,16 @@ Metamaps.Map.InfoBox = { $('.mapInfoName .best_in_place_name').unbind("ajax:success").bind("ajax:success", function () { var name = $(this).html(); - $('.mapName').html(name); Metamaps.Active.Map.set('name', name); Metamaps.Active.Map.trigger('saved'); }); + $('.mapInfoDesc .best_in_place_desc').unbind("ajax:success").bind("ajax:success", function () { + var desc = $(this).html(); + Metamaps.Active.Map.set('desc', desc); + Metamaps.Active.Map.trigger('saved'); + }); + $('.yourMap .mapPermission').unbind().click(self.onPermissionClick); // .yourMap in the unbind/bind is just a namespace for the events // not a reference to the class .yourMap on the .mapInfoBox @@ -4304,6 +4353,11 @@ Metamaps.Map.InfoBox = { $('.yourMap .mapInfoDelete').unbind().click(self.deleteActiveMap); }, + updateNameDescPerm: function(name, desc, perm) { + $('.mapInfoName .best_in_place_name').html(name); + $('.mapInfoDesc .best_in_place_desc').html(desc); + $('.mapInfoBox .mapPermission').removeClass('commons public private').addClass(perm); + }, createContributorList: function () { var self = Metamaps.Map.InfoBox; @@ -4364,6 +4418,7 @@ Metamaps.Map.InfoBox = { Metamaps.Active.Map.save({ permission: permission }); + Metamaps.Active.Map.updateMapWrapper(); shareable = permission === 'private' ? '' : 'shareable'; $('.mapPermission').removeClass('commons public private minimize').addClass(permission); $('.mapPermission .permissionSelect').remove(); diff --git a/app/helpers/users_helper.rb b/app/helpers/users_helper.rb index 27d6f8e7..097ecdfb 100644 --- a/app/helpers/users_helper.rb +++ b/app/helpers/users_helper.rb @@ -8,7 +8,7 @@ module UsersHelper user['id'] = u.id user['label'] = u.name user['value'] = u.name - user['profile'] = u.image.url(:thumb) + user['profile'] = u.image.url(:square) user['mapCount'] = u.maps.count user['created_at'] = u.created_at.strftime("%m/%d/%Y") user['rtype'] = "mapper" diff --git a/app/models/user.rb b/app/models/user.rb index adea25db..f0c1345f 100644 --- a/app/models/user.rb +++ b/app/models/user.rb @@ -37,30 +37,17 @@ class User < ActiveRecord::Base # This method associates the attribute ":image" with a file attachment has_attached_file :image, :styles => { - :thumb => ['100x100>', :png], - :square => ['200x200#', :png], - :round => ['200x200#', :png] + :square => ['84x84#', :png] }, :default_url => "/assets/user.png" - #, :convert_options => {:round => Proc.new{self.convert_options}} - # Validate the attached image is image/jpg, image/png, etc validates_attachment_content_type :image, :content_type => /\Aimage\/.*\Z/ - - def self.convert_options - trans = '' - trans << ' ( +clone -alpha extract ' - trans << '-draw "fill black polygon 0,0 0,100 100,0 fill white circle 100,100 100,0" ' - trans << '( +clone -flip ) -compose multiply -composite ' - trans << '( +clone -flop ) -compose multiply -composite ' - trans << ') -alpha off -compose copy_opacity -composite ' - end def as_json(options={}) { :id => self.id, :name => self.name, - :image => self.image.url + :image => self.image.url(:square) } end diff --git a/app/views/layouts/_account.html.erb b/app/views/layouts/_account.html.erb index ffe69b7e..b48cde3d 100644 --- a/app/views/layouts/_account.html.erb +++ b/app/views/layouts/_account.html.erb @@ -5,7 +5,7 @@ <% if authenticated? %> <% account = current_user %> - <%= image_tag user.image.url(:thumb), :size => "48x48", :class => "sidebarAccountImage" %> + <%= image_tag user.image.url(:square), :size => "48x48", :class => "sidebarAccountImage" %>

<%= account.name.split[0...1][0] %>