我正在开发一个使用Google Drive Realtime API的网络应用程序。 API用于存储文档的数据,并同步活动协作者之间的所有修改。
现在,我想为这个应用程序添加对富文本(只有粗体,下划线和链接等基础知识)的文本框的支持。文本框应启用类似于Google Docs的协作文本编辑。我现在进行了几天的搜索和实验,但是我找不到如何交换数据或如何构建适合Drive Realtime API的合适数据模型的正确解决方案。
有一种方法可以让人联想到在CollaborativeSting内交换HTML(或类似的标记)。但那不会起作用,因为它可能迟早会破坏标记。
另一个(可能更好)起点是使用更多abstract data model作为Quill editor does。 (如果可能的话,我想稍后使用这个编辑器,但这不是必须的。)
" Hello!的富文本模型这是link."看起来像这样:
var doc = [
{ insert: "Hello!", attributes: { bold: true } },
{ insert: " Here is a " },
{ insert: "link.", attributes: { href: 'http://example.org' } }
];
我可以将上面的文档示例转换为" Hello! 那是 a link."这些说明:
var operation = [
{ retain: 7 },
{ insert: "That's", attributes: { italic: true } },
{ delete: 1 }
];
但是,如果更多协作者同时键入或格式化,则将此模型保存到CollaborativeList似乎也没有解决方案。特别是因为我无法影响服务器端的行为。
有人会想到一个适用于富文本的合适模型或数据交换过程吗?它不一定是最好的解决方案(如果介于两者之间)。使用此API交换纯文本是令人难以置信的简单,但对我来说似乎不可能有丰富的文本。
感谢您的帮助!
我能够使用新信息Sheryl Simon provided me below来确定我的问题。通过使用IndexReferences,我现在能够将纯文本与格式信息隔离开来。
我添加了一些代码,用于保存用户的本地文本选择(可以是单个位置或范围),并在文本更改后恢复。这很好用。我还可以添加对单个用户的多个文本选择的支持 - 因为每个用户只能更改自己的选择。
但我无法弄清楚一个模型,其中几个用户可以同时添加和删除例如粗体。如果我将CollaborativeList用于带有多个[start, end]
数组的粗体文本,如果两个用户同时设置重叠范围,或者如果两个用户想要编辑相同的范围,我将获得一个损坏的数据集同时(通过移除和重新插入范围或移动现有范围的范围标记)。
以下是一些伪代码。所有索引都存储为IndexReferences:
Model:
[ User1: makeBold([8,20])
[ 0, 10] => removeValue([0,10]), removeValue([15,36]), push([0,36])
[15, 36]
[77, 82] User2: removeBold([0,5])
] => removeValue([0,10]), push([6,10])
如果两个用户都在左侧显示的数据集上启动并且首先应用了第一个用户的操作,则第二个用户将无法再删除[0,10]
(因为它已被替换)所以文本保持粗体,将[6,10]
推入列表会导致重复数据。我该如何防止这些问题?
答案 0 :(得分:7)
查看IndexReferences。这就是那些设计的目的。您基本上跟踪区域的开头和结尾的标记,该标记应该是粗体,斜体等。如果在区域之前或之内添加文本,IndexReference将自动移动,因此它应该在逻辑上表现。