diff --git a/browser/main/Actions/PlanetActions.js b/browser/main/Actions/PlanetActions.js
index f9a311c2..a1afef21 100644
--- a/browser/main/Actions/PlanetActions.js
+++ b/browser/main/Actions/PlanetActions.js
@@ -5,9 +5,9 @@ module.exports = Reflux.createActions([
'createSnippet',
'updateSnippet',
- 'destroySnippet',
+ 'deleteSnippet',
'createBlueprint',
'updateBlueprint',
- 'destroyBlueprint'
+ 'deleteBlueprint'
])
diff --git a/browser/main/Components/CodeEditor.jsx b/browser/main/Components/CodeEditor.jsx
index ee222fbd..16054576 100644
--- a/browser/main/Components/CodeEditor.jsx
+++ b/browser/main/Components/CodeEditor.jsx
@@ -14,6 +14,7 @@ var CodeEditor = React.createClass({
editor.setValue(this.props.code)
editor.renderer.setShowGutter(true)
editor.setTheme('ace/theme/xcode')
+ editor.clearSelection()
var session = editor.getSession()
session.setMode('ace/mode/' + this.props.mode)
diff --git a/browser/main/Components/SnippetDeleteModal.jsx b/browser/main/Components/SnippetDeleteModal.jsx
new file mode 100644
index 00000000..0f2d4708
--- /dev/null
+++ b/browser/main/Components/SnippetDeleteModal.jsx
@@ -0,0 +1,49 @@
+var React = require('react')
+var PlanetStore = require('../Stores/PlanetStore')
+var PlanetActions = require('../Actions/PlanetActions')
+
+var SnippetDeleteModal = React.createClass({
+ propTypes: {
+ close: React.PropTypes.func,
+ snippet: React.PropTypes.object
+ },
+ componentDidMount: function () {
+ this.unsubscribe = PlanetStore.listen(this.onListen)
+ },
+ componentWillUnmount: function () {
+ this.unsubscribe()
+ },
+ onListen: function (res) {
+ switch (res.status) {
+ case 'snippetDeleted':
+ this.props.close()
+ break
+ }
+ },
+ stopPropagation: function (e) {
+ e.stopPropagation()
+ },
+ submit: function () {
+ PlanetActions.deleteSnippet(this.props.snippet.id)
+ },
+ render: function () {
+ return (
+
+
+
Delete Snippet
+
+
+
Are you sure to delete it?
+
+
+
+ )
+ }
+})
+
+module.exports = SnippetDeleteModal
diff --git a/browser/main/Components/SnippetForm.jsx b/browser/main/Components/SnippetForm.jsx
index 1b4598dc..c15081b2 100644
--- a/browser/main/Components/SnippetForm.jsx
+++ b/browser/main/Components/SnippetForm.jsx
@@ -42,6 +42,12 @@ var SnippetForm = React.createClass({
callSign: '',
Tags: []
}, this.props.snippet)
+ snippet.Tags = snippet.Tags.map(function (tag) {
+ return {
+ label: tag.name,
+ value: tag.name
+ }
+ })
return {
snippet: snippet
}
@@ -110,7 +116,7 @@ var SnippetForm = React.createClass({
-
+
diff --git a/browser/main/Containers/PlanetContainer.jsx b/browser/main/Containers/PlanetContainer.jsx
index df1e22c9..60e4265a 100644
--- a/browser/main/Containers/PlanetContainer.jsx
+++ b/browser/main/Containers/PlanetContainer.jsx
@@ -4,6 +4,7 @@ var ModalBase = require('../Components/ModalBase')
var LaunchModal = require('../Components/LaunchModal')
var CodeViewer = require('../Components/CodeViewer')
var SnippetEditModal = require('../Components/SnippetEditModal')
+var SnippetDeleteModal = require('../Components/SnippetDeleteModal')
var AuthStore = require('../Stores/AuthStore')
var PlanetStore = require('../Stores/PlanetStore')
@@ -175,6 +176,15 @@ var PlanetArticleDetail = React.createClass({
submitEditModal: function () {
this.setState({isEditModalOpen: false})
},
+ openDeleteModal: function () {
+ this.setState({isDeleteModalOpen: true})
+ },
+ closeDeleteModal: function () {
+ this.setState({isDeleteModalOpen: false})
+ },
+ submitDeleteModal: function () {
+ this.setState({isDeleteModalOpen: false})
+ },
render: function () {
var snippet = this.props.snippet
@@ -190,12 +200,16 @@ var PlanetArticleDetail = React.createClass({
{snippet.callSign} {snippet.updatedAt}
-
+
+
+
+
+
@@ -242,7 +256,7 @@ module.exports = React.createClass({
this.transitionTo('snippets', {
userName: this.props.params.userName,
planetName: this.props.params.planetName,
- localId: planet.Snippets[0].localId})
+ localId: this.props.params.localId == null ? planet.Snippets[0].localId : this.props.params.localId})
}
})
break
@@ -260,13 +274,41 @@ module.exports = React.createClass({
if (snippet.PlanetId === this.state.currentPlanet.id) {
snippets.some(function (_snippet, index) {
if (_snippet.id === snippet.id) {
- snippets[index] = snippet
+ snippets.splice(index, 1)
+ snippets.unshift(snippet)
this.setState({snippets: snippets})
return true
}
return false
}.bind(this))
}
+ break
+ case 'snippetDeleted':
+ if (snippet.PlanetId === this.state.currentPlanet.id) {
+ snippets.some(function (_snippet, index) {
+ if (_snippet.id === snippet.id) {
+ snippets.splice(index, 1)
+ this.setState({snippets: snippets}, function () {
+ var params = this.getParams()
+ if (parseInt(params.localId, 10) === snippet.localId) {
+ if (snippets.length === 0) {
+ delete params.localId
+ this.transitionTo('planet', params)
+ return
+ }
+ if (index > 0) {
+ params.localId = snippets[index - 1].localId
+ } else {
+ params.localId = snippets[0].localId
+ }
+ this.transitionTo('snippets', params)
+ }
+ })
+ return true
+ }
+ return false
+ }.bind(this))
+ }
}
},
diff --git a/browser/main/Stores/PlanetStore.js b/browser/main/Stores/PlanetStore.js
index 14465a32..1916899b 100644
--- a/browser/main/Stores/PlanetStore.js
+++ b/browser/main/Stores/PlanetStore.js
@@ -9,6 +9,7 @@ var PlanetStore = Reflux.createStore({
this.listenTo(PlanetActions.fetchPlanet, this.fetchPlanet)
this.listenTo(PlanetActions.createSnippet, this.createSnippet)
this.listenTo(PlanetActions.updateSnippet, this.updateSnippet)
+ this.listenTo(PlanetActions.deleteSnippet, this.deleteSnippet)
},
fetchPlanet: function (planetName) {
request
@@ -69,6 +70,27 @@ var PlanetStore = Reflux.createStore({
data: snippet
})
}.bind(this))
+ },
+ deleteSnippet: function (id) {
+ request
+ .del('http://localhost:8000/snippets/id/' + id)
+ .set({
+ Authorization: 'Bearer ' + localStorage.getItem('token')
+ })
+ .send()
+ .end(function (err, res) {
+ if (err) {
+ console.error(err)
+ this.trigger(null)
+ return
+ }
+
+ var snippet = res.body
+ this.trigger({
+ status: 'snippetDeleted',
+ data: snippet
+ })
+ }.bind(this))
}
})
diff --git a/browser/styles/main/containers/PlanetContainer.styl b/browser/styles/main/containers/PlanetContainer.styl
index 0f080cf2..dd7f9bb1 100644
--- a/browser/styles/main/containers/PlanetContainer.styl
+++ b/browser/styles/main/containers/PlanetContainer.styl
@@ -2,6 +2,9 @@
.PlanetContainer
absolute top bottom right
left 50px
+ .tags
+ a
+ margin 0 2px
.PlanetHeader
absolute left right top
@@ -118,9 +121,6 @@
absolute bottom right
left 200px
top 65px
- .tags
- a
- margin 0 2px
width 250px
border-right solid 1px highlightenBorderColor
diff --git a/browser/styles/shared/modal.styl b/browser/styles/shared/modal.styl
index 89bd4310..ac3ad7a9 100644
--- a/browser/styles/shared/modal.styl
+++ b/browser/styles/shared/modal.styl
@@ -21,6 +21,9 @@
h1
padding: 10px 0 15px;
font-size: 1.5em;
+ .modal-body
+ p
+ margin-bottom 15px
.modal-footer
clearfix()
border-top solid 1px borderColor