Как объединить Quill Rich Text Editor и socket.io для обмена дельтами

Я пытаюсь объединить Quill Rich Text Editor и socket.io. Я хотел бы иметь редактор, похожий на документы Google, где люди могли бы редактировать одновременно.

Я изо всех сил пытаюсь отправить и применить события «изменения текста» по сети, используя код, подобный этому:

fullEditor.on('text-change', function(delta, source) {
  if (source === 'user') {
    socket.emit('text change', {'who': my_id, 'delta': JSON.stringify(delta)});
  }
});


socket.on('text change', function(msg){
  if(msg.who != my_id) {
      var del = JSON.parse(msg.delta);
      var Delta = fullEditor.getContents().constructor;
      var delta = new Delta(del.startLength,del.endLength,del.ops);
      fullEditor.updateContents( delta );
    }
    });

Это терпит неудачу с

Uncaught TypeError: undefined не является функцией | перо.js:8020

так как на другом конце у меня есть простой хэш, и quill ожидает объекты определенного типа (InsertOp, http://quilljs.com/docs/editor/deltas/ и т. д.).

Любые идеи, как заставить его работать?


javascript socket.io quill
person Greg Dziemidowicz    schedule 31.05.2014    source источник

Ответы (1)


arrow_upward
2
arrow_downward

Проблема в том, что updateContents ожидает объект Delta, и пока вы его создаете, конструктор Delta ожидает массив объектов Operations.

Новейшая версия (v0.14.0) обновляет updateContents, чтобы получить простой объект javascript, поэтому вы сможете сделать:

socket.on('text change', function(msg){
  if(msg.who != my_id) {
    var del = JSON.parse(msg.delta);
    fullEditor.updateContents( del );
  }
});

Обратите внимание, что для реализации совместной работы в реальном времени, такой как Google Docs, вам также потребуется какое-то разрешение конфликтов. Самым простым является платформенное решение, такое как API OT GoInstant. собственной библиотекой, такой как ShareJS.

person jhchen    schedule 02.06.2014