Merge branch 'move-markdown-preview' into 'master'

Remove preview_markdown from the global obj

See merge request gitlab-org/gitlab-ce!16025

app/assets/javascripts/behaviors/index.js

@@ -7,6 +7,7 @@ import installGlEmojiElement from './gl_emoji';
 import './quick_submit';
 import './requires_input';
 import './toggler_behavior';
+import '../preview_markdown';
 
 installGlEmojiElement();
 initCopyAsGFM();

app/assets/javascripts/main.js

@@ -46,7 +46,6 @@ import LazyLoader from './lazy_loader';
 import './line_highlighter';
 import initLogoAnimation from './logo';
 import './milestone_select';
-import './preview_markdown';
 import './projects_dropdown';
 import './render_gfm';
 import initBreadcrumbs from './breadcrumb';

app/assets/javascripts/preview_markdown.js

@@ -6,195 +6,193 @@
 // (including the explanation of quick actions), and showing a warning when
 // more than `x` users are referenced.
 //
-(function () {
-  var lastTextareaPreviewed;
-  var lastTextareaHeight = null;
-  var markdownPreview;
-  var previewButtonSelector;
-  var writeButtonSelector;
-
-  window.MarkdownPreview = (function () {
-    function MarkdownPreview() {}
-
-    // Minimum number of users referenced before triggering a warning
-    MarkdownPreview.prototype.referenceThreshold = 10;
-    MarkdownPreview.prototype.emptyMessage = 'Nothing to preview.';
-
-    MarkdownPreview.prototype.ajaxCache = {};
-
-    MarkdownPreview.prototype.showPreview = function ($form) {
-      var mdText;
-      var preview = $form.find('.js-md-preview');
-      var url = preview.data('url');
-      if (preview.hasClass('md-preview-loading')) {
-        return;
-      }
-      mdText = $form.find('textarea.markdown-area').val();
-
-      if (mdText.trim().length === 0) {
-        preview.text(this.emptyMessage);
-        this.hideReferencedUsers($form);
-      } else {
-        preview.addClass('md-preview-loading').text('Loading...');
-        this.fetchMarkdownPreview(mdText, url, (function (response) {
-          var body;
-          if (response.body.length > 0) {
-            body = response.body;
-          } else {
-            body = this.emptyMessage;
-          }
-
-          preview.removeClass('md-preview-loading').html(body);
-          preview.renderGFM();
-          this.renderReferencedUsers(response.references.users, $form);
-
-          if (response.references.commands) {
-            this.renderReferencedCommands(response.references.commands, $form);
-          }
-        }).bind(this));
-      }
-    };
 
-    MarkdownPreview.prototype.fetchMarkdownPreview = function (text, url, success) {
-      if (!url) {
-        return;
-      }
-      if (text === this.ajaxCache.text) {
-        success(this.ajaxCache.response);
-        return;
-      }
-      $.ajax({
-        type: 'POST',
-        url: url,
-        data: {
-          text: text
-        },
-        dataType: 'json',
-        success: (function (response) {
-          this.ajaxCache = {
-            text: text,
-            response: response
-          };
-          success(response);
-        }).bind(this)
-      });
-    };
-
-    MarkdownPreview.prototype.hideReferencedUsers = function ($form) {
-      $form.find('.referenced-users').hide();
-    };
-
-    MarkdownPreview.prototype.renderReferencedUsers = function (users, $form) {
-      var referencedUsers;
-      referencedUsers = $form.find('.referenced-users');
-      if (referencedUsers.length) {
-        if (users.length >= this.referenceThreshold) {
-          referencedUsers.show();
-          referencedUsers.find('.js-referenced-users-count').text(users.length);
-        } else {
-          referencedUsers.hide();
-        }
-      }
-    };
-
-    MarkdownPreview.prototype.hideReferencedCommands = function ($form) {
-      $form.find('.referenced-commands').hide();
-    };
-
-    MarkdownPreview.prototype.renderReferencedCommands = function (commands, $form) {
-      var referencedCommands;
-      referencedCommands = $form.find('.referenced-commands');
-      if (commands.length > 0) {
-        referencedCommands.html(commands);
-        referencedCommands.show();
+var lastTextareaPreviewed;
+var lastTextareaHeight = null;
+var markdownPreview;
+var previewButtonSelector;
+var writeButtonSelector;
+
+function MarkdownPreview() {}
+
+// Minimum number of users referenced before triggering a warning
+MarkdownPreview.prototype.referenceThreshold = 10;
+MarkdownPreview.prototype.emptyMessage = 'Nothing to preview.';
+
+MarkdownPreview.prototype.ajaxCache = {};
+
+MarkdownPreview.prototype.showPreview = function ($form) {
+  var mdText;
+  var preview = $form.find('.js-md-preview');
+  var url = preview.data('url');
+  if (preview.hasClass('md-preview-loading')) {
+    return;
+  }
+  mdText = $form.find('textarea.markdown-area').val();
+
+  if (mdText.trim().length === 0) {
+    preview.text(this.emptyMessage);
+    this.hideReferencedUsers($form);
+  } else {
+    preview.addClass('md-preview-loading').text('Loading...');
+    this.fetchMarkdownPreview(mdText, url, (function (response) {
+      var body;
+      if (response.body.length > 0) {
+        body = response.body;
       } else {
-        referencedCommands.html('');
-        referencedCommands.hide();
+        body = this.emptyMessage;
       }
-    };
-
-    return MarkdownPreview;
-  }());
-
-  markdownPreview = new window.MarkdownPreview();
-  previewButtonSelector = '.js-md-preview-button';
-  writeButtonSelector = '.js-md-write-button';
-  lastTextareaPreviewed = null;
-  const markdownToolbar = $('.md-header-toolbar');
-
-  $.fn.setupMarkdownPreview = function () {
-    var $form = $(this);
-    $form.find('textarea.markdown-area').on('input', function () {
-      markdownPreview.hideReferencedUsers($form);
-    });
-  };
-
-  $(document).on('markdown-preview:show', function (e, $form) {
-    if (!$form) {
-      return;
-    }
-
-    lastTextareaPreviewed = $form.find('textarea.markdown-area');
-    lastTextareaHeight = lastTextareaPreviewed.height();
-
-    // toggle tabs
-    $form.find(writeButtonSelector).parent().removeClass('active');
-    $form.find(previewButtonSelector).parent().addClass('active');
 
-    // toggle content
-    $form.find('.md-write-holder').hide();
-    $form.find('.md-preview-holder').show();
-    markdownToolbar.removeClass('active');
-    markdownPreview.showPreview($form);
-  });
-
-  $(document).on('markdown-preview:hide', function (e, $form) {
-    if (!$form) {
-      return;
-    }
-    lastTextareaPreviewed = null;
-
-    if (lastTextareaHeight) {
-      $form.find('textarea.markdown-area').height(lastTextareaHeight);
-    }
-
-    // toggle tabs
-    $form.find(writeButtonSelector).parent().addClass('active');
-    $form.find(previewButtonSelector).parent().removeClass('active');
-
-    // toggle content
-    $form.find('.md-write-holder').show();
-    $form.find('textarea.markdown-area').focus();
-    $form.find('.md-preview-holder').hide();
-    markdownToolbar.addClass('active');
+      preview.removeClass('md-preview-loading').html(body);
+      preview.renderGFM();
+      this.renderReferencedUsers(response.references.users, $form);
 
-    markdownPreview.hideReferencedCommands($form);
+      if (response.references.commands) {
+        this.renderReferencedCommands(response.references.commands, $form);
+      }
+    }).bind(this));
+  }
+};
+
+MarkdownPreview.prototype.fetchMarkdownPreview = function (text, url, success) {
+  if (!url) {
+    return;
+  }
+  if (text === this.ajaxCache.text) {
+    success(this.ajaxCache.response);
+    return;
+  }
+  $.ajax({
+    type: 'POST',
+    url: url,
+    data: {
+      text: text
+    },
+    dataType: 'json',
+    success: (function (response) {
+      this.ajaxCache = {
+        text: text,
+        response: response
+      };
+      success(response);
+    }).bind(this)
   });
-
-  $(document).on('markdown-preview:toggle', function (e, keyboardEvent) {
-    var $target;
-    $target = $(keyboardEvent.target);
-    if ($target.is('textarea.markdown-area')) {
-      $(document).triggerHandler('markdown-preview:show', [$target.closest('form')]);
-      keyboardEvent.preventDefault();
-    } else if (lastTextareaPreviewed) {
-      $target = lastTextareaPreviewed;
-      $(document).triggerHandler('markdown-preview:hide', [$target.closest('form')]);
-      keyboardEvent.preventDefault();
+};
+
+MarkdownPreview.prototype.hideReferencedUsers = function ($form) {
+  $form.find('.referenced-users').hide();
+};
+
+MarkdownPreview.prototype.renderReferencedUsers = function (users, $form) {
+  var referencedUsers;
+  referencedUsers = $form.find('.referenced-users');
+  if (referencedUsers.length) {
+    if (users.length >= this.referenceThreshold) {
+      referencedUsers.show();
+      referencedUsers.find('.js-referenced-users-count').text(users.length);
+    } else {
+      referencedUsers.hide();
     }
+  }
+};
+
+MarkdownPreview.prototype.hideReferencedCommands = function ($form) {
+  $form.find('.referenced-commands').hide();
+};
+
+MarkdownPreview.prototype.renderReferencedCommands = function (commands, $form) {
+  var referencedCommands;
+  referencedCommands = $form.find('.referenced-commands');
+  if (commands.length > 0) {
+    referencedCommands.html(commands);
+    referencedCommands.show();
+  } else {
+    referencedCommands.html('');
+    referencedCommands.hide();
+  }
+};
+
+markdownPreview = new MarkdownPreview();
+
+previewButtonSelector = '.js-md-preview-button';
+writeButtonSelector = '.js-md-write-button';
+lastTextareaPreviewed = null;
+const markdownToolbar = $('.md-header-toolbar');
+
+$.fn.setupMarkdownPreview = function () {
+  var $form = $(this);
+  $form.find('textarea.markdown-area').on('input', function () {
+    markdownPreview.hideReferencedUsers($form);
   });
+};
+
+$(document).on('markdown-preview:show', function (e, $form) {
+  if (!$form) {
+    return;
+  }
+
+  lastTextareaPreviewed = $form.find('textarea.markdown-area');
+  lastTextareaHeight = lastTextareaPreviewed.height();
+
+  // toggle tabs
+  $form.find(writeButtonSelector).parent().removeClass('active');
+  $form.find(previewButtonSelector).parent().addClass('active');
+
+  // toggle content
+  $form.find('.md-write-holder').hide();
+  $form.find('.md-preview-holder').show();
+  markdownToolbar.removeClass('active');
+  markdownPreview.showPreview($form);
+});
+
+$(document).on('markdown-preview:hide', function (e, $form) {
+  if (!$form) {
+    return;
+  }
+  lastTextareaPreviewed = null;
 
-  $(document).on('click', previewButtonSelector, function (e) {
-    var $form;
-    e.preventDefault();
-    $form = $(this).closest('form');
-    $(document).triggerHandler('markdown-preview:show', [$form]);
-  });
-
-  $(document).on('click', writeButtonSelector, function (e) {
-    var $form;
-    e.preventDefault();
-    $form = $(this).closest('form');
-    $(document).triggerHandler('markdown-preview:hide', [$form]);
-  });
-}());
+  if (lastTextareaHeight) {
+    $form.find('textarea.markdown-area').height(lastTextareaHeight);
+  }
+
+  // toggle tabs
+  $form.find(writeButtonSelector).parent().addClass('active');
+  $form.find(previewButtonSelector).parent().removeClass('active');
+
+  // toggle content
+  $form.find('.md-write-holder').show();
+  $form.find('textarea.markdown-area').focus();
+  $form.find('.md-preview-holder').hide();
+  markdownToolbar.addClass('active');
+
+  markdownPreview.hideReferencedCommands($form);
+});
+
+$(document).on('markdown-preview:toggle', function (e, keyboardEvent) {
+  var $target;
+  $target = $(keyboardEvent.target);
+  if ($target.is('textarea.markdown-area')) {
+    $(document).triggerHandler('markdown-preview:show', [$target.closest('form')]);
+    keyboardEvent.preventDefault();
+  } else if (lastTextareaPreviewed) {
+    $target = lastTextareaPreviewed;
+    $(document).triggerHandler('markdown-preview:hide', [$target.closest('form')]);
+    keyboardEvent.preventDefault();
+  }
+});
+
+$(document).on('click', previewButtonSelector, function (e) {
+  var $form;
+  e.preventDefault();
+  $form = $(this).closest('form');
+  $(document).triggerHandler('markdown-preview:show', [$form]);
+});
+
+$(document).on('click', writeButtonSelector, function (e) {
+  var $form;
+  e.preventDefault();
+  $form = $(this).closest('form');
+  $(document).triggerHandler('markdown-preview:hide', [$form]);
+});
+
+export default MarkdownPreview;