Reorderer in uPortal

This page is intended to house information, discussion and resources related to the application of the Reorderer to add keyboard support to uPortal's channel reorganization functionality.

Layout Markup & Data

This diagram represents a single tab of a layout with 3 columns. The first column has 4 portlets, the second 2 and the third 3. In this layout, the greyed out portlets are locked, and cannot be moved. The 'prec' number indicates the precedence of the portlet.

The numbers in square brackets ([ ]) represent the indices of possible drop targets. Conceptually, drop targets exist in the 'spaces' between and around the portlets. The total number of drop targets on a tab is equal to the number of columns plus the number of portlets.

The following data structure will be included in the init to describe the portlet elements and their containers.

var layout = {
    id:"t2",
    columns:[
        { id:"c1", children:["portletA","portletB","portletC","portletD"]},
        { id:"c2", children:["portletE","portletF"]   },
        { id:"c3", children:["portletG","portletH","portletI"]}
    ]
}

The following data structure will be included in the init and describes for each orderable element where it can be moved. Each row in the table represents the permissions for a single portlet being moved. Each column in the row indicates the drop permissions of the moved portlet for the drop targets (as described by the diagram above). The boolean value indicates whether or not the portlet being moved can be dropped on the given drop target.

For example

  • dropTargets[5][2] = 0, which means that portlet F can not be dropped between portlets B and C (because it is not high enough precedence to be placed higher than portlet C).
  • dropTargets[5][3] = 1, which means that portlet F can be dropped between portlets C and D.
demo.portal.dropTargetPerms = [
    [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],   // portlet A
    [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],   // portlet B
    [0, 0, 1, 1, 1, 0, 1, 1, 0, 1, 1, 1],   // portlet C
    [0, 0, 0, 1, 1, 0, 1, 1, 0, 1, 1, 1],   // portlet D
    [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],   // portlet E
    [0, 0, 0, 1, 1, 0, 1, 1, 0, 1, 1, 1],   // portlet F
    [0, 0, 1, 1, 1, 0, 1, 1, 1, 1, 1, 1],   // portlet G
    [0, 0, 0, 1, 1, 0, 1, 1, 0, 1, 1, 1],   // portlet H
    [0, 0, 0, 1, 1, 0, 1, 1, 0, 1, 1, 1]    // portlet I
];