+ var empty_p = document.createElement('P');
+ empty_p.appendChild(document.createElement('BR'));
+ var empty_div = sel.anchorNode;
+ empty_div.replaceWith(empty_p);
+ var range = document.createRange();
+ range.setStart(empty_p, 0);
+ sel.removeAllRanges();
+ sel.addRange(range);
+ }
+ if (sel.anchorNode.tagName == "LI" && sel.anchorNode.innerHTML == "
") {
+ // new empty li got inserted, insert a
within
+ var empty_p = document.createElement('P');
+ empty_p.appendChild(document.createElement('BR'));
+ var empty_li = anchorNode;
+ if (empty_li.childNodes.length) { // lone
+ empty_li.removeChild(empty_li.childNodes[0]);
+ }
+ empty_li.appendChild(empty_p);
+ var range = document.createRange();
+ range.setStart(empty_p, 0);
+ sel.removeAllRanges();
+ sel.addRange(range);
+ }
var prev_p = sel.anchorNode.previousSibling;
if (! prev_p) return;
if (prev_p.tagName != 'P') {
prev_p = $(prev_p).parents('p')[0];
+ if (! prev_p || prev_p.tagName != 'P') return;
}
var title_match = prev_p.innerText.match(/^(h[1-6]). /);
if (title_match) {
@@ -15,74 +62,203 @@ $(function() {
title.textContent = title.textContent.slice(4);
prev_p.replaceWith(title);
}
+ return true;
+ },
+
+ init: function() {
+ $(document).on('selectionchange', function(event) {
+ if ($('input[name=link-target].shown').length) {
+ return;
+ }
+ var sel = window.getSelection();
+ if ($(sel.anchorNode).parents('div[contenteditable]').length && sel.toString()) {
+ show_inline_style_toolbar(sel);
+ } else if (inline_style_toolbar) {
+ $(inline_style_toolbar).hide();
+ }
+ });
+ var $image_upload = $('');
+ $image_upload.on('change', upload_image);
+ $image_upload.appendTo(document.body);
+
+ $(document).on('click', 'div.figure span.empty', function() {
+ window.active_figure = this.parentNode;
+ $('#image-upload').trigger('click');
+ return true;
+ });
+ },
+
+ off: function() {
+ $('#image-upload').remove();
+ if (block_style_toolbar) { block_style_toolbar.hide(); }
+ if (inline_style_toolbar) { inline_style_toolbar.hide(); }
+ $(document).off('selectionchange');
+ },
+
+ bind_events: function(elem) {
+ $(elem).on('input', Phylly.input_event);
+ $(elem).on('keyup click', update_block_style_toolbar);
+ },
+
+ unbind_events: function(elem) {
+ $(elem).off('input');
+ $(elem).off('keyup click');
+ },
+
+ }
+ window.Phylly = Phylly;
+
+ function upload_image() {
+ if ($(this).prop('files').length > 0) {
+ var file = $(this).prop('files')[0];
+ var params = new FormData();
+ params.append('image', file);
+ $.post({url: '/wiki/ajax/image/', processData: false, data: params, contentType: false}).success(function(data) {
+ var img = document.createElement('IMG');
+ img.src = data.url;
+ if (data.orig_url) {
+ img.setAttribute('data-orig-url', data.orig_url);
+ }
+ $(window.active_figure).empty().append(img);
+ });
}
- return true;
- });
- $('div[contenteditable]').on('keyup', function(event) {
- var sel = document.getSelection();
- if (sel.anchorNode instanceof Element && sel.anchorOffset == 0 && sel.isCollapsed) {
- // start of line
- show_block_style_popup();
- } else {
- hide_block_style_popup();
- }
- return true;
- });
+ }
- $('#save').on('click', function() {
- var text = $('div[contenteditable]')[0].innerHTML;
- var csrf = $('[name=csrfmiddlewaretoken]').val();
- $.post('api-save/',
- { text: text, csrfmiddlewaretoken: csrf}
- ).fail(function() {
- $('#save').css('background', 'red');
- });
- return false;
- });
+ function get_contenteditable_subnode(node) {
+ if (node === null) return null;
+ if (node.contentEditable === 'true') return node; // but we shouldn't arrive at root
+ if (node.parentNode.contentEditable === 'true') return node;
+ return get_contenteditable_subnode(node.parentNode);
+ }
+ function get_parent(node, type) {
+ if (node === null) return null;
+ if (node.tagName == type) return node;
+ return get_parent(node.parentNode, type);
+ }
+ function get_active_block(node) {
+ var main_node = get_contenteditable_subnode(node);
+ if (main_node === null) return null;
+ for (const block of Phylly.BLOCKS) {
+ if (main_node.tagName === block.tag && main_node.classList.contains(block.klass))
+ return block;
+ }
+ return null;
+ }
- var block_style_popup = null;
+ var block_style_toolbar = null;
function block_style() {
- var action = $(this).data('action');
- var class_name = null;
- if (action == 'code') {
- action = 'pre';
- class_name = 'screen';
- }
- document.execCommand('formatBlock', false, action);
var sel = window.getSelection();
- if (class_name) {
- $(sel.anchorNode).addClass(class_name);
+ var current_anchor = sel.anchorNode;
+ if (this.action_block.special == 'img') {
+ action = 'insertHTML';
+ param = '