You are not logged in.

Side Menu Plugin (new plugin from today)

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.

Umalo

Professional

  • "Umalo" started this thread

Posts: 1,051

Location: Osijek, Croatia, EU

  • Send private message

41

Sunday, March 15th 2015, 3:37pm

Can you send me on my mail: link to the online version to explore your code. Or small project package with the code to explore it offline. It could be you haven't included showtext.xml for HTML5...?

Muxi

Trainee

Posts: 113

  • Send private message

42

Sunday, March 15th 2015, 4:09pm

In the original-sidemenu.xml I only added the code I posted before. In my main.xml I included the showtext.xml and the sidemenu.xml
But I noticed that it's not a problem of side menu as I put the logo-plugin in my main.xml and without loading the side menu it's the same problem. So I can't find my fault and will go on reading the forum posts ;-)

mux

Umalo

Professional

  • "Umalo" started this thread

Posts: 1,051

Location: Osijek, Croatia, EU

  • Send private message

43

Sunday, March 29th 2015, 7:37pm

From other thread: http://krpano.com/forum/wbb/index.php?pa…59133#post59133

...What I would like to change is to get the sidemenu in other dimensions for mobile devices. Is this also possible in a way maybe to make two different <menu_settings> and defining one to only work on mobile devices or smartphones? I would like to start with a closed menu then and to cover the whole screen with the menu when opened, with larger buttons and fonts, and with always closing the menu after having pressed a button...
or maybe I can use two different sidemenu.xml's, one for mobiles and one for desktops...?...

This is how you can have device based settings:

Source code

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

<menu_settings devices="desktop|tablet"
.
.
row_height             ="30"
.
.	                              
 />

<menu_settings devices="mobile"
.
.
 row_height             ="45"
.
.	               
/>


If you want bigger font for mobile devices than in action switch_menu add something like:

Source code

 
1
2
3
4
5
6
7
8
9
10
11
12
13

