Demo: Draggable & Resizable Containers in TiddlyWiki (built on extended eventcatcher)

#21

I must have missed this thread before. This looks fantastic!

My first impression is that the described functionality works and nothing I’d immediately call a bug.

My thoughts regarding features I’d appreciate:

  • An option for “edit in float” button for the tid toolbar
  • Suggest that a doubleclick on the float title to resize as large as possible without creating an new overlap to another float. This would make the manual creation of a splitscreen (like the demo button does) much easier
  • css: can <float class=" " values be set to differentiate between view and edit floats? (I like my editing windows to be very visually distinct)
#22

Some ideas:

  • A floating tiddler’s titlebar should have the same appearance as a normal tiddler titlebar; i.e., font sizes, subtitles, tags, and all toolbar buttons (including more, edit, close, and any other custom-added toolbar buttons).

  • Floating a tiddler would hide it in the StoryRiver. It would technically remain in the $:/StoryList!!list and continue to have <<storyTiddler>> defined, but would simply not be displayed in the StoryRiver.

  • When a tiddler is floating, the “open in Float” button would change to a “return to StoryRiver” button.

  • Closing a floating tiddler would also remove it from the StoryRiver.

-e

1 Like
#23

Hi Eric, I appreciate the input, thank you. As I mentioned earlier in this thread, the intent is for floats to be a basic affordance similar to popups and modals. As such, I do not want to couple it tightly to the existence of a story river. However, your ideas are helpful in highlighting the kind of flexibility that would be needed if someone wanted to implement such a story river integration on top of floats, and I will give that some thought.

My hesitation for a tight story river integration stems from both the fact that some wikis have no story rivers and the mechanism is still useful there, and that there might be better approaches for a story river that allows tiddlers to be freely draggable (a widget that wraps the story template, or a storyview that adds the draggable, resizeable behaviour).

1 Like
#24

I think documentation on how to create such a button might be the best we can do, as Floats itself does not contain an editor that could be used in such a manner.

That is an interesting idea and feels like it would be a fun intelectual challenge to figure out in wikitext. That said, I am a little unsure how useful this would be in practice. To replace the splitscreen demo, you would still need to manually size on float before the proposed behaviour would be helpful.

Yes, additional classes can be specified when opening a float. Once the design is fairly stable I will find time start adding documentation.

Thank you for the feedback and input.

#25
  • Support this wholeheartedly. I would like more designers developers to think this way thus allowing more to move into the core without over loading it. Increasing design choice is critical.
  • I will have a go at an edit in float with the editor toolbar

I like the r-click on a link to set floats;

however I would like this to be a hackable tiddlywiki option such as tag driven so more than one “link menu” item can be added by different plugins.

Great work @saqimtiaz

#26

As mentioned in the top post, this isn’t a part of Floats but rather the Links Context Menu plugin, which is tag driven. It has been included in the demo to showcase potential use cases for Floats.

#27

I think you misunderstand me? I’m not suggesting anything more than copying the existing “edit in float” function from the the context menu of titles in the Open tab, to a button in the tid’s own toolbar.

Perhaps even better would be to just have the same context menu on the float button in the toolbar?

No? You’d just need two non-overlapping floats. Doubleclick one to maximise without creating an overlap, then doubleclick the other and it’ll maximise into the remaining space

The method would scale to 3 or more as well. Might be a little fiddly to lay them out non-overlapping initially, but still far less so than manually resizing them all

#28

The link context menu, and the editor it allows you to open, are both not a part of the Floats plugin and only present in the demo to show how such things could be integrated.

#29

Just playing with this now - this is really nice! I can’t wait to start using it. I’m assuming it’s not ready to install yet.

Couple of ideas after playing around with it, I think the editing experience will be most helpful for me, I noticed that although a “normal” editor seems to be of the “volatile” variety (keyboard timeout), this editor is not, I’d have to figure out a way to make that optional though I think you’re saying that the editor is outside your scope. I also noticed that I have the bad habit of starting my filtered transclusions by typing the {{{ }}} before going back in and doing the filter expression - in the normal editor, this is ignored but that was not the case here! I’d have to figure out how to better do that.

Thanks again! Great stuff.

#30

image
image1917×804 85.7 KB

Currently, a problem has occurred: the floating content can only be displayed in the top-left corner, and no matter how I adjust it, it doesn’t work. Could you please tell me if any additional plugins or modifications are needed?

I have turned off all plugins and still haven’t found the cause. The TiddlyWiki version I’m using is also 5.3.8. Additionally, the content in the upper left corner cannot expand—it can only be closed.

#31

The plugin is still in development and not recommended to be used in your own wikis at this time. However, if you want to give it a go, then you will also need the $:/plugins/sq/window-resize plugin from the demo.

#32

Currently, there is a conflict between the $:/plugins/sq/window-resize plugin and the $:/plugins/linonetwo/open-in-external-app plugin. You need to disable the $:/plugins/linonetwo/open-in-external-app plugin for normal operation. The issue has been submitted to the relevant code repository. Please refer to the link below.

#33

This is a temporary plugin that will be obsolete after the release of TW v5.4.0

#34

thank you, but release 5.4.0 need long time , I can’t wait .