diff --git a/ember/app/components/ui/controls/text-editor.js b/ember/app/components/ui/controls/text-editor.js
new file mode 100644
index 000000000..aab281c8b
--- /dev/null
+++ b/ember/app/components/ui/controls/text-editor.js
@@ -0,0 +1,9 @@
+import Ember from 'ember';
+
+export default Ember.Component.extend({
+ actions: {
+ save: function() {
+ this.sendAction('save', this.get('value'));
+ }
+ }
+});
\ No newline at end of file
diff --git a/ember/app/controllers/composer.js b/ember/app/controllers/composer.js
new file mode 100644
index 000000000..08615abe3
--- /dev/null
+++ b/ember/app/controllers/composer.js
@@ -0,0 +1,42 @@
+import Ember from 'ember';
+
+export default Ember.Controller.extend({
+
+ needs: ['index', 'application'],
+
+ user: Ember.Object.create({avatarNumber: 1}),
+
+ discussion: null,
+
+ showing: true,
+ minimized: false,
+
+ title: 'Replying to Some Discussion Title',
+
+ actions: {
+ close: function() {
+ this.set('showing', false);
+ },
+ minimize: function() {
+ this.set('minimized', true);
+ },
+ show: function() {
+ this.set('minimized', false);
+ },
+ save: function(value) {
+ var store = this.store;
+ var discussion = this.get('discussion');
+ var controller = this;
+
+ var post = store.createRecord('post', {
+ content: value,
+ discussion: discussion
+ });
+ post.save().then(function(post) {
+ discussion.set('posts', discussion.get('posts')+','+post.get('id'));
+ controller.get('delegate').send('replyAdded', post);
+ });
+ }
+ }
+
+});
diff --git a/ember/app/controllers/discussion.js b/ember/app/controllers/discussion.js
index dc38ff961..cd6e3cabe 100644
--- a/ember/app/controllers/discussion.js
+++ b/ember/app/controllers/discussion.js
@@ -40,8 +40,26 @@ export default Ember.ObjectController.extend(Ember.Evented, {
actions: {
reply: function() {
- this.set('controllers.composer.showing', true);
- this.set('controllers.composer.title', 'Replying to '+this.get('model.title')+'');
+ var composer = this.get('controllers.composer');
+ // composer.beginPropertyChanges();
+ composer.set('minimized', false);
+ composer.set('showing', true);
+ composer.set('title', 'Replying to '+this.get('model.title')+'');
+ composer.set('delegate', this);
+ composer.set('discussion', this.get('model'));
+ // composer.endPropertyChanges();
+ },
+
+ replyAdded: function(post) {
+ var stream = this.get('stream');
+ stream.set('ids', this.get('model.postIds'));
+ var index = stream.get('count') - 1;
+ stream.get('content').pushObject(Ember.Object.create({
+ indexStart: index,
+ indexEnd: index,
+ content: post
+ }));
+ this.get('controllers.composer').set('showing', false);
},
// This action is called when the start position of the discussion
diff --git a/ember/app/mixins/add-css-class-to-body.js b/ember/app/mixins/add-css-class-to-body.js
new file mode 100644
index 000000000..30d2fa4ca
--- /dev/null
+++ b/ember/app/mixins/add-css-class-to-body.js
@@ -0,0 +1,16 @@
+import Ember from 'ember';
+
+export default Ember.Mixin.create({
+ activate: function() {
+ var cssClass = this.toCssClass();
+ Ember.$('body').addClass(cssClass);
+ },
+
+ deactivate: function() {
+ Ember.$('body').removeClass(this.toCssClass());
+ },
+
+ toCssClass: function() {
+ return this.routeName.replace(/\./g, '-').dasherize();
+ }
+});
\ No newline at end of file
diff --git a/ember/app/routes/index/index.js b/ember/app/routes/index/index.js
index 8cd8adfc1..15c977f4b 100644
--- a/ember/app/routes/index/index.js
+++ b/ember/app/routes/index/index.js
@@ -1,6 +1,8 @@
import Ember from 'ember';
-export default Ember.Route.extend({
+import AddCssClassToBodyMixin from '../../mixins/add-css-class-to-body';
+
+export default Ember.Route.extend(AddCssClassToBodyMixin, {
// When we enter the discussions list view, we no longer want the
// discussions list to be in pane mode.
diff --git a/ember/app/styles/flarum/composer.less b/ember/app/styles/flarum/composer.less
index f33c744b2..9ec403c2c 100644
--- a/ember/app/styles/flarum/composer.less
+++ b/ember/app/styles/flarum/composer.less
@@ -8,33 +8,67 @@
right: 0;
z-index: @zindex-navbar-fixed;
pointer-events: none;
+ .transition(left 0.2s);
+
+ .with-pane & {
+ left: @index-pane-width;
+ }
}
.composer {
pointer-events: auto;
- margin-left: 200px;
+ margin-left: -20px;
+ margin-right: 200px;
.box-shadow(0 2px 6px rgba(0, 0, 0, 0.25));
border-radius: 4px 4px 0 0;
- background: rgba(255, 255, 255, 0.98);
+ background: rgba(255, 255, 255, 0.9);
transform: translateZ(0); // Fix for Chrome bug where a transparent white background is actually gray
+ position: relative;
+ .transition(~"margin-left 0.2s, margin-right 0.2s, background 0.2s");
+
+ .index-index & {
+ margin-left: 205px;
+ margin-right: -20px;
+ }
+ &.active {
+ background: rgba(255, 255, 255, 0.98);
+ }
+ &.minimized {
+ height: 50px;
+ cursor: pointer;
+ }
}
.composer-content {
- padding: 0 20px 15px;
+ padding: 20px 20px 15px;
+
+ .minimized & {
+ padding: 10px 20px;
+ }
}
.composer-handle {
height: 20px;
+ margin-bottom: -20px;
cursor: row-resize;
+ position: relative;
+
+ .minimized & {
+ display: none;
+ }
}
.composer-controls {
- float: right;
- margin: -5px 15px 0 0;
+ position: absolute;
+ right: 10px;
+ top: 10px;
}
.composer-avatar {
float: left;
- width: 64px;
- height: 64px;
+ .avatar-size(64px);
+
+ .minimized & {
+ display: none;
+ }
}
.composer-body {
- margin-left: 84px;
+ margin-left: 90px;
& h3 {
margin: 5px 0 10px;
@@ -42,20 +76,30 @@
font-size: 16px;
font-weight: normal;
}
-}
-.composer-editor textarea {
- background: none;
- border-radius: 0;
- padding: 0;
- margin-bottom: 10px;
- height: 200px;
- border: 0;
- resize: none;
- color: @fl-body-color;
- font-size: 15px;
- line-height: 1.6;
- &:focus {
+ .minimized & {
+ margin-left: 0;
+ }
+}
+.composer-editor {
+ & textarea {
background: none;
+ border-radius: 0;
+ padding: 0;
+ margin-bottom: 10px;
+ height: 200px;
+ border: 0;
+ resize: none;
+ color: @fl-body-color;
+ font-size: 14px;
+ line-height: 1.6;
+
+ &:focus {
+ background: none;
+ }
+ }
+
+ .minimized & {
+ visibility: hidden;
}
}
\ No newline at end of file
diff --git a/ember/app/templates/application.hbs b/ember/app/templates/application.hbs
index a4bc0f819..597c9f483 100644
--- a/ember/app/templates/application.hbs
+++ b/ember/app/templates/application.hbs
@@ -1,4 +1,4 @@
-