From 160898acf364e3c77309b2ccb1fb5d14b3c2eef7 Mon Sep 17 00:00:00 2001
From: Jeff Wong <awole20@gmail.com>
Date: Wed, 13 Jun 2018 17:56:14 -0700
Subject: [PATCH] Feature: add jump to post modal on mobile

---
 .../components/topic-navigation.js.es6          |  3 +++
 .../discourse/controllers/jump-to-post.js.es6   |  4 ++++
 .../discourse/controllers/topic.js.es6          | 17 ++++++++++-------
 .../discourse/templates/modal/jump-to-post.hbs  |  2 +-
 .../common/foundation/variables.scss            |  2 +-
 5 files changed, 19 insertions(+), 9 deletions(-)

diff --git a/app/assets/javascripts/discourse/components/topic-navigation.js.es6 b/app/assets/javascripts/discourse/components/topic-navigation.js.es6
index 1f06f871629..1d541184882 100644
--- a/app/assets/javascripts/discourse/components/topic-navigation.js.es6
+++ b/app/assets/javascripts/discourse/components/topic-navigation.js.es6
@@ -63,6 +63,9 @@ export default Ember.Component.extend({
         if ( !$target.is('.widget-button') &&
              !$parents.is('.widget-button') &&
              !$parents.is('.dropdown-menu') &&
+             !$parents.is('#discourse-modal') &&
+             !$target.is('#discourse-modal') &&
+             !$parents.is('.modal-footer') &&
              (
               $target.is('.topic-timeline') ||
              !$parents.is('#topic-progress-wrapper')
diff --git a/app/assets/javascripts/discourse/controllers/jump-to-post.js.es6 b/app/assets/javascripts/discourse/controllers/jump-to-post.js.es6
index 06fae57eb80..dc55fe2b1d8 100644
--- a/app/assets/javascripts/discourse/controllers/jump-to-post.js.es6
+++ b/app/assets/javascripts/discourse/controllers/jump-to-post.js.es6
@@ -4,6 +4,10 @@ export default Ember.Controller.extend(ModalFunctionality, {
   model: null,
   postNumber: null,
 
+  onShow: () => {
+    Ember.run.next(() => $('#post-jump').focus());
+  },
+
   actions: {
     jump() {
       const max   = this.get("topic.postStream.filteredPostsCount");
diff --git a/app/assets/javascripts/discourse/controllers/topic.js.es6 b/app/assets/javascripts/discourse/controllers/topic.js.es6
index 7925f136144..d948584aec8 100644
--- a/app/assets/javascripts/discourse/controllers/topic.js.es6
+++ b/app/assets/javascripts/discourse/controllers/topic.js.es6
@@ -13,6 +13,7 @@ import { extractLinkMeta } from 'discourse/lib/render-topic-featured-link';
 import { popupAjaxError } from 'discourse/lib/ajax-error';
 import { spinnerHTML } from 'discourse/helpers/loading-spinner';
 import { userPath } from 'discourse/lib/url';
+import showModal from 'discourse/lib/show-modal';
 
 let customPostMessageCallbacks = {};
 
@@ -469,13 +470,15 @@ export default Ember.Controller.extend(BufferedContent, {
     },
 
     jumpToPostPrompt() {
-      const postText = prompt(I18n.t('topic.progress.jump_prompt_long'));
-      if (postText === null) { return; }
-
-      const postIndex = parseInt(postText, 10);
-      if (postIndex === 0) { return; }
-
-      this._jumpToIndex(postIndex);
+      const topic = this.get('model');
+      const controller = showModal('jump-to-post');
+      controller.setProperties({
+        topic: topic,
+        postNumber: null,
+        jumpToIndex: (index) => {
+          this.send('jumpToIndex', index);
+        }
+      });
     },
 
     jumpToPost(postNumber) {
diff --git a/app/assets/javascripts/discourse/templates/modal/jump-to-post.hbs b/app/assets/javascripts/discourse/templates/modal/jump-to-post.hbs
index 73e6bf0ca4e..187f47d9932 100644
--- a/app/assets/javascripts/discourse/templates/modal/jump-to-post.hbs
+++ b/app/assets/javascripts/discourse/templates/modal/jump-to-post.hbs
@@ -1,5 +1,5 @@
 {{#d-modal-body title="topic.progress.jump_prompt_long"}}
-  {{text-field value=postNumber insert-newline="jump"}}
+  {{input id="post-jump" type="number" value=postNumber insert-newline="jump"}}
   <span class='input-hint-text'>
     {{i18n "topic.progress.jump_prompt_of" count=topic.postStream.filteredPostsCount}}
   </span>
diff --git a/app/assets/stylesheets/common/foundation/variables.scss b/app/assets/stylesheets/common/foundation/variables.scss
index 8f0537d4730..20e4b1451ce 100644
--- a/app/assets/stylesheets/common/foundation/variables.scss
+++ b/app/assets/stylesheets/common/foundation/variables.scss
@@ -67,7 +67,6 @@ $line-height-large: 1.4; // Normal or small text
 
 $z-layers: (
   "max": 9999,
-  "fullscreen": 1700,
   "modal": (
     "tooltip": 1600,
     "popover": 1500,
@@ -75,6 +74,7 @@ $z-layers: (
     "content": 1300,
     "overlay": 1200
   ),
+  "fullscreen": 1150,
   "mobile-composer": 1100,
   "header": 1000,
   "tooltip": 600,