topic Re: Include custom javascript library in Alfresco Archive

Include custom javascript library

jackjm — Thu, 27 Sep 2012 15:53:59 GMT

Hello allI would like to integrate MathJaxhttp://www.mathjax.org/ into an Alfresco implementation. Installation aside; the Alfresco involves including a <script> tag to the rendered document. What files would I need to modify to make this possible? Also, would it be possible to customize such

Re: Include custom javascript library

jpotts — Fri, 28 Sep 2012 21:28:01 GMT

Script tags are typically referenced in the HEAD part of an HTML page. In Alfresco Share, everything you see in the web page is rendered by a web script. A web script has a controller, typically server-side JavaScript, and one or more views. In Share's case, those views are implemented as Freemarker templates that spit out HTML.

A given web script is made up of multiple files. One of those files is named using the syntax:
some_script_id.some_http_method.head.ftl.

For example, go look at $TOMCAT_HOME/webapps/share/WEB-INF/classes/alfresco/site-webscripts/org/alfresco/components/wiki at the page.get.head.ftl file. You'll see some tags like "<@script>". That is a macro that produces "<script>" tags. The macros switches between compressed ("minified") JavaScript and uncompressed JavaScript depending on the debug setting in share config.

So to add your own client-side JavaScript library, you need to override the head file of a web script and add your own script reference. The easiest way to do this is to copy the script you want to override into $TOMCAT_HOME/webapps/share/WEB-INF/classes/alfresco/web-extension, so in this example the page.get.head.ftl file would be copied to $TOMCAT_HOME/webapps/share/WEB-INF/classes/alfresco/web-extension/site-webscripts/org/alfresco/components/wiki. Then make changes as you see fit.

This approach works for 3.4 and 4.0. In 4.0 there's an alternative way to override web scripts. See Dave Draper's blog for more details.

I don't know if that is the EXACT web script or head file you want–you'll have to figure that out for yourself. You might look at enabling surf bug–it can show you which web scripts are responsible for which parts of the Share app.

Sorry that I don't have time to give you step-by-step instructions, but this should give you enough to go on.

Jeff

Re: Include custom javascript library

jackjm — Mon, 08 Oct 2012 20:40:09 GMT

Thank you very much Jeff, this is certainly very helpful in getting started. I will try this out later this evening and let you know. Sorry for the late response; I got pulled away in other projects.

Best regards

Re: Include custom javascript library

jackjm — Tue, 09 Oct 2012 15:36:23 GMT

Hi Jeff,

Thank you very much; things worked as expected and I was able to include the custom library. However; the library also requires options to be included in the script tag as follows:

<script type="text/x-mathjax-config">
MathJax.Hub.Config({
    extensions: ["tex2jax.js"],
    jax: ["input/TeX","output/HTML-CSS"],
    tex2jax: {inlineMath: [["$","$"],["\$","\$"]]}
});
</script>

Any guidance on where and how I can get this information included?

Thank you again for all your assistance

best regards.

Re: Include custom javascript library

jackjm — Wed, 10 Oct 2012 21:59:18 GMT

I (think) I figured this out; I over-wrote the page.get.html.ftl to get the custom <script text="…">

I can see in the source of the page that library and the respective information is rendered.

One final question; I notice that most of the tags have //<!CDATA[ in them; is this necessary for the custom text that I want rendered and if so any reason? In my early days I remember this had something to do with XML but I don't remember exactly!

Now that I have things the library included, I have to continue working on the integration and the MathJax library to kick in as required.

As far the inclusion goes, I think this issue is mostly resolved. I say mostly because I am not sure if what I did above was correct; if you can please confirm, I will close the issue and mark it resolved.

Thanks again for all the help Jeff

Re: Include custom javascript library

jpotts — Thu, 11 Oct 2012 19:18:25 GMT

You should be able to put that script tag in head as-is.

Jeff