[tw] [TW5] PanFlex Layout

[BurningTreeC]

Hello folks,

I'm tweaking on a Layout concept called *PanFlex *on
http://panflex.tiddlyspot.com - it still has some quirks -
But I'll show it off anyway ;)

This concept uses my pan widget to create 4 draggable bars around the story
river that let you show and hide a left- top- right- and bottom panel
Each panel can hold the content you like by tagging tiddlers with:
$:/tags/LeftBar $:/tags/TopBar $:/tags/BottomBar ... the right bar is the
sidebar and remains untouched 'cause it's a holy cow

If you like to take a look and test, I'd appreciate if you let me know if
you find it useful and especially if you discover some errors and quirks

The stylesheet and calculations a pretty complex and I hope I can fix the
remaining bugs soon

All the best,

BurningTreeC

[@TiddlyTweeter]

You might want to advise that on first open you can get a JavaScript error.
Its goes away on subsequent reload. (This is a known quirk. Its something
to do with getting JS in place? Often not encountered by the developer as
they don't open for the first time more than once :-)

BTW, there is also a "mid-bar".

Lovely stuff.

J.

Post by BurningTreeC
Hello folks,
I'm tweaking on a Layout concept called *PanFlex *on
http://panflex.tiddlyspot.com - it still has some quirks -
But I'll show it off anyway ;)
This concept uses my pan widget to create 4 draggable bars around the
story river that let you show and hide a left- top- right- and bottom panel
$:/tags/LeftBar $:/tags/TopBar $:/tags/BottomBar ... the right bar is the
sidebar and remains untouched 'cause it's a holy cow
If you like to take a look and test, I'd appreciate if you let me know if
you find it useful and especially if you discover some errors and quirks
The stylesheet and calculations a pretty complex and I hope I can fix the
remaining bugs soon
All the best,
BurningTreeC

[BurningTreeC]

Post by @TiddlyTweeter
You might want to advise that on first open you can get a JavaScript
error. Its goes away on subsequent reload. (This is a known quirk. Its
something to do with getting JS in place? Often not encountered by the
developer as they don't open for the first time more than once :-)
Thanks! I'll take a better look at the pan widget, maybe I can prevent

that error...

I've opened the page on Beaker Browser now for the first time, there's no
such error, on chromium neither. I haven't accessed it on those browsers
before

Could this error in general be related to safari?

BTC

[@TiddlyTweeter]

I get it on FF 52 (after clearing cache). I'll try other browsers now....

Google chrome latest, no problem. TiddlyDesktop (chrome again) no problem.

Maybe its not an issue to worry about, though I can replicate it in FF.
Maybe its just an older FF issue?

Best wishes
Josiah

Post by @TiddlyTweeter
You might want to advise that on first open you can get a JavaScript

Post by @TiddlyTweeter
error. Its goes away on subsequent reload. (This is a known quirk. Its
something to do with getting JS in place? Often not encountered by the
developer as they don't open for the first time more than once :-)
Thanks! I'll take a better look at the pan widget, maybe I can prevent

that error...
I've opened the page on Beaker Browser now for the first time, there's no
such error, on chromium neither. I haven't accessed it on those browsers
before
Could this error in general be related to safari?
BTC

[TonyM]

Love it,

This would be a great option on tiddlywikis where it could be toggled.
Especially if it were possible to select

tttttttttttttttt
l m r
bbbbbbbb

or even better

tttttttttttttttR
l m R
lbbbbbbbbb

etc

Thus except for columns within tiddlers this covers the vast majority of
layouts we could ask for.

Great Work.

Tony

Post by BurningTreeC
Hello folks,
I'm tweaking on a Layout concept called *PanFlex *on
http://panflex.tiddlyspot.com - it still has some quirks -
But I'll show it off anyway ;)
This concept uses my pan widget to create 4 draggable bars around the
story river that let you show and hide a left- top- right- and bottom panel
$:/tags/LeftBar $:/tags/TopBar $:/tags/BottomBar ... the right bar is the
sidebar and remains untouched 'cause it's a holy cow
If you like to take a look and test, I'd appreciate if you let me know if
you find it useful and especially if you discover some errors and quirks
The stylesheet and calculations a pretty complex and I hope I can fix the
remaining bugs soon
All the best,
BurningTreeC

[BurningTreeC]

Post by TonyM
Love it,
This would be a great option on tiddlywikis where it could be toggled.
Especially if it were possible to select
tttttttttttttttt
l m r
bbbbbbbb
or even better
tttttttttttttttR
l m R
lbbbbbbbbb
etc

Thanks Tony,
That's a very good idea, but also very very complicated to do the way I'm
doing it (which is anarcho-freestyle)
I've come to a point where the stylesheet is that complicated that I fear
to change it
It needs to be restructured into logically connected blocks, then it could
be possible to make more layout variants happen

Post by TonyM
Thus except for columns within tiddlers this covers the vast majority of
layouts we could ask for.

I could add a viewtemplate for tiddlers that looks the same as the page
layout, how about that?

Post by TonyM
Great Work.
Tony

BTC

[David Gifford]

Yet another very cool TiddlyWiki feature!

Might I suggest some kind of small icon to indicate dragging - like this
one:

https://www.google.com.mx/search?q=drag+icon&client=firefox-b-1-ab&dcr=0&source=lnms&tbm=isch&sa=X&ved=0ahUKEwj63LDi2c3ZAhVl5YMKHev7C-AQ_AUICigB&biw=1708&bih=789#imgrc=1jQp7oitIf9XiM:

instead of black bands? I imagine most TiddlyWikis published by users would
not use your opening screen with instructions, so it needs to be more
obvious for THEIR users where they can find this hidden stuff.

Post by BurningTreeC
Hello folks,
I'm tweaking on a Layout concept called *PanFlex *on
http://panflex.tiddlyspot.com - it still has some quirks -
But I'll show it off anyway ;)
This concept uses my pan widget to create 4 draggable bars around the
story river that let you show and hide a left- top- right- and bottom panel
$:/tags/LeftBar $:/tags/TopBar $:/tags/BottomBar ... the right bar is the
sidebar and remains untouched 'cause it's a holy cow
If you like to take a look and test, I'd appreciate if you let me know if
you find it useful and especially if you discover some errors and quirks
The stylesheet and calculations a pretty complex and I hope I can fix the
remaining bugs soon
All the best,
BurningTreeC

[David Gifford]

Or even better, the simple white boxes used by image editing programs to
indicate that you can drag to expand a layer or element.

Post by David Gifford
Yet another very cool TiddlyWiki feature!
Might I suggest some kind of small icon to indicate dragging - like this
https://www.google.com.mx/search?q=drag+icon&client=firefox-b-1-ab&dcr=0&source=lnms&tbm=isch&sa=X&ved=0ahUKEwj63LDi2c3ZAhVl5YMKHev7C-AQ_AUICigB&biw=1708&bih=789#imgrc=1jQp7oitIf9XiM
instead of black bands? I imagine most TiddlyWikis published by users
would not use your opening screen with instructions, so it needs to be more
obvious for THEIR users where they can find this hidden stuff.

Post by BurningTreeC
Hello folks,
I'm tweaking on a Layout concept called *PanFlex *on
http://panflex.tiddlyspot.com - it still has some quirks -
But I'll show it off anyway ;)
This concept uses my pan widget to create 4 draggable bars around the
story river that let you show and hide a left- top- right- and bottom panel
$:/tags/LeftBar $:/tags/TopBar $:/tags/BottomBar ... the right bar is the
sidebar and remains untouched 'cause it's a holy cow
If you like to take a look and test, I'd appreciate if you let me know if
you find it useful and especially if you discover some errors and quirks
The stylesheet and calculations a pretty complex and I hope I can fix the
remaining bugs soon
All the best,
BurningTreeC

[BurningTreeC]

Post by David Gifford
Yet another very cool TiddlyWiki feature!
Might I suggest some kind of small icon to indicate dragging - like this
https://www.google.com.mx/search?q=drag+icon&client=firefox-b-1-ab&dcr=0&source=lnms&tbm=isch&sa=X&ved=0ahUKEwj63LDi2c3ZAhVl5YMKHev7C-AQ_AUICigB&biw=1708&bih=789#imgrc=1jQp7oitIf9XiM
instead of black bands? I imagine most TiddlyWikis published by users
would not use your opening screen with instructions, so it needs to be more
obvious for THEIR users where they can find this hidden stuff.
Thanks David!

Yes, this is a work-in-progress demo and I want to change the black bars,
thanks for the idea!
The width of the bars will be configurable soon, especially useful for
mobile devices
I was thinking about a thin svg line centered inside those bars, with
something in the center of the line that indicates that it's draggable
That could be done with css and needs some googling

I'll post here if I have updates on this

Simon

[BurningTreeC]

I accept good ideas for the bars, there are ways to configure how they get
styled

If there's interest, I'll make that configurable, if not, I'll try finding
a solution I find suitable