firepad + others WIP

This commit is contained in:
Matthew Scragg 2014-10-01 17:14:54 -05:00
parent ec551ac09d
commit d72ecf10f0
10 changed files with 778 additions and 651 deletions

View file

@ -150,7 +150,25 @@ Access from your browser
http://localhost:5000 http://localhost:5000
## Templating
Realms uses handlebars partials to create templates.
Each page that you create is a potential partial.
Let's create the following partial:
http://localhost:5000/_create/my-partial
<div class="panel panel-default">
<div class="panel-heading">{{ heading }}</div>
<div class="panel-body">
{{ body }}
</div>
</div>
Don't forget to save it.
Now
## Author ## Author
Matthew Scragg <scragg@gmail.com> Matthew Scragg <scragg@gmail.com>

View file

@ -12,7 +12,8 @@
"parsleyjs": "~2.0.3", "parsleyjs": "~2.0.3",
"marked": "~0.3.2", "marked": "~0.3.2",
"js-yaml": "~3.2.1", "js-yaml": "~3.2.1",
"localforage": "~0.9.2", "store-js": "~1.3.16",
"bootswatch-dist": "3.2.0-flatly" "bootswatch-dist": "3.2.0-flatly",
"bootbox": "4.3.0"
} }
} }

View file

@ -52,7 +52,6 @@ CACHE_REDIS_DB = '0'
#CACHE_TYPE = 'memcached' #CACHE_TYPE = 'memcached'
CACHE_MEMCACHED_SERVERS = ['127.0.0.1:11211'] CACHE_MEMCACHED_SERVERS = ['127.0.0.1:11211']
# Get ReCaptcha Keys for your domain here: # Get ReCaptcha Keys for your domain here:
# https://www.google.com/recaptcha/admin#whyrecaptcha # https://www.google.com/recaptcha/admin#whyrecaptcha
RECAPTCHA_ENABLE = False RECAPTCHA_ENABLE = False
@ -75,6 +74,12 @@ REGISTRATION_ENABLED = True
# Used by Flask-Login # Used by Flask-Login
LOGIN_DISABLED = ALLOW_ANON LOGIN_DISABLED = ALLOW_ANON
# None, firepad, or togetherjs
COLLABORATION = 'togetherjs'
# Required for firepad
FIREBASE_HOSTNAME = None
# Page names that can't be modified # Page names that can't be modified
WIKI_LOCKED_PAGES = [] WIKI_LOCKED_PAGES = []
# Depreciated variable name # Depreciated variable name

View file

@ -1,7 +1,8 @@
from realms import assets from realms import assets
assets.register('editor.js', assets.register('editor.js',
'vendor/localforage/dist/localforage.js', 'vendor/store-js/store.js',
'vendor/bootbox/bootbox.js',
'vendor/ace-builds/src/ace.js', 'vendor/ace-builds/src/ace.js',
'vendor/ace-builds/src/mode-markdown.js', 'vendor/ace-builds/src/mode-markdown.js',
'vendor/ace-builds/src/ext-keybinding_menu.js', 'vendor/ace-builds/src/ext-keybinding_menu.js',

View file

@ -139,11 +139,11 @@ class Wiki():
return cached return cached
# commit = gittle.utils.git.commit_info(self.repo[sha]) # commit = gittle.utils.git.commit_info(self.repo[sha])
name = self.cname_to_filename(name).encode('latin-1') filename = self.cname_to_filename(name).encode('latin-1')
sha = sha.encode('latin-1') sha = sha.encode('latin-1')
try: try:
data = self.gittle.get_commit_files(sha, paths=[name]).get(name) data = self.gittle.get_commit_files(sha, paths=[filename]).get(filename)
if not data: if not data:
return None return None
partials = {} partials = {}
@ -153,6 +153,7 @@ class Wiki():
for partial_name in meta['import']: for partial_name in meta['import']:
partials[partial_name] = self.get_page(partial_name) partials[partial_name] = self.get_page(partial_name)
data['partials'] = partials data['partials'] = partials
data['info'] = self.get_history(name, limit=1)[0]
return data return data
except KeyError: except KeyError:
@ -175,10 +176,10 @@ class Wiki():
new = self.get_page(name, sha=new_sha) new = self.get_page(name, sha=new_sha)
return ghdiff.diff(old['data'], new['data']) return ghdiff.diff(old['data'], new['data'])
def get_history(self, name): def get_history(self, name, limit=100):
file_path = self.cname_to_filename(name) file_path = self.cname_to_filename(name)
versions = [] versions = []
walker = self.repo.get_walker(paths=[file_path], max_entries=100) walker = self.repo.get_walker(paths=[file_path], max_entries=limit)
for entry in walker: for entry in walker:
change_type = None change_type = None
for change in entry.changes(): for change in entry.changes():

View file

@ -74,7 +74,12 @@ def edit(name):
name = remove_ext(data['name']) name = remove_ext(data['name'])
content = data.get('data') content = data.get('data')
g.assets['js'].append('editor.js') g.assets['js'].append('editor.js')
return render_template('wiki/edit.html', name=name, content=content, sha=data.get('sha'), partials=data.get('partials')) return render_template('wiki/edit.html',
name=name,
content=content,
info=data.get('info'),
sha=data.get('sha'),
partials=data.get('partials'))
else: else:
return redirect(url_for('wiki.create', name=cname)) return redirect(url_for('wiki.create', name=cname))
@ -110,7 +115,10 @@ def create(name):
return redirect(url_for('wiki.edit', name=cname)) return redirect(url_for('wiki.edit', name=cname))
g.assets['js'].append('editor.js') g.assets['js'].append('editor.js')
return render_template('wiki/edit.html', name=cname, content="") return render_template('wiki/edit.html',
name=cname,
content="",
info={})
@blueprint.route("/", defaults={'name': 'home'}) @blueprint.route("/", defaults={'name': 'home'})

View file

@ -186,7 +186,7 @@ a.label {
right: 0; right: 0;
bottom: 0; bottom: 0;
left: 0; left: 0;
padding: 40px 10px 10px 10px; padding: 45px 10px 10px 10px;
overflow: auto; overflow: auto;
//word-break: break-word; //word-break: break-word;
cursor: default; cursor: default;
@ -217,7 +217,7 @@ a.label {
background-color: #eee; background-color: #eee;
} }
#editor { .editor {
margin-top: 40px; margin-top: 40px;
} }
@ -226,7 +226,7 @@ a.label {
padding: 3px; padding: 3px;
} }
#editor { .editor {
margin-top: 0; margin-top: 0;
} }

