Skip to content

Instantly share code, notes, and snippets.

@guiltry
Last active May 3, 2017 08:56
Show Gist options
  • Save guiltry/1978c528e925c228343a9c83630a1a44 to your computer and use it in GitHub Desktop.
Save guiltry/1978c528e925c228343a9c83630a1a44 to your computer and use it in GitHub Desktop.
module Articles
module Services
class LompatanMarkdownProcessor
def initialize(full_document = "")
@full_document = full_document
end
def preprocess
document = @full_document.gsub(/\r\n\r\n\r\n/, "\r\n\r\n<br>\r\n")
document = _youtube(document)
return document
end
def postprocess
document = @full_document.gsub(/image\/(\d+)\//, "image/\\1/medium_")
document = document.gsub(/<img src/, '<img class="b-lazy" src="data:image/gif\;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" data-src')
return document
end
# Input:
# !video[https://www.youtube.com/watch?v=0af00UcTO-c]
# !video[https://youtu.be/0af00UcTO-c]
# !video[https://www.youtube.com/embed/0af00UcTO-c]
#
# Output:
# <div class="lompatan-iframe"><iframe src="https://www.youtube.com/embed/0af00UcTO-c" frameborder="0" allowfullscreen></iframe></div>
#
def _youtube(document)
document.gsub!(
/\!video\[https:\/\/(www.)?youtube.com\/watch\?v=(.*)\]/,
'<div class="lompatan-iframe"><iframe src="https://www.youtube.com/embed/\2" frameborder="0" allowfullscreen></iframe></div>'
)
document.gsub!(
/\!video\[https:\/\/(www.)?youtu.be\/(.*)\]/,
'<div class="lompatan-iframe"><iframe src="https://www.youtube.com/embed/\2" frameborder="0" allowfullscreen></iframe></div>'
)
document.gsub!(
/\!video\[https:\/\/(www.)?youtube.com\/embed\/(.*)\]/,
'<div class="lompatan-iframe"><iframe src="https://www.youtube.com/embed/\2" frameborder="0" allowfullscreen></iframe></div>'
)
return document
end
end
end
end
// ==========================================================================
// SimpleMDE
// ==========================================================================
function _replaceSelection(cm, active, startEnd, url) {
if(/editor-preview-active/.test(cm.getWrapperElement().lastChild.className))
return;
var text;
var start = startEnd[0];
var end = startEnd[1];
var startPoint = cm.getCursor("start");
var endPoint = cm.getCursor("end");
if(url) {
end = end.replace("#url#", url);
}
if(active) {
text = cm.getLine(startPoint.line);
start = text.slice(0, startPoint.ch);
end = text.slice(startPoint.ch);
cm.replaceRange(start + end, {
line: startPoint.line,
ch: 0
});
} else {
text = cm.getSelection();
cm.replaceSelection(start + text + end);
startPoint.ch += start.length;
if(startPoint !== endPoint) {
endPoint.ch += start.length;
}
}
cm.setSelection(startPoint, endPoint);
cm.focus();
}
function customRenderer(text) {
// youtube
text = text.replace(/\!video\[https:\/\/(www.)?youtube.com\/watch\?v=(.*)\]/, "<div class=\"lompatan-iframe\"><iframe src=\"https://www.youtube.com/embed/$2\" frameborder=\"0\" allowfullscreen></iframe></div>")
text = text.replace(/\!video\[https:\/\/(www.)?youtu.be\/(.*)\]/, "<div class=\"lompatan-iframe\"><iframe src=\"https://www.youtube.com/embed/$2\" frameborder=\"0\" allowfullscreen></iframe></div>")
text = text.replace(/\!video\[https:\/\/(www.)?youtube.com\/embed\/(.*)\]/, "<div class=\"lompatan-iframe\"><iframe src=\"https://www.youtube.com/embed/$2\" frameborder=\"0\" allowfullscreen></iframe></div>")
return text
}
var simplemde = new SimpleMDE({
element: $("#article_markdown")[0],
spellChecker: false,
promptURLs: true,
autoDownloadFontAwesome: false,
previewRender: function(plainText) {
text = customRenderer(plainText);
text = this.parent.markdown(text);
return text
},
toolbar: [
"bold", "italic", "heading",
"|",
"unordered-list", "ordered-list",
"|",
"link", "image",
{
name: "video",
action: function(editor){
var cm = editor.codemirror;
var stat = editor.getState(cm);
var options = editor.options;
var url = "";
if(options.promptURLs) {
url = prompt("URL for the video:");
if(!url) {
return false;
}
}
_replaceSelection(cm, stat.image, ["!video[", "#url#]"], url);
},
className: "fa fa-play-circle",
title: "Embed Video",
},
"|",
"preview", "side-by-side", "fullscreen",
"|",
"guide"
]
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment