如何在SDL Tridion 2011 SP1中扩展“CheckOut”命令？

Question

I am trying to extend the "CheckOut" command of Tridion, and as of now I am trying to display my own message and am expecting the OOTB CheckOut action needs to be place when i click "CheckOut" option from the ribbon tool bar.

I have created the config file and .js file as given below, i have made changes in the System.config as well and created the virtual directory also. However my .js not fired and not displaying my custom message.

config.xml

<?xml version="1.0"?>
<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="CommandsExtensions.Commandset" merger="Tridion.Web.UI.Core.Configuration.Resources.CommandGroupProcessor" merge="always">
            <cfg:fileset>
                <cfg:file type="script">/js/ExtendCheckOut.js</cfg:file>
                <cfg:file type="reference">CommandsExtensions.Interface</cfg:file>
            </cfg:fileset>
            <cfg:dependencies>
                <cfg:dependency>Tridion.Web.UI.Editors.CME</cfg:dependency>
                <cfg:dependency>Tridion.Web.UI.Editors.CME.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:commands>
                    <ext:command name="CheckOut" extendingcommand="ExtendCheckOut" />
                </ext:commands>
                <ext:dependencies>
                    <cfg:dependency>CommandsExtensions.Commandset</cfg:dependency>
                </ext:dependencies>
            </ext:commandextensions>
            <ext:contextmenus/>
            <ext:lists/>
            <ext:tabpages/>
            <ext:toolbars/>
            <ext:ribbontoolbars/>
        </ext:editorextension>
    </ext:editorextensions>
    <ext:dataextenders/>
</extensions>
<commands>
    <cfg:commandset id="CommandsExtensions.Interface">
        <cfg:command name="ExtendCheckOut" implementation="CommandsExtensions.ExtendCheckOut"/>
    </cfg:commandset>
</commands>
<contextmenus/>
<localization/>
<settings>
    <defaultpage>/Views/Default.aspx</defaultpage>
    <navigatorurl>/Views/Default.aspx</navigatorurl>
    <editurls/>
    <listdefinitions/>
    <itemicons/>
    <theme>
        <path>css</path>
    </theme>
    <customconfiguration/>
</settings>

.js file

Type.registerNamespace("Extensions");

Extensions.ExtendCheckOut = function Extensions.ExtendCheckOut() {
   Type.enableInterface(this, "Extensions.ExtendCheckOut");
   this.addInterface("Tridion.Cme.Command", ["ExtendCheckOut"]);
};

Extensions.ExtendCheckOut.prototype.isAvailable = function ExtendCheckOut$isAvailable(selection) {
   return true;
}

Extensions.ExtendCheckOut.prototype.isEnabled = function ExtendCheckOut$isEnabled(selection) {
   return true;
}

Extensions.ExtendCheckOut.prototype._execute = function ExtendCheckOut$_execute(selection) {
   $messages.registerWarning("This is Extended CheckOut");
}

Answer 1

This is what I did, extending the Save button:

<cfg:groups>
  <cfg:group name="ValidateTitleField.CommandSet">
    <cfg:fileset>
      <cfg:file type="script">/Commands/ValidateTitleFieldCommand.js</cfg:file>
      <cfg:file type="reference">ValidateTitleField.Interface</cfg:file>
    </cfg:fileset>
    <cfg:dependencies>
      <cfg:dependency>Tridion.Web.UI.Editors.CME</cfg:dependency>
      <cfg:dependency>Tridion.Web.UI.Editors.CME.commands</cfg:dependency>
    </cfg:dependencies>
  </cfg:group>
  <cfg:group name="ValidateTitleField.Views.ValidateTitleFieldPopup">
    <cfg:fileset>
      <cfg:file type="script">/Views/ValidateTitleFieldPopup.js</cfg:file>
      <cfg:file type="style">/Views/ValidateTitleFieldPopup.css</cfg:file>
    </cfg:fileset>
    <cfg:dependencies>
      <cfg:dependency>Tridion.Web.UI.Editors.CME</cfg:dependency>
      <cfg:dependency>Tridion.Web.UI.Editors.CME.commands</cfg:dependency>
    </cfg:dependencies>
  </cfg:group>
</cfg:groups>

[...]

  <ext:editorextension target="CME">
    <ext:editurls />
    <ext:listdefinitions />
    <ext:taskbars />
    <ext:commands />
    <ext:commandextensions>
      <ext:commands>
        <ext:command name="Save" extendingcommand="ValidateTitleField"/>
      </ext:commands>
      <ext:dependencies>
        <cfg:dependency>ValidateTitleField.CommandSet</cfg:dependency>
      </ext:dependencies>
    </ext:commandextensions>
    <ext:contextmenus />
    <ext:lists />
    <ext:tabpages />
    <ext:toolbars />
    <ext:ribbontoolbars />
  </ext:editorextension>

[...]

<commands>
  <cfg:commandset id="ValidateTitleField.Interface">
    <cfg:command name="ValidateTitleField" implementation="Company.Extensions.ValidateTitleFieldCommand"/>
  </cfg:commandset>
</commands>

Then in my command implementation (JS) I used the following to invoke the "original" methods:

Company.Extensions.ValidateTitleFieldCommand.prototype._isAvailable = function ValidateTitleFieldCommand$_isAvailable(selection) {
    console.debug("Is Available called");
    return $cme.getCommand("Save")._isAvailable(selection);
};

And finally, somewhere deep in the _execute method:

if (!failed)
    return $cme.getCommand("Save")._execute(selection, pipeline);
else {
    this.loadPopup();
}

Hope this helps,

N

Answer 2

You have a mismatch between the implementation your configuration file points to:

<commands>
    <cfg:commandset id="CommandsExtensions.Interface">
        <cfg:command name="ExtendCheckOut" 
                     implementation="CommandsExtensions.ExtendCheckOut"/>
    </cfg:commandset>
</commands>

And the actual JavaScript code:

Extensions.ExtendCheckOut = function Extensions.ExtendCheckOut() {

You'll probably want to change the configuration file to:

        <cfg:command name="ExtendCheckOut" 
                     implementation="Extensions.ExtendCheckOut"/>