Flux - 31 - Actions With Multiple Methods

Author: StephenGrider

imgur-client/sass/image-detail.scss

@@ -0,0 +1,9 @@
+.image-detail {
+  .panel-body {
+    text-align: center;
+  }
+
+  img, video {
+    max-width: 100%;
+  }
+}

imgur-client/src/components/image-detail.jsx

@@ -16,7 +16,7 @@ module.exports = React.createClass({
     Actions.getImage(this.props.params.id);
   },
   render: function() {
-    return <div>
+    return <div className="image-detail">
       {this.state.image ? this.renderContent() : null}
     </div>
   },

imgur-client/src/stores/comment-store.jsx

@@ -0,0 +1,17 @@
+var Reflux = require('reflux');
+var Actions = require('../actions');
+var Api = require('../utils/api');
+
+module.exports = Reflux.createStore({
+  listenables: [Actions],
+  getImage: function(id){
+    Api.get('gallery/' + id + '/comments')
+      .then(function(json){
+        this.comment = json.data;
+        this.triggerChange();
+      }.bind(this));
+  },
+  triggerChange: function() {
+    this.trigger('change', this.comment);
+  }
+});