Display web-preview of document on form in Alfresco 5 share community

Question

I have created an alfresco form. I would like to embed the web-preview component on it. I found a source code example for Alfresco 4.2.1 .

First it creates an ftl file.

<@script type="text/javascript" src="${page.url.context}/res/components/form/custom-web-preview.js"></@script>
   <@script type="text/javascript" src="${page.url.context}/res/components/preview/web-preview.js"></@script>
   <@script src="${url.context}/res/components/preview/web-preview.js" />
   <@script src="${url.context}/res/components/preview/WebPreviewer.js" />
   <@script src="${url.context}/res/js/flash/extMouseWheel.js" />
   <@script src="${url.context}/res/components/preview/StrobeMediaPlayback.js" />
   <@script src="${url.context}/res/components/preview/Video.js" />
   <@script src="${url.context}/res/components/preview/Audio.js" />
   <@script src="${url.context}/res/components/preview/Flash.js" />
   <@script src="${url.context}/res/components/preview/Image.js" />

 <script type="text/javascript">//<![CDATA[
(
function()
{
    new Alfresco.customControl("${fieldHtmlId}").setMessages(${messages});
}
)
();

//]]></script>

<div id="${fieldHtmlId}">
   <div id="web-preview">

 </div>
</div>

After add the following code in onReady method of client side java-script

Alfresco.util.Ajax.request(
         {
           method: "GET",
           url: Alfresco.constants.URL_SERVICECONTEXT + "components/preview/web-preview?nodeRef=${NODEREF}&htmlid=${ID}",,
           successCallback:
           {
            fn: function(o)
            {
        Dom.get("web-preview").innerHTML = o.serverResponse.responseText;
            },
            scope: this
           },
           failureMessage: "Failed"
        });
         }

When i try this on alfresco 5 community the form failure.

Is this possible to work in the new version of Alfresco ? Where exactly should I add the Ajax request ? Is there a better way to achieve this ?

What is the error you're getting? You don't expect us to copy the code and try it on 5 for you right :) — Tahir Malik, Feb 18 '16 at 20:02
ERROR [extensions.webscripts.AbstractRuntime] [http-bio -8080-exec-17] Exception from executeScript - redirecting to status template err or: 01190000 Failed to process template org/alfresco/components/form/form.get.ht ml.ftl org.springframework.extensions.webscripts.WebScriptException: 01190000 Failed t o process template org/alfresco/components/form/form.get.html.ftl — mr antoni, Feb 19 '16 at 09:13
Tip: If the failing expression is known to be legally null/missing, either speci fy a default value with myOptionalVar!myDefault, or use <#if myOptionalVar??>whe n-present<#else>when-missing#if>. (These only cover the last step of the expre ssion; to cover the whole expression, use parenthessis: (myOptionVar.foo)!myDefa ult, (myOptionVar.foo)?? The failing instruction (print stack trace for 14 more): ==> ${page.url.context} [in template "org/alfresco/components/form/controls/web -preview.ftl" at line 1, column 38] — mr antoni, Feb 19 '16 at 09:14

Marco Altieri · Answer 1 · 2016-02-20T13:16:26.470

The code in that article is incomplete and depends on a lot of custom code that has not been included.

It is not clear to me:

what is it the custom-web-preview.js ?
What is it the javascript class Alfresco.customControl that is instantiated in the ftl ?

new Alfresco.customControl("${fieldHtmlId}").setMessages(${messages})
What is the "client side" javascript in which to add the onReady ?
What is trying to call with the following url?

Alfresco.constants.URL_SERVICECONTEXT + "components/preview/web-preview?nodeRef=${NODEREF}&htmlid=${ID}"

I am not aware of placeholders with the syntax ${} in the share library. In the share code sometimes YAHOO.lang.substitute is used to substitute placeholders specified with the syntax {}, like in the following example:

var templateUrl = YAHOO.lang.substitute(Alfresco.constants.URL_SERVICECONTEXT + "components/form?itemKind={itemKind}&itemId={itemId}&mode={mode}&submitType={submitType}&formId={formId}&showCancelButton=true",
{
   itemKind: "type",
   itemId: "cm:folder",
   mode: "create",
   submitType: "json",
   formId: "doclib-common"
});

The javascript object passed to the method is used to specify the actual values for the placeholders. In the code suggested in the article, I do not see what share is supposed to do with the ${ID} and ${NODEREF}.

I am sorry, but it seems to me that the author of the article has just copied and pasted some code written in his project at work without testing that what he wrote was self contained and correct.

Display web-preview of document on form in Alfresco 5 share community

1 Answers1