Hi,
I have an issue developing an SDK component. I will try to explain it the the SAP colorBox example which comes with the SDK.
In the ZTL-File are two functions to get/set the color:
class com.sap.sample.coloredbox.ColoredBox extends Component {
/* Returns the current color of the box. */
String getColor() {*
return this.color;
*}
/* Sets the current color of the box. */
void setColor(/* New color */ String newColor) {*
this.color = newColor;
*}
}<br>
Then, in the contribution.xml, the property is defined like this.
<?xml version="1.0" encoding="UTF-8"?> <sdkExtension xmlns="http://www.sap.com/bi/zen/sdk" id="com.sap.sample.coloredbox" title="SAP Lumira Component SDK Extension Sample Colored Box" version="22.0" vendor="SAP"> <component id="ColoredBox" title="Colored Box" icon="res/icon.png" handlerType="div" modes="commons m" supportsExportContent="true" propertySheetPath="res/additional_properties_sheet/additional_properties_sheet.html"> <requireJs modes="commons m">res/js/component</requireJs> <property id="color" title="Color" type="Color" group="Display" bindable="true"/> <property id="onclick" title="On Click" type="ScriptText" group="Events"/> <initialization> <defaultValue property="LEFT_MARGIN">40</defaultValue> <defaultValue property="TOP_MARGIN">40</defaultValue> <defaultValue property="WIDTH">100</defaultValue> <defaultValue property="HEIGHT">100</defaultValue> <defaultValue property="color">red</defaultValue> </initialization> </component> </sdkExtension>So, we have a property named "color" and a default value "red".Last part is the component.js:
define(["sap/designstudio/sdk/component", "css!../css/component.css"], function(Component, css) {
Component.subclass("com.sap.sample.coloredbox.ColoredBox", function() {
var that = this;
this.init = function() {
this.$().addClass("coloredBox");
this.$().click(function() {
that.fireEvent("onclick");
});
};
this.color = function(value) {
if (value === undefined) {
return this.$().css("background-color"); <<<<< NEVER EXECUTED!!!
} else {
this.$().css("background-color", 'yellow');
return this;
}
};
});
});
The issue is the following:The line return this.$().css("background-color"); of the setter/getter function is NEVER EXECUTED, at least, in the javascript debugger never stopps there. You can also change the line to return '1234'; It will not make any difference.For this example, it's not a problem.But I want to make a small SDK extension to get the URL of the report:.ztl: class com.lunar.applicationinfo.ApplicationInfo { String getURL() {* return this.URL; *}}contribution.xml
... <property id="URL" title="" type="String" visible="false"></property> ....component.js
this.url= function(value) {
if (value === undefined) {
return location.url
} else {
return this;
}
}; This will not work since the line "return location.url" is never executed.The function getURL will always return an empty string.When a default value is set in the contribution.xml, the default value is returned instead.For me this is a strange behavior - why is there a getter at all when it's never used?How can I implement a component which gives me the current URL?Thanks!