qcobjects 2.4.39 → 2.4.41
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/QCObjects.js +615 -499
- package/VERSION +1 -1
- package/package.json +1 -1
package/QCObjects.js
CHANGED
|
@@ -306,7 +306,7 @@
|
|
|
306
306
|
warnEnabled: true,
|
|
307
307
|
debug(message) {
|
|
308
308
|
if (this.debugEnabled) {
|
|
309
|
-
console.log("\x1b[35m%s\x1b[0m",
|
|
309
|
+
console.log("\x1b[35m%s\x1b[0m", `[DEBUG][${performance.now().toLocaleString()}] ${message}`);
|
|
310
310
|
}
|
|
311
311
|
},
|
|
312
312
|
info(message) {
|
|
@@ -317,12 +317,12 @@
|
|
|
317
317
|
} else {
|
|
318
318
|
color = "\x1b[33m%s\x1b[0m";
|
|
319
319
|
}
|
|
320
|
-
console.info(color,
|
|
320
|
+
console.info(color, `[INFO][${performance.now().toLocaleString()}] ${message}`);
|
|
321
321
|
}
|
|
322
322
|
},
|
|
323
323
|
warn(message) {
|
|
324
324
|
if (this.warnEnabled) {
|
|
325
|
-
console.warn("\x1b[31m%s\x1b[0m",
|
|
325
|
+
console.warn("\x1b[31m%s\x1b[0m", `[WARN][${performance.now().toLocaleString()}] ${message}`);
|
|
326
326
|
}
|
|
327
327
|
}
|
|
328
328
|
};
|
|
@@ -1959,66 +1959,98 @@
|
|
|
1959
1959
|
return validRoutingWays.includes(routingWay);
|
|
1960
1960
|
};
|
|
1961
1961
|
|
|
1962
|
-
|
|
1963
|
-
|
|
1964
|
-
|
|
1965
|
-
|
|
1966
|
-
|
|
1967
|
-
|
|
1968
|
-
|
|
1969
|
-
|
|
1970
|
-
|
|
1971
|
-
|
|
1972
|
-
|
|
1973
|
-
|
|
1974
|
-
|
|
1975
|
-
|
|
1976
|
-
|
|
1977
|
-
|
|
1978
|
-
|
|
1979
|
-
|
|
1980
|
-
|
|
1981
|
-
|
|
1982
|
-
|
|
1983
|
-
|
|
1984
|
-
|
|
1985
|
-
|
|
1986
|
-
|
|
1987
|
-
|
|
1988
|
-
|
|
1989
|
-
|
|
1990
|
-
|
|
1991
|
-
|
|
1992
|
-
|
|
1993
|
-
|
|
1994
|
-
|
|
1995
|
-
|
|
1996
|
-
|
|
1997
|
-
|
|
1998
|
-
|
|
1999
|
-
|
|
2000
|
-
|
|
2001
|
-
|
|
2002
|
-
|
|
2003
|
-
|
|
2004
|
-
|
|
2005
|
-
return _ret_;
|
|
2006
|
-
};
|
|
2007
|
-
return null;
|
|
2008
|
-
});
|
|
1962
|
+
var _buildComponentFromElement_ = function (element, __parent__){
|
|
1963
|
+
var __shadowed_not_set = (element.getAttribute("shadowed") === null) ? (true) : (false);
|
|
1964
|
+
var __tplsource_attr_not_set = (element.getAttribute("template-source") === null) ? (true) : (false);
|
|
1965
|
+
var shadowed = (element.getAttribute("shadowed") === "true") ? (true) : (false);
|
|
1966
|
+
var __cached_not_set = (element.getAttribute("cached") === null) ? (true) : (false);
|
|
1967
|
+
var cached = (element.getAttribute("cached") === "true") ? (true) : (false);
|
|
1968
|
+
var tplextension = (typeof _top.CONFIG.get("tplextension") !== "undefined") ? (_top.CONFIG.get("tplextension")) : ("html");
|
|
1969
|
+
tplextension = (element.getAttribute("tplextension") !== null) ? (element.getAttribute("tplextension")) : (tplextension);
|
|
1970
|
+
var _componentName = element.getAttribute("name");
|
|
1971
|
+
var _componentClassName = (element.getAttribute("componentClass") !== null) ? (element.getAttribute("componentClass")) : ("Component");
|
|
1972
|
+
let __componentClassName = (_top.CONFIG.get("preserveComponentBodyTag")) ? (
|
|
1973
|
+
(_componentName !== null) ? ("com.qcobjects.components." + _componentName + ".ComponentBody") : ("com.qcobjects.components.ComponentBody")
|
|
1974
|
+
) : (_componentClassName);
|
|
1975
|
+
_componentName = (_componentName !== null) ? (_componentName) : (
|
|
1976
|
+
(ClassFactory(__componentClassName) &&
|
|
1977
|
+
typeof ClassFactory(__componentClassName).name !== "undefined"
|
|
1978
|
+
) ? (
|
|
1979
|
+
ClassFactory(__componentClassName).name
|
|
1980
|
+
) : ("")
|
|
1981
|
+
);
|
|
1982
|
+
var __classDefinition = ClassFactory(__componentClassName);
|
|
1983
|
+
var __tplsource_prop_set = (__componentClassName !== "Component" && ((typeof __classDefinition !== "undefined" && typeof __classDefinition.tplsource === "string") && __classDefinition.tplsource !== "")) ? (true) : (false);
|
|
1984
|
+
var tplsource = (__tplsource_attr_not_set && __tplsource_prop_set) ? (__classDefinition.tplsource) : ((__tplsource_attr_not_set) ? ("default") : (element.getAttribute("template-source")));
|
|
1985
|
+
logger.debug(`template source for ${_componentName} is ${tplsource} `);
|
|
1986
|
+
logger.debug(`type for ${_componentName} is ${__getType__(__classDefinition)} `);
|
|
1987
|
+
|
|
1988
|
+
var componentURI;
|
|
1989
|
+
componentURI = ComponentURI({
|
|
1990
|
+
"COMPONENTS_BASE_PATH": _top.CONFIG.get("componentsBasePath"),
|
|
1991
|
+
"COMPONENT_NAME": _componentName,
|
|
1992
|
+
"TPLEXTENSION": tplextension,
|
|
1993
|
+
"TPL_SOURCE": tplsource
|
|
1994
|
+
});
|
|
1995
|
+
if (_top.CONFIG.get("preserveComponentBodyTag")) {
|
|
1996
|
+
Package((_componentName !== "") ? ("com.qcobjects.components." + _componentName + "") : ("com.qcobjects.components"), [
|
|
1997
|
+
Class("ComponentBody", ClassFactory("Component"), {
|
|
1998
|
+
name: _componentName,
|
|
1999
|
+
tplsource: tplsource,
|
|
2000
|
+
tplextension: tplextension,
|
|
2001
|
+
reload: true
|
|
2002
|
+
})
|
|
2003
|
+
]);
|
|
2004
|
+
}
|
|
2009
2005
|
|
|
2006
|
+
var __create_component_instance_ = function () {
|
|
2007
|
+
var __shadowed = (__shadowed_not_set) ? ((__classDefinition && __classDefinition.shadowed) || ClassFactory("Component").shadowed) : (shadowed);
|
|
2008
|
+
var __definition = {
|
|
2009
|
+
__parent__: __parent__,
|
|
2010
|
+
name: _componentName,
|
|
2011
|
+
cached: (__cached_not_set) ? (ClassFactory("Component").cached) : (cached),
|
|
2012
|
+
shadowed: __shadowed,
|
|
2013
|
+
tplextension: tplextension,
|
|
2014
|
+
body: (_top.CONFIG.get("preserveComponentBodyTag")) ? (_DOMCreateElement("componentBody")) : (element),
|
|
2015
|
+
templateURI: componentURI,
|
|
2016
|
+
tplsource: tplsource
|
|
2017
|
+
};
|
|
2018
|
+
if (typeof _componentName === "undefined" || _componentName === "" || _componentName === null) {
|
|
2019
|
+
/* this allows to use the original property defined
|
|
2020
|
+
in the component definition if it is not present in the tag */
|
|
2021
|
+
delete __definition.name;
|
|
2022
|
+
}
|
|
2023
|
+
if (componentURI === "") {
|
|
2024
|
+
/* this allows to use the original property defined
|
|
2025
|
+
in the component definition if it is not present in the tag */
|
|
2026
|
+
delete __definition.templateURI;
|
|
2027
|
+
}
|
|
2028
|
+
var newComponent = New(__classDefinition, __definition);
|
|
2010
2029
|
|
|
2011
|
-
|
|
2012
|
-
|
|
2013
|
-
}
|
|
2014
|
-
}, captureFalse);
|
|
2030
|
+
if (_top.CONFIG.get("preserveComponentBodyTag")) {
|
|
2031
|
+
element.append(newComponent);
|
|
2015
2032
|
}
|
|
2016
|
-
|
|
2017
|
-
|
|
2018
|
-
|
|
2033
|
+
return newComponent;
|
|
2034
|
+
};
|
|
2035
|
+
var newComponent = __create_component_instance_.call(this);
|
|
2036
|
+
return newComponent;
|
|
2037
|
+
};
|
|
2038
|
+
|
|
2039
|
+
var _buildComponentsFromElements_ = function (elements, __parent__) {
|
|
2040
|
+
var componentsBuiltWith = [];
|
|
2041
|
+
if (isBrowser){
|
|
2042
|
+
componentsBuiltWith = elements.map(
|
|
2043
|
+
function(element){
|
|
2044
|
+
return _buildComponentFromElement_(element, __parent__);
|
|
2045
|
+
}
|
|
2046
|
+
);
|
|
2047
|
+
} else {
|
|
2048
|
+
logger.debug("[_buildComponentsFromElements_] not implemented for Non-Browser environments");
|
|
2019
2049
|
}
|
|
2050
|
+
return componentsBuiltWith;
|
|
2020
2051
|
};
|
|
2021
2052
|
|
|
2053
|
+
|
|
2022
2054
|
Package("com.qcobjects", [
|
|
2023
2055
|
class Component extends ClassFactory("InheritClass") {
|
|
2024
2056
|
validRoutingWays= ["pathname", "hash", "search"];
|
|
@@ -2030,9 +2062,13 @@
|
|
|
2030
2062
|
routingNodes= [];
|
|
2031
2063
|
routings= [];
|
|
2032
2064
|
routingPath= "";
|
|
2065
|
+
routingPaths=[];
|
|
2033
2066
|
_componentHelpers= [];
|
|
2034
2067
|
subcomponents=[];
|
|
2035
2068
|
splashScreenComponent=undefined;
|
|
2069
|
+
controller=undefined;
|
|
2070
|
+
view=undefined;
|
|
2071
|
+
effect=undefined;
|
|
2036
2072
|
|
|
2037
2073
|
constructor ({
|
|
2038
2074
|
templateURI= "",
|
|
@@ -2051,7 +2087,8 @@
|
|
|
2051
2087
|
body,
|
|
2052
2088
|
shadowRoot,
|
|
2053
2089
|
splashScreenComponent,
|
|
2054
|
-
|
|
2090
|
+
controller,
|
|
2091
|
+
view
|
|
2055
2092
|
}){
|
|
2056
2093
|
super(...arguments);
|
|
2057
2094
|
var self = this;
|
|
@@ -2065,25 +2102,33 @@
|
|
|
2065
2102
|
self.processorHandler = New(ClassFactory("Processor"), {
|
|
2066
2103
|
component: self
|
|
2067
2104
|
});
|
|
2068
|
-
|
|
2069
|
-
if (typeof self.__new__ === "function") {
|
|
2070
|
-
self.__new__.call(self, self);
|
|
2071
|
-
}
|
|
2072
2105
|
|
|
2073
|
-
|
|
2074
|
-
.
|
|
2075
|
-
|
|
2076
|
-
|
|
2077
|
-
|
|
2078
|
-
|
|
2079
|
-
|
|
2080
|
-
|
|
2081
|
-
|
|
2082
|
-
|
|
2083
|
-
|
|
2106
|
+
/* assign body data attributes to data */
|
|
2107
|
+
self.data = (typeof self.data === "undefined" || self.data === null)?({}):(self.data);
|
|
2108
|
+
self.data = Object.assign(self.data, self.dataAttributes);
|
|
2109
|
+
|
|
2110
|
+
self.createServiceInstance()
|
|
2111
|
+
.then(function (serviceResponse){
|
|
2112
|
+
if (typeof self.__new__ === "function") {
|
|
2113
|
+
self.__new__.call(self, self);
|
|
2114
|
+
}
|
|
2115
|
+
|
|
2116
|
+
self._generateRoutingPaths(self.body)
|
|
2117
|
+
.then(function (){
|
|
2118
|
+
self._reroute_()
|
|
2119
|
+
.then(function () {
|
|
2120
|
+
return self.rebuild()
|
|
2121
|
+
.then(function () {
|
|
2122
|
+
logger.info(`Component._new_ The component ${self.name} was built successfully!`);
|
|
2123
|
+
}).catch(function (standardResponse) {
|
|
2124
|
+
logger.warn(`Component._new_ Something went wrong building the component ${self.name}`);
|
|
2125
|
+
console.error(standardResponse);
|
|
2126
|
+
});
|
|
2127
|
+
});
|
|
2084
2128
|
});
|
|
2129
|
+
|
|
2085
2130
|
});
|
|
2086
|
-
|
|
2131
|
+
|
|
2087
2132
|
}
|
|
2088
2133
|
|
|
2089
2134
|
set body(value) {
|
|
@@ -2158,6 +2203,123 @@
|
|
|
2158
2203
|
return Object.assign(accumulator, colData);
|
|
2159
2204
|
});
|
|
2160
2205
|
}
|
|
2206
|
+
|
|
2207
|
+
createServiceInstance (){
|
|
2208
|
+
var component = this;
|
|
2209
|
+
var body = component.body;
|
|
2210
|
+
var data = this.data;
|
|
2211
|
+
var __serviceClass;
|
|
2212
|
+
var __classDefinition = component.getClass().__definition;
|
|
2213
|
+
var _serviceClassName = (body.getAttribute("serviceClass") !== null) ? (body.getAttribute("serviceClass")) : (null);
|
|
2214
|
+
|
|
2215
|
+
return new Promise (function (resolve, reject){
|
|
2216
|
+
/* __enable_service_class__ = true by default */
|
|
2217
|
+
var __enable_service_class__ = (
|
|
2218
|
+
(Object.hasOwnProperty.call(body, "enableServiceClass") && body.enableServiceClass) ||
|
|
2219
|
+
(!Object.hasOwnProperty.call(body, "enableServiceClass"))
|
|
2220
|
+
) ? (true) : (false);
|
|
2221
|
+
var _response_to_data_ = (body.getAttribute("response-to") !== null && body.getAttribute("response-to") === "data") ? (true) : (false);
|
|
2222
|
+
var _response_to_template_ = (body.getAttribute("response-to") !== null && body.getAttribute("response-to") === "template") ? (true) : (false);
|
|
2223
|
+
|
|
2224
|
+
if (__enable_service_class__ && _serviceClassName !== null) {
|
|
2225
|
+
__serviceClass = ClassFactory(_serviceClassName);
|
|
2226
|
+
}
|
|
2227
|
+
if (!_response_to_data_ && __classDefinition && Object.hasOwnProperty.call(__classDefinition, "responseTo")) {
|
|
2228
|
+
_response_to_data_ = (__classDefinition.responseTo === "data") ? (true) : (false);
|
|
2229
|
+
} else if (!_response_to_data_ && Object.hasOwnProperty.call(ClassFactory("Component"), "responseTo")) {
|
|
2230
|
+
_response_to_data_ = (ClassFactory("Component").responseTo === "data") ? (true) : (false);
|
|
2231
|
+
}
|
|
2232
|
+
if (!_response_to_template_ && __classDefinition && Object.hasOwnProperty.call(__classDefinition, "responseTo")) {
|
|
2233
|
+
_response_to_template_ = (__classDefinition.responseTo === "template") ? (true) : (false);
|
|
2234
|
+
} else if (!_response_to_template_ && Object.hasOwnProperty.call(ClassFactory("Component"), "responseTo")) {
|
|
2235
|
+
_response_to_template_ = (ClassFactory("Component").responseTo === "template") ? (true) : (false);
|
|
2236
|
+
}
|
|
2237
|
+
|
|
2238
|
+
if (typeof __serviceClass !== "undefined" &&
|
|
2239
|
+
(typeof __enable_service_class__ !== "undefined" &&
|
|
2240
|
+
__enable_service_class__ === true) &&
|
|
2241
|
+
(_response_to_data_ || _response_to_template_)
|
|
2242
|
+
) {
|
|
2243
|
+
logger.info("Loading service " + _serviceClassName);
|
|
2244
|
+
var serviceInstance = New(__serviceClass, {
|
|
2245
|
+
data: data
|
|
2246
|
+
});
|
|
2247
|
+
serviceLoader(serviceInstance).then(function ({
|
|
2248
|
+
request,
|
|
2249
|
+
service
|
|
2250
|
+
}) {
|
|
2251
|
+
var serviceResponse = service.template;
|
|
2252
|
+
if (_response_to_data_) {
|
|
2253
|
+
if (typeof data === "object" && typeof serviceResponse === "object") {
|
|
2254
|
+
data = Object.assign(data, serviceResponse);
|
|
2255
|
+
} else {
|
|
2256
|
+
data = serviceResponse;
|
|
2257
|
+
}
|
|
2258
|
+
}
|
|
2259
|
+
component.serviceInstance = serviceInstance;
|
|
2260
|
+
component.serviceData = data;
|
|
2261
|
+
|
|
2262
|
+
if (_response_to_template_) {
|
|
2263
|
+
component.template = serviceResponse;
|
|
2264
|
+
}
|
|
2265
|
+
resolve (serviceResponse);
|
|
2266
|
+
}, function (rejectedResponse){
|
|
2267
|
+
logger.debug(`Service loading rejected for ${_serviceClassName} in ${component.name}`);
|
|
2268
|
+
reject (rejectedResponse);
|
|
2269
|
+
} ).catch(function (e) {
|
|
2270
|
+
logger.debug("Something went wroing while trying to load the service " + _serviceClassName);
|
|
2271
|
+
throw Error (`Error loading ${_serviceClassName} for ${component.name}. Detail: ${e}`);
|
|
2272
|
+
});
|
|
2273
|
+
} else {
|
|
2274
|
+
resolve(null);
|
|
2275
|
+
}
|
|
2276
|
+
});
|
|
2277
|
+
}
|
|
2278
|
+
|
|
2279
|
+
_bindroute_ () {
|
|
2280
|
+
var _component_ = this;
|
|
2281
|
+
if (!_component_._bindroute_.loaded){
|
|
2282
|
+
if (isBrowser) {
|
|
2283
|
+
|
|
2284
|
+
_component_.hostElements("a").map(function (a) {
|
|
2285
|
+
a.oldclick = a.onclick;
|
|
2286
|
+
a.onclick = function (e) {
|
|
2287
|
+
var _ret_ = true;
|
|
2288
|
+
if (!_top.global.get("routingPaths")) {
|
|
2289
|
+
_top.global.set("routingPaths", []);
|
|
2290
|
+
}
|
|
2291
|
+
var routingWay = _top.CONFIG.get("routingWay");
|
|
2292
|
+
var routingPath = e.target[routingWay];
|
|
2293
|
+
if (_top.global.get("routingPaths").includes(routingPath) &&
|
|
2294
|
+
e.target[routingWay] !== document.location[routingWay] &&
|
|
2295
|
+
e.target.href !== document.location.href
|
|
2296
|
+
) {
|
|
2297
|
+
logger.debug("A ROUTING WAS FOUND: " + routingPath);
|
|
2298
|
+
window.history.pushState({
|
|
2299
|
+
href: e.target.href
|
|
2300
|
+
}, e.target.href, e.target.href);
|
|
2301
|
+
ClassFactory("Component").route();
|
|
2302
|
+
_ret_ = false;
|
|
2303
|
+
} else {
|
|
2304
|
+
logger.debug("NO ROUTING FOUND FOR: " + routingPath);
|
|
2305
|
+
}
|
|
2306
|
+
if (typeof e.target.oldclick !== "undefined" && typeof e.target.oldclick === "function") {
|
|
2307
|
+
e.target.oldclick.call(e.target, e);
|
|
2308
|
+
}
|
|
2309
|
+
return _ret_;
|
|
2310
|
+
};
|
|
2311
|
+
return null;
|
|
2312
|
+
});
|
|
2313
|
+
|
|
2314
|
+
} else {
|
|
2315
|
+
// not yet implemented.
|
|
2316
|
+
}
|
|
2317
|
+
this._bindroute_.loaded = true;
|
|
2318
|
+
} else {
|
|
2319
|
+
logger.debug(`Routes already bound to popstate events for ${_component_.name}`);
|
|
2320
|
+
}
|
|
2321
|
+
|
|
2322
|
+
}
|
|
2161
2323
|
|
|
2162
2324
|
done(standardResponse) {
|
|
2163
2325
|
var _ret_;
|
|
@@ -2167,6 +2329,127 @@
|
|
|
2167
2329
|
}
|
|
2168
2330
|
return _ret_;
|
|
2169
2331
|
}
|
|
2332
|
+
|
|
2333
|
+
__done__ () {
|
|
2334
|
+
var _component_ = this;
|
|
2335
|
+
var componentDone = function () {
|
|
2336
|
+
if (typeof _component_ === "undefined") {
|
|
2337
|
+
throw new Error("componentDone() has lost its context");
|
|
2338
|
+
}
|
|
2339
|
+
if (typeof _component_.body === "undefined") {
|
|
2340
|
+
throw new Error("The component has no body");
|
|
2341
|
+
}
|
|
2342
|
+
var viewName = _component_.body.getAttribute("viewClass");
|
|
2343
|
+
var _View = ClassFactory(viewName);
|
|
2344
|
+
if (typeof _View !== "undefined") {
|
|
2345
|
+
_component_.view = New(_View, {
|
|
2346
|
+
component: _component_
|
|
2347
|
+
}); // Initializes the main view for the component
|
|
2348
|
+
if (Object.hasOwnProperty.call(_component_.view, "done") && typeof _component_.view.done === "function") {
|
|
2349
|
+
_component_.view.done.call(_component_.view);
|
|
2350
|
+
}
|
|
2351
|
+
}
|
|
2352
|
+
var controllerName = _component_.body.getAttribute("controllerClass");
|
|
2353
|
+
if (!controllerName) {
|
|
2354
|
+
controllerName = "Controller";
|
|
2355
|
+
}
|
|
2356
|
+
var _Controller = ClassFactory(controllerName);
|
|
2357
|
+
if (typeof _Controller !== "undefined") {
|
|
2358
|
+
_component_.controller = New(_Controller, {
|
|
2359
|
+
component: _component_
|
|
2360
|
+
}); // Initializes the main controller for the component
|
|
2361
|
+
if (typeof _component_.controller.done === "function") {
|
|
2362
|
+
try {
|
|
2363
|
+
_component_.controller.done.call(_component_.controller);
|
|
2364
|
+
} catch (e){
|
|
2365
|
+
throw Error (e);
|
|
2366
|
+
}
|
|
2367
|
+
} else {
|
|
2368
|
+
logger.debug(`${controllerName} does not have a done() method.`);
|
|
2369
|
+
}
|
|
2370
|
+
if (typeof _component_.controller.createRoutingController === "function") {
|
|
2371
|
+
_component_.controller.createRoutingController.call(_component_.controller);
|
|
2372
|
+
} else {
|
|
2373
|
+
logger.debug(`${controllerName} does not have a createRoutingController() method.`);
|
|
2374
|
+
}
|
|
2375
|
+
}
|
|
2376
|
+
var effectClassName = _component_.body.getAttribute("effectClass");
|
|
2377
|
+
var applyEffectTo = _component_.body.getAttribute("apply-effect-to");
|
|
2378
|
+
applyEffectTo = (applyEffectTo !== null) ? (applyEffectTo) : ("load");
|
|
2379
|
+
if (effectClassName !== null && applyEffectTo === "observe") {
|
|
2380
|
+
_component_.applyObserveTransitionEffect(effectClassName);
|
|
2381
|
+
} else if (effectClassName !== null && applyEffectTo === "load") {
|
|
2382
|
+
_component_.applyTransitionEffect(effectClassName);
|
|
2383
|
+
}
|
|
2384
|
+
|
|
2385
|
+
if (_top.CONFIG.get("overrideComponentTag")) {
|
|
2386
|
+
_component_.body.outerHTML = this.body.innerHTML;
|
|
2387
|
+
}
|
|
2388
|
+
_component_.body.setAttribute("loaded", true);
|
|
2389
|
+
|
|
2390
|
+
logger.debug(`Trying to run component helpers for ${_component_.name}...`);
|
|
2391
|
+
try {
|
|
2392
|
+
_component_.runComponentHelpers();
|
|
2393
|
+
logger.debug(`Component helpers for ${_component_.name} executed.`);
|
|
2394
|
+
} catch (e){
|
|
2395
|
+
logger.debug(`Component helpers for ${_component_.name} could not be executed.`);
|
|
2396
|
+
throw Error(e);
|
|
2397
|
+
}
|
|
2398
|
+
|
|
2399
|
+
_component_.subcomponents = _component_.__buildSubComponents__();
|
|
2400
|
+
|
|
2401
|
+
_component_._bindroute_();
|
|
2402
|
+
};
|
|
2403
|
+
|
|
2404
|
+
return new Promise (function (resolve, reject){
|
|
2405
|
+
try {
|
|
2406
|
+
Promise.resolve(componentDone.call(_component_));
|
|
2407
|
+
} catch (e){
|
|
2408
|
+
reject(e);
|
|
2409
|
+
}
|
|
2410
|
+
});
|
|
2411
|
+
|
|
2412
|
+
}
|
|
2413
|
+
|
|
2414
|
+
hostElements(tagFilter){
|
|
2415
|
+
var _component_ = this;
|
|
2416
|
+
var elementList = (_component_.shadowed && (typeof _component_.shadowRoot !== "undefined"))?(
|
|
2417
|
+
_component_.shadowRoot.subelements(tagFilter)
|
|
2418
|
+
):(
|
|
2419
|
+
_component_.body.subelements(tagFilter)
|
|
2420
|
+
);
|
|
2421
|
+
return elementList;
|
|
2422
|
+
}
|
|
2423
|
+
|
|
2424
|
+
get subtags(){
|
|
2425
|
+
var _component_ = this;
|
|
2426
|
+
var tagFilter = "component:not([loaded])";
|
|
2427
|
+
return _component_.hostElements(tagFilter);
|
|
2428
|
+
}
|
|
2429
|
+
|
|
2430
|
+
get bodyAttributes() {
|
|
2431
|
+
var _component_ = this;
|
|
2432
|
+
var c = _component_.body;
|
|
2433
|
+
return [...c.getAttributeNames()].map (a => {return {[a]:c.getAttribute(a)};}).reduce ((accumulator,colData, index) => {return Object.assign(accumulator, colData);} );
|
|
2434
|
+
}
|
|
2435
|
+
|
|
2436
|
+
get dataAttributes(){
|
|
2437
|
+
var _component_ = this;
|
|
2438
|
+
var c = _component_.body;
|
|
2439
|
+
return [{}].concat([...c.getAttributeNames()].filter(n=>n.startsWith("data-")).map (a => {return {[a.split("-")[1]]:c.getAttribute(a)};})).reduce ((accumulator,colData, index) => {return Object.assign(accumulator, colData);} );
|
|
2440
|
+
}
|
|
2441
|
+
|
|
2442
|
+
__buildSubComponents__ (rebuildObjects = false) {
|
|
2443
|
+
var _component_ = this;
|
|
2444
|
+
var elementList = _component_.subtags;
|
|
2445
|
+
if (!rebuildObjects){
|
|
2446
|
+
elementList = elementList.filter(t=>t.getAttribute("loaded") !== "true");
|
|
2447
|
+
}
|
|
2448
|
+
if ((typeof _component_ !== "undefined") || _component_.subcomponents.length<1){
|
|
2449
|
+
_component_.subcomponents = _buildComponentsFromElements_(elementList, _component_);
|
|
2450
|
+
}
|
|
2451
|
+
return _component_.subcomponents;
|
|
2452
|
+
}
|
|
2170
2453
|
|
|
2171
2454
|
fail(standardResponse) {
|
|
2172
2455
|
var _ret_;
|
|
@@ -2233,12 +2516,12 @@
|
|
|
2233
2516
|
logger.debug("ADDING Slots to Shadowed COMPONENT {{NAME}} ".replace("{{NAME}}", _component_.name));
|
|
2234
2517
|
shadowContainer.innerHTML += tmp_shadowContainer.innerHTML;
|
|
2235
2518
|
logger.debug("APPENDING Shadowed COMPONENT {{NAME}} to Container ".replace("{{NAME}}", _component_.name));
|
|
2236
|
-
|
|
2519
|
+
var qs = container.querySelector(".shadowHost");
|
|
2520
|
+
if (!(typeof qs !== "undefined" && qs !== null)) {
|
|
2237
2521
|
container.appendChild(shadowContainer);
|
|
2238
2522
|
} else {
|
|
2239
2523
|
logger.debug("Shadowed Container for COMPONENT {{NAME}} is already present in the tree ".replace("{{NAME}}", _component_.name));
|
|
2240
|
-
|
|
2241
|
-
container.appendChild(shadowContainer);
|
|
2524
|
+
_component_.shadowRoot.innerHTML = shadowContainer.shadowRoot.innerHTML;
|
|
2242
2525
|
}
|
|
2243
2526
|
} else {
|
|
2244
2527
|
logger.warn("Shadowed COMPONENT {{NAME}} is bad configured".replace("{{NAME}}", _component_.name));
|
|
@@ -2289,10 +2572,14 @@
|
|
|
2289
2572
|
request: null,
|
|
2290
2573
|
component: _component
|
|
2291
2574
|
};
|
|
2292
|
-
|
|
2293
|
-
_component.done
|
|
2294
|
-
|
|
2295
|
-
|
|
2575
|
+
_component.__done__().then(function (){
|
|
2576
|
+
if (typeof _component.done === "function") {
|
|
2577
|
+
_component.done.call(_component, standardResponse);
|
|
2578
|
+
}
|
|
2579
|
+
resolve.call(_promise, standardResponse);
|
|
2580
|
+
}, function (){
|
|
2581
|
+
reject.call(_promise, standardResponse);
|
|
2582
|
+
});
|
|
2296
2583
|
break;
|
|
2297
2584
|
case (_component.get("tplsource") === "inline"):
|
|
2298
2585
|
logger.debug("Component " + _component.name + " has specified template-source=inline, so it is assumed that template is already declared");
|
|
@@ -2301,10 +2588,14 @@
|
|
|
2301
2588
|
request: null,
|
|
2302
2589
|
component: _component
|
|
2303
2590
|
};
|
|
2304
|
-
|
|
2305
|
-
_component.done
|
|
2306
|
-
|
|
2307
|
-
|
|
2591
|
+
_component.__done__().then(function (){
|
|
2592
|
+
if (typeof _component.done === "function") {
|
|
2593
|
+
_component.done.call(_component, standardResponse);
|
|
2594
|
+
}
|
|
2595
|
+
resolve.call(_promise, standardResponse);
|
|
2596
|
+
}, function (){
|
|
2597
|
+
reject.call(_promise, standardResponse);
|
|
2598
|
+
});
|
|
2308
2599
|
break;
|
|
2309
2600
|
case (_component.get("tplsource") === "default" &&
|
|
2310
2601
|
_component.get("templateURI") !== ""):
|
|
@@ -2357,10 +2648,9 @@
|
|
|
2357
2648
|
}
|
|
2358
2649
|
|
|
2359
2650
|
static route() {
|
|
2360
|
-
var componentClass = this;
|
|
2651
|
+
var componentClass = this; /* is can be class or object*/
|
|
2361
2652
|
var _route_promise_;
|
|
2362
|
-
var isValidInstance = ((
|
|
2363
|
-
Object.hasOwnProperty.call(componentClass, "subcomponents")) ? (true) : (false);
|
|
2653
|
+
var isValidInstance = ( isQCObjects_Object(componentClass) && is_a(componentClass,"Component") ) ? (true) : (false);
|
|
2364
2654
|
var __route__ = function (componentList) {
|
|
2365
2655
|
var _componentNames_ = [];
|
|
2366
2656
|
var _promises_ = componentList.filter(function (rc) {
|
|
@@ -2376,19 +2666,22 @@
|
|
|
2376
2666
|
if (typeof rc !== "undefined" && !!rc._reroute_) {
|
|
2377
2667
|
_promise_ = rc._reroute_()
|
|
2378
2668
|
.then(function () {
|
|
2379
|
-
rc.
|
|
2380
|
-
rc.innerHTML = "";
|
|
2669
|
+
rc.reload = true;
|
|
2381
2670
|
return rc.rebuild();
|
|
2382
2671
|
})
|
|
2383
2672
|
.then(function (_rc_) {
|
|
2384
|
-
if (Object.hasOwnProperty.call(
|
|
2385
|
-
typeof
|
|
2386
|
-
|
|
2673
|
+
if (Object.hasOwnProperty.call(rc, "subcomponents") &&
|
|
2674
|
+
typeof rc.subcomponents !== "undefined" &&
|
|
2675
|
+
rc.subcomponents.length > 0
|
|
2387
2676
|
) {
|
|
2388
|
-
logger.debug("LOOKING FOR ROUTINGS IN SUBCOMPONENTS FOR: " +
|
|
2389
|
-
return __route__.call(
|
|
2677
|
+
logger.debug("LOOKING FOR ROUTINGS IN SUBCOMPONENTS FOR: " + rc.name);
|
|
2678
|
+
return __route__.call(rc, rc.subcomponents);
|
|
2390
2679
|
} else {
|
|
2391
|
-
|
|
2680
|
+
logger.debug("No subcomponents to look for routings in: " + rc.name);
|
|
2681
|
+
if (rc.subtags.length>0){
|
|
2682
|
+
rc.subcomponents = rc.__buildSubComponents__(true);
|
|
2683
|
+
}
|
|
2684
|
+
resolve(rc);
|
|
2392
2685
|
}
|
|
2393
2686
|
});
|
|
2394
2687
|
} else if (typeof rc !== "undefined") {
|
|
@@ -2404,8 +2697,8 @@
|
|
|
2404
2697
|
logger.warn("ROUTING FAILED FOR " + _componentNames_.join(", ") + ": " + err);
|
|
2405
2698
|
});
|
|
2406
2699
|
};
|
|
2407
|
-
if (isValidInstance ||
|
|
2408
|
-
if (isValidInstance
|
|
2700
|
+
if (isValidInstance || !!global.componentsStack) {
|
|
2701
|
+
if (isValidInstance) {
|
|
2409
2702
|
logger.debug("loading routings for instance " + componentClass.name);
|
|
2410
2703
|
}
|
|
2411
2704
|
_route_promise_ = __route__.call(componentClass, (isValidInstance) ? (componentClass.subcomponents) : (global.componentsStack));
|
|
@@ -2467,6 +2760,12 @@
|
|
|
2467
2760
|
routing[attributeNames[a]] = routingNode.getAttribute(attributeNames[a]);
|
|
2468
2761
|
});
|
|
2469
2762
|
component.routings.push(routing);
|
|
2763
|
+
if (!component.routingPaths) {
|
|
2764
|
+
component.routingPaths = [];
|
|
2765
|
+
}
|
|
2766
|
+
if (!component.routingPaths.includes(routing.path)) {
|
|
2767
|
+
component.routingPaths.push(routing.path);
|
|
2768
|
+
}
|
|
2470
2769
|
if (!_top.global.get("routingPaths")) {
|
|
2471
2770
|
_top.global.set("routingPaths", []);
|
|
2472
2771
|
}
|
|
@@ -2727,19 +3026,29 @@
|
|
|
2727
3026
|
|
|
2728
3027
|
]);
|
|
2729
3028
|
|
|
2730
|
-
_top._bindroute_.__assigned = false;
|
|
2731
|
-
|
|
2732
3029
|
(_methods_)(ClassFactory("Component")).map(function (__c__) {
|
|
2733
3030
|
(_protected_code_)(__c__);
|
|
2734
3031
|
});
|
|
2735
3032
|
|
|
3033
|
+
if (isBrowser){
|
|
3034
|
+
window.addEventListener("popstate",function (popStateEvent){
|
|
3035
|
+
popStateEvent.stopImmediatePropagation();
|
|
3036
|
+
popStateEvent.stopPropagation();
|
|
3037
|
+
ClassFactory("Component").route();
|
|
3038
|
+
});
|
|
3039
|
+
}
|
|
3040
|
+
|
|
2736
3041
|
Package("com.qcobjects.controllers", [
|
|
2737
3042
|
class Controller extends ClassFactory("InheritClass") {
|
|
3043
|
+
component = null;
|
|
3044
|
+
dependencies = [];
|
|
2738
3045
|
constructor ({
|
|
2739
|
-
component
|
|
2740
|
-
dependencies
|
|
3046
|
+
component,
|
|
3047
|
+
dependencies
|
|
2741
3048
|
}){
|
|
2742
3049
|
super (...arguments);
|
|
3050
|
+
this.component = component;
|
|
3051
|
+
this.dependencies = dependencies;
|
|
2743
3052
|
if (typeof this.component === "undefined" || this.component === "null"){
|
|
2744
3053
|
throw Error (`${__getType__(this)} must be called with a component`);
|
|
2745
3054
|
}
|
|
@@ -3039,11 +3348,13 @@
|
|
|
3039
3348
|
}
|
|
3040
3349
|
});
|
|
3041
3350
|
__promise__.then(function (standardResponse) {
|
|
3042
|
-
|
|
3043
|
-
|
|
3044
|
-
|
|
3045
|
-
|
|
3046
|
-
|
|
3351
|
+
return component.__done__().then (function (){
|
|
3352
|
+
var _ret_;
|
|
3353
|
+
if (typeof component.done === "function") {
|
|
3354
|
+
_ret_ = component.done.call(component, standardResponse);
|
|
3355
|
+
}
|
|
3356
|
+
return Promise.resolve(_ret_);
|
|
3357
|
+
});
|
|
3047
3358
|
}, function (standardResponse) {
|
|
3048
3359
|
var _ret_;
|
|
3049
3360
|
if (typeof component.fail === "function") {
|
|
@@ -3123,11 +3434,13 @@
|
|
|
3123
3434
|
}
|
|
3124
3435
|
});
|
|
3125
3436
|
component.__promise__.then(function (standardResponse) {
|
|
3126
|
-
|
|
3127
|
-
|
|
3128
|
-
|
|
3129
|
-
|
|
3130
|
-
|
|
3437
|
+
return component.__done__().then (function (){
|
|
3438
|
+
var _ret_;
|
|
3439
|
+
if (typeof component.done === "function") {
|
|
3440
|
+
_ret_ = component.done.call(component, standardResponse);
|
|
3441
|
+
}
|
|
3442
|
+
return Promise.resolve(_ret_);
|
|
3443
|
+
});
|
|
3131
3444
|
}, function (standardResponse) {
|
|
3132
3445
|
var _ret_;
|
|
3133
3446
|
if (typeof component.fail === "function") {
|
|
@@ -3460,234 +3773,12 @@
|
|
|
3460
3773
|
if (isBrowser) {
|
|
3461
3774
|
|
|
3462
3775
|
Element.prototype.buildComponents = function (rebuildObjects = false) {
|
|
3463
|
-
var tagFilter =
|
|
3776
|
+
var tagFilter = "component:not([loaded])";
|
|
3464
3777
|
var d = this;
|
|
3465
|
-
var
|
|
3466
|
-
|
|
3467
|
-
_component_ = components[_c];
|
|
3468
|
-
var data = {};
|
|
3469
|
-
var attributenames = components[_c].getAttributeNames().filter(function (a) {
|
|
3470
|
-
return a.startsWith("data-");
|
|
3471
|
-
}).map(function (a) {
|
|
3472
|
-
return a.split("-")[1];
|
|
3473
|
-
});
|
|
3474
|
-
attributenames.map(function (_attribute_name_) {
|
|
3475
|
-
data[_attribute_name_] = components[_c].getAttribute("data-" + _attribute_name_);
|
|
3476
|
-
});
|
|
3477
|
-
var componentDone = function () {
|
|
3478
|
-
var _component_ = this;
|
|
3479
|
-
if (typeof _component_ === "undefined") {
|
|
3480
|
-
throw new Error("componentDone() has lost its context");
|
|
3481
|
-
}
|
|
3482
|
-
if (typeof _component_.body === "undefined") {
|
|
3483
|
-
throw new Error("The component has no body");
|
|
3484
|
-
}
|
|
3485
|
-
var viewName = _component_.body.getAttribute("viewClass");
|
|
3486
|
-
var _View = ClassFactory(viewName);
|
|
3487
|
-
if (typeof _View !== "undefined") {
|
|
3488
|
-
_component_.view = New(_View, {
|
|
3489
|
-
component: _component_
|
|
3490
|
-
}); // Initializes the main view for the component
|
|
3491
|
-
if (Object.hasOwnProperty.call(_component_.view, "done") && typeof _component_.view.done === "function") {
|
|
3492
|
-
_component_.view.done.call(_component_.view);
|
|
3493
|
-
}
|
|
3494
|
-
}
|
|
3495
|
-
var controllerName = _component_.body.getAttribute("controllerClass");
|
|
3496
|
-
if (!controllerName) {
|
|
3497
|
-
controllerName = "Controller";
|
|
3498
|
-
}
|
|
3499
|
-
var _Controller = ClassFactory(controllerName);
|
|
3500
|
-
if (typeof _Controller !== "undefined") {
|
|
3501
|
-
_component_.controller = New(_Controller, {
|
|
3502
|
-
component: _component_
|
|
3503
|
-
}); // Initializes the main controller for the component
|
|
3504
|
-
if (typeof _component_.controller.done === "function") {
|
|
3505
|
-
_component_.controller.done.call(_component_.controller);
|
|
3506
|
-
} else {
|
|
3507
|
-
logger.debug(`${controllerName} does not have a done() method.`);
|
|
3508
|
-
}
|
|
3509
|
-
if (typeof _component_.controller.createRoutingController === "function") {
|
|
3510
|
-
_component_.controller.createRoutingController.call(_component_.controller);
|
|
3511
|
-
} else {
|
|
3512
|
-
logger.debug(`${controllerName} does not have a createRoutingController() method.`);
|
|
3513
|
-
}
|
|
3514
|
-
}
|
|
3515
|
-
var effectClassName = _component_.body.getAttribute("effectClass");
|
|
3516
|
-
var applyEffectTo = _component_.body.getAttribute("apply-effect-to");
|
|
3517
|
-
applyEffectTo = (applyEffectTo !== null) ? (applyEffectTo) : ("load");
|
|
3518
|
-
if (effectClassName !== null && applyEffectTo === "observe") {
|
|
3519
|
-
_component_.applyObserveTransitionEffect(effectClassName);
|
|
3520
|
-
} else if (effectClassName !== null && applyEffectTo === "load") {
|
|
3521
|
-
_component_.applyTransitionEffect(effectClassName);
|
|
3522
|
-
}
|
|
3523
|
-
if (_component_.shadowed && (typeof _component_.shadowRoot !== "undefined")) {
|
|
3524
|
-
_component_.subcomponents = _buildComponent(_component_.shadowRoot.subelements(tagFilter), _component_);
|
|
3525
|
-
} else {
|
|
3526
|
-
_component_.subcomponents = _buildComponent(_component_.body.subelements(tagFilter), _component_);
|
|
3527
|
-
}
|
|
3528
|
-
|
|
3529
|
-
if (_top.CONFIG.get("overrideComponentTag")) {
|
|
3530
|
-
_component_.body.outerHTML = this.body.innerHTML;
|
|
3531
|
-
}
|
|
3532
|
-
_component_.body.setAttribute("loaded", true);
|
|
3533
|
-
|
|
3534
|
-
logger.debug(`Trying to run component helpers for ${_component_.name}...`);
|
|
3535
|
-
try {
|
|
3536
|
-
_component_.runComponentHelpers();
|
|
3537
|
-
logger.debug(`Component helpers for ${_component_.name} executed.`);
|
|
3538
|
-
} catch (e){
|
|
3539
|
-
logger.debug(`Component helpers for ${_component_.name} could not be executed.`);
|
|
3540
|
-
throw Error(e);
|
|
3541
|
-
}
|
|
3542
|
-
|
|
3543
|
-
if ((Tag("component[loaded=true]").length * 100 / Tag("component").length) >= 100) {
|
|
3544
|
-
d.dispatchEvent(new CustomEvent("componentsloaded", {
|
|
3545
|
-
detail: {
|
|
3546
|
-
lastComponent: _component_
|
|
3547
|
-
}
|
|
3548
|
-
}));
|
|
3549
|
-
}
|
|
3550
|
-
};
|
|
3551
|
-
|
|
3552
|
-
var __shadowed_not_set = (components[_c].getAttribute("shadowed") === null) ? (true) : (false);
|
|
3553
|
-
var __tplsource_attr_not_set = (components[_c].getAttribute("template-source") === null) ? (true) : (false);
|
|
3554
|
-
var shadowed = (components[_c].getAttribute("shadowed") === "true") ? (true) : (false);
|
|
3555
|
-
var __cached_not_set = (components[_c].getAttribute("cached") === null) ? (true) : (false);
|
|
3556
|
-
var cached = (components[_c].getAttribute("cached") === "true") ? (true) : (false);
|
|
3557
|
-
var tplextension = (typeof _top.CONFIG.get("tplextension") !== "undefined") ? (_top.CONFIG.get("tplextension")) : ("html");
|
|
3558
|
-
tplextension = (components[_c].getAttribute("tplextension") !== null) ? (components[_c].getAttribute("tplextension")) : (tplextension);
|
|
3559
|
-
var _componentName = components[_c].getAttribute("name");
|
|
3560
|
-
var _componentClassName = (components[_c].getAttribute("componentClass") !== null) ? (components[_c].getAttribute("componentClass")) : ("Component");
|
|
3561
|
-
var _serviceClassName = (components[_c].getAttribute("serviceClass") !== null) ? (components[_c].getAttribute("serviceClass")) : (null);
|
|
3562
|
-
/* __enable_service_class__ = true by default */
|
|
3563
|
-
var __enable_service_class__ = (
|
|
3564
|
-
(Object.hasOwnProperty.call(components[_c], "enableServiceClass") && components[_c].enableServiceClass) ||
|
|
3565
|
-
(!Object.hasOwnProperty.call(components[_c], "enableServiceClass"))
|
|
3566
|
-
) ? (true) : (false);
|
|
3567
|
-
var _response_to_data_ = (components[_c].getAttribute("response-to") !== null && components[_c].getAttribute("response-to") === "data") ? (true) : (false);
|
|
3568
|
-
var _response_to_template_ = (components[_c].getAttribute("response-to") !== null && components[_c].getAttribute("response-to") === "template") ? (true) : (false);
|
|
3569
|
-
let __componentClassName = (_top.CONFIG.get("preserveComponentBodyTag")) ? (
|
|
3570
|
-
(_componentName !== null) ? ("com.qcobjects.components." + _componentName + ".ComponentBody") : ("com.qcobjects.components.ComponentBody")
|
|
3571
|
-
) : (_componentClassName);
|
|
3572
|
-
_componentName = (_componentName !== null) ? (_componentName) : (
|
|
3573
|
-
(ClassFactory(__componentClassName) &&
|
|
3574
|
-
typeof ClassFactory(__componentClassName).name !== "undefined"
|
|
3575
|
-
) ? (
|
|
3576
|
-
ClassFactory(__componentClassName).name
|
|
3577
|
-
) : ("")
|
|
3578
|
-
);
|
|
3579
|
-
var __classDefinition = ClassFactory(__componentClassName);
|
|
3580
|
-
var __tplsource_prop_set = (__componentClassName !== "Component" && ((typeof __classDefinition !== "undefined" && typeof __classDefinition.tplsource === "string") && __classDefinition.tplsource !== "")) ? (true) : (false);
|
|
3581
|
-
var tplsource = (__tplsource_attr_not_set && __tplsource_prop_set) ? (__classDefinition.tplsource) : ((__tplsource_attr_not_set) ? ("default") : (components[_c].getAttribute("template-source")));
|
|
3582
|
-
logger.debug(`template source for ${_componentName} is ${tplsource} `);
|
|
3583
|
-
logger.debug(`type for ${_componentName} is ${__getType__(__classDefinition)} `);
|
|
3584
|
-
|
|
3585
|
-
var componentURI;
|
|
3586
|
-
componentURI = ComponentURI({
|
|
3587
|
-
"COMPONENTS_BASE_PATH": _top.CONFIG.get("componentsBasePath"),
|
|
3588
|
-
"COMPONENT_NAME": _componentName,
|
|
3589
|
-
"TPLEXTENSION": tplextension,
|
|
3590
|
-
"TPL_SOURCE": tplsource
|
|
3591
|
-
});
|
|
3592
|
-
if (_top.CONFIG.get("preserveComponentBodyTag")) {
|
|
3593
|
-
Package((_componentName !== "") ? ("com.qcobjects.components." + _componentName + "") : ("com.qcobjects.components"), [
|
|
3594
|
-
Class("ComponentBody", ClassFactory("Component"), {
|
|
3595
|
-
name: _componentName,
|
|
3596
|
-
tplsource: tplsource,
|
|
3597
|
-
tplextension: tplextension,
|
|
3598
|
-
reload: true
|
|
3599
|
-
})
|
|
3600
|
-
]);
|
|
3601
|
-
}
|
|
3602
|
-
|
|
3603
|
-
var __serviceClass;
|
|
3604
|
-
if (__enable_service_class__ && _serviceClassName !== null) {
|
|
3605
|
-
__serviceClass = ClassFactory(_serviceClassName);
|
|
3606
|
-
}
|
|
3607
|
-
if (!_response_to_data_ && __classDefinition && Object.hasOwnProperty.call(__classDefinition, "responseTo")) {
|
|
3608
|
-
_response_to_data_ = (__classDefinition.responseTo === "data") ? (true) : (false);
|
|
3609
|
-
} else if (!_response_to_data_ && Object.hasOwnProperty.call(ClassFactory("Component"), "responseTo")) {
|
|
3610
|
-
_response_to_data_ = (ClassFactory("Component").responseTo === "data") ? (true) : (false);
|
|
3611
|
-
}
|
|
3612
|
-
if (!_response_to_template_ && __classDefinition && Object.hasOwnProperty.call(__classDefinition, "responseTo")) {
|
|
3613
|
-
_response_to_template_ = (__classDefinition.responseTo === "template") ? (true) : (false);
|
|
3614
|
-
} else if (!_response_to_template_ && Object.hasOwnProperty.call(ClassFactory("Component"), "responseTo")) {
|
|
3615
|
-
_response_to_template_ = (ClassFactory("Component").responseTo === "template") ? (true) : (false);
|
|
3616
|
-
}
|
|
3617
|
-
|
|
3618
|
-
var __create_component_instance_ = function (data, serviceResponse) {
|
|
3619
|
-
var __shadowed = (__shadowed_not_set) ? ((__classDefinition && __classDefinition.shadowed) || ClassFactory("Component").shadowed) : (shadowed);
|
|
3620
|
-
var __definition = {
|
|
3621
|
-
__parent__: __parent__,
|
|
3622
|
-
name: _componentName,
|
|
3623
|
-
data: data,
|
|
3624
|
-
cached: (__cached_not_set) ? (ClassFactory("Component").cached) : (cached),
|
|
3625
|
-
shadowed: __shadowed,
|
|
3626
|
-
tplextension: tplextension,
|
|
3627
|
-
body: (_top.CONFIG.get("preserveComponentBodyTag")) ? (_DOMCreateElement("componentBody")) : (components[_c]),
|
|
3628
|
-
templateURI: componentURI,
|
|
3629
|
-
tplsource: tplsource,
|
|
3630
|
-
subcomponents: []
|
|
3631
|
-
};
|
|
3632
|
-
if (_response_to_template_) {
|
|
3633
|
-
__definition.template = serviceResponse;
|
|
3634
|
-
}
|
|
3635
|
-
if (typeof _componentName === "undefined" || _componentName === "" || _componentName === null) {
|
|
3636
|
-
/* this allows to use the original property defined
|
|
3637
|
-
in the component definition if it is not present in the tag */
|
|
3638
|
-
delete __definition.name;
|
|
3639
|
-
}
|
|
3640
|
-
if (componentURI === "") {
|
|
3641
|
-
/* this allows to use the original property defined
|
|
3642
|
-
in the component definition if it is not present in the tag */
|
|
3643
|
-
delete __definition.templateURI;
|
|
3644
|
-
}
|
|
3645
|
-
var newComponent = New(__classDefinition, __definition);
|
|
3646
|
-
|
|
3647
|
-
if (_top.CONFIG.get("preserveComponentBodyTag")) {
|
|
3648
|
-
components[_c].append(newComponent);
|
|
3649
|
-
}
|
|
3650
|
-
newComponent.done = componentDone;
|
|
3651
|
-
return newComponent;
|
|
3652
|
-
};
|
|
3653
|
-
var newComponent;
|
|
3654
|
-
if (typeof __serviceClass !== "undefined" &&
|
|
3655
|
-
(typeof __enable_service_class__ !== "undefined" &&
|
|
3656
|
-
__enable_service_class__ === true) &&
|
|
3657
|
-
(_response_to_data_ || _response_to_template_)
|
|
3658
|
-
) {
|
|
3659
|
-
logger.info("Loading service " + _serviceClassName);
|
|
3660
|
-
var serviceInstance = New(__serviceClass, {
|
|
3661
|
-
data: data
|
|
3662
|
-
});
|
|
3663
|
-
serviceLoader(serviceInstance).then(function ({
|
|
3664
|
-
request,
|
|
3665
|
-
service
|
|
3666
|
-
}) {
|
|
3667
|
-
var serviceResponse = service.template;
|
|
3668
|
-
if (_response_to_data_) {
|
|
3669
|
-
if (typeof data === "object" && typeof serviceResponse === "object") {
|
|
3670
|
-
data = Object.assign(data, serviceResponse);
|
|
3671
|
-
} else {
|
|
3672
|
-
data = serviceResponse;
|
|
3673
|
-
}
|
|
3674
|
-
}
|
|
3675
|
-
newComponent = __create_component_instance_.call(this, data, serviceResponse);
|
|
3676
|
-
newComponent.serviceInstance = serviceInstance;
|
|
3677
|
-
newComponent.serviceData = data;
|
|
3678
|
-
}).catch(function (e) {
|
|
3679
|
-
logger.debug("Something went wroing while trying to load the service " + _serviceClassName);
|
|
3680
|
-
});
|
|
3681
|
-
} else {
|
|
3682
|
-
newComponent = __create_component_instance_.call(this, data, null);
|
|
3683
|
-
}
|
|
3684
|
-
return newComponent;
|
|
3685
|
-
});
|
|
3686
|
-
return componentsBuiltWith;
|
|
3687
|
-
};
|
|
3688
|
-
var components = d.subelements(tagFilter);
|
|
3689
|
-
return _buildComponent(components, null);
|
|
3778
|
+
var elements = d.subelements(tagFilter);
|
|
3779
|
+
return _buildComponentsFromElements_(elements, null);
|
|
3690
3780
|
};
|
|
3781
|
+
|
|
3691
3782
|
HTMLDocument.prototype.buildComponents = Element.prototype.buildComponents;
|
|
3692
3783
|
HTMLElement.prototype.buildComponents = Element.prototype.buildComponents;
|
|
3693
3784
|
var _ComponentWidget_ = class extends HTMLElement {
|
|
@@ -3696,7 +3787,7 @@
|
|
|
3696
3787
|
const componentWidget = this;
|
|
3697
3788
|
const componentName = componentWidget.nodeName.toLowerCase();
|
|
3698
3789
|
const componentBody = _DOMCreateElement("component");
|
|
3699
|
-
const __enabled__atributes__ =
|
|
3790
|
+
const __enabled__atributes__ = componentWidget.getAttributeNames();
|
|
3700
3791
|
componentBody.setAttribute("name", componentName);
|
|
3701
3792
|
|
|
3702
3793
|
if (!componentWidget.hasAttribute("shadowed")) {
|
|
@@ -4247,173 +4338,209 @@
|
|
|
4247
4338
|
}
|
|
4248
4339
|
});
|
|
4249
4340
|
|
|
4250
|
-
|
|
4251
|
-
|
|
4252
|
-
|
|
4253
|
-
timing,
|
|
4254
|
-
draw,
|
|
4255
|
-
duration
|
|
4256
|
-
}) {
|
|
4341
|
+
Package("com.qcobjects.effects.base", [
|
|
4342
|
+
class Effect extends ClassFactory("InheritClass") {
|
|
4343
|
+
duration = 1000;
|
|
4257
4344
|
|
|
4258
|
-
|
|
4345
|
+
constructor (){
|
|
4346
|
+
super(...arguments);
|
|
4347
|
+
}
|
|
4259
4348
|
|
|
4260
|
-
|
|
4261
|
-
|
|
4262
|
-
|
|
4263
|
-
|
|
4349
|
+
animate({
|
|
4350
|
+
timing,
|
|
4351
|
+
draw,
|
|
4352
|
+
duration
|
|
4353
|
+
}) {
|
|
4354
|
+
|
|
4355
|
+
let start = performance.now();
|
|
4356
|
+
|
|
4357
|
+
requestAnimationFrame(function animate(time) {
|
|
4358
|
+
// timeFraction goes from 0 to 1
|
|
4359
|
+
let timeFraction = (time - start) / duration;
|
|
4360
|
+
if (timeFraction > 1) timeFraction = 1;
|
|
4361
|
+
|
|
4362
|
+
// calculate the current animation state
|
|
4363
|
+
let progress = timing(timeFraction);
|
|
4364
|
+
|
|
4365
|
+
draw(Math.round(progress * 100)); // draw it
|
|
4366
|
+
|
|
4367
|
+
if (timeFraction < 1) {
|
|
4368
|
+
requestAnimationFrame(animate);
|
|
4369
|
+
} else {
|
|
4370
|
+
// if this is an object with a done method
|
|
4371
|
+
if (typeof this !== "undefined" &&
|
|
4372
|
+
this !== null &&
|
|
4373
|
+
Object.hasOwnProperty.call(this, "done") &&
|
|
4374
|
+
(typeof this.done).toLowerCase() === "function") {
|
|
4375
|
+
this.done.call(this);
|
|
4376
|
+
}
|
|
4377
|
+
}
|
|
4378
|
+
|
|
4379
|
+
});
|
|
4380
|
+
}
|
|
4381
|
+
|
|
4382
|
+
}
|
|
4383
|
+
]);
|
|
4264
4384
|
|
|
4265
|
-
|
|
4266
|
-
|
|
4385
|
+
Package("com.qcobjects.effects.transitions.base", [
|
|
4386
|
+
|
|
4387
|
+
class TransitionEffect extends ClassFactory("Effect") {
|
|
4388
|
+
duration= 385;
|
|
4389
|
+
defaultParams= {
|
|
4390
|
+
alphaFrom: 0,
|
|
4391
|
+
alphaTo: 1,
|
|
4392
|
+
angleFrom: 180,
|
|
4393
|
+
angleTo: 0,
|
|
4394
|
+
radiusFrom: 0,
|
|
4395
|
+
radiusTo: 30,
|
|
4396
|
+
scaleFrom: 0,
|
|
4397
|
+
scaleTo: 1
|
|
4398
|
+
};
|
|
4399
|
+
fitToHeight= false;
|
|
4400
|
+
fitToWidth= false;
|
|
4401
|
+
effects= [];
|
|
4267
4402
|
|
|
4268
|
-
|
|
4403
|
+
constructor (){
|
|
4404
|
+
super(...arguments);
|
|
4405
|
+
logger.info("DECLARING TransitionEffect ");
|
|
4406
|
+
this.component.defaultParams = this.defaultParams;
|
|
4407
|
+
}
|
|
4269
4408
|
|
|
4270
|
-
|
|
4271
|
-
|
|
4272
|
-
|
|
4273
|
-
|
|
4274
|
-
|
|
4275
|
-
|
|
4276
|
-
|
|
4277
|
-
|
|
4278
|
-
|
|
4279
|
-
|
|
4409
|
+
apply({
|
|
4410
|
+
alphaFrom,
|
|
4411
|
+
alphaTo,
|
|
4412
|
+
angleFrom,
|
|
4413
|
+
angleTo,
|
|
4414
|
+
radiusFrom,
|
|
4415
|
+
radiusTo,
|
|
4416
|
+
scaleFrom,
|
|
4417
|
+
scaleTo
|
|
4418
|
+
}) {
|
|
4419
|
+
var _transition_ = this;
|
|
4420
|
+
logger.info("EXECUTING TransitionEffect ");
|
|
4421
|
+
if (_transition_.fitToHeight) {
|
|
4422
|
+
_transition_.component.body.height = _transition_.component.body.offsetParent.scrollHeight;
|
|
4280
4423
|
}
|
|
4281
|
-
|
|
4282
|
-
|
|
4283
|
-
|
|
4284
|
-
|
|
4285
|
-
|
|
4286
|
-
|
|
4287
|
-
|
|
4288
|
-
|
|
4289
|
-
|
|
4290
|
-
|
|
4291
|
-
|
|
4292
|
-
|
|
4293
|
-
|
|
4294
|
-
|
|
4295
|
-
|
|
4296
|
-
|
|
4297
|
-
|
|
4298
|
-
|
|
4299
|
-
|
|
4300
|
-
|
|
4301
|
-
|
|
4302
|
-
|
|
4303
|
-
this.component.defaultParams = this.defaultParams;
|
|
4304
|
-
},
|
|
4305
|
-
apply({
|
|
4306
|
-
alphaFrom,
|
|
4307
|
-
alphaTo,
|
|
4308
|
-
angleFrom,
|
|
4309
|
-
angleTo,
|
|
4310
|
-
radiusFrom,
|
|
4311
|
-
radiusTo,
|
|
4312
|
-
scaleFrom,
|
|
4313
|
-
scaleTo
|
|
4314
|
-
}) {
|
|
4315
|
-
var _transition_ = this;
|
|
4316
|
-
logger.info("EXECUTING TransitionEffect ");
|
|
4317
|
-
if (_transition_.fitToHeight) {
|
|
4318
|
-
_transition_.component.body.height = _transition_.component.body.offsetParent.scrollHeight;
|
|
4319
|
-
}
|
|
4320
|
-
if (_transition_.fitToWidth) {
|
|
4321
|
-
_transition_.component.body.width = _transition_.component.body.offsetParent.scrollWidth;
|
|
4322
|
-
}
|
|
4323
|
-
_transition_.component.body.style.display = "block";
|
|
4324
|
-
_transition_.effects.map(function (effectClassName, eff) {
|
|
4325
|
-
var __effectClass__ = ClassFactory(effectClassName);
|
|
4326
|
-
var effectObj = new __effectClass__();
|
|
4327
|
-
var effectClassMethod = effectObj.apply;
|
|
4328
|
-
var args = [_transition_.component.body].concat(Object.values({
|
|
4329
|
-
alphaFrom,
|
|
4330
|
-
alphaTo,
|
|
4331
|
-
angleFrom,
|
|
4332
|
-
angleTo,
|
|
4333
|
-
radiusFrom,
|
|
4334
|
-
radiusTo,
|
|
4335
|
-
scaleFrom,
|
|
4336
|
-
scaleTo
|
|
4337
|
-
}));
|
|
4338
|
-
effectClassMethod.apply(_transition_, args);
|
|
4339
|
-
});
|
|
4424
|
+
if (_transition_.fitToWidth) {
|
|
4425
|
+
_transition_.component.body.width = _transition_.component.body.offsetParent.scrollWidth;
|
|
4426
|
+
}
|
|
4427
|
+
_transition_.component.body.style.display = "block";
|
|
4428
|
+
_transition_.effects.map(function (effectClassName, eff) {
|
|
4429
|
+
var __effectClass__ = ClassFactory(effectClassName);
|
|
4430
|
+
var effectObj = new __effectClass__();
|
|
4431
|
+
var effectClassMethod = effectObj.apply;
|
|
4432
|
+
var args = [_transition_.component.body].concat(Object.values({
|
|
4433
|
+
alphaFrom,
|
|
4434
|
+
alphaTo,
|
|
4435
|
+
angleFrom,
|
|
4436
|
+
angleTo,
|
|
4437
|
+
radiusFrom,
|
|
4438
|
+
radiusTo,
|
|
4439
|
+
scaleFrom,
|
|
4440
|
+
scaleTo
|
|
4441
|
+
}));
|
|
4442
|
+
effectClassMethod.apply(_transition_, args);
|
|
4443
|
+
});
|
|
4444
|
+
}
|
|
4445
|
+
|
|
4340
4446
|
}
|
|
4341
|
-
|
|
4342
|
-
|
|
4343
|
-
Class("Timer", {
|
|
4344
|
-
duration: 1000,
|
|
4345
|
-
alive: true,
|
|
4346
|
-
thread({
|
|
4347
|
-
timing,
|
|
4348
|
-
intervalInterceptor,
|
|
4349
|
-
duration
|
|
4350
|
-
}) {
|
|
4351
|
-
var timer = this;
|
|
4447
|
+
]);
|
|
4352
4448
|
|
|
4353
|
-
|
|
4449
|
+
Package("com.qcobjects.timing", [
|
|
4450
|
+
class Timer extends ClassFactory("InheritClass") {
|
|
4354
4451
|
|
|
4355
|
-
|
|
4356
|
-
|
|
4357
|
-
|
|
4358
|
-
let timeFraction = elapsed / duration;
|
|
4359
|
-
if (timeFraction > 1) timeFraction = 1;
|
|
4452
|
+
constructor (){
|
|
4453
|
+
super(...arguments);
|
|
4454
|
+
}
|
|
4360
4455
|
|
|
4361
|
-
|
|
4362
|
-
|
|
4456
|
+
duration= 1000;
|
|
4457
|
+
alive= true;
|
|
4458
|
+
thread({
|
|
4459
|
+
timing,
|
|
4460
|
+
intervalInterceptor,
|
|
4461
|
+
duration
|
|
4462
|
+
}) {
|
|
4463
|
+
var timer = this;
|
|
4464
|
+
|
|
4465
|
+
let start = performance.now();
|
|
4466
|
+
|
|
4467
|
+
requestAnimationFrame(function thread(time) {
|
|
4468
|
+
// timeFraction goes from 0 to 1
|
|
4469
|
+
let elapsed = (time - start);
|
|
4470
|
+
let timeFraction = elapsed / duration;
|
|
4471
|
+
if (timeFraction > 1) timeFraction = 1;
|
|
4472
|
+
|
|
4473
|
+
// calculate the current progress state
|
|
4474
|
+
let progress = timing(timeFraction, elapsed);
|
|
4475
|
+
|
|
4476
|
+
intervalInterceptor(Math.round(progress * 100)); // draw it
|
|
4477
|
+
|
|
4478
|
+
if ((timeFraction < 1 || duration === -1) && timer.alive) {
|
|
4479
|
+
requestAnimationFrame(thread);
|
|
4480
|
+
}
|
|
4481
|
+
|
|
4482
|
+
});
|
|
4483
|
+
}
|
|
4484
|
+
|
|
4363
4485
|
|
|
4364
|
-
|
|
4486
|
+
}
|
|
4487
|
+
]);
|
|
4365
4488
|
|
|
4366
|
-
|
|
4367
|
-
|
|
4368
|
-
|
|
4489
|
+
Package("com.qcobjects.tools.essentials", [
|
|
4490
|
+
class Toggle extends ClassFactory("InheritClass") {
|
|
4491
|
+
_toggle= false;
|
|
4492
|
+
_inverse= true;
|
|
4493
|
+
_positive= null;
|
|
4494
|
+
_negative= null;
|
|
4495
|
+
_dispatched= null;
|
|
4496
|
+
_args= {};
|
|
4497
|
+
|
|
4498
|
+
constructor (){
|
|
4499
|
+
super(...arguments);
|
|
4500
|
+
}
|
|
4369
4501
|
|
|
4370
|
-
|
|
4371
|
-
|
|
4372
|
-
|
|
4502
|
+
changeToggle() {
|
|
4503
|
+
this._toggle = (this._toggle) ? (false) : (true);
|
|
4504
|
+
}
|
|
4373
4505
|
|
|
4374
|
-
|
|
4375
|
-
|
|
4376
|
-
|
|
4377
|
-
|
|
4378
|
-
|
|
4379
|
-
|
|
4380
|
-
|
|
4381
|
-
|
|
4382
|
-
|
|
4383
|
-
},
|
|
4384
|
-
_new_({
|
|
4385
|
-
positive,
|
|
4386
|
-
negative,
|
|
4387
|
-
args
|
|
4388
|
-
}) {
|
|
4389
|
-
this._positive = positive;
|
|
4390
|
-
this._negative = negative;
|
|
4391
|
-
this._args = args;
|
|
4392
|
-
},
|
|
4393
|
-
fire() {
|
|
4394
|
-
var toggle = this;
|
|
4395
|
-
var _promise = new Promise(function (resolve, reject) {
|
|
4506
|
+
_new_({
|
|
4507
|
+
positive,
|
|
4508
|
+
negative,
|
|
4509
|
+
args
|
|
4510
|
+
}) {
|
|
4511
|
+
this._positive = positive;
|
|
4512
|
+
this._negative = negative;
|
|
4513
|
+
this._args = args;
|
|
4514
|
+
}
|
|
4396
4515
|
|
|
4397
|
-
|
|
4398
|
-
|
|
4399
|
-
|
|
4516
|
+
fire() {
|
|
4517
|
+
var toggle = this;
|
|
4518
|
+
var _promise = new Promise(function (resolve, reject) {
|
|
4519
|
+
|
|
4520
|
+
if (typeof toggle._positive === "function" && typeof toggle._negative === "function") {
|
|
4521
|
+
if (toggle._inverse) {
|
|
4522
|
+
toggle._dispatched = (toggle._toggle) ? (toggle._negative.bind(toggle)) : (toggle._positive.bind(toggle));
|
|
4523
|
+
} else {
|
|
4524
|
+
toggle._dispatched = (toggle._toggle) ? (toggle._positive.bind(toggle)) : (toggle._negative.bind(toggle));
|
|
4525
|
+
}
|
|
4526
|
+
toggle._dispatched.call(toggle, toggle._args);
|
|
4527
|
+
resolve.call(_promise, toggle);
|
|
4400
4528
|
} else {
|
|
4401
|
-
|
|
4529
|
+
logger.debug("Toggle functions are not declared");
|
|
4530
|
+
reject.call(_promise, toggle);
|
|
4402
4531
|
}
|
|
4403
|
-
|
|
4404
|
-
|
|
4405
|
-
}
|
|
4406
|
-
logger.debug(
|
|
4407
|
-
|
|
4408
|
-
|
|
4409
|
-
}
|
|
4410
|
-
|
|
4411
|
-
|
|
4412
|
-
logger.debug(e.toString());
|
|
4413
|
-
});
|
|
4414
|
-
return _promise;
|
|
4532
|
+
}).then(function (toggle) {
|
|
4533
|
+
toggle.changeToggle();
|
|
4534
|
+
}).catch(function (e) {
|
|
4535
|
+
logger.debug(e.toString());
|
|
4536
|
+
});
|
|
4537
|
+
return _promise;
|
|
4538
|
+
}
|
|
4539
|
+
|
|
4540
|
+
|
|
4415
4541
|
}
|
|
4416
|
-
|
|
4542
|
+
|
|
4543
|
+
]);
|
|
4417
4544
|
|
|
4418
4545
|
// Set Processors
|
|
4419
4546
|
(function (_top) {
|
|
@@ -4597,8 +4724,6 @@
|
|
|
4597
4724
|
};
|
|
4598
4725
|
var _buildComponents = function () {
|
|
4599
4726
|
if (isBrowser) {
|
|
4600
|
-
logger.debug("Starting to bind routes");
|
|
4601
|
-
_top._bindroute_.call(ClassFactory("Component"));
|
|
4602
4727
|
logger.debug("Starting to building components");
|
|
4603
4728
|
global.componentsStack = document.buildComponents.call(document);
|
|
4604
4729
|
logger.debug("Initializing the service worker");
|
|
@@ -4760,15 +4885,6 @@
|
|
|
4760
4885
|
if (isBrowser) {
|
|
4761
4886
|
asyncLoad(function () {
|
|
4762
4887
|
Ready(function () {
|
|
4763
|
-
window.onpopstate = function (event) {
|
|
4764
|
-
event.stopImmediatePropagation();
|
|
4765
|
-
event.stopPropagation();
|
|
4766
|
-
if (ClassFactory("CONFIG").get("rebuildObjects", true)){
|
|
4767
|
-
global.componentsStack = document.buildComponents.call(document, true);
|
|
4768
|
-
} else {
|
|
4769
|
-
ClassFactory("Component").route();
|
|
4770
|
-
}
|
|
4771
|
-
};
|
|
4772
4888
|
|
|
4773
4889
|
/*
|
|
4774
4890
|
* scroll management custom events
|
package/VERSION
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
2.4.
|
|
1
|
+
2.4.41
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "qcobjects",
|
|
3
|
-
"version": "2.4.
|
|
3
|
+
"version": "2.4.41",
|
|
4
4
|
"description": "QCObjects is an Open-source framework that empowers full-stack developers to make micro-services and micro-frontends into an N-Tier architecture.",
|
|
5
5
|
"main": "QCObjects.js",
|
|
6
6
|
"license": "LGPL-3.0",
|