Remove legacy mobile view logic

No issue
- Move editor-base-view mixin into editor/edit view
- Also deletes mobile views and modifies files that were using it
- Helps pave the way for Ember 2.0, where views do not exist

core/client/app/styles/layouts/content.css

@@ -1,12 +1,4 @@
 /* Content /ghost/
-/* ---------------------------------------------------------- */
-
-.content-view-container {
-    position: relative;
-    flex-grow: 1;
-    display: flex;
-    flex-direction: column;
-}
 
 /* Show/Hide on Mobile // TODO: What the fuck does that mean?
 /* ---------------------------------------------------------- */

core/client/app/templates/posts.hbs

@@ -1,3 +1,4 @@
+<section class="gh-view content-view-container">
 <header class="view-header">
     <h2 class="view-title">Content</h2>
     <section class="view-actions">
@@ -40,3 +41,4 @@
         {{outlet}}
     </section>
 </div>
+</section>

core/client/app/views/editor/edit.js

@@ -1,9 +1,62 @@
 import Ember from 'ember';
-import EditorViewMixin from 'ghost/mixins/editor-base-view';
+import setScrollClassName from 'ghost/utils/set-scroll-classname';
 
-var EditorView = Ember.View.extend(EditorViewMixin, {
+var EditorViewMixin = Ember.View.extend({
     tagName: 'section',
-    classNames: ['gh-view']
+    classNames: ['gh-view'],
+    // create a hook for jQuery logic that will run after
+    // a view and all child views have been rendered,
+    // since didInsertElement runs only when the view's el
+    // has rendered, and not necessarily all child views.
+    //
+    // http://mavilein.github.io/javascript/2013/08/01/Ember-JS-After-Render-Event/
+    // http://emberjs.com/api/classes/Ember.run.html#method_next
+    scheduleAfterRender: function () {
+        Ember.run.scheduleOnce('afterRender', this, this.afterRenderEvent);
+    }.on('didInsertElement'),
+
+    // all child views will have rendered when this fires
+    afterRenderEvent: function () {
+        var $previewViewPort = this.$('.js-entry-preview-content');
+
+        // cache these elements for use in other methods
+        this.set('$previewViewPort', $previewViewPort);
+        this.set('$previewContent', this.$('.js-rendered-markdown'));
+
+        $previewViewPort.on('scroll', Ember.run.bind($previewViewPort, setScrollClassName, {
+            target: this.$('.js-entry-preview'),
+            offset: 10
+        }));
+    },
+
+    removeScrollHandlers: function () {
+        this.get('$previewViewPort').off('scroll');
+    }.on('willDestroyElement'),
+
+    // updated when gh-ed-editor component scrolls
+    editorScrollInfo: null,
+    // updated when markdown is rendered
+    height: null,
+
+    // HTML Preview listens to scrollPosition and updates its scrollTop value
+    // This property receives scrollInfo from the textEditor, and height from the preview pane, and will update the
+    // scrollPosition value such that when either scrolling or typing-at-the-end of the text editor the preview pane
+    // stays in sync
+    scrollPosition: Ember.computed('editorScrollInfo', 'height', function () {
+        if (!this.get('editorScrollInfo')) {
+            return 0;
+        }
+
+        var scrollInfo = this.get('editorScrollInfo'),
+            previewHeight = this.get('$previewContent').height() - this.get('$previewViewPort').height(),
+            previewPosition,
+            ratio;
+
+        ratio = previewHeight / scrollInfo.diff;
+        previewPosition = scrollInfo.top * ratio;
+
+        return previewPosition;
+    })
 });
 
-export default EditorView;
+export default EditorViewMixin;

core/client/app/views/editor/new.js

@@ -1,10 +1,7 @@
-import Ember from 'ember';
-import EditorViewMixin from 'ghost/mixins/editor-base-view';
+import EditorView from 'ghost/views/editor/edit';
 
-var EditorNewView = Ember.View.extend(EditorViewMixin, {
-    tagName: 'section',
-    templateName: 'editor/edit',
-    classNames: ['gh-view']
+var EditorNewView = EditorView.extend({
+    templateName: 'editor/edit'
 });
 
 export default EditorNewView;

core/client/app/views/posts/index.js

@@ -1,6 +1,6 @@
-import MobileIndexView from 'ghost/views/mobile/index-view';
+import Ember from 'ember';
 
-var PostsIndexView = MobileIndexView.extend({
+var PostsIndexView = Ember.View.extend({
     classNames: ['no-posts-box']
 });
 

core/client/app/views/settings/content-base.js

@@ -1,13 +1,8 @@
-import MobileContentView from 'ghost/views/mobile/content-view';
-/**
- * All settings views other than the index should inherit from this base class.
- * It ensures that the correct screen is showing when a mobile user navigates
- * to a `settings.someRouteThatIsntIndex` route.
- */
+import Ember from 'ember';
 
-var SettingsContentBaseView = MobileContentView.extend({
+var SettingsView = Ember.View.extend({
     tagName: 'section',
-    classNames: ['gh-view', 'js-settings-content']
+    classNames: ['gh-view']
 });
 
-export default SettingsContentBaseView;
+export default SettingsView;

core/test/functional/client/content_test.js

@@ -14,7 +14,7 @@ CasperTest.begin('Content screen is correct', 15, function suite(test) {
     });
 
     casper.then(function testViews() {
-        test.assertExists('.content-view-container', 'Content main view is present');
+        test.assertExists('.gh-main .gh-view', 'Content main view is present');
         test.assertExists('.content-list-content', 'Content list view is present');
         test.assertExists('.gh-nav-main-editor', 'add new post button exists');
         test.assertEquals(

core/test/functional/client/settings_test.js

@@ -15,7 +15,7 @@ CasperTest.begin('Settings screen is correct', 9, function suite(test) {
     });
 
     casper.then(function testViews() {
-        test.assertExists('.js-settings-content', 'Settings content view is present');
+        test.assertExists('.gh-main .gh-view', 'Settings content view is present');
         test.assertExists(generalTabDetector, 'Form is present');
         test.assertSelectorHasText('.view-title', 'General', 'Title is "General"');
     });