This is a blog how you can use the Design Studio SDK: Component Manager (for dynamic component access) in order to dynamically access components and data sources by name and type.
The Usecase
In many cases, you just have some areas, which are build together from standard components and you want to have dynamic access to the areas.
You need to include the component Design Studio SDK: Component Manager (for dynamic component access).
The Examples
1. copy dynamically filter to all unknown data sources
I have following case, I have a filter panel and want to distribute the filters to different data sources in online composition. The problem is, using split cell container the names of the data sources are unknown, so you cannot code on something what is not existing. Now, we can make this - like in this sample script:
var dataSources = COMPOSE_COMPONENTMANAGER.listAllDataSources();
// full copy, we want to avoid
//dataSources.forEach(function(ds, index) {
// if(ds.name != "DS_MASTER") {
// var datasource = COMPOSE_COMPONENTMANAGER.getDataSourceByName(ds.name);
// datasource.copyFilters(DS_MASTER);
// }
//});
var dimensions = DS_MASTER.getDimensions();
dataSources.forEach(function(ds, index) {
if(ds.name != "DS_MASTER") {
var datasourceTarget = COMPOSE_COMPONENTMANAGER.getDataSourceByName(ds.name);
dimensions.forEach(function(dimension, index) {
var name = dimension.name;
var filterCurrent = DS_MASTER.getFilterExt(dimension);
var filterPrevious = COMPOSE_COLLECTION_FILTERS.getLabelByKey(name);
if(filterCurrent != filterPrevious) {
datasourceTarget.setFilterExt(dimension, filterCurrent);
}
});
}
});
(this will used in the v2 of online composition application, V1 is here Community SDK: First Functional Application with SDK Components (Online Composition))
2. Find all Buttons with suffix "TOP" and apply some scripts on it.
var output = COMPONENTMANAGER_1.listAllComponents("", "TOP");
var components = "";
output.forEach(function(element, index) {
components = components + element.name + ", " + element.type + ", " + element.component.getWidth() + "\r\n";
var button = COMPONENTMANAGER_1.returnAsButton(element.component);
button.setText("changed!");
});
TEXTAREA_1.setValue(components);
(part of the attached example)
3. Have dynamic prefix (which can be changed) and want to get a component using its name.
var prefixDynamic = "KAR";
var inputComponent = COMPONENTMANAGER_1.getComponentByName(prefixDynamic + "ACCORDION_LOAD");
var acc = COMPONENTMANAGER_1.returnAsScnAccordion (inputComponent);
acc.addElement("KAROL", "Karol", "", "S1");
4. Group some components or data sources together and have always access to the group.
// grouping part
COMPONENTMANAGER_1.addComponentToGroup("BUTTONS", "BUTTON_1");
COMPONENTMANAGER_1.addComponentToGroup("BUTTONS", "BUTTON_4");
// access part
var components = COMPONENTMANAGER_1.getComponentsFromGroup("BUTTONS");
components.forEach(function(element, index) {
var name = element.name;
var component = COMPONENTMANAGER_1.getComponentByName(name);
var button = COMPONENTMANAGER_1.returnAsButton(component);
button.setWidth(400);
});
5. List all Panels (or concrete - all components which have "PANEL" in its name)
var output = COMPONENTMANAGER_1.listAllComponentsWithType("PANEL");
var components = "";
output.forEach(function(element, index) {
components = components + element.name + ", " + element.type + ", " + element.component.getWidth() + "\r\n";
});
TEXTAREA_1.setValue(components);
and many others...
Take a try,also on the methods...
The examples.
Pick up the application with examples from here: applications/SDK_COMP_MANAGER at master · org-scn-design-studio-community/applications · GitHub
The Key Point
The names of the components are very "critical" in Design Studio - those must be unique and ideally are also descriptive - and ideally not too long.
Why?
The example app will be uploaded in the apprepository, uder org-scn-design-studio-community/applications · GitHub
UPDATE 02.2015:
For practical usage in real app, see the blog: My Way to Second Functional (Dynamic) Online Composition Application
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
User | Count |
---|---|
38 | |
19 | |
13 | |
13 | |
11 | |
10 | |
10 | |
10 | |
8 | |
8 |