Creating Custom Form Widget with Dojo- Tutorial (in process)

[rsulliv1]

0

[boneill]

Hi,

Did you make any progress on the tutorial.  I need to implement a custom widget and hitting a brick wall on information of how to do this

[rsulliv1]

I'm still working, but I have gotten past a number of road-blocks.

Where are you stuck? What have you attempted & what's the roadblock?

[boneill]

I am pretty much stuck at the beginning.  I spent today trying to figure out dojo. I am trying to follow the advice of alfresco to create a html page for the dojo widget first and then create it as a widget.   I created a simple dojo html page.  I now need it to call out to a webscript but it needs to run through alfresco so that I dont get cross domain issues when calling the webscript.  I cant get it to run in alfresco though.

I placed it into the root of the alfresco webapp and try calling it but it just displays as straight html and does not call dojo.  very frustrating.  so I suppose first things first.  How do I create a html page and include it in alfresco so that I can use it as a dojo page.

Regards

[rsulliv1]

Dojo is just a javascript toolkit, so it's supposed to show up in all html (and javascript). There is no separate calling to dojo. Also, dojo is a separate entity from alfresco, so they can work independently.

http://docs.dojocampus.org/              will give you an idea of what dojo is. However, alfresco uses a really old version of dojo 0.4.1, I believe. So, most of the apis are out of date.

[boneill]

Cheers, understand a bit about dojo now but still no clearer on how you create a widget in alfresco.  Any heads up appreciated.

[rsulliv1]

Integrating the custom widget into Alfresco is best done by reverse engineering what's currently there.

From  http://wiki.alfresco.com/wiki/Creating_XForms_Widgets             

"Integrating a custom Dojo widget into Alfresco involves:

   1. Adding your custom widget definition to xforms.js (located in the /scripts/ajax/ directory in alfresco.war)
   2. Registering the new widget with Alfresco in web-client-config-wcm.xml (located in the /WEB-INF/classes/alfresco/ directory in alfresco.war), giving it a symbolic name as part of that process
   3. Updating your Web Form XML Schema(s) to use your custom widget, by putting the widget's symbolic name in the "appearance" annotation of the relevant element(s) "

Digging through those files will let you see how alfresco incorporates dojo code into it's form processor. Another long-standing alfresco bug states that both of these files must be directly edited instead of extended. The alfresco framework hardcoded too many things to allow for simple per widget code extensions.

[boneill]

Thanks for the response.  Looks like I am at approximately the same point as you, having also read the wiki one pager on how to create custom widgets.  So have you actually managed to create a widget and encorporate it into alfresco?  If so can you provide an example?  I will be working on this today also so am happy to share my progress with you (assuming I make any).

Regards

[rsulliv1]

Have you done any work with applying custom appearances to xsds?
basically, how it works is that you have to define a custom appearance (i.e., a new <widget> node in web-client-config-wcm.xml) that will point to your custom dojo javascript class. The new javascript class is added to xforms.js. For syntax, take a look at all of the out of the box <widget> nodes and how they point to a javascript class. Then find that class in xforms.js to see how it is defined.

That's the basic layout of the files.

It'll look something like this:
add:
<widget xforms-type="xf:select1" appearance="mycustom2" javascript-class-name="alfresco.xforms.ComboboxSelect2" />
to web-client-config-wcm.xml

and then add:

alfresco.xforms.ComboboxSelect2 = alfresco.xforms.AbstractSelectWidget.extend({
……
});

to xforms.js

I'm still working on the specific logic of my widget, but that's how you incorporate them into alfresco. I fully agree that alfresco's documentation & existing forum posts are quite lacking.

let me know how that works for you.

[rsulliv1]

Have you made any progress? Please let me know if you ran into any issues.

I posted some walkthrough details and some summary information at: http://ecmconsultant.blogspot.com/