View file

@ -1,59 +1,245 @@
/* function Aced(settings) {
Source is modified version of http://dillinger.io/ var id,
*/ options,
$(function () { editor,
element,
preview,
previewWrapper,
profile,
autoInterval,
themes,
themeSelect,
loadedThemes = {};
var url_prefix = ""; settings = settings || {};
var sha = $("#sha").text();
var $theme = $('#theme-list');
var $preview = $('#preview');
var $autosave = $('#autosave');
var $wordcount = $('#wordcount');
var $wordcounter = $('#wordcounter');
var $pagename = $("#page-name");
var $entry_markdown_header = $("#entry-markdown-header"); options = {
var $entry_preview_header = $("#entry-preview-header"); sanitize: true,
preview: null,
// Tabs editor: null,
$entry_markdown_header.click(function(){ theme: 'idle_fingers',
$("section.entry-markdown").addClass('active'); themePath: '/static/vendor/ace-builds/src',
$("section.entry-preview").removeClass('active'); mode: 'markdown',
}); autoSave: true,
autoSaveInterval: 5000,
$entry_preview_header.click(function(){ syncPreview: false,
$("section.entry-preview").addClass('active'); keyMaster: false,
$("section.entry-markdown").removeClass('active'); submit: function(data){ alert(data); },
}); showButtonBar: false,
themeSelect: null,
submitBtn: null,
var editor; renderer: null,
var autoInterval; info: null
var profile = {
theme: 'ace/theme/idle_fingers',
currentMd: '',
autosave: {
enabled: true,
interval: 3000 // might be too aggressive; don't want to block UI for large saves.
},
current_filename: $pagename.val()
}; };
// Feature detect ish themes = {
var dillinger = 'dillinger'; chrome: "Chrome",
var dillingerElem = document.createElement(dillinger); clouds: "Clouds",
var dillingerStyle = dillingerElem.style; clouds_midnight: "Clouds Midnight",
var domPrefixes = 'Webkit Moz O ms Khtml'.split(' '); cobalt: "Cobalt",
crimson_editor: "Crimson Editor",
dawn: "Dawn",
dreamweaver: "Dreamweaver",
eclipse: "Eclipse",
idle_fingers: "idleFingers",
kr_theme: "krTheme",
merbivore: "Merbivore",
merbivore_soft: "Merbivore Soft",
mono_industrial: "Mono Industrial",
monokai: "Monokai",
pastel_on_dark: "Pastel on Dark",
solarized_dark: "Solarized Dark",
solarized_light: "Solarized Light",
textmate: "TextMate",
tomorrow: "Tomorrow",
tomorrow_night: "Tomorrow Night",
tomorrow_night_blue: "Tomorrow Night Blue",
tomorrow_night_bright: "Tomorrow Night Bright",
tomorrow_night_eighties: "Tomorrow Night 80s",
twilight: "Twilight",
vibrant_ink: "Vibrant Ink"
};
/// UTILS ================= function editorId() {
return "aced." + id;
}
function infoKey() {
return editorId() + ".info";
}
function gc() {
// Clean up localstorage
store.forEach(function(key, val) {
var re = new RegExp("aced\.(.*?)\.info");
var info = re.exec(key);
if (!info || !val.time) {
return;
}
var id = info[1];
// Remove week+ old stuff
var now = new Date().getTime() / 1000;
if (now > (val.time + 604800)) {
store.remove(key);
store.remove('aced.' + id);
}
});
}
function buildThemeSelect() {
var $sel = $("<select class='aced-theme-sel' data-placeholder='Theme'></select>");
$sel.append('<option></option>');
$.each(themes, function(k, v) {
$sel.append("<option value='" + k + "'>" + v + "</option>");
});
return $("<div/>").html($sel);
}
function toJquery(o) {
return (typeof o == 'string') ? $("#" + o) : $(o);
}
function initProfile() {
profile = {theme: ''};
try {
// Need to merge in any undefined/new properties from last release
// Meaning, if we add new features they may not have them in profile
profile = $.extend(true, profile, store.get('aced.profile'));
} catch (e) { }
}
function updateProfile(obj) {
profile = $.extend(null, profile, obj);
store.set('profile', profile);
}
function render(content) {
return (options.renderer) ? options.renderer(content) : content;
}
function bindKeyboard() {
// CMD+s TO SAVE DOC
key('command+s, ctrl+s', function (e) {
submit();
e.preventDefault();
});
var saveCommand = {
name: "save",
bindKey: {
mac: "Command-S",
win: "Ctrl-S"
},
exec: function () {
submit();
}
};
editor.commands.addCommand(saveCommand);
}
function info(info) {
if (info) {
store.set(infoKey(), info);
}
return store.get(infoKey());
}
function val(val) {
// Alias func
if (val) {
editor.getSession().setValue(val);
}
return editor.getSession().getValue();
}
function discardDraft() {
stopAutoSave();
store.remove(editorId());
store.remove(infoKey());
location.reload();
}
function save() {
store.set(editorId(), val());
}
function submit() {
store.remove(editorId());
store.remove(editorId() + ".info");
options.submit(val());
}
function autoSave() {
if (options.autoSave) {
autoInterval = setInterval(function () {
save();
}, options.autoSaveInterval);
} else {
stopAutoSave();
}
}
function stopAutoSave() {
if (autoInterval){
clearInterval(autoInterval)
}
}
function renderPreview() {
if (!preview) {
return;
}
preview.html(render(val()));
$('pre code', preview).each(function(i, e) {
hljs.highlightBlock(e)
});
}
function getScrollHeight($prevFrame) {
// Different browsers attach the scrollHeight of a document to different
// elements, so handle that here.
if ($prevFrame[0].scrollHeight !== undefined) {
return $prevFrame[0].scrollHeight;
} else if ($prevFrame.find('html')[0].scrollHeight !== undefined &&
$prevFrame.find('html')[0].scrollHeight !== 0) {
return $prevFrame.find('html')[0].scrollHeight;
} else {
return $prevFrame.find('body')[0].scrollHeight;
}
}
function getPreviewWrapper(obj) {
// Attempts to get the wrapper for preview based on overflow prop
if (!obj) {
return;
}
if (obj.css('overflow') == 'auto' || obj.css('overflow') == 'scroll') {
return obj;
} else {
return getPreviewWrapper(obj.parent());
}
}
function syncPreview() {
var editorScrollRange = (editor.getSession().getLength());
var previewScrollRange = (getScrollHeight(preview));
// Find how far along the editor is (0 means it is scrolled to the top, 1
// means it is at the bottom).
var scrollFactor = editor.getFirstVisibleRow() / editorScrollRange;
// Set the scroll position of the preview pane to match. jQuery will
// gracefully handle out-of-bounds values.
previewWrapper.scrollTop(scrollFactor * previewScrollRange);
}
/**
* Utility method to async load a JavaScript file.
*
* @param {String} The name of the file to load
* @param {Function} Optional callback to be executed after the script loads.
* @return {void}
*/
function asyncLoad(filename, cb) { function asyncLoad(filename, cb) {
(function (d, t) { (function (d, t) {
@ -71,459 +257,174 @@ $(function () {
}(document, 'script')); }(document, 'script'));
} }
/** function setTheme(theme) {
* Grab the user's profile from localStorage and stash in "profile" variable. var cb = function(theme) {
* editor.setTheme('ace/theme/'+theme);
* @return {Void} updateProfile({theme: theme});
*/
function getUserProfile() {
localforage.getItem('profile', function(p) {
profile = $.extend(true, profile, p);
if (profile.filename != $pagename.val()) {
setEditorValue("");
updateUserProfile({ filename: $pagename.val(), currentMd: "" });
} else {
if (profile.currentMd) {
setEditorValue(profile.currentMd);
}
}
});
}
/**
* Update user's profile in localStorage by merging in current profile with passed in param.
*
* @param {Object} An object containg proper keys and values to be JSON.stringify'd
* @return {Void}
*/
function updateUserProfile(obj) {
localforage.clear();
localforage.setItem('profile', $.extend(true, profile, obj));
}
/**
* Utility method to test if particular property is supported by the browser or not.
* Completely ripped from Modernizr with some mods.
* Thx, Modernizr team!
*
* @param {String} The property to test
* @return {Boolean}
*/
function prefixed(prop) {
return testPropsAll(prop, 'pfx')
}
/**
* A generic CSS / DOM property test; if a browser supports
* a certain property, it won't return undefined for it.
* A supported CSS property returns empty string when its not yet set.
*
* @param {Object} A hash of properties to test
* @param {String} A prefix
* @return {Boolean}
*/
function testProps(props, prefixed) {
for (var i in props) {
if (dillingerStyle[ props[i] ] !== undefined) {
return prefixed === 'pfx' ? props[i] : true;
}
}
return false
}
/**
* Tests a list of DOM properties we want to check against.
* We specify literally ALL possible (known and/or likely) properties on
* the element including the non-vendor prefixed one, for forward-
* compatibility.
*
* @param {String} The name of the property
* @param {String} The prefix string
* @return {Boolean}
*/
function testPropsAll(prop, prefixed) {
var ucProp = prop.charAt(0).toUpperCase() + prop.substr(1)
, props = (prop + ' ' + domPrefixes.join(ucProp + ' ') + ucProp).split(' ');
return testProps(props, prefixed);
}
/**
* Normalize the transitionEnd event across browsers.
*
* @return {String}
*/
function normalizeTransitionEnd() {
var transEndEventNames =
{
'WebkitTransition': 'webkitTransitionEnd', 'MozTransition': 'transitionend', 'OTransition': 'oTransitionEnd', 'msTransition': 'msTransitionEnd' // maybe?
, 'transition': 'transitionend'
}; };
return transEndEventNames[ prefixed('transition') ]; if (loadedThemes[theme]) {
} cb(theme);
/**
* Returns the full text of an element and all its children.
* The script recursively traverses all text nodes, and returns a
* concatenated string of all texts.
*
* Taken from
* http://stackoverflow.com/questions/2653670/innertext-textcontent-vs-retrieving-each-text-node
*
* @param node
* @return {int}
*/
function getTextInElement(node) {
if (node.nodeType === 3) {
return node.data;
}
var txt = '';
if (node = node.firstChild) do {
txt += getTextInElement(node);
} while (node = node.nextSibling);
return txt;
}
/**
* Counts the words in a string
*
* @param string
* @return int
*/
function countWords(string) {
var words = string.replace(/W+/g, ' ').match(/\S+/g);
return words && words.length || 0;
}
/**
* Initialize application.
*
* @return {Void}
*/
function init() {
// Attach to jQuery support object for later use.
$.support.transitionEnd = normalizeTransitionEnd();
initAce();
getUserProfile();
initUi();
bindPreview();
bindNav();
bindKeyboard();
autoSave();
}
function initAce() {
editor = ace.edit("editor");
editor.focus();
editor.setOptions({
enableBasicAutocompletion: true
});
}
function initUi() {
// Set proper theme value in theme dropdown
fetchTheme(profile.theme, function () {
$theme.find('li > a[data-value="' + profile.theme + '"]').addClass('selected');
editor.setBehavioursEnabled(true);
editor.getSession().setUseWrapMode(true);
editor.setShowPrintMargin(false);
editor.getSession().setTabSize(2);
editor.getSession().setUseSoftTabs(true);
editor.renderer.setShowInvisibles(true);
editor.renderer.setShowGutter(false);
editor.getSession().setMode('ace/mode/markdown');
setEditorValue(profile.currentMd || editor.getSession().getValue());
previewMd();
});
// Set text for dis/enable autosave / word counter
$autosave.html(profile.autosave.enabled ? '<i class="icon-remove"></i>&nbsp;Disable Autosave' : '<i class="icon-ok"></i>&nbsp;Enable Autosave');
$wordcount.html(!profile.wordcount ? '<i class="icon-remove"></i>&nbsp;Disabled Word Count' : '<i class="icon-ok"></i>&nbsp;Enabled Word Count');
$('.dropdown-toggle').dropdown();
}
function clearSelection() {
setEditorValue("");
previewMd();
}
function saveFile(isManual) {
updateUserProfile({currentMd: editor.getSession().getValue()});
if (isManual) {
updateUserProfile({ currentMd: "" });
var data = {
name: $pagename.val(),
message: $("#page-message").val(),
content: editor.getSession().getValue()
};
$.post(window.location, data, function() {
location.href = url_prefix + '/' + data['name'];
});
}
}
function autoSave() {
if (profile.autosave.enabled) {
autoInterval = setInterval(function() {
saveFile();
}, profile.autosave.interval);
} else { } else {
clearInterval(autoInterval) asyncLoad(options.themePath + "/theme-" + theme + ".js", function () {
} cb(theme);
loadedThemes[theme] = true;
}
$("#save-native").on('click', function() {
saveFile(true);
});
function resetProfile() {
// For some reason, clear() is not working in Chrome.
localforage.clear();
// Let's turn off autosave
profile.autosave.enabled = false;
localforage.removeItem('profile', function() {
window.location.reload();
});
}
function changeTheme(e) {
// check for same theme
var $target = $(e.target);
if ($target.attr('data-value') === profile.theme) {
return;
}
else {
// add/remove class
$theme.find('li > a.selected').removeClass('selected');
$target.addClass('selected');
// grabnew theme
var newTheme = $target.attr('data-value');
$(e.target).blur();
fetchTheme(newTheme, function () {
}); });
} }
} }
function fetchTheme(th, cb) { function initSyncPreview() {
var name = th.split('/').pop(); if (!preview || !options.syncPreview) return;
asyncLoad("/static/vendor/ace-builds/src/theme-" + name + ".js", function () { previewWrapper = getPreviewWrapper(preview);
editor.setTheme(th);
cb && cb();
updateBg(name);
updateUserProfile({theme: th});
});
}
function updateBg(name) {
// document.body.style.backgroundColor = bgColors[name]
}
function setEditorValue(str) {
editor.getSession().setValue(str);
}
function previewMd() {
$preview.html(MDR.convert(editor.getSession().getValue(), true));
}
function updateFilename(str) {
// Check for string because it may be keyup event object
var f;
if (typeof str === 'string') {
f = str;
} else {
f = getCurrentFilenameFromField();
}
updateUserProfile({ current_filename: f });
}
function showHtml() {
// TODO: UPDATE TO SUPPORT FILENAME NOT JUST A RANDOM FILENAME
var unmd = editor.getSession().getValue();
function _doneHandler(jqXHR, data, response) {
// console.dir(resp)
var resp = JSON.parse(response.responseText);
$('#myModalBody').text(resp.data);
$('#myModal').modal();
}
function _failHandler() {
alert("Roh-roh. Something went wrong. :(");
}
var config = {
type: 'POST',
data: "unmd=" + encodeURIComponent(unmd),
dataType: 'json',
url: '/factory/fetch_html_direct',
error: _failHandler,
success: _doneHandler
};
$.ajax(config)
}
function toggleAutoSave() {
$autosave.html(profile.autosave.enabled ? '<i class="icon-remove"></i>&nbsp;Disable Autosave' : '<i class="icon-ok"></i>&nbsp;Enable Autosave');
updateUserProfile({autosave: {enabled: !profile.autosave.enabled }});
autoSave();
}
function bindPreview() {
editor.getSession().on('change', function (e) {
previewMd();
});
}
function bindNav() {
$theme
.find('li > a')
.bind('click', function (e) {
changeTheme(e);
return false;
});
$('#clear')
.on('click', function () {
clearSelection();
return false;
});
$("#autosave")
.on('click', function () {
toggleAutoSave();
return false;
});
$('#reset')
.on('click', function () {
resetProfile();
return false;
});
$('#cheat').
on('click', function () {
window.open("https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet", "_blank");
return false;
});
} // end bindNav()
function bindKeyboard() {
// CMD+s TO SAVE DOC
key('command+s, ctrl+s', function (e) {
saveFile(true);
e.preventDefault(); // so we don't save the web page - native browser functionality
});
var saveCommand = {
name: "save",
bindKey: {
mac: "Command-S",
win: "Ctrl-S"
},
exec: function () {
saveFile(true);
}
};
editor.commands.addCommand(saveCommand);
}
init();
});
function getScrollHeight($prevFrame) {
// Different browsers attach the scrollHeight of a document to different
// elements, so handle that here.
if ($prevFrame[0].scrollHeight !== undefined) {
return $prevFrame[0].scrollHeight;
} else if ($prevFrame.find('html')[0].scrollHeight !== undefined &&
$prevFrame.find('html')[0].scrollHeight !== 0) {
return $prevFrame.find('html')[0].scrollHeight;
} else {
return $prevFrame.find('body')[0].scrollHeight;
}
}
function syncPreview() {
var $ed = window.ace.edit('editor');
var $prev = $('#preview');
var editorScrollRange = ($ed.getSession().getLength());
var previewScrollRange = (getScrollHeight($prev));
// Find how far along the editor is (0 means it is scrolled to the top, 1
// means it is at the bottom).
var scrollFactor = $ed.getFirstVisibleRow() / editorScrollRange;
// Set the scroll position of the preview pane to match. jQuery will
// gracefully handle out-of-bounds values.
$prev.parent().scrollTop(scrollFactor * previewScrollRange);
}
window.onload = function () { window.onload = function () {
var $loading = $('#loading');
if ($.support.transition) {
$loading
.bind($.support.transitionEnd, function () {
$('#main').removeClass('bye');
$loading.remove();
})
.addClass('fade_slow');
} else {
$('#main').removeClass('bye');
$loading.remove();
}
/** /**
* Bind synchronization of preview div to editor scroll and change * Bind synchronization of preview div to editor scroll and change
* of editor cursor position. * of editor cursor position.
*/ */
window.ace.edit('editor').session.on('changeScrollTop', syncPreview); editor.session.on('changeScrollTop', syncPreview);
window.ace.edit('editor').session.selection.on('changeCursor', syncPreview); editor.session.selection.on('changeCursor', syncPreview);
}; };
}
function initProps() {
// Id of editor
if (typeof settings == 'string') {
settings = { editor: settings };
}
if ('theme' in profile && profile['theme']) {
settings['theme'] = profile['theme'];
}
if (settings['preview'] && !settings.hasOwnProperty('syncPreview')) {
settings['syncPreview'] = true;
}
$.extend(options, settings);
if (options.editor) {
element = toJquery(options.editor);
}
$.each(options, function(k, v){
if (element.data(k.toLowerCase())) {
options[k] = element.data(k.toLowerCase());
}
});
if (options.themeSelect) {
themeSelect = toJquery(options.themeSelect);
}
if (options.submitBtn) {
var submitBtn = toJquery(options.submitBtn);
submitBtn.click(function(){
submit();
});
}
if (options.preview) {
preview = toJquery(options.preview);
// Enable sync unless set otherwise
if (!settings.hasOwnProperty('syncPreview')) {
options['syncPreview'] = true;
}
}
if (!element.attr('id')) {
// No id, make one!
id = Math.random().toString(36).substring(7);
element.attr('id', id);
} else {
id = element.attr('id')
}
}
function initEditor() {
editor = ace.edit(id);
setTheme(profile.theme || options.theme);
editor.getSession().setMode('ace/mode/' + options.mode);
if (store.get(editorId()) && store.get(editorId()) != val()) {
editor.getSession().setValue(store.get(editorId()));
}
editor.getSession().setUseWrapMode(true);
editor.getSession().setTabSize(2);
editor.getSession().setUseSoftTabs(true);
editor.setShowPrintMargin(false);
editor.renderer.setShowInvisibles(true);
editor.renderer.setShowGutter(false);
if (options.showButtonBar) {
var $btnBar = $('<div class="aced-button-bar aced-button-bar-top">' + buildThemeSelect().html() + ' <button type="button" class="btn btn-primary btn-xs aced-save">Save</button></div>')
element.find('.ace_content').before($btnBar);
$(".aced-save", $btnBar).click(function(){
submit();
});
if ($.fn.chosen) {
$('select', $btnBar).chosen().change(function(){
setTheme($(this).val());
});
}
}
if (options.keyMaster) {
bindKeyboard();
}
if (preview) {
editor.getSession().on('change', function (e) {
renderPreview();
});
renderPreview();
}
if (themeSelect) {
themeSelect
.find('li > a')
.bind('click', function (e) {
setTheme($(e.target).data('value'));
$(e.target).blur();
return false;
});
}
if (options.info) {
// If no info exists, save it to storage
if (!store.get(infoKey())) {
store.set(infoKey(), options.info);
} else {
// Check info in storage against one passed in
// for possible changes in data that may have occurred
var info = store.get(infoKey());
if (info['sha'] != options.info['sha'] && !info['ignore']) {
// Data has changed since start of draft
$(document).trigger('shaMismatch');
}
}
}
$(this).trigger('ready');
}
function init() {
gc();
initProfile();
initProps();
initEditor();
initSyncPreview();
autoSave();
}
init();
return {
editor: editor,
submit: submit,
val: val,
discard: discardDraft,
info: info
};
}

