[Widgets] Add a new "Custom Header" widget

src/assets/groups.json

@@ -1,6 +1,6 @@
 [{
     "_hidden_node": {
-        "jqm_toolbars":["Header", "Footer", "Navbar"],
+        "jqm_toolbars":["Header", "CustomHeader", "Footer", "Navbar"],
         "jqm_input_boolean":["ToggleSwitch", "RadioButton", "RadioGroup", "Checkbox", "CheckboxGroup"],
         "jqm_other_inputs":[ {
                     "Form": ["Form"],

src/js/composer.js

@@ -542,6 +542,7 @@ $(function() {
                     // Collapsible's items are under .ui-collapsible-content
                     '> .ui-collapsible-content > .adm-node,' +
                     '> ul > li.adm-node,' +
+                    '> div > .adm-node,' +
                     '> *.orig-adm-node:not(.ui-header,.ui-content,.ui-footer)',
                 start: function(event, ui){
                     trackOffsets('start:   ',ui,$(this).data('sortable'));

src/js/widgets.js

@@ -331,7 +331,7 @@ var BWidgetRegistry = {
             {
                 name: "top",
                 cardinality: "1",
-                allow: "Header"
+                allow: ["Header", "CustomHeader"]
             },
             {
                 name: "content",
@@ -389,6 +389,36 @@ var BWidgetRegistry = {
         ]
     },
 
+    /**
+     * Represents a header object at the top of a page. Includes a "text"
+     * property that represents header text. Includes "left" and "right" zones
+     * for optional buttons, and "bottom" zone for an optional navbar.
+     */
+    CustomHeader: {
+        parent: "Background",
+        allowIn: "Page",
+        dragHeader: true,
+        paletteImageName: "jqm_customheader.svg",
+        displayLabel: "Custom Header",
+        moveable: false,
+        template: '<div data-role="header"><div></div></div>',
+        properties: {
+            text: {
+                type: "string",
+                defaultValue: "CustomHeader"
+            },
+            position: BCommonProperties.position,
+            theme: BCommonProperties.theme
+        },
+        zones: [
+            {
+                name: "default",
+                locator: '> div',
+                cardinality: "N"
+            }
+        ]
+    },
+
     /**
      * Represents a footer object at the bottom of a page.
      */