AnsweredAssumed Answered

Include ZeroClipboard in a ftl template

Question asked by amandine.b on May 13, 2015
Latest reply on May 18, 2015 by amandine.b
Hi,

I'm trying to use ZeroClipboard, a JavaScript library which allow to copy text into the clipboard.
I used this librarie with Alfresco 4.1 without problems, but when I changed to Alfresco 4.2, the action doesn't work anymore.

I've added a custom action on the "More Action" menu. When I click on this action, a new popup shows up, which contains the JavaScript calling ZeroClipboard.

If I still use my 4.1 configuration, I get a JavaScript error which make the header menu disappear.
This error is caused by the librairie, which try to access to the body. Nevertheless, when the Javascript dependencies are loaded, the body isn't loaded yet.

So I try to move the dependency by removing it of the "share-config.xml" file and by including it to my ftl template, but the Javascript is never loaded.

<b>My 4.1 configuration (share-config.xml) :</b>
<blockcode> <config evaluator="string-compare" condition="DocLibCustom">
         <dependencies>
            <js src="/modules/simple-dialog.js" />
            <js src="/modules/email-form.js" />
            <js src="/components/people-finder/authority-finder.js" />
            <js src="/components/documentlibrary/my/ZeroClipboard.min.js" />
         </dependencies>
   </config>
</blockcode>

On the 4.2, I deleted the "ZeroClipboard" line.

<b>The ftl template :</b>
<blockcode>
<div id="div_getnoderef">

   <p id="p_label_do_ctrlc">${msg('do-ctrlc')}</p>
   <#if args.nodeRef??>
   <p>
      <input id="cp_nodeRef" name="nodeRef" type="text"
         value="${args.nodeRef}" title="NodeRef" />
   </p>
   <div class="ft">
      <span class="button-group"> <span
         class="yui-button yui-push-button"> <span class="first-child">
               <button id="my-button" data-clipboard-text="${args.nodeRef}">${msg('get-noderef-action.close')}</button>
         </span>
      </span>
      </span>
   </div>
   <#else>
   <p>Erreur lors de la récupération de la référence.</p>
   </#if>
</div>

<script type="text/javascript">
   //—————————–
   //Copie dans le presse papier
   //—————————–

   // pour éviter le bug sous IE on passe par sa fonction interne + destruction de la fenêtre
   if (window.clipboardData) {
      document.getElementById('my-button').onclick = function(event) {
         window.clipboardData.setData('Text', nodeRef);
         downloadDlg.destroy();
      }
   }
   // pour les autres navigateurs on appelle zeroclipboard
   else {
      // on test si l'utilisateur a bien flash d'installé pour que le script fonctionne
      var hasFlash = false;
      try {
         var fo = new ActiveXObject('ShockwaveFlash.ShockwaveFlash');
         if (fo)
            hasFlash = true;
      } catch (e) {
         if (navigator.mimeTypes["application/x-shockwave-flash"] != undefined)
            hasFlash = true;
      }

      //Si Flash installé, on passe par la libraire ZeroClipboard.
      if (hasFlash) {
         ZeroClipboard.config({
                  swfPath : '/share/res/components/documentlibrary/my/ZeroClipboard.swf'
               });
         var client = new ZeroClipboard(document.getElementById('my-button'));
         // lorsque la mise en mémoire du noderef est finie on détruit la fenêtre
         client.on('complete', function(client, args) {
            downloadDlg.destroy();
         });
      } else { // s'il n' pas flash le clic sur le bouton fermé ne fait pas la copie, il ferme juste la fenêtre et on change le label
         document.getElementById('p_label_do_ctrlc').innerHTML = Alfresco.util
               .message("do-ctrlc-noflash");
         document.getElementById('my-button').onclick = function(event) {
            downloadDlg.destroy();
         }
      }
   }
</script>
</blockcode>

I try to add
<script src="classpath:share/res/components/documentlibrary/my/ZeroClipboard.min.js"></script>
on the ftl template but when I click on the action, I've got the error "ZeroClipboard is undefined" and the ZeroClipboard JavaScript file doesn't appear in the loaded JS files (on firebug).

Do you have any ideas to solve this issue please ?

Thanks,

Regards.

Outcomes