Bug or Shortcoming in Templating?


#1

I’m looking to make something a bit like Google Docs where multiple people are able to edit a body of text concurrently.

I figured the way to do this would be to make my template just contain the text, have a helper for the template which gets the data from the database, and to fire an event on input which just grabs the text and puts it in the database.

The issue is that this setup is causing the text to be duplicated every time my template renders. It’s like when it’s rendering, it completely ignores the fact that text is already present and it just sticks in the text.

I have a minimal reproduction which uses Session instead of a database to demonstrate this over here on StackOverflow (nobody seemed to be offering useful help there, so I figured I’d ask here: http://stackoverflow.com/q/29292054/901641 )

Currently, for a workaround (which I posted as an answer on that question), on every input event I clear out the current text so that when the template updates, it just puts the next text into the newly cleared field. This looks like an ugly hack.

I feel like what is happening is either:

  1. There’s a bug in the templating system (Blaze? Spacebars? I’m mixed up on what the different components of Meteor are…)
  2. There’s a shortcoming in the templating system (it doesn’t seem to have any hooks where I can insert my own code after it updates content.)
  3. I’m abusing the templating system somehow or completely going about this wrong.

I’d love to be pointed in the right direction. I’ve only been using Meteor for a week so at this stage it’s difficult to tell if the bug is in my code or if the bug is with Meteor… if someone more experienced could confirm it’s a bug, or a shortcoming, or else tell me what I’m doing wrong, that would be extremely helpful.


#2

I would say have a look at ShareJs . This lets you create documents that can be updated concurrently from mulitple connections and it saves the document in a collection for you also.

So simple to set up
{{> sharejsText docid='documentId' id="editor"}}


#3

I feel your pain since i have a similar bug in my app in an imput which is also refreshed with each keystroke for validation purpose. Sometimes the input goes berserk and like you the input text (or past input !) is repeated ad nauseum with each keystroke.
I have been tracking the problem for weeks (the app is in production !), without being able to reproduce it constantly.
I have the impression that it only happens with Firefox and never with Chrome but i’m not sure, what browser do you use ?
I must add (but this is probably not specific to Meteor) that it’s very hard to debug event with the chrome debugger since when you set breakpoint some events are swallowed (probably async related).


#4

ShareJS has some demos, like the hex game, that suggest to me that it’s pretty darn flexible and not at all limited to just plain text editing:

http://sharejs.org/demos.html

I think I will probably use it.


#5

I’m working on a personal project which allows editing some front-end meteor code by multiple users.

The publication checks a ‘lastModifiedBy’ field and only sends down the change if a different user made the edit. In my case, this approach saved quite a bit of logic that I was originally doing in the client.

I still have some of the same view challenges you described – How to only update the part of the text that changed ? Fix cursor position jumping… these things are possible to fix with something like Codemirror that I’m using, I just haven’t addressed them yet.

just wanted to share the general idea of moving some logic to the publication. I watched a good talk by @manuel which gave me the idea to start moving logic into publications https://www.youtube.com/watch?v=RmjYw4G4ImQ .