glenux-contrib/metamaps--metamaps
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

access maps that are live

Browse source
This commit is contained in:
Connor Turland 2016-08-24 01:39:31 +00:00 committed by Devin Howard
parent 97c118a20b
commit a2f3194b4b
11 changed files with 94 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
app/assets/stylesheets/clean.css.erb
View file

@ -751,6 +751,10 @@
background-image: url(<%= asset_data_uri 'exploremaps_sprite.png' %>);
background-position: 0 0;
}
.exploreMapsCenter .liveMaps .exploreMapsIcon {
background-image: url(<%= asset_data_uri 'exploremaps_sprite.png' %>);
background-position: -32px 0;
}
.exploreMapsCenter .featuredMaps .exploreMapsIcon {
background-image: url(<%= asset_data_uri 'exploremaps_sprite.png' %>);
background-position: -96px 0;
@ -774,12 +778,20 @@
.sharedMaps:hover .exploreMapsIcon, .sharedMaps.active .exploreMapsIcon {
background-position: -128px -32px;
}
.liveMaps:hover .exploreMapsIcon, .liveMaps.active .exploreMapsIcon {
background-position: -32px -32px;
}
.mapsWrapper {
/*overflow-y: auto; */
padding: 32px 32px 56px 32px;
}
.noMaps {
text-align: center;
padding-top: 40px;
}
/* end explore maps */
/* instructions */

9
app/controllers/explore_controller.rb
View file

@ -61,6 +61,15 @@ class ExploreController < ApplicationController
end
end
# GET /explore/live
def live
@maps = map_scope(Map)
respond_to do |format|
format.html
end
end
# GET /explore/mapper/:id
def mapper
@user = User.find(params[:id])

12
app/views/maps/livemaps.html.erb Normal file
View file

@ -0,0 +1,12 @@
<% #
# @file
# Shows a list of current user's maps
# GET /explore/mine(.:format)
# %>
<script>
Metamaps.currentSection = "explore";
Metamaps.currentPage = "live";
<% content_for :title, "Explore Live Maps | Metamaps" %>
<% content_for :mobile_title, "Live Maps" %>
</script>

1
config/routes.rb
View file

@ -11,6 +11,7 @@ Metamaps::Application.routes.draw do
get 'mine'
get 'shared'
get 'starred'
get 'live'
get 'mapper/:id', action: 'mapper'
end

1
frontend/src/Metamaps/GlobalUI/index.js
View file

@ -54,6 +54,7 @@ const GlobalUI = {
Metamaps.Maps.Mapper = new Metamaps.Backbone.MapsCollection(mapperCollection, mapperOptionsObj)
Metamaps.Maps.Featured = new Metamaps.Backbone.MapsCollection(featuredCollection, { id: 'featured', sortBy: 'updated_at' })
Metamaps.Maps.Active = new Metamaps.Backbone.MapsCollection(activeCollection, { id: 'active', sortBy: 'updated_at' })
Metamaps.Maps.Live = new Metamaps.Backbone.MapsCollection([], { id: 'live', sortBy: 'name' })
},
showDiv: function (selector) {
$(selector).show()

17
frontend/src/Metamaps/Realtime.js
View file

@ -48,6 +48,7 @@ const Realtime = {
console.log('connected')
if (!self.disconnected) {
self.startActiveMap()
self.subscribeToLiveMaps()
} else self.disconnected = false
})
self.socket.on('disconnect', function () {
@ -101,6 +102,21 @@ const Realtime = {
$('body').prepend(self.room.chat.$container)
} // if Active.Mapper
},
subscribeToLiveMaps: function () {
var self = Metamaps.Realtime
// Handles livemaps array on the UI
self.socket.emit('requestLiveMaps')
self.socket.on('receiveLiveMaps', function (maps) {
Metamaps.Maps.Live.add(maps)
})
self.socket.on('map_went_live', function (map) {
Metamaps.Maps.Live.add(map)
})
self.socket.on('map_no_longer_live', function (data) {
var map = Metamaps.Maps.Live.get(data.id)
Metamaps.Maps.Live.remove(map)
})
},
addJuntoListeners: function () {
var self = Realtime
@ -488,6 +504,7 @@ const Realtime = {
username: Active.Mapper.get('name'),
userimage: Active.Mapper.get('image'),
mapid: Active.Map.id
map: Active.Map.attributes
})
socket.on(myId + '-' + Active.Map.id + '-invitedToCall', self.invitedToCall) // new call

5
frontend/src/Metamaps/Router.js
View file

@ -84,7 +84,8 @@ const _Router = Backbone.Router.extend({
// either 'featured', 'mapper', or 'active'
var capitalize = section.charAt(0).toUpperCase() + section.slice(1)
if (section === 'shared' || section === 'featured' || section === 'active' || section === 'starred') {
const sections = ['shared', 'featured', 'active', 'starred', 'live']
if (sections.indexOf(section) !== -1) {
document.title = 'Explore ' + capitalize + ' Maps | Metamaps'
} else if (section === 'mapper') {
$.ajax({
@ -131,7 +132,7 @@ const _Router = Backbone.Router.extend({
var navigateTimeout = function () {
self.timeoutId = setTimeout(navigate, 300)
}
if (Metamaps.Maps[capitalize].length === 0) {
if (section !== 'live' && Metamaps.Maps[capitalize].length === 0) {
Metamaps.Loading.show()
setTimeout(function () {
Metamaps.Maps[capitalize].getMaps(navigate) // this will trigger an explore maps render

9
frontend/src/components/Header.js
View file

@ -28,7 +28,7 @@ class Header extends Component {
return forClass
}
const explore = section == "mine" || section == "active" || section == "starred" || section == "shared" || section == "featured"
const explore = ["mine", "active", "starred", "shared", "featured", "live"].includes(section)
const mapper = section == "mapper"
return (
@ -67,6 +67,13 @@ class Header extends Component {
text="Featured Maps"
/>
<MapLink show={explore}
href="/explore/live"
linkClass={activeClass("live")}
data-router="true"
text="Live Maps"
/>
{mapper ? (
<div className='exploreMapsButton active mapperButton'>
<img className='exploreMapperImage' width='24' height='24' src={this.props.user.image} />

7
frontend/src/components/Maps.js
View file

@ -9,7 +9,10 @@ class Maps extends Component {
const { maps, currentUser, section, displayStyle, user, moreToLoad, loadMore } = this.props
let mapElements
if (displayStyle == 'grid') {
if (maps.models.length === 0) {
mapElements = <div className='noMaps'>There are no maps to see here.</div>
}
else if (displayStyle == 'grid') {
mapElements = maps.models.map(function (map) {
return <MapCard key={ map.id } map={ map } currentUser={ currentUser } />
})
@ -28,7 +31,7 @@ class Maps extends Component {
{ currentUser && !user ? <div className="map newMap"><a href="/maps/new"><div className="newMapImage"></div><span>Create new map...</span></a></div> : null }
{ mapElements }
<div className='clearfloat'></div>
{ moreToLoad ?
{ moreToLoad && section !== 'live' ?
[<button className="button loadMore" onClick={ loadMore }>load more</button>, <div className='clearfloat'></div>]
: null }
</div>

25
realtime/realtime-server.js
View file

@ -3,14 +3,19 @@ var
signalServer = require('./signal'),
stunservers = [{"url": "stun:stun.l.google.com:19302"}];
io.set('log', false);
//io.set('log', false);
function start() {
var livemaps = {}
signalServer(io, stunservers);
io.on('connection', function (socket) {
socket.on('requestLiveMaps', function () {
var maps = Object.keys(livemaps).map(function(key) { return livemaps[key] })
socket.emit('receiveLiveMaps', maps)
})
// this will ping a new person with awareness of who's already on the map
socket.on('updateNewMapperList', function (data) {
var existingUser = {
@ -56,6 +61,16 @@ function start() {
// this will ping everyone on a map that there's a person just joined the map
socket.on('newMapperNotify', function (data) {
if (!livemaps[data.mapid] && data.map.permission === 'commons') {
livemaps[data.mapid] = data.map // { name: '', desc: '', numTopics: '' }
livemaps[data.mapid].mapper_count = 1
io.sockets.emit('map_went_live', livemaps[data.mapid])
}
else if (data.map.permission === 'commons') {
livemaps[data.mapid].mapper_count++
}
socket.set('mapid', data.mapid);
socket.set('userid', data.userid);
socket.set('username', data.username);
@ -70,6 +85,7 @@ function start() {
});
var end = function () {
var socketUserName, socketUserID;
socket.get('userid', function (err, id) {
socketUserID = id;
@ -82,6 +98,13 @@ function start() {
userid: socketUserID
};
socket.get('mapid', function (err, mapid) {
if (livemaps[mapid] && livemaps[mapid].mapper_count == 1) {
delete livemaps[mapid]
io.sockets.emit('map_no_longer_live', { id: mapid })
}
else if (livemaps[mapid]) {
livemaps[mapid].mapper_count--
}
socket.broadcast.emit('maps-' + mapid + '-lostmapper', data);
});
};