Topic
  • 4 replies
  • Latest Post - ‏2013-02-26T08:42:34Z by Jaango
HermannSW
HermannSW
4874 Posts

Pinned topic Bookmarklets and WebGUI

‏2010-05-17T21:06:25Z |
Hello,

a bookmarklet is a program stored in a URL often starting with "javascript:...".

3.7.x bookmarklets

In Datapower firmware releases 3.7.x the links in WebGUI left navigation bar are bookmarklets looking like this:

javascript:window.mainFrame.genericStatusRequest(
'StylesheetCachingSummary',%20
'genericStatus')

This has the advantage that the address of the box is not included.
Bookmarking any of these links allows to use the generated bookmarks for any of your 3.7.x DataPower boxes.

3.8.0 bookmarks

In DataPower firmware release 3.8.0 the links on WebGUI left navigation bar look like this:

https:
//boxip:webguiport/status/StylesheetCachingSummary

As can be seen the box address is part of these links and a bookmark may only be used for one box.

3.7 / 3.8 folders

It is useful to have the links most often used available in folders "3.7" and "3.8"
in Bookmarks Toolbar (FF)/ Links (IE)/ Bookmarks Bar (Chrome & Safari) for easy access.
See the attached screenshot for an example consisting of links interesting for Stylesheet development.

3.8.x bookmarklets

In order to be able to use the links in "3.8" folder for all 3.8.x boxes bookmarklets are the solution, again.

In order to make the "Stylesheet Cache" bookmark

https:
//boxip:webguiport/status/StylesheetCachingSummary

applicable to all your 3.8.x boxes you may turn it into a bookmarklet doing the necessary transformation like this:

javascript:

void(location=window.location.href.replace(/(^[^:]*:\/\/[^/]*).*$/g,
'$1')+
'/status/StylesheetCachingSummary')

(This just extracts the protocol, address and port from your current WebGUI page and prepends that to the service selector)

As you can see this is a simple pattern -- just bookmark the link you are interested in into menue "3.8".
Then do the modification as shown above.

Special case: popup links

DataPower XPath Tool is really useful.
It opens in a new window and allows to determine XPath statements by just clicking into a loaded XML document.

XPath Tool bookmark for 3.7.x is

https:
//boxip:webguiport/TaskTemplates/SelectXPath.xml?popup=true&newObjPopup=true&newObjPopupInput=input_XPath&step=get-started&popuplocation=

and for 3.8.0 is

https:
//boxip:webguiport/service/SelectXPath?popup=true&newObjPopup=true&newObjPopupInput=input_XPath&step=get-started&popuplocation=


For 3.7.x this is how to turn the bookmark into a bookmarklet allowing application to all your 3.7.x boxes:

javascript:

void(window.open(window.location.href.replace(/(^[^:]*:\/\/[^/]*).*$/g,
'$1')+
'/TaskTemplates/SelectXPath.xml?popup=true&newObjPopup=true&newObjPopupInput=input_XPath&step=get-started&popuplocation=').focus())


For Firefox and Chrome this opens a new tab in the browser, for Internet Explorer and Safari this opens a new window.
(You may modify "window.open" to get different behavior)

Complete samples for bookmarking

Bookmarklet software distribution is just a list of links, which can be bookmarked.
I lost the fight with the Wiki software and have to provide the links encapsulated in code-tags.


Stylesheet Cache (3.7/3.8) javascript:window.mainFrame.genericStatusRequest(
'StylesheetCachingSummary',%20
'genericStatus') javascript:

void(location=window.location.href.replace(/(^[^:]*:\/\/[^/]*).*$/g,
'$1')+
'/status/StylesheetCachingSummary')   Stylesheet Profiles (3.7/3.8) javascript:window.mainFrame.genericStatusRequest(
'StylesheetProfilesSimpleIndex',%20
'genericStatus') javascript:

void(location=window.location.href.replace(/(^[^:]*:\/\/[^/]*).*$/g,
'$1')+
'/status/StylesheetProfilesSimpleIndex')   Stylesheet Status (3.7/3.8) javascript:window.mainFrame.genericStatusRequest(
'StylesheetStatusSimpleIndex',%20
'genericStatus') javascript:

void(location=window.location.href.replace(/(^[^:]*:\/\/[^/]*).*$/g,
'$1')+
'/status/StylesheetStatusSimpleIndex')   XPath Tool (3.7/3.8) javascript:

