From ec2d00e26d0888ef6bbbfefc7b95b029b8590806 Mon Sep 17 00:00:00 2001
From: Connor Turland <connorturland@gmail.com>
Date: Wed, 22 Mar 2017 17:20:50 +0000
Subject: [PATCH] simplify views/topiccard
---
frontend/src/Metamaps/DataModel/Topic.js | 16 +-------
frontend/src/Metamaps/GlobalUI/ReactApp.js | 9 +++--
frontend/src/Metamaps/Import.js | 2 +-
frontend/src/Metamaps/JIT.js | 4 +-
frontend/src/Metamaps/Topic.js | 14 +++++++
frontend/src/Metamaps/Views/TopicCard.js | 46 +++-------------------
frontend/src/Metamaps/Views/index.js | 1 -
frontend/src/components/TopicCard/Links.js | 4 +-
frontend/src/components/TopicCard/index.js | 2 +-
9 files changed, 31 insertions(+), 67 deletions(-)
diff --git a/frontend/src/Metamaps/DataModel/Topic.js b/frontend/src/Metamaps/DataModel/Topic.js
index e8025a7d..10acc5b1 100644
--- a/frontend/src/Metamaps/DataModel/Topic.js
+++ b/frontend/src/Metamaps/DataModel/Topic.js
@@ -93,25 +93,11 @@ const Topic = Backbone.Model.extend({
return node
},
- updateViews: function() {
- var onPageWithTopicCard = Active.Map || Active.Topic
- var node = this.get('node')
- // update topic card, if this topic is the one open there
- if (onPageWithTopicCard && this === TopicCard.openTopicCard) {
- TopicCard.showCard(node)
- }
-
- // update the node on the map
- if (onPageWithTopicCard && node) {
- node.name = this.get('name')
- Visualize.mGraph.plot()
- }
- },
updateCardView: function() {
var onPageWithTopicCard = Active.Map || Active.Topic
var node = this.get('node')
// update topic card, if this topic is the one open there
- if (onPageWithTopicCard && this === TopicCard.openTopicCard) {
+ if (onPageWithTopicCard && this === TopicCard.openTopic) {
TopicCard.showCard(node)
}
},
diff --git a/frontend/src/Metamaps/GlobalUI/ReactApp.js b/frontend/src/Metamaps/GlobalUI/ReactApp.js
index 75e4ed8b..db850091 100644
--- a/frontend/src/Metamaps/GlobalUI/ReactApp.js
+++ b/frontend/src/Metamaps/GlobalUI/ReactApp.js
@@ -35,12 +35,14 @@ const ReactApp = {
mobile: false,
mobileTitle: '',
mobileTitleWidth: 0,
+ metacodeSets: [],
init: function(serverData, openLightbox) {
const self = ReactApp
self.serverData = serverData
self.unreadNotificationsCount = serverData.unreadNotificationsCount
self.mobileTitle = serverData.mobileTitle
self.openLightbox = openLightbox
+ self.metacodeSets = serverData.metacodeSets
routes = makeRoutes(serverData.ActiveMapper)
self.resize()
window && window.addEventListener('resize', self.resize)
@@ -148,10 +150,9 @@ const ReactApp = {
const self = ReactApp
return {
openTopic: TopicCard.openTopic,
- metacodeSets: TopicCard.metacodeSets,
- updateTopic: TopicCard.updateTopic,
- onTopicFollow: TopicCard.onTopicFollow,
- redrawCanvas: () => Visualize.mGraph.plot()
+ metacodeSets: self.metacodeSets,
+ updateTopic: (topic, obj) => topic.save(obj),
+ onTopicFollow: Topic.onTopicFollow
}
},
getTopicProps: function() {
diff --git a/frontend/src/Metamaps/Import.js b/frontend/src/Metamaps/Import.js
index 9b90b993..54e256b2 100644
--- a/frontend/src/Metamaps/Import.js
+++ b/frontend/src/Metamaps/Import.js
@@ -375,7 +375,7 @@ const Import = {
url
}, function success(data, textStatus) {
if (typeof data === 'string' && data.trim() === '') return
- var selector = '#showcard #topic_' + topic.get('id') + ' .best_in_place'
+ var selector = '.showcard #topic_' + topic.get('id') + ' .best_in_place'
if ($(selector).find('form').length > 0) {
$(selector).find('textarea, input').val(data.title)
} else {
diff --git a/frontend/src/Metamaps/JIT.js b/frontend/src/Metamaps/JIT.js
index 8100ebfe..ffaab923 100644
--- a/frontend/src/Metamaps/JIT.js
+++ b/frontend/src/Metamaps/JIT.js
@@ -15,7 +15,7 @@ import Control from './Control'
import Create from './Create'
import DataModel from './DataModel'
import Filter from './Filter'
-import GlobalUI from './GlobalUI'
+import GlobalUI, { ReactApp } from './GlobalUI'
import Map from './Map'
import Mouse from './Mouse'
import Selected from './Selected'
@@ -1468,7 +1468,7 @@ const JIT = {
}
$(rightclickmenu).remove()
},
- metacodeSets: TopicCard.metacodeSets
+ metacodeSets: ReactApp.metacodeSets
}),
document.getElementById('metacodeOptionsWrapper')
)
diff --git a/frontend/src/Metamaps/Topic.js b/frontend/src/Metamaps/Topic.js
index 49b27253..0054ad55 100644
--- a/frontend/src/Metamaps/Topic.js
+++ b/frontend/src/Metamaps/Topic.js
@@ -86,6 +86,20 @@ const Topic = {
Active.Topic = DataModel.Topics.get(nodeid)
}
},
+ onTopicFollow: topic => {
+ const isFollowing = topic.isFollowedBy(Active.Mapper)
+ $.post({
+ url: `/topics/${topic.id}/${isFollowing ? 'un' : ''}follow`
+ })
+ if (isFollowing) {
+ GlobalUI.notifyUser('You are no longer following this topic')
+ Active.Mapper.unfollowTopic(topic.id)
+ } else {
+ GlobalUI.notifyUser('You are now following this topic')
+ Active.Mapper.followTopic(topic.id)
+ }
+ ReactApp.render()
+ },
fetchRelatives: function(nodes, metacodeId) {
var self = this
diff --git a/frontend/src/Metamaps/Views/TopicCard.js b/frontend/src/Metamaps/Views/TopicCard.js
index 670ce762..943869e9 100644
--- a/frontend/src/Metamaps/Views/TopicCard.js
+++ b/frontend/src/Metamaps/Views/TopicCard.js
@@ -1,48 +1,14 @@
-/* global $ */
-
-import Active from '../Active'
-import Visualize from '../Visualize'
-import GlobalUI, { ReactApp } from '../GlobalUI'
+import { ReactApp } from '../GlobalUI'
const TopicCard = {
- openTopic: null, // stores the topic that's currently open
- metacodeSets: [],
- init: function(serverData) {
- const self = TopicCard
- self.metacodeSets = serverData.metacodeSets
- },
- onTopicFollow: topic => {
- const self = TopicCard
- const isFollowing = topic.isFollowedBy(Active.Mapper)
- $.post({
- url: `/topics/${topic.id}/${isFollowing ? 'un' : ''}follow`
- })
- if (isFollowing) {
- GlobalUI.notifyUser('You are no longer following this topic')
- Active.Mapper.unfollowTopic(topic.id)
- } else {
- GlobalUI.notifyUser('You are now following this topic')
- Active.Mapper.followTopic(topic.id)
- }
- self.render()
- },
- updateTopic: (topic, obj) => {
- const self = TopicCard
- topic.save(obj, { success: self.render })
- },
- render: function() {
+ openTopic: null,
+ showCard: function(node) {
+ TopicCard.openTopic = node.getData('topic')
ReactApp.render()
},
- showCard: function(node, opts = {}) {
- var self = TopicCard
- var topic = node.getData('topic')
- self.openTopic = topic
- self.render()
- },
hideCard: function() {
- var self = TopicCard
- self.openTopic = null
- self.render()
+ TopicCard.openTopic = null
+ ReactApp.render()
}
}
diff --git a/frontend/src/Metamaps/Views/index.js b/frontend/src/Metamaps/Views/index.js
index 85a710c3..0f7cf566 100644
--- a/frontend/src/Metamaps/Views/index.js
+++ b/frontend/src/Metamaps/Views/index.js
@@ -11,7 +11,6 @@ const Views = {
init: (serverData) => {
$(document).on(JUNTO_UPDATED, () => ExploreMaps.render())
ChatView.init([serverData['sounds/MM_sounds.mp3'], serverData['sounds/MM_sounds.ogg']])
- TopicCard.init(serverData)
},
ExploreMaps,
ChatView,
diff --git a/frontend/src/components/TopicCard/Links.js b/frontend/src/components/TopicCard/Links.js
index c4b4796f..ef401106 100644
--- a/frontend/src/components/TopicCard/Links.js
+++ b/frontend/src/components/TopicCard/Links.js
@@ -25,7 +25,6 @@ class Links extends Component {
this.props.updateTopic({
metacode_id: metacodeId
})
- this.props.redrawCanvas()
}
toggleShowMoreMaps = e => {
@@ -155,8 +154,7 @@ Links.propTypes = {
icon_path: PropTypes.string, // url
name: PropTypes.string
}))
- })),
- redrawCanvas: PropTypes.func
+ }))
}
export default Links
diff --git a/frontend/src/components/TopicCard/index.js b/frontend/src/components/TopicCard/index.js
index 0245e1a2..e3297dad 100644
--- a/frontend/src/components/TopicCard/index.js
+++ b/frontend/src/components/TopicCard/index.js
@@ -32,7 +32,7 @@ class ReactTopicCard extends Component {
return (
<Draggable handle=".metacodeImage" defaultPosition={{x: 100, y: 100}}>
- <div className="showcard mapElement mapElementHidden" id="showcard">
+ <div className="showcard mapElement mapElementHidden">
<div className={classname}>
<div className={`CardOnGraph ${hasAttachment ? 'hasAttachment' : ''}`} id={`topic_${topic.id}`}>
<Title name={topic.get('name')}