Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Note: All further examples will only use the "UIO + Page Enhancer" version: fluid.uiOptionsPlusPageEnhancer(). The pattern holds.

Section
Column
width25%20%

Column
Code Block
javascript
javascript
/**
 * Define a grade for the schema for your settings
 */
fluid.defaults("my.extra.settingsSchema", {
    schema: {...}
});
/**
 * Define a grade for extra panels
 * and their default settings
 */
fluid.defaults("my.extra.panels", {
    defaultSiteSettings: {
        foofer: 7,
        doodle: true
    },
    components: {
        foofer: {
            funcName: "my.integration.fooferPanel",
            options: {
                // if necessary:
                template: "myFooferPanel.html"
                // why can't panels load their own templates?
            }
            // any other configuration as necessary
        },
        doodle: {
            funcName: "my.integration.doodlePanel",
            options: {
                template: "myDoodlePanel.html"
                // if necessary
            }
            // any other configuration as necessary
        }
    }
});
/**
 * Define a grade for extra enactors
 */
fluid.defaults("my.extra.enactors", {
    components: {
        foofer: {
            funcName: "my.integration.fooferEnactor",
            // any other configuration as necessary
        },
        doodle: {
            funcName: "my.integration.doodleEnactor",
            // any other configuration as necessary
        }
    }
});
/**
 * Add the enactors, panels and schema
 */
fluid.uiOptionsPlusPageEnhancer(container, {
    gradeNames: ["fluid.uiEnhancer.starterEnactors",
                 "fluid.uiOptions.starterSettingsPanels",
                 "fluid.uiOptions.starterSettingsSchema",
                 "my.extra.enactors",
                 "my.extra.panels",
                 "my.extra.settingsSchema"],
    pathToTemplates: "my/sites/lib/infusion/templates/",
    pathToTocTemplate: "my/sites/",
    siteThemeClassName: "foofer-doodle-theme"
});
Column
width25%20%

Alternatively, the extra grades could be added using demands:

Section
Column
width25%20%

Column
Code Block
javascript
javascript
fluid.demands("fluid.uiOptions", ["my.integrations"], {
    gradeNames: ["my.extra.enactors", "my.extra.panels", "my.extra.settingsSchema"],
});
fluid.uiOptionsPlusPageEnhancer(container, {
    gradeNames: ["fluid.uiEnhancer.starterEnactors",
                 "fluid.uiOptions.starterSettingsPanels",
                 "fluid.uiOptions.starterSettingsSchema"],
    pathToTemplates: "my/sites/lib/infusion/templates/",
    pathToTocTemplate: "my/sites/",
    siteThemeClassName: "foofer-doodle-theme"
});
Column
width25%20%

Use Case: 3rd Parties Wanting A Subset Of The Starter Set

...