Personal/realms-wiki
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

firepad + others WIP

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

18
README.md
View file

@ -150,7 +150,25 @@ Access from your browser
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
Matthew Scragg <scragg@gmail.com>

5
bower.json
View file

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

7
realms/config/__init__.py
View file

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

3
realms/modules/wiki/assets.py
View file

@ -1,7 +1,8 @@
from realms import assets
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/mode-markdown.js',
'vendor/ace-builds/src/ext-keybinding_menu.js',

9
realms/modules/wiki/models.py
View file

@ -139,11 +139,11 @@ class Wiki():
return cached
# 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')
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:
return None
partials = {}
@ -153,6 +153,7 @@ class Wiki():
for partial_name in meta['import']:
partials[partial_name] = self.get_page(partial_name)
data['partials'] = partials
data['info'] = self.get_history(name, limit=1)[0]
return data
except KeyError:
@ -175,10 +176,10 @@ class Wiki():
new = self.get_page(name, sha=new_sha)
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)
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:
change_type = None
for change in entry.changes():

12
realms/modules/wiki/views.py
View file

@ -74,7 +74,12 @@ def edit(name):
name = remove_ext(data['name'])
content = data.get('data')
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:
return redirect(url_for('wiki.create', name=cname))
@ -110,7 +115,10 @@ def create(name):
return redirect(url_for('wiki.edit', name=cname))
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'})

6
realms/static/css/style.css
View file

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

887
realms/static/js/editor.js
View file

