Qwertied

Programmatic Dojo Drag and Drop

While Dojo 1.0’s release improved the documentation available for the dojo toolkit, I still often find myself having to resort to reading the source code itself to get things working. In particular, dojo’s documentation for the programmatic use of some of its widgets and utilities seems to be lacking.

As part of the uPortal 3 theme update effort, I’ve been trying to get dojo 1.0.2’s drag and drop support working. We used a custom dojo-based drag and drop handler for moving portlets in uPortal 2.6, but I wanted to begin using the new, official drag and drop engine included in the dojo 1.0 distribution. Unfortunately, the documentation is mostly geared towards using dojo with parseOnLoad enabled.

Through some trial and error and source code reading, I discovered that the following steps are generally necessary to enable dojo’s drag and drop programmatically with parseOnLoad set to false:

1. Set “dojoDndItem” as the CSS class name for each element that should be draggable.
2. Use javascript to create a dojo.dnd.Source object for each parent container object. These items should be direct parents fo the draggable elements.

While this allowed all of the portlets to be draggable, I found that none of the form text fields or other interactive elements in the portlets worked. We need drag handles! As it turns out, specifying a parameter of “withHandles: true” in the Source object, and then giving an element a CSS class of “dojoDndHandle” allows only part of the draggable object to function as a drag handle.

The finished result looks like the following:

<script type="text/javascript"> dojo.require(”dojo.dnd.Source”); var c1 = new dojo.dnd.Source(”container1″, {withHandles:true}); var c2 = new dojo.dnd.Source(”container2″, { withHandles: true }); </script></p> <div id="container1"> <div class="dojoDndItem"> <div class="dojoDndHandle">Handle 1</div> <div>Object 1 content</div> </div> <div class="dojoDndItem"> <div class="dojoDndHandle">Handle 2</div> <div>Object 2 content</div> </div> </div> <div id="container2"> <div class="dojoDndItem"> <div class="dojoDndHandle">Handle 3</div> <div>Object 3 content</div> </div> </div> <p>

Posted in Javascript | No Comments »

Calendar Portlet Released

I’ve added the initial version of Yale’s new Calendar portlet to the JA-SIG source code repository. The portlet aggregates calendar content from multiple sources and displays the resulting events in a simple list view.

The portlet was designed with uPortal in mind, but as it follows the JSR-168 portlet specification, it should be able to be run in other compatible portlet containers.

Features:

• Aggregate calendars and produce a read-only display
• Calendars may be iCal feeds on the web or CAS-proxy protected iCal feeds
• Create custom calendar adapter implementations to retrieve calendar information from databases, custom XML schemas, etc.
• Admins may define default calendars and assign them to users by role
• Users may add additional calendars from iCalShare, Google Calendar, etc.

Technical details:

• JSR-168 portlet
• Spring PortletMVC
• Hibernate
• ical4j

To try out the portlet, download the source code from subversion at https://www.ja-sig.org/svn/portlets/CalendarPortlet/trunk, run “mvn install”, and follow your portal’s instructions for portlet deployment.

Additional screenshots and user-focused help documents can be found at http://www.yale.edu/yaleinfohelp/my-calendar.html.

Posted in Java, uPortal, Calendar Portlet | No Comments »

Feedback Portlet Released

The initial version of the user feedback portlet developed at the JA-SIG Winter Unconference has been added to the JA-SIG source code repository. The portlet allows users to provide simple feedback about the containing portal, and also provides an administrative view of the content.

The portlet was designed with uPortal in mind, but as it follows the JSR-168 portlet specification, it should work in other compatible portlet containers.

User feedback submission features:

• Simple user UI for comment submission
• Users may make their feedback anonymous, but the default is to collect user information
• Automatically collect information about the user and his or her browser

Administrative feedback features:

• Admin interface for viewing feedback with recent comments and overall stats summaries
• Easily filter feedback by type or user role
• Shortcuts for sending email to non-anonymous users
• Excel data export
• Optional listener to forward feedback submissions on to an email address

Technical implementation:

• JSR-168 portlet using the Spring PortletMVC framework
• Hibernate backend

To try out the portlet, download the source code from subversion at https://www.ja-sig.org/svn/portlets/FeedbackPortlet/trunk, run “mvn install”, and follow your portal’s instructions for portlet deployment.

Posted in Java, uPortal | No Comments »