2016-12-14 05:26:26 +00:00
|
|
|
/* eslint-disable func-names, space-before-function-paren, no-var, one-var, one-var-declaration-per-line, wrap-iife, no-else-return, consistent-return, object-shorthand, comma-dangle, no-param-reassign, padded-blocks, camelcase, prefer-arrow-callback, max-len */
|
|
|
|
|
2016-07-27 03:32:10 +00:00
|
|
|
// MarkdownPreview
|
|
|
|
//
|
|
|
|
// Handles toggling the "Write" and "Preview" tab clicks, rendering the preview,
|
|
|
|
// and showing a warning when more than `x` users are referenced.
|
|
|
|
//
|
2016-07-24 20:45:11 +00:00
|
|
|
(function() {
|
|
|
|
var lastTextareaPreviewed, markdownPreview, previewButtonSelector, writeButtonSelector;
|
|
|
|
|
2016-12-14 05:26:26 +00:00
|
|
|
window.MarkdownPreview = (function() {
|
2016-07-24 20:45:11 +00:00
|
|
|
function MarkdownPreview() {}
|
|
|
|
|
2016-07-27 03:32:10 +00:00
|
|
|
// Minimum number of users referenced before triggering a warning
|
2016-07-24 20:45:11 +00:00
|
|
|
MarkdownPreview.prototype.referenceThreshold = 10;
|
|
|
|
|
|
|
|
MarkdownPreview.prototype.ajaxCache = {};
|
|
|
|
|
2016-12-12 03:35:19 +00:00
|
|
|
MarkdownPreview.prototype.showPreview = function($form) {
|
2016-07-24 20:45:11 +00:00
|
|
|
var mdText, preview;
|
2016-12-12 03:35:19 +00:00
|
|
|
preview = $form.find('.js-md-preview');
|
|
|
|
mdText = $form.find('textarea.markdown-area').val();
|
2016-07-24 20:45:11 +00:00
|
|
|
if (mdText.trim().length === 0) {
|
|
|
|
preview.text('Nothing to preview.');
|
2016-12-12 03:35:19 +00:00
|
|
|
this.hideReferencedUsers($form);
|
2016-07-24 20:45:11 +00:00
|
|
|
} else {
|
|
|
|
preview.text('Loading...');
|
2016-12-12 03:37:11 +00:00
|
|
|
this.fetchMarkdownPreview(mdText, (function(response) {
|
2016-12-12 03:18:40 +00:00
|
|
|
preview.html(response.body);
|
|
|
|
preview.renderGFM();
|
2016-12-12 03:35:19 +00:00
|
|
|
this.renderReferencedUsers(response.references.users, $form);
|
2016-12-12 03:18:40 +00:00
|
|
|
}).bind(this));
|
2016-07-24 20:45:11 +00:00
|
|
|
}
|
|
|
|
};
|
|
|
|
|
2016-12-12 03:37:11 +00:00
|
|
|
MarkdownPreview.prototype.fetchMarkdownPreview = function(text, success) {
|
2016-04-13 12:17:42 +00:00
|
|
|
if (!window.preview_markdown_path) {
|
2016-07-24 20:45:11 +00:00
|
|
|
return;
|
|
|
|
}
|
|
|
|
if (text === this.ajaxCache.text) {
|
2016-12-12 03:15:03 +00:00
|
|
|
success(this.ajaxCache.response);
|
|
|
|
return;
|
2016-07-24 20:45:11 +00:00
|
|
|
}
|
2016-12-12 03:15:03 +00:00
|
|
|
$.ajax({
|
2016-07-24 20:45:11 +00:00
|
|
|
type: 'POST',
|
2016-04-13 12:17:42 +00:00
|
|
|
url: window.preview_markdown_path,
|
2016-07-24 20:45:11 +00:00
|
|
|
data: {
|
|
|
|
text: text
|
|
|
|
},
|
|
|
|
dataType: 'json',
|
2016-12-12 03:18:40 +00:00
|
|
|
success: (function(response) {
|
|
|
|
this.ajaxCache = {
|
|
|
|
text: text,
|
|
|
|
response: response
|
2016-07-24 20:45:11 +00:00
|
|
|
};
|
2016-12-12 03:18:40 +00:00
|
|
|
success(response);
|
|
|
|
}).bind(this)
|
2016-07-24 20:45:11 +00:00
|
|
|
});
|
|
|
|
};
|
|
|
|
|
2016-12-12 03:35:19 +00:00
|
|
|
MarkdownPreview.prototype.hideReferencedUsers = function($form) {
|
|
|
|
$form.find('.referenced-users').hide();
|
2016-07-24 20:45:11 +00:00
|
|
|
};
|
|
|
|
|
2016-12-12 03:35:19 +00:00
|
|
|
MarkdownPreview.prototype.renderReferencedUsers = function(users, $form) {
|
2016-07-24 20:45:11 +00:00
|
|
|
var referencedUsers;
|
2016-12-12 03:35:19 +00:00
|
|
|
referencedUsers = $form.find('.referenced-users');
|
2016-07-24 20:45:11 +00:00
|
|
|
if (referencedUsers.length) {
|
|
|
|
if (users.length >= this.referenceThreshold) {
|
|
|
|
referencedUsers.show();
|
2016-12-12 03:15:03 +00:00
|
|
|
referencedUsers.find('.js-referenced-users-count').text(users.length);
|
2016-07-24 20:45:11 +00:00
|
|
|
} else {
|
2016-12-12 03:15:03 +00:00
|
|
|
referencedUsers.hide();
|
2016-07-24 20:45:11 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
};
|
|
|
|
|
|
|
|
return MarkdownPreview;
|
|
|
|
})();
|
|
|
|
|
2016-12-14 05:26:26 +00:00
|
|
|
markdownPreview = new window.MarkdownPreview();
|
2016-07-24 20:45:11 +00:00
|
|
|
|
|
|
|
previewButtonSelector = '.js-md-preview-button';
|
|
|
|
|
|
|
|
writeButtonSelector = '.js-md-write-button';
|
|
|
|
|
|
|
|
lastTextareaPreviewed = null;
|
|
|
|
|
|
|
|
$.fn.setupMarkdownPreview = function() {
|
2016-12-12 03:15:03 +00:00
|
|
|
var $form = $(this);
|
|
|
|
$form.find('textarea.markdown-area')
|
|
|
|
.on('input', function() {
|
|
|
|
markdownPreview.hideReferencedUsers($form);
|
|
|
|
})
|
|
|
|
.on('blur', function() {
|
|
|
|
markdownPreview.showPreview($form);
|
|
|
|
});
|
2016-07-24 20:45:11 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
$(document).on('markdown-preview:show', function(e, $form) {
|
|
|
|
if (!$form) {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
lastTextareaPreviewed = $form.find('textarea.markdown-area');
|
2016-07-27 03:32:10 +00:00
|
|
|
// toggle tabs
|
2016-07-24 20:45:11 +00:00
|
|
|
$form.find(writeButtonSelector).parent().removeClass('active');
|
|
|
|
$form.find(previewButtonSelector).parent().addClass('active');
|
2016-07-27 03:32:10 +00:00
|
|
|
// toggle content
|
2016-07-24 20:45:11 +00:00
|
|
|
$form.find('.md-write-holder').hide();
|
|
|
|
$form.find('.md-preview-holder').show();
|
2016-12-12 03:15:03 +00:00
|
|
|
markdownPreview.showPreview($form);
|
2016-07-24 20:45:11 +00:00
|
|
|
});
|
|
|
|
|
|
|
|
$(document).on('markdown-preview:hide', function(e, $form) {
|
|
|
|
if (!$form) {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
lastTextareaPreviewed = null;
|
2016-07-27 03:32:10 +00:00
|
|
|
// toggle tabs
|
2016-07-24 20:45:11 +00:00
|
|
|
$form.find(writeButtonSelector).parent().addClass('active');
|
|
|
|
$form.find(previewButtonSelector).parent().removeClass('active');
|
2016-07-27 03:32:10 +00:00
|
|
|
// toggle content
|
2016-07-24 20:45:11 +00:00
|
|
|
$form.find('.md-write-holder').show();
|
|
|
|
$form.find('textarea.markdown-area').focus();
|
2016-12-12 03:15:03 +00:00
|
|
|
$form.find('.md-preview-holder').hide();
|
2016-07-24 20:45:11 +00:00
|
|
|
});
|
|
|
|
|
|
|
|
$(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')]);
|
2016-12-12 03:15:03 +00:00
|
|
|
keyboardEvent.preventDefault();
|
2016-07-24 20:45:11 +00:00
|
|
|
} else if (lastTextareaPreviewed) {
|
|
|
|
$target = lastTextareaPreviewed;
|
|
|
|
$(document).triggerHandler('markdown-preview:hide', [$target.closest('form')]);
|
2016-12-12 03:15:03 +00:00
|
|
|
keyboardEvent.preventDefault();
|
2016-07-24 20:45:11 +00:00
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
$(document).on('click', previewButtonSelector, function(e) {
|
|
|
|
var $form;
|
|
|
|
e.preventDefault();
|
|
|
|
$form = $(this).closest('form');
|
2016-12-12 03:15:03 +00:00
|
|
|
$(document).triggerHandler('markdown-preview:show', [$form]);
|
2016-07-24 20:45:11 +00:00
|
|
|
});
|
|
|
|
|
|
|
|
$(document).on('click', writeButtonSelector, function(e) {
|
|
|
|
var $form;
|
|
|
|
e.preventDefault();
|
|
|
|
$form = $(this).closest('form');
|
2016-12-12 03:15:03 +00:00
|
|
|
$(document).triggerHandler('markdown-preview:hide', [$form]);
|
2016-07-24 20:45:11 +00:00
|
|
|
});
|
|
|
|
|
|
|
|
}).call(this);
|