@ -1,59 +1,245 @@
/*
Source is modified version of http://dillinger.io/
*/
$(function () {
function Aced(settings) {
var id,
options,
editor,
element,
preview,
previewWrapper,
profile,
autoInterval,
themes,
themeSelect,
loadedThemes = {};
var url_prefix = "";
var sha = $("#sha").text();
var $theme = $('#theme-list');
var $preview = $('#preview');
var $autosave = $('#autosave');
var $wordcount = $('#wordcount');
var $wordcounter = $('#wordcounter');
var $pagename = $("#page-name");
settings = settings || {};
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');
});
var editor;
var autoInterval;
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()
options = {
sanitize: true,
preview: null,
editor: null,
theme: 'idle_fingers',
themePath: '/static/vendor/ace-builds/src',
mode: 'markdown',
autoSave: true,
autoSaveInterval: 5000,
syncPreview: false,
keyMaster: false,
submit: function(data){ alert(data); },
showButtonBar: false,
themeSelect: null,
submitBtn: null,
renderer: null,
info: null
};
// Feature detect ish
var dillinger = 'dillinger';
var dillingerElem = document.createElement(dillinger);
var dillingerStyle = dillingerElem.style;
var domPrefixes = 'Webkit Moz O ms Khtml'.split(' ');
themes = {
chrome: "Chrome",
clouds: "Clouds",
clouds_midnight: "Clouds Midnight",
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 (d, t) {
@ -71,459 +257,174 @@ $(function () {
}(document, 'script'));
}
/**
* Grab the user's profile from localStorage and stash in "profile" variable.
*
* @return {Void}
*/
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'
function setTheme(theme) {
var cb = function(theme) {
editor.setTheme('ace/theme/'+theme);
updateProfile({theme: theme});
};
return transEndEventNames[ prefixed('transition') ];
}
/**
* 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);
if (loadedThemes[theme]) {
cb(theme);
} else {
clearInterval(autoInterval)
}
}
$("#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 () {
asyncLoad(options.themePath + "/theme-" + theme + ".js", function () {
cb(theme);
loadedThemes[theme] = true;
});
}
}
function fetchTheme(th, cb) {
var name = th.split('/').pop();
asyncLoad("/static/vendor/ace-builds/src/theme-" + name + ".js", function () {
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);
}
function initSyncPreview() {
if (!preview || !options.syncPreview) return;
previewWrapper = getPreviewWrapper(preview);
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
* of editor cursor position.
*/
window.ace.edit('editor').session.on('changeScrollTop', syncPreview);
window.ace.edit('editor').session.selection.on('changeCursor', syncPreview);
editor.session.on('changeScrollTop', 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
};
}

6
realms/static/js/main.js
View file

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

274
realms/templates/wiki/edit.html
View file

@ -1,8 +1,81 @@
{% extends 'layout.html' %}
{% block js %}
<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(){
$("#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 %}
<script>
$(function() {
{% for name, value in partials.items() %}
{% if name and value %}
try {
@ -12,13 +85,119 @@
}
{% endif %}
{% endfor %}
});
</script>
{% 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_suppressJoinConfirmation = true;
{% if current_user.is_authenticated() %}
TogetherJSConfig_getUserName = function () {
return {{ current_user.username|tojson }};
@ -30,16 +209,16 @@
{% endif %}
TogetherJSConfig_on_ready = function () {
MDR.sanitize = true;
$("#preview").html('');
$("#start-togetherjs").addClass('btn-danger').html('End Collaboration').prop('disabled', false);
startCollaboration();
};
TogetherJSConfig_on_close = function () {
MDR.sanitize = false;
$("#start-togetherjs").removeClass('btn-danger').html('Collaborate').prop('disabled', false);
//endCollaboration();
};
</script>
<script src="https://togetherjs.com/togetherjs-min.js"></script>
{% endif %}
{% endblock %}
{% block body %}
@ -55,51 +234,66 @@
<div class="col-md-6 col-xs-4">
<div class="pull-right">
<button class="btn btn-default btn-sm" id="start-togetherjs" type="button"
onclick="TogetherJS(this); return false">
<button id="discard-btn" class="btn btn-sm btn-danger">
<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>
</button>
<a href="#" id="drop6" role="button" class="dropdown-toggle btn btn-default btn-sm" data-toggle="dropdown">
<i class="fa fa-paint-brush visible-xs"></i>
<button style='display:none' class="btn btn-default btn-sm" id="loading-collaboration" type="button">
<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>
</a>
<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" href="#" data-value="ace/theme/clouds" >Clouds</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/clouds_midnight" >Clouds Midnight</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/cobalt" >Cobalt</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/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" href="#" data-value="ace/theme/dreamweaver" >Dreamweaver</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/eclipse" >Eclipse</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/idle_fingers" >idleFingers</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/kr_theme" >krTheme</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/merbivore" >Merbivore</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/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" href="#" data-value="ace/theme/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" href="#" data-value="ace/theme/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" href="#" data-value="ace/theme/textmate" >TextMate</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/tomorrow" >Tomorrow</a></li>
<li><a tabindex="-1" href="#" data-value="ace/theme/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" href="#" data-value="ace/theme/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" href="#" data-value="ace/theme/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="chrome" >Chrome</a></li>
<li><a tabindex="-1" data-value="clouds" >Clouds</a></li>
<li><a tabindex="-1" data-value="clouds_midnight" >Clouds Midnight</a></li>
<li><a tabindex="-1" data-value="cobalt" >Cobalt</a></li>
<li><a tabindex="-1" data-value="crimson_editor" >Crimson Editor</a></li>
<li><a tabindex="-1" data-value="dawn" class="selected">Dawn</a></li>
<li><a tabindex="-1" data-value="dreamweaver" >Dreamweaver</a></li>
<li><a tabindex="-1" data-value="eclipse" >Eclipse</a></li>
<li><a tabindex="-1" data-value="idle_fingers" >idleFingers</a></li>
<li><a tabindex="-1" data-value="kr_theme" >krTheme</a></li>
<li><a tabindex="-1" data-value="merbivore" >Merbivore</a></li>
<li><a tabindex="-1" data-value="merbivore_soft" >Merbivore Soft</a></li>
<li><a tabindex="-1" data-value="mono_industrial" >Mono Industrial</a></li>
<li><a tabindex="-1" data-value="monokai" >Monokai</a></li>
<li><a tabindex="-1" data-value="pastel_on_dark">Pastel on Dark</a></li>
<li><a tabindex="-1" data-value="solarized_dark" >Solarized Dark</a></li>
<li><a tabindex="-1" data-value="solarized_light" >Solarized Light</a></li>
<li><a tabindex="-1" data-value="textmate" >TextMate</a></li>
<li><a tabindex="-1" data-value="tomorrow" >Tomorrow</a></li>
<li><a tabindex="-1" data-value="tomorrow_night">Tomorrow Night</a></li>
<li><a tabindex="-1" data-value="tomorrow_night_blue" >Tomorrow Night Blue</a></li>
<li><a tabindex="-1" data-value="tomorrow_night_bright" >Tomorrow Night Bright</a></li>
<li><a tabindex="-1" data-value="tomorrow_night_eighties" >Tomorrow Night 80s</a></li>
<li><a tabindex="-1" data-value="twilight" >Twilight</a></li>
<li><a tabindex="-1" data-value="vibrant_ink" >Vibrant Ink</a></li>
</ul>
{% if name in config.LOCKED %}
{% if name in config['LOCKED'] %}
<a class="btn btn-danger btn-sm">
<i class="fa fa-lock"></i>
<span class="hidden-xs">Locked</span>
</a>
{% 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>
<span class="hidden-xs">Save</span>
</a>
@ -114,7 +308,7 @@
<a class="markdown-help" href=""><span class="hidden">What is Markdown?</span></a>
</header>
<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>