View file

@ -58,7 +58,7 @@ hljs.initHighlightingOnLoad();
var MDR = { var MDR = {
meta: null, meta: null,
md: null, md: null,
sanitize: false, // Override sanitize: true, // Override
parse: function(md){ return marked(md); }, parse: function(md){ return marked(md); },
convert: function(md, sanitize) { convert: function(md, sanitize) {
if (this.sanitize !== null) { if (this.sanitize !== null) {
@ -76,9 +76,7 @@ var MDR = {
// Causes some problems with inline styles // Causes some problems with inline styles
html = html_sanitize(html, function(url) { html = html_sanitize(html, function(url) {
try { try {
var prot = decodeURIComponent(unescape(url)) var prot = decodeURIComponent(url.toString());
.replace(/[^\w:]/g, '')
.toLowerCase();
} catch (e) { } catch (e) {
return ''; return '';
} }

View file

@ -1,8 +1,81 @@
{% extends 'layout.html' %} {% extends 'layout.html' %}
{% block js %} {% block js %}
<script> <script>
var $entry_markdown_header = $("#entry-markdown-header");
var $entry_preview_header = $("#entry-preview-header");
// Tabs
$entry_markdown_header.click(function(){
$("section.entry-markdown").addClass('active');
$("section.entry-preview").removeClass('active');
});
$entry_preview_header.click(function(){
$("section.entry-preview").addClass('active');
$("section.entry-markdown").removeClass('active');
});
$(document).on('shaMismatch', function() {
bootbox.dialog({
title: "Page has changed",
message: "This page has changed and differs from your draft. What do you want to do?",
buttons: {
ignore: {
label: "Ignore",
className: "btn-default",
callback: function() {
var info = aced.info();
info['ignore'] = true;
aced.info(info);
}
},
discard: {
label: "Discard Draft",
className: "btn-danger",
callback: function() {
aced.discard();
}
},
changes: {
label: "Show Diff",
className: "btn-primary",
callback: function() {
bootbox.alert("Draft diff not done! Sorry");
}
}
}
})
});
$(function(){ $(function(){
$("#discard-btn").click(function() {
aced.discard();
});
$(".entry-markdown .floatingheader").click(function(){
aced.editor.focus();
});
});
var aced = new Aced({
editor: 'editor-{{- name -}}',
renderer: function(md) { return MDR.convert(md) },
info: {{ info|tojson }},
submit: function(content) {
var data = {
name: $("#page-name").val(),
message: $("#page-message").val(),
content: content
};
$.post(window.location, data, function() {
location.href = "{{ config.get('RELATIVE_PATH') }}" + '/' + data['name'];
});
}
});
</script>
{% if partials %} {% if partials %}
<script>
$(function() {
{% for name, value in partials.items() %} {% for name, value in partials.items() %}
{% if name and value %} {% if name and value %}
try { try {
@ -12,13 +85,119 @@
} }
{% endif %} {% endif %}
{% endfor %} {% endfor %}
});
</script>
{% endif %} {% endif %}
$("#start-togetherjs").click(function(){
$(this).prop('disabled', true).html("Loading"); {% if config.get('COLLABORATION') %}
<script>
var $startCollaborationBtn = $('#start-collaboration');
var $endCollaborationBtn = $('#end-collaboration');
var $loadingCollaborationBtn = $('#loading-collaboration');
function loadingCollaboration() {
$endCollaborationBtn.hide();
$startCollaborationBtn.hide();
$loadingCollaborationBtn.show();
$(document).trigger('loading-collaboration');
}
function startCollaboration() {
$loadingCollaborationBtn.hide();
$startCollaborationBtn.hide();
$endCollaborationBtn.show();
$(document).trigger('start-collaboration');
}
function endCollaboration() {
$loadingCollaborationBtn.hide();
$endCollaborationBtn.hide();
$startCollaborationBtn.show();
$(document).trigger('end-collaboration');
}
$(function() {
$startCollaborationBtn.click(function() {
loadingCollaboration();
});
$endCollaborationBtn.click(function() {
endCollaboration();
}); });
}); });
</script>
{% endif %}
{% if config.get('COLLABORATION') == 'firepad' %}
<script src="https://cdn.firebase.com/js/client/1.0.17/firebase.js"></script>
<script src="https://cdn.firebase.com/libs/firepad/1.0.0/firepad.min.js"></script>
<script>
// Helper to get hash from end of URL or generate a random one.
function getExampleRef() {
var ref = new Firebase('https://{{ config.get("FIREBASE_HOSTNAME") }}');
var hash = window.location.hash.replace(/^#fp-/, '');
if (hash) {
ref = ref.child(hash);
} else {
ref = ref.push(); // generate unique location.
window.location = window.location + '#fp-' + ref.name(); // add it as a hash to the URL.
}
return ref;
}
function initFirepad() {
var new_ = true;
if (window.location.hash.lastIndexOf('#fp-', 0) === 0) {
new_ = false;
}
var firepadRef = getExampleRef();
var session = window.ace.edit('editor').session;
var content;
if (new_) {
content = session.getValue();
}
// Firepad wants an empty editor
session.setValue('');
//// Create Firepad.
var firepad = Firepad.fromACE(firepadRef, aced.editor, {
defaultText: content
});
firepad.on('ready', function() {
startCollaboration();
});
$(document).on('end-collaboration', function() {
firepad.dispose();
});
}
$(document).on('loading-collaboration', function() {
initFirepad(true);
});
$(function(){
if (window.location.hash.lastIndexOf('#fp-', 0) === 0) {
loadingCollaboration();
}
});
</script>
{% endif %}
{% if config.get('COLLABORATION') == 'togetherjs' %}
<script>
$(document).on('loading-collaboration', function() {
TogetherJS();
});
$(document).on('end-collaboration', function() {
TogetherJS();
});
TogetherJSConfig_toolName = "Collaboration"; TogetherJSConfig_toolName = "Collaboration";
TogetherJSConfig_suppressJoinConfirmation = true; TogetherJSConfig_suppressJoinConfirmation = true;
{% if current_user.is_authenticated() %} {% if current_user.is_authenticated() %}
TogetherJSConfig_getUserName = function () { TogetherJSConfig_getUserName = function () {
return {{ current_user.username|tojson }}; return {{ current_user.username|tojson }};
@ -30,16 +209,16 @@
{% endif %} {% endif %}
TogetherJSConfig_on_ready = function () { TogetherJSConfig_on_ready = function () {
MDR.sanitize = true; startCollaboration();
$("#preview").html('');
$("#start-togetherjs").addClass('btn-danger').html('End Collaboration').prop('disabled', false);
}; };
TogetherJSConfig_on_close = function () { TogetherJSConfig_on_close = function () {
MDR.sanitize = false; //endCollaboration();
$("#start-togetherjs").removeClass('btn-danger').html('Collaborate').prop('disabled', false);
}; };
</script> </script>
<script src="https://togetherjs.com/togetherjs-min.js"></script> <script src="https://togetherjs.com/togetherjs-min.js"></script>
{% endif %}
{% endblock %} {% endblock %}
{% block body %} {% block body %}
@ -55,51 +234,66 @@
<div class="col-md-6 col-xs-4"> <div class="col-md-6 col-xs-4">
<div class="pull-right"> <div class="pull-right">
<button class="btn btn-default btn-sm" id="start-togetherjs" type="button" <button id="discard-btn" class="btn btn-sm btn-danger">
onclick="TogetherJS(this); return false"> <i class="fa fa-trash-o"></i>
<span class="hidden-xs">Discard Draft</span>
</button>
<i class="fa fa-comments-o visible-xs"></i> {% if config.get('COLLABORATION') %}
<button style='display:none' class="btn btn-danger btn-sm" id="end-collaboration">
<i class="fa fa-comments-o"></i>
<span class="hidden-xs">End Collaboration</span>
</button>
<button class="btn btn-default btn-sm" id="start-collaboration" type="button">
<i class="fa fa-comments-o"></i>
<span class="hidden-xs">Collaborate</span> <span class="hidden-xs">Collaborate</span>
</button> </button>
<a href="#" id="drop6" role="button" class="dropdown-toggle btn btn-default btn-sm" data-toggle="dropdown"> <button style='display:none' class="btn btn-default btn-sm" id="loading-collaboration" type="button">
<i class="fa fa-paint-brush visible-xs"></i> <i class="fa fa-cog fa-spin"></i>
<span class="hidden-xs">Loading</span>
</button>
{% endif %}
<a id="drop6" role="button" class="dropdown-toggle btn btn-default btn-sm" data-toggle="dropdown">
<i class="fa fa-paint-brush"></i>
<span class="hidden-xs">Theme <i class="fa fa-caret-down"></i></span> <span class="hidden-xs">Theme <i class="fa fa-caret-down"></i></span>
</a> </a>
<ul id="theme-list" class="dropdown-menu" role="menu" aria-labelledby="drop6"> <ul id="theme-list" class="dropdown-menu" role="menu" aria-labelledby="drop6">
<li><a tabindex="-1" href="#" data-value="ace/theme/chrome" >Chrome</a></li> <li><a tabindex="-1" data-value="chrome" >Chrome</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/clouds" >Clouds</a></li> <li><a tabindex="-1" data-value="clouds" >Clouds</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/clouds_midnight" >Clouds Midnight</a></li> <li><a tabindex="-1" data-value="clouds_midnight" >Clouds Midnight</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/cobalt" >Cobalt</a></li> <li><a tabindex="-1" data-value="cobalt" >Cobalt</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/crimson_editor" >Crimson Editor</a></li> <li><a tabindex="-1" data-value="crimson_editor" >Crimson Editor</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/dawn" class="selected">Dawn</a></li> <li><a tabindex="-1" data-value="dawn" class="selected">Dawn</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/dreamweaver" >Dreamweaver</a></li> <li><a tabindex="-1" data-value="dreamweaver" >Dreamweaver</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/eclipse" >Eclipse</a></li> <li><a tabindex="-1" data-value="eclipse" >Eclipse</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/idle_fingers" >idleFingers</a></li> <li><a tabindex="-1" data-value="idle_fingers" >idleFingers</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/kr_theme" >krTheme</a></li> <li><a tabindex="-1" data-value="kr_theme" >krTheme</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/merbivore" >Merbivore</a></li> <li><a tabindex="-1" data-value="merbivore" >Merbivore</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/merbivore_soft" >Merbivore Soft</a></li> <li><a tabindex="-1" data-value="merbivore_soft" >Merbivore Soft</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/mono_industrial" >Mono Industrial</a></li> <li><a tabindex="-1" data-value="mono_industrial" >Mono Industrial</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/monokai" >Monokai</a></li> <li><a tabindex="-1" data-value="monokai" >Monokai</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/pastel_on_dark">Pastel on Dark</a></li> <li><a tabindex="-1" data-value="pastel_on_dark">Pastel on Dark</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/solarized_dark" >Solarized Dark</a></li> <li><a tabindex="-1" data-value="solarized_dark" >Solarized Dark</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/solarized_light" >Solarized Light</a></li> <li><a tabindex="-1" data-value="solarized_light" >Solarized Light</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/textmate" >TextMate</a></li> <li><a tabindex="-1" data-value="textmate" >TextMate</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/tomorrow" >Tomorrow</a></li> <li><a tabindex="-1" data-value="tomorrow" >Tomorrow</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/tomorrow_night">Tomorrow Night</a></li> <li><a tabindex="-1" data-value="tomorrow_night">Tomorrow Night</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/tomorrow_night_blue" >Tomorrow Night Blue</a></li> <li><a tabindex="-1" data-value="tomorrow_night_blue" >Tomorrow Night Blue</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/tomorrow_night_bright" >Tomorrow Night Bright</a></li> <li><a tabindex="-1" data-value="tomorrow_night_bright" >Tomorrow Night Bright</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/tomorrow_night_eighties" >Tomorrow Night 80s</a></li> <li><a tabindex="-1" data-value="tomorrow_night_eighties" >Tomorrow Night 80s</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/twilight" >Twilight</a></li> <li><a tabindex="-1" data-value="twilight" >Twilight</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/vibrant_ink" >Vibrant Ink</a></li> <li><a tabindex="-1" data-value="vibrant_ink" >Vibrant Ink</a></li>
</ul> </ul>
{% if name in config.LOCKED %} {% if name in config['LOCKED'] %}
<a class="btn btn-danger btn-sm"> <a class="btn btn-danger btn-sm">
<i class="fa fa-lock"></i> <i class="fa fa-lock"></i>
<span class="hidden-xs">Locked</span> <span class="hidden-xs">Locked</span>
</a> </a>
{% else %} {% else %}
<a id="save-native" class="btn btn-primary btn-sm"> <a id="submit-btn" class="btn btn-primary btn-sm">
<i class="fa fa-save"></i> <i class="fa fa-save"></i>
<span class="hidden-xs">Save</span> <span class="hidden-xs">Save</span>
</a> </a>
@ -114,7 +308,7 @@
<a class="markdown-help" href=""><span class="hidden">What is Markdown?</span></a> <a class="markdown-help" href=""><span class="hidden">What is Markdown?</span></a>
</header> </header>
<section id="entry-markdown-content" class="entry-markdown-content"> <section id="entry-markdown-content" class="entry-markdown-content">
<div id="editor" class="ace-editor">{{ content }}</div> <div id="editor-{{- name -}}" data-submitbtn='submit-btn' data-themeselect="theme-list" data-mode="markdown" data-preview="preview" class="editor">{{ content }}</div>
</section> </section>
</section> </section>