Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
Add postEditor#toggleSection, works with ul/ol sections
  * marked `changeSectionTagName` private in favor of `toggleSection`.
    'ember-mobiledoc-editor' uses `changeSectionTagName` so it will need
    to be updated
  * join contiguous list sections -- when a section adjacent to a
    list section is removed, the postEditor will scan for and join
    contiguous list sections in the before_complete queue
  * put cursor position at start of changed range -- the end of the
    range is not stable (it can move around when joinin contiguous lists
    or when the toggle changes the last section to/from a list item) so
    it is quite difficult to select the entire range after the toggle.
  * remove unused `splitAtListItem`, `splitIntoSections` methods on
    ListSection, ListItem
  * add `MarkupSection.isMarkupSection` property
  * add Section `canJoin`, `join` methods
  * add test to ensure toggling while on a card section is a no-op
  * Add editor#selectRange, postEditor#setRange APIs
  * Remove Cursor `moveToSection`, `selectSections`, `moveToPosition`
  * use `Cursor#selectRange` primarily, instead (called by `editor#selectRange`)
  * Add Range.fromSection convenience method
  * Remove `Editor#moveToPosition` (in favor of `selectRange`)

fixes #186
  • Loading branch information
bantic committed Dec 8, 2015
1 parent 3cfdd87 commit 1e47433
Show file tree
Hide file tree
Showing 22 changed files with 1,063 additions and 298 deletions.
88 changes: 56 additions & 32 deletions src/js/editor/editor.js
Expand Up @@ -20,6 +20,7 @@ import { setData } from '../utils/element-utils';
import mixin from '../utils/mixin';
import EventListenerMixin from '../utils/event-listener';
import Cursor from '../utils/cursor';
import Range from '../utils/cursor/range';
import PostNodeBuilder from '../models/post-node-builder';
import {
DEFAULT_TEXT_EXPANSIONS, findExpansion, validateExpansion
Expand Down Expand Up @@ -232,14 +233,16 @@ class Editor {
const range = this.cursor.offsets;

if (this.cursor.hasSelection()) {
let nextPosition = this.run(postEditor => postEditor.deleteRange(range));
this.cursor.moveToPosition(nextPosition);
this.run(postEditor => {
let nextPosition = postEditor.deleteRange(range);
postEditor.setRange(new Range(nextPosition));
});
} else if (event) {
const key = Key.fromEvent(event);
const nextPosition = this.run(postEditor => {
return postEditor.deleteFrom(range.head, key.direction);
let key = Key.fromEvent(event);
this.run(postEditor => {
let nextPosition = postEditor.deleteFrom(range.head, key.direction);
postEditor.setRange(new Range(nextPosition));
});
this.cursor.moveToPosition(nextPosition);
}
}

Expand All @@ -248,17 +251,20 @@ class Editor {

event.preventDefault();

const range = this.cursor.offsets;
const cursorSection = this.run(postEditor => {
let range = this.cursor.offsets;
this.run(postEditor => {
let cursorSection;
if (!range.isCollapsed) {
let nextPosition = postEditor.deleteRange(range);
if (nextPosition.section.isBlank) {
return nextPosition.section;
let nextPosition = postEditor.deleteRange(range);
cursorSection = nextPosition.section;
if (cursorSection && cursorSection.isBlank) {
postEditor.setRange(Range.fromSection(cursorSection));
return;
}
}
return postEditor.splitSection(range.head)[1];
cursorSection = postEditor.splitSection(range.head)[1];
postEditor.setRange(Range.fromSection(cursorSection));
});
this.cursor.moveToSection(cursorSection);
}

showPrompt(message, defaultValue, callback) {
Expand All @@ -271,27 +277,46 @@ class Editor {

selectSections(sections=[]) {
if (sections.length) {
this.cursor.selectSections(sections);
let headSection = sections[0],
tailSection = sections[sections.length - 1];
this.selectRange(new Range(headSection.headPosition(),
tailSection.tailPosition()));
} else {
this.cursor.clearSelection();
}
this._reportSelectionState();
}

selectRange(range){
this.cursor.selectRange(range);
this._reportSelectionState();
selectRange(range) {
this.range = range;
this.renderRange();
}

moveToPosition(position) {
this.cursor.moveToPosition(position);
// @private
renderRange() {
this.cursor.selectRange(this.range);
this._reportSelectionState();

// ensure that the range is "cleaned"/un-cached after
// rendering a cursor range
this.range = null;
}

get cursor() {
return new Cursor(this);
}

// "read" the range from dom unless it has been set explicitly
// Any method that sets the range explicitly should ensure that
// the range is rendered and cleaned later
get range() {
return this._range || this.cursor.offsets;
}

set range(newRange) {
this._range = newRange;
}

setPlaceholder(placeholder) {
setData(this.element, 'placeholder', placeholder);
}
Expand Down Expand Up @@ -476,6 +501,7 @@ class Editor {
*/
run(callback) {
const postEditor = new PostEditor(this);
postEditor.begin();
const result = callback(postEditor);
this.runCallbacks(CALLBACK_QUEUES.DID_UPDATE, [postEditor]);
postEditor.complete();
Expand Down Expand Up @@ -582,12 +608,11 @@ class Editor {
}

_insertEmptyMarkupSectionAtCursor() {
const section = this.run(postEditor => {
this.run(postEditor => {
const section = postEditor.builder.createMarkupSection('p');
postEditor.insertSectionBefore(this.post.sections, section);
return section;
postEditor.setRange(Range.fromSection(section));
});
this.cursor.moveToSection(section);
}

handleKeydown(event) {
Expand All @@ -612,12 +637,13 @@ class Editor {
if (position.section.isCardSection) {
nextPosition = position.move(key.direction);
if (nextPosition) {
let newRange;
if (key.isShift()) {
let newRange = range.moveFocusedPosition(key.direction);
this.cursor.selectRange(newRange);
newRange = range.moveFocusedPosition(key.direction);
} else {
this.cursor.moveToPosition(nextPosition);
newRange = new Range(nextPosition);
}
this.selectRange(newRange);
event.preventDefault();
}
}
Expand All @@ -640,10 +666,10 @@ class Editor {
if (key.isTab() && !range.head.section.isCardSection) {
nextPosition = postEditor.insertText(nextPosition, TAB);
}
if (nextPosition && nextPosition !== range.head) {
postEditor.setRange(new Range(nextPosition));
}
});
if (nextPosition !== range.head) {
this.cursor.moveToPosition(nextPosition);
}
if (
(isCollapsed && range.head.section.isCardSection) ||
key.isTab()
Expand Down Expand Up @@ -711,12 +737,10 @@ class Editor {

let pastedPost = parsePostFromPaste(event, this.builder, this._cardParsers);

let nextPosition;
this.run(postEditor => {
nextPosition = postEditor.insertPost(position, pastedPost);
let nextPosition = postEditor.insertPost(position, pastedPost);
postEditor.setRange(new Range(nextPosition));
});

this.cursor.moveToPosition(nextPosition);
}

// @private
Expand Down
10 changes: 6 additions & 4 deletions src/js/editor/key-commands.js
@@ -1,8 +1,8 @@
import Key from '../utils/key';
import { MODIFIERS, SPECIAL_KEYS } from '../utils/key';
import { filter, reduce } from '../utils/array-utils';
import Position from '../utils/cursor/position';
import assert from '../utils/assert';
import Range from '../utils/cursor/range';

export const DEFAULT_KEY_COMMANDS = [{
str: 'META+B',
Expand Down Expand Up @@ -45,10 +45,12 @@ export const DEFAULT_KEY_COMMANDS = [{
run(editor) {
let range = editor.cursor.offsets;
if (!editor.cursor.hasSelection()) {
range.tail = new Position(range.head.section, range.head.section.length);
range.tail = range.head.section.tailPosition();
}
let nextPosition = editor.run(postEditor => postEditor.deleteRange(range));
editor.cursor.moveToPosition(nextPosition);
editor.run(postEditor => {
let nextPosition = postEditor.deleteRange(range);
postEditor.setRange(new Range(nextPosition));
});
}
}, {
str: 'META+K',
Expand Down

0 comments on commit 1e47433

Please sign in to comment.