From d2d35c9a3d7cd12f4fd053b6f4a7d372b57f2983 Mon Sep 17 00:00:00 2001 From: Connor Turland Date: Sat, 11 Mar 2017 21:13:58 -0500 Subject: [PATCH] just keep using current mapinfobox --- app/views/layouts/_templates.html.erb | 47 +++++++++++++++ app/views/layouts/application.html.erb | 8 +-- frontend/src/Metamaps/GlobalUI/ReactApp.js | 6 +- frontend/src/Metamaps/Map/InfoBox.js | 41 ++++--------- .../src/components/MapView/InfoAndHelp.js | 9 +-- frontend/src/components/MapView/MapInfoBox.js | 60 ++++--------------- frontend/src/components/MapView/index.js | 19 +++--- 7 files changed, 95 insertions(+), 95 deletions(-) diff --git a/app/views/layouts/_templates.html.erb b/app/views/layouts/_templates.html.erb index 8bb5fb73..8f894267 100644 --- a/app/views/layouts/_templates.html.erb +++ b/app/views/layouts/_templates.html.erb @@ -4,6 +4,53 @@ #%>
+ + <% end %>
- <%= render :partial => 'layouts/foot' %> diff --git a/frontend/src/Metamaps/GlobalUI/ReactApp.js b/frontend/src/Metamaps/GlobalUI/ReactApp.js index 2b2ab2de..5d9a474a 100644 --- a/frontend/src/Metamaps/GlobalUI/ReactApp.js +++ b/frontend/src/Metamaps/GlobalUI/ReactApp.js @@ -11,7 +11,7 @@ import Active from '../Active' import DataModel from '../DataModel' import { ExploreMaps, ChatView, TopicCard } from '../Views' import Realtime from '../Realtime' -import Map from '../Map' +import Map, { InfoBox } from '../Map' import Topic from '../Topic' import makeRoutes from '../../components/makeRoutes' let routes @@ -73,7 +73,9 @@ const ReactApp = { map: Active.Map, mapIsStarred: self.mapIsStarred, endActiveMap: Map.end, - launchNewMap: Map.launch + launchNewMap: Map.launch, + toggleMapInfoBox: InfoBox.toggleBox, + infoBoxHtml: InfoBox.html // filters } }, diff --git a/frontend/src/Metamaps/Map/InfoBox.js b/frontend/src/Metamaps/Map/InfoBox.js index d5588a57..59f66411 100644 --- a/frontend/src/Metamaps/Map/InfoBox.js +++ b/frontend/src/Metamaps/Map/InfoBox.js @@ -4,12 +4,11 @@ import outdent from 'outdent' import Active from '../Active' import DataModel from '../DataModel' -import GlobalUI from '../GlobalUI' +import GlobalUI, { ReactApp } from '../GlobalUI' import Util from '../Util' const InfoBox = { isOpen: false, - changing: false, selectingPermission: false, changePermissionText: "
As the creator, you can change the permission of this map, and the permission of all the topics and synapses you have authority to change will change as well.
", nameHTML: outdent` @@ -34,12 +33,12 @@ const InfoBox = { data-bip-value="{{desc}}" >{{desc}}`, userImageUrl: '', + html: '', init: function(serverData, updateThumbnail) { var self = InfoBox self.updateThumbnail = updateThumbnail - $('.mapInfoIcon').click(self.toggleBox) $('.mapInfoBox').click(function(event) { event.stopPropagation() }) @@ -47,7 +46,7 @@ const InfoBox = { self.attachEventListeners() - self.generateBoxHTML = Hogan.compile('') + self.generateBoxHTML = Hogan.compile($('#mapInfoBoxTemplate').html()) self.userImageUrl = serverData['user.png'] @@ -71,27 +70,18 @@ const InfoBox = { open: function() { var self = InfoBox $('.mapInfoIcon div').addClass('hide') - if (!self.isOpen && !self.changing) { - self.changing = true - $('.mapInfoBox').fadeIn(200, function() { - self.changing = false - self.isOpen = true - }) - } + $('.mapInfoBox').fadeIn(200, function() { + self.isOpen = true + }) }, close: function() { var self = InfoBox - $('.mapInfoIcon div').removeClass('hide') - if (!self.changing) { - self.changing = true - $('.mapInfoBox').fadeOut(200, function() { - self.changing = false - self.isOpen = false - self.hidePermissionSelect() - $('.mapContributors .tip').hide() - }) - } + $('.mapInfoBox').fadeOut(200, function() { + self.isOpen = false + self.hidePermissionSelect() + $('.mapContributors .tip').hide() + }) }, load: function() { var self = InfoBox @@ -119,13 +109,8 @@ const InfoBox = { obj['created_at'] = map.get('created_at_clean') obj['updated_at'] = map.get('updated_at_clean') - var classes = isCreator ? 'yourMap' : '' - classes += canEdit ? ' canEdit' : '' - classes += shareable ? ' shareable' : '' - $('.mapInfoBox').removeClass('shareable yourMap canEdit') - .addClass(classes) - .html(self.generateBoxHTML.render(obj)) - + self.html = self.generateBoxHTML.render(obj) + ReactApp.render() self.attachEventListeners() }, attachEventListeners: function() { diff --git a/frontend/src/components/MapView/InfoAndHelp.js b/frontend/src/components/MapView/InfoAndHelp.js index dd3df321..3e86c5fd 100644 --- a/frontend/src/components/MapView/InfoAndHelp.js +++ b/frontend/src/components/MapView/InfoAndHelp.js @@ -7,19 +7,20 @@ class InfoAndHelp extends Component { mapIsStarred: PropTypes.bool, currentUser: PropTypes.object, map: PropTypes.object, - infoBoxOpen: PropTypes.bool + onInfoClick: PropTypes.func, + infoBoxhtml: PropTypes.string } render () { - const { mapIsStarred, map, currentUser, infoBoxOpen } = this.props + const { mapIsStarred, map, currentUser, onInfoClick, infoBoxHtml } = this.props const starclassName = mapIsStarred ? 'starred' : '' const tooltip = mapIsStarred ? 'Star' : 'Unstar' return
- {infoBoxOpen && } +
{tooltip}
-
+
Map Info
diff --git a/frontend/src/components/MapView/MapInfoBox.js b/frontend/src/components/MapView/MapInfoBox.js index 96cfd45f..7f64da0f 100644 --- a/frontend/src/components/MapView/MapInfoBox.js +++ b/frontend/src/components/MapView/MapInfoBox.js @@ -3,60 +3,20 @@ import React, { Component, PropTypes } from 'react' class MapInfoBox extends Component { static propTypes = { currentUser: PropTypes.object, - map: PropTypes.object + map: PropTypes.object, + infoBoxHtml: PropTypes.string } render () { - const { currentUser, map } = this.props + const { currentUser, map, infoBoxHtml } = this.props if (!map) return null - - let name, contributors_class, contributor_image, contributor_list, - contributor_count, topic_count, synapse_count, map_creator_tip, - permission, desc, user_name, created_at, updated_at - return
-
Click here to name this map
-
{name}
-
-
- - {contributor_count} -
{contributor_list}
-
-
- {topic_count} -
-
- {synapse_count} -
-
- {map_creator_tip} -
-
-
-
- {desc} -
-
-

Created by: {user_name} on {created_at}

-

Last edited: {updated_at}

-
-
-
-
Update Thumbnail
- Thumb -
-
-
- Delete -
-
-
- Share -
-
-
-
+ const html = {__html: infoBoxHtml} + const isCreator = map.authorizePermissionChange(currentUser) + const canEdit = map.authorizeToEdit(currentUser) + let classes = 'mapInfoBox mapElement mapElementHidden permission ' + classes += isCreator ? 'yourMap' : '' + classes += canEdit ? ' canEdit' : '' + return
} } diff --git a/frontend/src/components/MapView/index.js b/frontend/src/components/MapView/index.js index f9c8d1c3..ef9222e4 100644 --- a/frontend/src/components/MapView/index.js +++ b/frontend/src/components/MapView/index.js @@ -13,15 +13,17 @@ class MapView extends Component { mapId: PropTypes.string, map: PropTypes.object, mapIsStarred: PropTypes.bool, + toggleFilterBox: PropTypes.func, + toggleMapInfoBox: PropTypes.func, + infoBoxHtml: PropTypes.string, currentUser: PropTypes.object, endActiveMap: PropTypes.func, - launchNewMap: PropTypes.func + launchNewMap: PropTypes.func, } constructor(props) { super(props) this.state = { - infoBoxOpen: false, filterBoxOpen: false, chatOpen: false } @@ -34,7 +36,6 @@ class MapView extends Component { endMap() { this.setState({ - infoBoxOpen: false, filterBoxOpen: false, chatOpen: false }) @@ -61,8 +62,8 @@ class MapView extends Component { } render = () => { - const { map, mapIsStarred, currentUser, onOpen, onClose } = this.props - const { infoBoxOpen, filterBoxOpen, chatOpen } = this.state + const { map, mapIsStarred, currentUser, onOpen, onClose, toggleMapInfoBox, toggleFilterBox, infoBoxHtml } = this.props + const { filterBoxOpen, chatOpen } = this.state const onChatOpen = () => { this.setState({chatOpen: true}) onOpen() @@ -73,12 +74,16 @@ class MapView extends Component { } // TODO: stop using {...this.props} and make explicit return
- + - +
} }