Section Editor - Prototype

#61

The local macro doesn’t display because you’re handling the display. You would have to import the macro. Or, just set a global macro tag.

On mine, you can’t see \define nor the button for that part of the tiddler . I think this is because your CSS or formatting is hiding the button. You can make it appear, I think by changing this line on process-sections:

<br/><<toggle-button>>

Part of the reason that you can’t see the button is that \define is “eaten” by TW’s rendering. That moves things out of place. Beyond that … I’m sure there’s a good format tweak.

1 Like
#62

Hi, there’s a bug in the demo page and beta plugin.

in $:/plugins/kookma/section/macros/main

<$vars source=<<__source__>> sourceText={{{[<__source__>get[text]]}}} pattern=<<__pattern__>> nonWhitespace="[^\s]" >
<$list counter=counter variable=section
       filter="[<sourceText>splitregexp<pattern>!is[blank]first[]regexp<nonWhitespace>]
               [<sourceText>splitregexp<pattern>!is[blank]butfirst[]regexp<nonWhitespace>addprefix[!]]">

The addprefix[!] is interfering with the section-editor-template in use, which is $:/plugins/kookma/section/templates/sections.

The template is using the lookahead regex proposed by @Mark_S and me, which splits on the linebreak before the exclamation point/s. So the addprefix[!] is unnecessary.

Sections aren’t saving. When the editor splits the source text for viewing, it adds an extra “!” at the beginning. So if the source text was an h1, the section editor presents the section as an h2. The search-replace operator doesn’t work anymore because it’s searching for an h2 section, when the source text is an h1.

This is the text field of test/05/demo

* Hover your mouse over different part of this tiddlers
* Click on the edit button appears on hove
* Edit as you like
** Save (click on done button)
** Cancel (click on cancel button)

! How to
* Create a tiddler
* Add some sections (a part with a heading e.g. h1, h2, ...)
* Add field `se-type`
* Save your tiddler
* Now hover your mouse over tiddler and note to the buttons appear

!! Beta
# This is a beta version
# Only use for test

<<alert danger "This plugin is in development stage and will be changed without notice!">>

And this is the section editor:

image
image1372×1212 95.4 KB

Screen Shot 2021-10-03 at 4.47.52 PM
Screen Shot 2021-10-03 at 4.47.52 PM1764×954 116 KB

#63

Thank you! yes, this part has been corrected and filter is a simple one line in 0.2.3

What regex do you propose if we want to split on <section>....</section>

What do you think about pattern="\n(?=^<section.*?>)"

This is in response to what @CodaCoder asked!

One issue here is if we want to split ONLY on <tag>...</tag> we need to handle the content between two occurrences!

1 Like
#64

Hi, your pattern seems to split on <section> and <section/>, but not on </section>. How about this: \n(?=^<.*?section>)?

So, like:

Don't pick up this text. Don't pick this up.

<tag>

Just this stuff.

</tag>

* Not this.
* Nor this.

<tag>

Yeah, just this stuff

</tag>

Nope.
#65

Thank you @sull-vitsy

please note that tag can have styles or classes or other attributes like

<tag  style="color:red">

Just this stuff.

</tag>

* Not this.
* Nor this.

<tag class="test" style="background:yellow">

Yeah, just this stuff

</tag>

Nope.
#66

Oh I see. I think this is better than what I said earlier: \n(?=^<\/?section.*?>).

#67

It needs to look ahead and see that there is a matching end tag. Also, unlike !, a tag might start anywhere on the line. I’m thinking maybe two splits - one at the start of a section and a separate split at the end.

#68

@Mohammad This is very true and worth noting. It’s rarely the case that I use that kind of construct but it does happen sometimes (I could certainly live without it).

#69

@Mark_S, @CodaCoder
I believe we can restrict it to <section..> started in a new line!

@Sttot what do you mean by editing images? in TW images are transclusion or link! I am not familiar with notion and I appreciate to share some screenshot let me know what you need to do with Section Editor!

#70

In notion, everything is considered as a block. A paragraph of text, a picture or a bullet list item are all blocks. Each block can be edited separately, while others are rendered normally.

I have just find a way to make it, see my issue. I think I can use JS to split toddler more flexible.

