[Menu JQuery (IJ)] How to integrate into your project...

[Menu JQuery (IJ)] How to integrate into your project...

Forge Component
Published on 2014-12-14 by Ian Johnstone
0 votes
Published on 2014-12-14 by Ian Johnstone
  1. Download Menu JQuery (IJ) and open the project.
  2. Save the 5 resources to your hard-drive (2 CSS, 2 GIF, 1 JS) file, and add them to the project you are using MenuJQueryIJ on.  Remember to set "Deploy To Target Directory" and for the gif files they need to be placed in the "img" folder (that's where the JS file expects them).  You may need to alter the GIF files to fit your theme.
  3. Compile and deploy MenuJQuery(IJ) then test the menu that is there (action is MakeSampleMenu)
  4. Look at "Screen Flows ::: Common ::: Menu" and the reference to the "MenuJQueryIJ ::: MenuHorizonal" webblock.  This is where you set you menu color and selector color (it's used by the JavaScript).
  5. To set the text colors, open up your theme, and put in these two lines or whatever you want.  If you open the MenuJQueryIJ theme, you'll find these two CSS commands replicating them in your project allows you to set your own colors, the first is the standard color and the second is a hover color.
    .ddsmoothmenu a, .ddsmoothmenu a:link, .ddsmoothmenu a:visited { color: white; }
    .ddsmoothmenu a:hover { color: black; }

  6. Evaluate the MakeSampleMenu action to create your own menu.  You need a "Menu_Start" and "Menu_End" action at the start and end of the logic.  You use a "Menu_Add" to add an element to the menu.  If you want to create a sub-menu, set "isCreateSubMenu" to true.  Then all menus after this menu add fall into a sub-menu.  When you have finished a submenu, you add a "Menu_Pop" action.
  7. For menu_add, these are the options.  "MenuName" is the text title that appears in the menu (there is a text length limit, so watch out).  "ASPXPageName" is the name of the page without the ".aspx" suffix.  If you wish to make this system work with java, you'll have to modify Menu_add appropriately.  If you want to use parameters, include the .aspx suffix and add any parameters you want with ? and &.  You can use session variables and expressions to set the parameters appropriately.  "RoleName" tests the current session user for the role that they have; make sure the text case is accurate or RoleName won't work.  "isCreateSubMenu" creates a submenu so that subsequent menu_adds go into a sub menu.  Use menu_pop at the end of a submenu.
  8. In your "Common ::: Header", create a preparation and put in your menu create action.  You keep the menu create action here while developing as menu is created once per session; the time between login/logout.  But once the app is done/fix, etc. you can move the menu to to the OnSessionStart, assuming you don't have any special logic or parameters to be generated.  The menu creation, generally, only needs to occur once per session; and you don't need to generally use CPU regenerating the same menu over and over.
  9. To skin this menu for different tenants, I used session variables to determine the two colours to use so that I could feed them into the MenuHorizontal webblock reference.  CSS is deployed per tenant so that's how the colors end up being set.

Hi Ian,

Very nice. Thanks for sharing.

I've discovered a bug in this system, and I'll issue a patch next day or so.  (Roles don't work right), and I need to add a role on the menu_pop part.