void(window.open(window.location.href.replace(/(^[^:]*:\/\/[^/]*).*$/g,
'$1')+
'/TaskTemplates/SelectXPath.xml?popup=true&newObjPopup=true&newObjPopupInput=input_XPath&step=get-started&popuplocation=').focus()) javascript:

void(window.open(window.location.href.replace(/(^[^:]*:\/\/[^/]*).*$/g,
'$1')+
'/service/SelectXPath?popup=true&newObjPopup=true&newObjPopupInput=input_XPath&step=get-started&popuplocation=').focus())
Updated on 2013-02-26T08:42:34Z at 2013-02-26T08:42:34Z by Jaango
  • arun_tcs
    arun_tcs
    144 Posts

    Re: Bookmarklets and WebGUI

    ‏2010-05-18T05:30:19Z  
    Thanks a lot Herman for sharing the information. You have got lot of tricky tools :)

    This will definitely aid in development.
  • Jaango
    Jaango
    267 Posts

    Re: Bookmarklets and WebGUI

    ‏2013-02-22T10:53:26Z  
    • arun_tcs
    • ‏2010-05-18T05:30:19Z
    Thanks a lot Herman for sharing the information. You have got lot of tricky tools :)

    This will definitely aid in development.
    How do i use java script to click on "Debug probe" tab, i can add to favourites the page for DebugPanel(the thing when we click on toubleshooting in ctrl panel). However, would like to use some java script code to invoke the debug probe tab. Tried below without luck

    document.getElementById('debugTabs-Probe-tab').click();
    
    Updated on 2014-03-25T02:39:22Z at 2014-03-25T02:39:22Z by iron-man
  • HermannSW
    HermannSW
    4874 Posts

    Re: Bookmarklets and WebGUI

    ‏2013-02-25T20:23:49Z  
    • Jaango
    • ‏2013-02-22T10:53:26Z
    How do i use java script to click on "Debug probe" tab, i can add to favourites the page for DebugPanel(the thing when we click on toubleshooting in ctrl panel). However, would like to use some java script code to invoke the debug probe tab. Tried below without luck

    <pre class="java dw" data-editor-lang="java" data-pbcklang="java" dir="ltr">document.getElementById('debugTabs-Probe-tab').click(); </pre>
    I just selected a Probe icon in "Debug Probe" tab of "Trouble Shooting" screen and did "View Selection Source".
    Not sure what you want to build from this:
    <a xmlns="http://www.w3.org/1999/xhtml" id="btn_debug_1" onclick="multistepDebugPopup('mpgw', '1234', 'show')" href="javascript:void(0);"><img border="0" alt="List Transactions" src="/images/magnify_small.gif"/></a>
    


     
    Hermann <myXsltBlog/> <myXsltTweets/> <myCE/>
    Updated on 2014-03-25T02:39:05Z at 2014-03-25T02:39:05Z by iron-man
  • Jaango
    Jaango
    267 Posts

    Re: Bookmarklets and WebGUI

    ‏2013-02-26T08:42:34Z  
    • HermannSW
    • ‏2013-02-25T20:23:49Z
    I just selected a Probe icon in "Debug Probe" tab of "Trouble Shooting" screen and did "View Selection Source".
    Not sure what you want to build from this:
    <pre class="java dw" data-editor-lang="java" data-pbcklang="java" dir="ltr"><a xmlns="http://www.w3.org/1999/xhtml" id="btn_debug_1" onclick="multistepDebugPopup('mpgw', '1234', 'show')" href="javascript:void(0);"><img border="0" alt="List Transactions" src="/images/magnify_small.gif"/></a> </pre>

     
    Hermann <myXsltBlog/> <myXsltTweets/> <myCE/>
    Hermann,

    I was looking for a way to use the shortcuts to access the "Debug Probe" tab, without using any mouse click. If we add the below url to favourites, we can eaily access the troubleshooting, main tab, page. That was why i tried using some javascript codes, for easy access of other tabs.
    https://mybox:9090/system/DebugPanel
    javascript:document.getElementById("debugTabs-Probe-tab").click()
                                                                            <div class="tab" id="debugTabs-Probe-tab">
                                                                                    <span class="tab-wrap-1">
                                                                                            <span class="tab-wrap-2">
                                                                                                    <span class="tab-wrap-3">Debug Probe</span>
                                                                                            </span>
                                                                                    </span>
                                                                            </div>
    
    Updated on 2014-03-25T02:39:02Z at 2014-03-25T02:39:02Z by iron-man