Tridion 2011 provides shortcuts for several actions to navigate the tree view in the GUI and open items.  However, many other operations do not have a hotkey available, such as the Publish Queue.  During a normal day I open the Publish Queue many times, often from a Component or Page view.  I also have minimized the ribbon toolbar and finding the Publish Queue button is still an effort.  I wanted a shortcut key to assign to the Publish Queue to bring it up.  In this post I’ll explain how I added the hotkey to the Tridion GUI using a GUI Extension and provide a way for you to further customize it with your own hotkeys.

Code published at https://github.com/rcurlette/Publish-Queue-Shortcut

Update:  Big thanks to @puf for the comments.  Code is updated to reflect them.

Step 1:  Create the Folder for the GUI Extension.  I created the folder for the GUI Extension:  C:\Program Files\Tridion\web\WebUI\Editors\Shortcuts

Step 2:  Add the js files

For this extension I am using an external js library called Mousetrap, http://craig.is/killing/mice.  It is an excellent library, stand-alone, no dependencies, and only 1.6kb when minified.  This is important to know because the js library will load on every GUI view.

Create a js folder in the Shortcuts folder and put the mousetrap.min.js file there.

Step 3:  Adding our shortcut

Create another js file and call it mousekeys.js.  This is the place we’ll define our shortcuts and map them to GUI Javascript calls.

The below code was borrowed and adapted  from Albert Romkes excellent post about adding js files without showing a GUI element.   http://albertromkes.com/2012/01/30/tridion-gui-extensions-how-to-load-a-javascript-without-showing-a-gui-element/

/js/mousekeys.js

//If you only want your code to affect certain screens/views, you should listen to Anguilla events like this:
$evt.addEventHandler($display, "start", onDisplayStarted);

// This callback is called when any view has finished loading
function onDisplayStarted() {

	// Open Publish Queue dialog
	Mousetrap.bind('q', function() {
	                // UPDATE:  Below is the easy way to do it.  Make sure to update your Shortcuts.config to include the CME dependencies.  Big thanks to Frank van Puffelen (@puf) for the suggestion!
                        $commands.executeCommand('PublishingQueue')

			//var popup = $popup.create($cme.Popups.PUBLISH_QUEUE.URL, $cme.Popups.PUBLISH_QUEUE.FEATURES);
			//popup.open();
	});

    $evt.removeEventHandler($display, "start", onDisplayStarted);

    //alert($display.getView().getId());

   //if ($display.getView().getId() == "ComponentView") {
		//alert('comp view');
   //}
}

Step 4:  Finding the js call for the Tridion functionality

Using Firebug I inspected the Publish Queue button and then searched through the GUI js using Firebug Script window and found the code to open the Publish Dialog.  I feel lucky to have found it and that it worked.  🙂  This is not always so easy and you might want to do some research before planning on mapping a shortcut to a favorite functionality, like checking-in or checking-out TBBs.  (if you do figure out how to do this pls leave a comment!)  🙂  What other hotkey mappings would you like to see?

Step 5:  Create the config file for the extension

For me this was the first time using the domain model element within the config node.  It is a distinct difference between the normal method of having the cfg:file set node under the cfg:group node.

Shortcuts.config

<?xml version="1.0" ?>
<!--
    Tridion Hotkeys Extension

    Copyright (C) 2012 Robert Curlette
-->
<Configuration xmlns="http://www.sdltridion.com/2009/GUI/Configuration/Merge" xmlns:cfg="http://www.sdltridion.com/2009/GUI/Configuration" xmlns:ext="http://www.sdltridion.com/2009/GUI/extensions" xmlns:cmenu="http://www.sdltridion.com/2009/GUI/extensions/ContextMenu">
  <resources cache="true">
    <cfg:filters/>
    <cfg:groups>
      <cfg:group name="Curlette.Shortcuts" merger="Tridion.Web.UI.Core.Configuration.Resources.CommandGroupProcessor" merge="always">
          <cfg:domainmodel name="MousetrapDomain">
            <cfg:fileset>
              <cfg:file type="script" id="mousetrapLib">/js/mousetrap.min.js</cfg:file>
              <cfg:file type="script" id="mouseKeys">/js/mousekeys.js</cfg:file>
            </cfg:fileset>
            <cfg:services />
          </cfg:domainmodel>
          <cfg:dependencies>
            <cfg:dependency>Tridion.Web.UI.Editors.CME2010</cfg:dependency>
            <cfg:dependency>Tridion.Web.UI.Editors.CME2010.commands</cfg:dependency>
          </cfg:dependencies>
      </cfg:group>
    </cfg:groups>
  </resources>
  <definitionfiles/>
  <extensions>
    <ext:editorextensions>
      <ext:editorextension target="CME">
        <ext:editurls/>
        <ext:listdefinitions/>
        <ext:taskbars/>
        <ext:commands/>
        <ext:commandextensions/>
        <ext:contextmenus />
        <ext:lists/>
        <ext:tabpages/>
        <ext:toolbars/>
        <ext:ribbontoolbars/>
      </ext:editorextension>
    </ext:editorextensions>
    <ext:dataextenders/>
  </extensions>
  <commands/>
  <contextmenus/>
  <localization/>
  <settings>
    <defaultpage/><!--/Views/Default.aspx</defaultpage>-->
    <navigatorurl/><!--/Views/Default.aspx</navigatorurl>-->
    <editurls/>
    <listdefinitions/>
    <itemicons/>
    <theme>
      <path/><!--/CSS/</path>-->
    </theme>
    <customconfiguration/>
  </settings>
</Configuration>

Step 6:  Add the GUI Extension to the GUI
C:\Program Files\Tridion\web\WebUI\WebRoot\Configuration\System.config

<editor name="TridionShortcuts" xmlns="http://www.sdltridion.com/2009/GUI/Configuration">
<installpath xmlns="http://www.sdltridion.com/2009/GUI/Configuration">C:\Program Files\Tridion\web\WebUI\Editors\Shortcuts</installpath>
      <configuration xmlns="http://www.sdltridion.com/2009/GUI/Configuration">Shortcuts.config</configuration>
      <vdir xmlns="http://www.sdltridion.com/2009/GUI/Configuration">Shortcuts</vdir>
</editor>

Step 7:  Flush browser cache and try it.

Press the ‘q’ key in any window.  The moustrap js library does not work if you are in a text box or an input element, even if you use the ctrl-q key instead of ‘q’ as a hokey.

Code published at https://github.com/rcurlette/Publish-Queue-Shortcut

Summary

The GUI Extension framework allows us to easily enhance and enrich the User Experience using existing js libraries.  However, we should use care when adding libraries since they will be loaded with each GUI View and any errors in the js code will break the GUI.  To find out if your extension is breaking the gUI you can quicly comment it out in the System.config file and be back to normal very quickly.  I hope you enjoy using this and it makes it easier and quicker to view the Publish Queue.