<action name="switch_menu">
.
.		
for(set(i,1), i LE group[get(level)].group.count, inc(i),
txtadd(menu_0,'menu_',get(i));  txtadd(object_0_html,'object_',get(i));
set(plugin[%menu_0].html,get(group[get(level)].group[get(object_0_html)].value));
if(device.tablet,set(plugin[%menu_0].css,font-family:Arial; font-size:20px; color:#000000; text-align:left; font-weight:bold););
if(device.mobile,set(plugin[%menu_0].css,font-family:Arial; font-size:20px; color:#000000; text-align:left; font-weight:bold););			
if(device.desktop,set(plugin[%menu_0].css,font-family:Arial; font-size:11px; color:#000000; text-align:left; font-weight:bold););			
.
.
.
</action>


If you want to start with closed menu you can add call to slide_menu_left action e.g.

Source code

 
1
2
3
4
5

<action name="initiate_menu">
.
.		
if(device.mobile,delayedcall(0,slide_menu_left();););	
</action>


If you want on mobile devices after click menu to close than adapt the code of the action switch_menu to something like:
Instead of line:

Source code

 
1

set(plugin[%menu_0].onclick,get(group[get(level)].group[get(object_0_html)].link));

add something like:

Source code

 
1
2
3
4
5
6
7
8
9
10
11
12

<action name="switch_menu">
.
.			
if(device.mobile,
set(plugin[%menu_0].onclick,get(group[get(level)].group[get(object_0_html)].link);onclick2(););
set(plugin[%menu_0].onclick2,slide_menu_left(););
,
set(plugin[%menu_0].onclick,get(group[get(level)].group[get(object_0_html)].link));
);	
.
.
</action>

Muxi

Trainee

Posts: 113

  • Send private message

44

Sunday, March 29th 2015, 11:40pm

Great! Thank You so much for that lots of informations! The more I get into krpano the more I notice how wonderful and easy it is ...
Now there is only one more question left ;-)
maybe you already looked at my example I'm working on since a couple of days:
http://www.artesphera.de/pano/_vt/Kieler_Foerde/tour.html
when I close the menu, there's a menu button left to click to open it again. When my daughter today was taking a look on the tour she intuitively tried to swipe the menu button to open it again. So I think it would be great to put that feature on the button. Is it possible to do this? I already read about a plugin but maybe in the meantime since 2012 there has been a change in krpano to make that easier? Because I think that the pano gallery bar which is part of the basic tour making, this gallery also works with a kind of swipe: I press on a thumb to open the pano and I swipe to move the thumbs in the bar...

Thanks!

Umalo

Professional

  • "Umalo" started this thread

Posts: 1,051

Location: Osijek, Croatia, EU

  • Send private message

45

Tuesday, March 31st 2015, 12:57am

Something like this:

Can be achieved using Krpano draggable layer code. Here is quick solution: http://webonjee.com/radna-mapa/anton/__k…le/example.html

Package with the code: http://webonjee.com/radna-mapa/anton/__k…u_draggable.zip

Let me know if the daughter is happy with it *rolleyes*

Umalo

Muxi

Trainee

Posts: 113

  • Send private message

46

Tuesday, March 31st 2015, 11:54pm

Thanks, that's perfect! I will try it, do I have to take all the js and swf Files plus the side menu XML fils?

Muxi

Trainee

Posts: 113

  • Send private message

47

Monday, April 13th 2015, 8:48am

now it works and my daughter is nearly as happy as me ;-)
There is only one problem left with sidemenu which I can't get. When the menu is closed the menubutton is two times at the same place, overlaying each other. they are not exactly of same size. I tried to make them identical with scale but a real solution would be to make the one button disappear instead of laying in background.

Another thing: Umalo, the sidemenu is really a great plugin, I am really happy with it, thanks for your work and your support, I hope my donation is helping a little little bit to continue with your work ;-)
What, for me, is still unsolved: I needed the sidemenu to be scrollable... or I needed the bottommenu to have more than one level...
Especially if you're using a smartphone in landscape mode there is not much space left for the menu, e.g. in my case I have a logo and some buttons in the upper part of the menu, so there are only 4 menu items being visible.
The bottommenu for me is not a solution as I need at least two levels or three.

As I think that there are some more people having the same problems like me, maybe someone already made a scrollable verion out of this?
Or umalo, maybe, you could develope a paid version or something...

Umalo

Professional

  • "Umalo" started this thread

Posts: 1,051

Location: Osijek, Croatia, EU

  • Send private message

48

Monday, April 13th 2015, 3:44pm

- Send me your latest code in package to my mail. It must be some error in the code when you have button placement offset.
- Scrollable Side Menu is already done but there is small error in Scrollarea plugin when scaling so I can't publish it.
- Alternative can be 3 level Side menu : http://krpano.com/forum/wbb/index.php?pa…52031#post52031

Muxi

Trainee

Posts: 113

  • Send private message

49

Monday, April 13th 2015, 6:54pm

ok, thanks, I sent You a privmail.
I already was thinking about 3 levels but that would not be suitable for my project...hope you'll catch the error *thumbup*

martinkota

Beginner

Posts: 3

  • Send private message

50

Monday, May 18th 2015, 1:55pm

Button menu

Hi,

I am making virtual tour with sidemenu without logo. When I remove this code for logo position, I need to move a sidemenu text more up. When I done it, I need change a position of button menu to the centre left of screen. But I do not know what I change in code. It looks like that button menu pozition is join with text pozition of sidemenu. When I am coding aling=left for button menu, a button menu is on left side of text and no on left side of screen. Can you help me? Thank you

Martin

Muxi

Trainee

Posts: 113

  • Send private message

51

Monday, May 18th 2015, 2:51pm

can you give the code and maybe link of your example? it depends how you embedded the button menu...

martinkota

Beginner

Posts: 3

  • Send private message

52

Monday, May 18th 2015, 3:07pm

<menu_settings btn_menu_height="50" btn_menu_width="50" btn_back_upper_offset="-24" btn_back_left_offset="10" btn_back_rotate="180" btn_back_scale="1.3" btn_back_y="0" btn_back_x="0" x_scale="0.8" x_right_offset="16" line_transparency="0.4" line_height="1" line_upper_offset="11" arrow_upper_offset="11" arrow_right_offset="12" menu_0_onout_color_bcg="0x000000" menu_0_onover_color_bcg="0xab9862" menu_0_parent_y="0" menu_0_parent_x="0" menu_0_parent="menu_background" row_height="30" menu_0_text_y_step="30" menu_0_text_y_start="100" menu_0_text_x_start="0" menu_bgcolor="0xf4f4f4" menu_max_number_objects="20" menu_transparency="0.8" background_y="0" background_x="0" background_width="250"/>

<plugin onloaded="set(width,get(menu_settings.background_width));set(bgalpha,get(menu_settings.menu_transparency));set(bgcolor,get(menu_settings.menu_bgcolor));set(x,get(menu_settings.background_x));set(y,get(menu_settings.background_y));" zorder="4" align="left" keep="true" name="menu_background" height="100%" type="container"/>

<plugin onloaded=" set(x_x,get(menu_settings.background_width)); dec(x_x,get(menu_settings.x_right_offset)); set(x,get(x_x)); set(x_y,get(menu_settings.menu_0_text_y_start)); inc(x_y,get(menu_settings.arrow_upper_offset)); dec(x_y,get(menu_settings.row_height)); set(y,get(x_y)); set(scale,get(menu_settings.x_scale)); set(visible,true); set(plugin[submenu_x].onclick, switch_menu(0); slide_menu_left(); ); " zorder="10" align="topleft" visible="false" keep="true" url="%FIRSTXML%/gui_menu/x.png" name="submenu_x" parent="menu_background" edge="topleft"/>

<plugin onloaded=" set(back_x,get(menu_settings.btn_back_x)); inc(back_x,get(menu_settings.btn_back_left_offset)); set(x,get(back_x)); set(back_y,get(menu_settings.menu_0_text_y_start)); dec(back_y,get(menu_settings.row_height)); dec(back_y,get(menu_settings.btn_back_upper_offset)); set(y,get(back_y)); set(scale,get(menu_settings.btn_back_scale)); set(rotate,get(menu_settings.btn_back_rotate)); set(plugin[submenu_back].onclick, switch_menu(0); ); " zorder="10" align="topleft" visible="false" keep="true" url="%FIRSTXML%/gui_menu/arrow.png" name="submenu_back" parent="menu_background" edge="topleft"/>

<plugin onloaded=" set(height,get(menu_settings.btn_menu_height));set(back_x,get(menu_settings.btn_back_x));set(x,get(back_x));set(back_y,get(menu_settings.menu_0_text_y_start));set(y,get(back_y)); set(plugin[btn_menu].onclick, slide_menu_right(); ); " zorder="10" align="left" visible="false" keep="true" url="%FIRSTXML%/gui_menu/btn_menu.png" name="btn_menu" edge="left" width="prop"/>
martinkota has attached the following images:
  • Change.png
  • changes.png

This post has been edited 1 times, last edit by "martinkota" (May 18th 2015, 3:18pm)

Muxi

Trainee

Posts: 113

  • Send private message

53

Monday, May 18th 2015, 3:39pm

no, sorry, was not that...

I think the button-menu position is determined by the first position of the menu items. If You want to set it independently you can delete set(y,get(back_y)); in the btn_menu-plugin and instead set a simple y-value, like y="300" in the btn_menu-plugin.

or, after deleting set(y...) don't give any y-value if you want the button in the middle, just change align="centerleft" and edge="bottomleft"

This post has been edited 2 times, last edit by "Muxi" (May 18th 2015, 3:55pm)

Umalo

Professional

  • "Umalo" started this thread

Posts: 1,051

Location: Osijek, Croatia, EU

  • Send private message

54

Monday, May 18th 2015, 7:17pm

You are right. btn_menu as you can read from the code is depending on menu_settings.menu_0_text_y_start value.

If you want this button to be centered find code where this plugin/layer is defined:

Source code

 
1

<plugin name="btn_menu" url=

There you will see the following commands in onloaded attribute:

Source code

 
1

set(back_y,get(menu_settings.menu_0_text_y_start));set(y,get(back_y));

Delete them as you don't want it to be set that way.

And change first line of plugin to have aligment to center left and y=0:

Source code

 
1

<plugin name="btn_menu" url="%FIRSTXML%/gui_menu/btn_menu.png" keep="true" align="leftcenter" edge="leftcenter" visible="false" zorder="10" y="0"


Additionaly: Why your plugin attributes have changed usual places? (this is not error if all needed attributes are there, just asking)

martinkota

Beginner

Posts: 3

  • Send private message

55

Monday, May 18th 2015, 10:34pm

Thank you very much,

it is function. I have just one question more about coding. I would like to start and close slide menu by button menu as like on pictures. Button menu have to slide togehter with slide menu to the side. Can you give me advice? Thank you.
martinkota has attached the following images:
  • profil.png
  • Profil B.png

Umalo

Professional

  • "Umalo" started this thread

Posts: 1,051

Location: Osijek, Croatia, EU

  • Send private message

56

Monday, May 18th 2015, 11:14pm

I think using this code you can adapt it in 5 minutes to do exactly what you asked for.
http://krpano.com/forum/wbb/index.php?pa…59185#post59185

Kaihavarie

Beginner

Posts: 3

  • Send private message

57

Tuesday, June 2nd 2015, 3:00pm

Hi all

is it possible to link the menu items to external html-sites? That would be great.

Thanks

Kai

Umalo

Professional

  • "Umalo" started this thread

Posts: 1,051

Location: Osijek, Croatia, EU

  • Send private message

58

Tuesday, June 2nd 2015, 5:57pm

Yes, sure. Adapt link attribute from menu elements as you like. Currently there are loadscene and switch_menu acctions, but you can change it to call any action or load external url.
Example: link="openurl('http://www.google.com',_blank);"
(make sure to run it with Krpano server if testing localy)

Muxi

Trainee

Posts: 113

  • Send private message

59

Friday, June 5th 2015, 7:59am

Here is new version of side menu by Umalo (multilevel, scrollable, draggable menu button...smaller number of elements on mobile/tablets with bigger rows and fonts) integrated in my GUI published on project:
http://kieler-foerde-360.de/Kieler_Foerde/tour.html

Thanks for your support, Umalo!

Kaihavarie

Beginner

Posts: 3

  • Send private message

60

Thursday, June 11th 2015, 8:35am

Quoted from "Muxi"

Here is new version of side menu by Umalo (multilevel, scrollable, draggable menu button...smaller number of elements on mobile/tablets with bigger rows and fonts) integrated in my GUI published on project:
http://kieler-foerde-360.de/Kieler_Foerde/tour.html

Thanks for your support, Umalo!
Hello u

Is there a download available for this version of sidemenu?

Thanx and have a nice day *smile*

Similar threads