Help customizing Sites in Share's header...

[gregbpopstar]

I'm customizing Share's "app-items" in it's header. 

First I read this great wiki article about the Share Header.

I found it was very easy to add a static "link" menu item to to sites Document Library on a site by site basis by adding the <header> section to the global config in share-config-custom.xml like this:

    <!– Global config section –>
    <config replace="true">
…
      <header>
         <app-items>
…
            <item type="link" id="test-site" label="Test Site" icon="sites.png">/site/test/documentlibrary</item>
…
         </app-items>
…
      </header>
    </config>
‍‍‍‍‍‍‍‍‍‍‍‍‍‍

That worked, but the following is what I really want to do, but haven't had success with yet.

I want to modify the "Sites" javascript menu so the favorites links on the menu all deliver the user directly to the Document Library bypassing the each sites dashboard. 

I tried this by changing the following:
1. Copied the UriTemplate config section from share-config.xml into share-config-custom.xml and modified it adding a new uri-template.  Here's what I added with a coment by my new uri-template element:

   <config evaluator="string-compare" condition="UriTemplate" replace="true">
      <uri-templates>
         <uri-template id="sitedashboardpage">/site/{site}/dashboard</uri-template>
         
      <!– Adding the uri template below in at attempt to change the urls on the site menu making them go directly to the document library. –>
      <uri-template id="sitedocumentlibrarypage">/site/{site}/documentlibrary</uri-template>

         <uri-template id="sitepage">/site/{site}/{pageid}</uri-template>
         <uri-template id="userdashboardpage">/user/{userid}/dashboard</uri-template>
         <uri-template id="userpage">/user/{userid}/{pageid}</uri-template>
         <uri-template id="userprofilepage">/user/{userid}/profile</uri-template>
         <uri-template id="userdefaultpage">/user/{pageid}</uri-template>
         <uri-template id="consoletoolpage">/console/{pageid}/{toolid}</uri-template>
         <uri-template id="consolepage">/console/{pageid}</uri-template>
      </uri-templates>
   </config>
‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

2. Next, I changed the _renderFavouriteSites function in /modules/header/sites.js file like this:

…
      _renderFavouriteSites: function Sites__renderFavouriteSites()
      {
…
         for (i = 0, ii = sites.length; i < ii; i++)
         {
            sitesMenu.addItem(
            {
               text: $html(this.options.favouriteSites[sites[i]]),
               
/* Using my new sitedocumentlibrarypage uri template instead of sitedashboardpage */
               url: Alfresco.util.uriTemplate("sitedocumentlibrarypage",
               {
                  site: sites[i]
               })
            }, 0);
         }
…
      },
…
‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

I know I should have done #2 above in a new javascript file and then added it to the dependencies, but this is a test at this point.

To my disappointment, these 2 changes didn't make the Sites menu items link correctly and even caused the Document Library page on every site to be inaccessible.

Does anyone have suggestions on how I may be able to make this kind of idea work?

Thanks

[mikeh]

The exact order of the uri-template config section is quite strict, as Surf uses it to determine page template arguments. Try inserting your new entry *after* the "sitepage" entry; that shouldn't affect normal operation.

Thanks,
Mike

[gregbpopstar]

That fixed half of the problem.  Thanks Mike.  Now I don't get an errors where Share says it can't find the sites dashboard and documentlibrary pages.

My remaining problem is that my change to the share/modules/header/sites.js file above didn't change the URIs on the favorites menu.  While investigating, I consulted FireFox's Firebug and Chrome's equivalent tools to see what sites.js file was being requested and found share is requesting /share/res/modules/header/sites.js (courtesy of UrlRewriteFilter).  When I make a manual request for http://localhost:8080/share/res/modules/header/sites.js it shows correctly my edited javascript. 

I still don't know why I'm not getting the right URIs in the menu items.  I have a feeling a lot of things are going to become more clear to me once I understand why.

PS: I've tried adding breakpoints and debugging to client side javascript FireBug's debugger, but I don't hit any of the breakpoints I put in the sites.js resource it loads.  Has anyone had success with this kind of interactive debugging of share client scripts?

[mikeh]

Are you absolutely sure it's requesting sites.js and not sites-min.js? The "unminimized" version is only requested if you've set the client-side debug flag to true.

   <!– Global config section –>
   <config replace="true">
      <flags>
         <!–
            Developer debugging setting to turn on DEBUG mode for client scripts in the browser
         –>
         <client-debug>true</client-debug>

         <!–
            LOGGING can always be toggled at runtime when in DEBUG mode (Ctrl, Ctrl, Shift, Shift).
            This flag automatically activates logging on page load.
         –>
         <client-debug-autologging>false</client-debug-autologging>
      </flags>
   </config>
‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Thanks,
Mike

[gregbpopstar]

I have the … <client-debug>true</client-debug> … you just sent in my share-config-custom.xml and I even put it in the share-config.xml just to be sure.

According to FireFox/FireBug and Chrome/Tools they are requesting sites.js and not site-min.js, but maybe that request is always supposed to be sites.js and is vectored to sites-min.js behind scenes?

I also did a wget of with the sites.js URI which the browsers requested and got a well formatted un-minimized version of the file with my correct changes.  That's what's got me scratching my head.  According to both of the browser tools and the wget the JS is right, but the resulting links in the favorites menu are not what they should be given my specified URI Template.

I wish I could successfully get some interactive debugger action on that JS, but I haven't been able to get that working.

[dallimor]

Sorry to thread dig but I thought I'd post a workaround for this.  The problem is the _renderFavouriteSites method is not called on load up but only when favorites are created and deleted.

Its probably not the optimum method but you can modify onTemplateLoaded and a call to _renderFavouriteSites to get the updated menu.

      /**
       * Event callback when dialog template has been loaded
       *
       * @method onTemplateLoaded
       * @param response {object} Server response from load template XHR request
       */
      onTemplateLoaded: function Sites_onTemplateLoaded(response)
      {
         // Inject the template from the XHR request into a new DIV element
         var containerDiv = document.createElement("div");
         containerDiv.innerHTML = response.serverResponse.responseText;
         document.body.insertBefore(containerDiv, document.body.firstChild);

         this.widgets.sitesButton = new YAHOO.widget.Button(this.id,
         {
            type: "menu",
            menu: this.id + "-sites-menu",
            lazyloadmenu: false
         });

         this._renderFavouriteSites();
      },‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Thanks

Chris