From 349fd649f8bc7a8578f9f888d77db48742dc3c11 Mon Sep 17 00:00:00 2001
From: Jake Wright <jake.w.96@live.co.uk>
Date: Wed, 20 Aug 2014 18:32:51 +0100
Subject: [PATCH] Fix markdown/preview tab for mobile

Fixes #3813

- Add togglePreview action to controller
- Implement action and bind attributes
- Remove the now pointless
- Update to comply with issue suggestions
---
 core/client/mixins/editor-base-controller.js |  7 +++++++
 core/client/templates/editor/edit.hbs        |  8 ++++----
 core/client/utils/codemirror-mobile.js       | 12 ------------
 3 files changed, 11 insertions(+), 16 deletions(-)

diff --git a/core/client/mixins/editor-base-controller.js b/core/client/mixins/editor-base-controller.js
index ebbec56c2f..aa6f835c88 100644
--- a/core/client/mixins/editor-base-controller.js
+++ b/core/client/mixins/editor-base-controller.js
@@ -277,6 +277,13 @@ var EditorControllerMixin = Ember.Mixin.create(MarkerManager, {
                 }
             }
             editor.replaceSelection(result_src);
+        },
+
+        // Make sure editor starts with markdown shown
+        isPreview: false,
+
+        togglePreview: function (preview) {
+            this.set('isPreview', preview);
         }
     }
 });
diff --git a/core/client/templates/editor/edit.hbs b/core/client/templates/editor/edit.hbs
index 4b00e46290..3cf494af12 100644
--- a/core/client/templates/editor/edit.hbs
+++ b/core/client/templates/editor/edit.hbs
@@ -10,8 +10,8 @@
         </section>
     </header>
 
-    <section class="entry-markdown active">
-        <header class="floatingheader">
+    <section {{bind-attr class=":entry-markdown isPreview::active"}}>
+        <header {{action "togglePreview" false}} class="floatingheader">
             <small>Markdown</small>
             <a class="markdown-help" href="" {{action "openModal" "markdown"}}><span class="hidden">What is Markdown?</span></a>
         </header>
@@ -20,8 +20,8 @@
         </section>
     </section>
 
-    <section class="entry-preview">
-        <header class="floatingheader" id="entry-preview-header">
+    <section {{bind-attr class=":entry-preview isPreview:active"}}>
+        <header {{action "togglePreview" true}} class="floatingheader">
             <small>Preview <span class="entry-word-count js-entry-word-count">{{gh-count-words scratch}}</span></small>
         </header>
         <section class="entry-preview-content">
diff --git a/core/client/utils/codemirror-mobile.js b/core/client/utils/codemirror-mobile.js
index 1a8242142e..a36ce4e719 100644
--- a/core/client/utils/codemirror-mobile.js
+++ b/core/client/utils/codemirror-mobile.js
@@ -28,18 +28,6 @@ init = function init() {
     if (device.mobile() || (device.tablet() && device.ios())) {
         $('body').addClass('touch-editor');
 
-        // make editor tabs touch-to-toggle in portrait mode
-        $('#entry-markdown-header').on('tap', function () {
-            $('.entry-markdown').addClass('active');
-            $('.entry-preview').removeClass('active');
-        });
-
-        $('#entry-preview-header').on('tap', function () {
-            $('.entry-markdown').removeClass('active');
-            $('.entry-preview').addClass('active');
-        });
-
-
         Ember.touchEditor = true;
         //initialize FastClick to remove touch delays
         Ember.run.scheduleOnce('afterRender', null, function () {