Hi,
I was wondering what codes I need to change in the jewelry box theme so that the left panel hides when the app first starts up.
Thank you,
Lesi
Lesi,
In the themes\JewelryBoxTheme\panels\LDockablePanel\Panel.js make this change:
onOpen<SPAN class="punctuation token">:</SPAN> <SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">{</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="token function">_setPostionWidthAndLeft</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> html<SPAN class="punctuation token">.</SPAN><SPAN class="token function">setStyle</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>domNode<SPAN class="punctuation token">,</SPAN> <SPAN class="punctuation token">{</SPAN> width<SPAN class="punctuation token">:</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>position<SPAN class="punctuation token">.</SPAN>width <SPAN class="operator token">+</SPAN> <SPAN class="string token">'px'</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>panelManager<SPAN class="punctuation token">.</SPAN><SPAN class="token function">minimizePanel</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="comment token">// if(this.position.width === 0){</SPAN> <SPAN class="comment token">// this.panelManager.minimizePanel(this);</SPAN> <SPAN class="comment token">// }else{</SPAN> <SPAN class="comment token">// this.panelManager.maximizePanel(this);</SPAN> <SPAN class="comment token">// }</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN><SPAN class="line-numbers-rows"><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN></SPAN>
Hi,I am customizing the Ldockable panel.I dont want any widget there I am writing customize code there..But as I am not adding any widget , when I am launching the app the panel open/close button is not coming
on the other hand front end customizing panel , there I can see the customized code added by me
How Can I view the Ldockable panel on app launch
what code need to be customized
any help on this will be highly appreciated
thanks
ash
Hi Robert,
I hope you are doing great! The above code for (LDockablePanel Closes at startup) is working fine on desktop but in mobile it still open at left on startup.
Also, is it possible can we make LDockable Panel open at bottom(like other widgets opening at bottom) in mobile view instead of left since it covers all map space when it open.
Thanks,
Irfan
Irfan,
Strange in my testing it still minimizes on mobile. As far as the moving to the bottom. No that would take a complete rewrite of the left dockable panel.
Robert,
Here are my two different steps to check the mobile view:
As soon I preview the app in Web appbuilder by clicking any mobile device it will open the with LDockablePanel.
Also, by inspecting the launch app in google chrome browser it still does the same thing first time. But after refreshing the app while staying in mobile view it don't open the LDockablePanel.
Thanks again for your help!
This little change works well, thank's
Is it possible to make a difference if it is a mobile device.
Ideally, I would like the panel to be minimized only on a mobile device ?
Jacques
Jacques,
Sure just check if the app is mobile using window.isMobileUa
perfect, thank you Robert
Hi Robert and Jacques-
Wondering if you can direct me on where to add the code to "check if the app is using window.isMobileUa"? I too am interested in having the Jewelry Box theme panel minimized only when our app is viewed on a mobile device and visible otherwise, but I'm just not sure where/how to add in that logic for mobile size.
Thanks!
Jennifer
When I try using your code above it works and closes on startup, but I cannot see the image to open it after startup when we need it. Any ideas?
Los miembros registrados pueden publicar, seguir actualizaciones y más. ¿Nuevo aquí? Regístrate gratis.
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.