#71

Oh! I assumed you wanted to avoid JS.

1 Like
#72

Yes, I try to avoid JS! but it seems sometimes there is no better solution to use JS code!
The filter by Scott seems to simplify the splitting!

#73

Hi, I’m ex-notion. Sections by paragraph (basically splitting double linebreaks) works, I tried it with the prototype. What do you need block editing ala-Notion for? I do love the dragging around and the columns, but it wasn’t a need for me in tiddlywiki.

#74

Hello. First, some tiddlers don’t have titles; second, sometimes a section can be long even if you do divisions by title. I don’t think Section Editor needs to be the same as the notion, where any element is a block, but it does need a more flexible and customizable way of dividing.

#75

I see. I was interested in how you use TW/what you use TW for, that makes you interested in having block editing. For example, see Mohammad’s original discussion: Best Practice: Tiddlywiki and Structure of Long Note.

#76

I tried to add folding! There is one problem! The preface (i.e. the text before the first heading) is considered as a section! I have to extract the first line to be used for summary in details tag!

<$list counter=counter variable=section
       filter="[<sourceText>splitregexp<pattern>!is[blank]regexp<nonWhitespace>]]">
<div class="se-section"><!-- for future use -->
<details open>
<summary>
<$list variable=firstLine filter="[<section>splitregexp[\n]!is[blank]first[]] ">
<$transclude tiddler=<<firstLine>> field=title mode=block/>  
</$list>
</summary>
<$list variable=currentSection filter="[<section>splitregexp[\n]butfirst[]join<lbr>]">
<$transclude tiddler="$:/plugins/kookma/section/templates/parser" mode=block/>  
</$list>
</details>
</div>
</$list>

The issue is:

  • we had to add something to consider for <summary>...</summary> for preface. For debugging purpose I just consider P1 and we need to see what we can use here!
  • displaying the second part (body of section) needs a complex tiddler (see above the third $list)!

what simpler do you propose?

#77

@Mohammad First I want to thank you for this work and especially the philosophy you used to develop this, basically the constraints you applied to insist on the simple single wiki is fantastic. This approach has resulted in the section editor as it is and it is great.

  • Given all the alternate section discussion here I am yet to identify what is incorporated on the section plugin.

Now standing on your shoulders I would like to ask for one extension in a future release that may appear to contradict your philosophy.

  • When editing a section that section is clearly identifiable text, the edit button edits it.
  • If you could provide a tag eg $:/tags/section-editor-toolbar (you could move the section edit button into this mechanisium)
  • Then tell us what the available variables etc… are available to $:/tags/section-editor-toolbar items and people can add buttons or indicators to the section editor.
  • This would allow people to introduce extensions beyond the actual solution you created such as copy section to clipboard, insert content from search.
  • Ultimately you could collect this work and make it available in an extended package.
#78

Ok, Now the philosophical! I decided to separate it from my last post.

Although in many ways reasonable, and the stimulus for the section editor plugin, you have applied some constraints. I appreciate the result (as said previously) however I want to contest them;

  • Compound/Patchwork tiddler portability (We have some good solutions for this)
  • Ability to search and get results from a compound tiddler
    • If we have a flag to identify such tiddlers it is possible to wikify the tiddler and search the wikification or its HTML version to find content that is pulled into a compound tiddler

I wont argue these now unless you want to but I want to point out if we can support the movement between single tiddler, compound and patchwork we get the best of many worlds.

If you permitted the previously requested access to a section toolbar and possible some tools, users could add features cloning, moving copying, transcluding, excising sections and generating compound and patchwork tiddlers.

I would like to encourage the kind of hackability as streams has also achieved. Streams the quintessential compound tiddler (actually it an “aside”), your section editor tiddler the Plain (and patchwork?)

#79

Hi Tones,
Have you tried the editor type from Sidebar > More Tab > Section Editor
Have you seen the switch toolbar?
You have all the shortcuts there! You can even install CodeMirror-Enhanced and benefic from autocomplete and snippets!

You idea is good! as one can have different toolbar setting in comparison to the main editor toolbar!

#80

Very good idea! I like it and it would be great to be able to search compound tiddlers!
I bookmarked your comments! Thank you