The purpose of text editor iframes?

[AdamS]

Hi all,

I'm just wondering why the tiddler text editor uses as iframe instead of a textarea by default. The iframe make styling the embedded textarea somewhat tricky. Interested to know what advantages the iframe confers that I will miss out on by changing the edit tiddler template.

Best wishes,

Adam

[Mark S.]

I *think* that it has to something to do with the edit buttons. I believe the iframe came in at the same time as the edit buttons. I could be very wrong, of course ;-)

[Jeremy Ruston]

Hi Adam

The iframe was added around the textarea when we added the toolbar buttons because otherwise clicking on a button will remove any active selection from the textarea as a side effect of removing focus.

There are some other ways to work around the same problem, notably using a contenteditable DIV instead of a textarea, but the other approaches sadly have their own problems too.

In terms of styling, the framed editor renders an invisible textarea with the class specified in the "class" attribute and one by one copies the active styles from that template. Thus, one can usually target that invisible textarea with a CSS declaration referencing "textarea.tc-edit-texteditor".

Best wishes

Jeremy

--
You received this message because you are subscribed to the Google Groups "TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywiki+...@googlegroups.com.
To post to this group, send email to tiddl...@googlegroups.com.
Visit this group at https://groups.google.com/group/tiddlywiki.
To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/4cb1112f-1f1a-4962-b728-224534551c59%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[AdamS]

Hi Mark and Jeremy,

That's good to know. So the loss of that functionality is kind of a problem.

What I've been trying to do is make tiddlers such that the size of the tiddler can be fixed (or manually resized) and the textarea will fill the remaining space with overflow-y set to auto. That is to say, the iframe fills the remaining space (using flex). The issue I've been running into with this is that if the textarea is in an iframe, whenever I click into the textarea or keypress in it, the textarea scrolls to the top. This seems to be some kind of bug with iframes. I've dodged this issue just by using a textarea instead, but I haven't been sure what I'm losing in giving up the iframe.

Any ideas how to sidestep this issue while still using an iframe?

Best wishes,

Adam

[TonyM]

Adam,

Let me share an approach I use, conceptualy, not in detail.

By introducing a button to toggle a field setting on each tiddler in the view template, then responding to this toggle=yes you can render fields in the view template however you want, this includes the text field, including in edit mode. You need to use templates so you avoid editing the current tiddler directly.

I have a button that folds the tiddler, then displays from the view template an edit text in in view mode. Using this method you could build your own edit view with any number of style, button and other features without touching the default editor.

Regards
Tony