You are not logged in.

Dear visitor, welcome to krpano.com Forum. If this is your first visit here, please read the Help. It explains in detail how this page works. To use all features of this page, you should consider registering. Please use the registration form, to register here or read more information about the registration process. If you are already registered, please login here.

1

Saturday, May 13th 2017, 10:12pm

help with a text popup [possible bug?]

hi there to the experienced :)

could you help me with a dynamic and responsive text popup ?

1) it should be defined by width and a (minimal) height
2) the height should scale/auto adjust to the given text
3) if the screen gets smaller than the given width / height
there should be a (10px) padding to the screen borders
(overriding the autoheight feature)

anybody with a good setup for this?

it maybe needs more than one layer, and i couldnt get it right yet...
if possible without event actions is preferred (ie. onresize for the padding)

index *rolleyes*

This post has been edited 11 times, last edit by "indexofrefraction" (May 14th 2017, 2:41pm)


2

Sunday, May 14th 2017, 11:53am

below is what i've come up with so far
(couldnt think of a method without event)

for layer[popup] there are options i tried,
but each version fails in some aspect.... see comments

note: intention is dynamic creation of popups,
so it must work for different widths, minheights and text(sizes)

the resize event takes care of the padding. seems to work well

Source code

1
2
3
4
5
<events name="popup_events" keep="true" onresize="popup_resize();" />
<action name="popup_resize">
	calc(layer[popup].maxwidth, stagewidth - 10);
	calc(layer[popup].maxheight, stageheight - 10);
</action>

now to the popup itself...

version 1) good! it is centered and the height scales to text

Source code

1
2
3
4
5
<layer name="popup" keep="true"
	type="text" html="some text[br]some text[br]some text[br]some text[br]some text[br]some text[br]some text"
	align="center" edge="center"
	width="800"
	height="" minheight="10">

version 2) just a different minheight and suddenly not centered anymore???

Source code

1
2
3
4
5
<layer name="popup" keep="true"
	type="text" html="some text[br]some text[br]some text[br]some text[br]some text[br]some text[br]some text"
	align="center" edge="center"
	width="800"
	height="" minheight="600">

version 3) hm, with a height of 1 it gets centered again

Source code

1
2
3
4
5
<layer name="popup" keep="true"
	type="text" html="some text[br]some text[br]some text[br]some text[br]some text[br]some text[br]some text"
	align="center" edge="center"
	width="800"
	height="1" minheight="600">

version 4) but now with the small minheight it is not adjusting to the text anymore

Source code

1
2
3
4
5
<layer name="popup" keep="true"
	type="text" html="some text[br]some text[br]some text[br]some text[br]some text[br]some text[br]some text"
	align="center" edge="center"
	width="800"
	height="1" minheight="10">

bollocks! *cursing*


really strange is version 1/2 ...
the popup adjusts to the text if the given minheight is too small,
but the vertical centering gets messed up..
the higher the minheight value, the more the popup is moving to the top edge

is this a bug?

(all tests were done with 1.19pr10)

This post has been edited 11 times, last edit by "indexofrefraction" (May 14th 2017, 2:42pm)