@ostendis/grapesjs-preset-ostendis-adv 1.2.2 → 1.2.3
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.
|
@@ -22446,15 +22446,21 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
22446
22446
|
});
|
|
22447
22447
|
// Scale the new range
|
|
22448
22448
|
DomComponents.addType("scale", {
|
|
22449
|
-
isComponent: function (el) {
|
|
22449
|
+
isComponent: function (el) {
|
|
22450
|
+
return (el.tagName === "DIV" &&
|
|
22451
|
+
(el.getAttribute("data-scale") === "true" ||
|
|
22452
|
+
el.classList.contains("scale")));
|
|
22453
|
+
},
|
|
22450
22454
|
model: {
|
|
22451
22455
|
defaults: {
|
|
22452
22456
|
tagName: "div",
|
|
22453
22457
|
attributes: {
|
|
22454
|
-
|
|
22458
|
+
"data-scale": "true",
|
|
22455
22459
|
"data-percent": "66",
|
|
22456
22460
|
"data-fcolor": "#3b5998",
|
|
22457
22461
|
"data-bgcolor": "#CCCCCC",
|
|
22462
|
+
"aria-label": "66 %",
|
|
22463
|
+
role: "img",
|
|
22458
22464
|
},
|
|
22459
22465
|
style: {
|
|
22460
22466
|
"box-sizing": "border-box",
|
|
@@ -22462,7 +22468,7 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
22462
22468
|
height: "20px",
|
|
22463
22469
|
"max-width": "100%",
|
|
22464
22470
|
border: "0px solid #666666",
|
|
22465
|
-
background: "linear-gradient(to right
|
|
22471
|
+
background: "linear-gradient(to right, #3b5998 66%, #CCCCCC 66%)",
|
|
22466
22472
|
},
|
|
22467
22473
|
traits: [
|
|
22468
22474
|
{
|
|
@@ -22491,22 +22497,38 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
22491
22497
|
],
|
|
22492
22498
|
},
|
|
22493
22499
|
init: function () {
|
|
22494
|
-
var
|
|
22495
|
-
this.
|
|
22496
|
-
this.
|
|
22497
|
-
|
|
22500
|
+
var _a;
|
|
22501
|
+
var attr = this.getAttributes();
|
|
22502
|
+
var el = (_a = this.view) === null || _a === void 0 ? void 0 : _a.el;
|
|
22503
|
+
var p = parseInt(attr["data-percent"]);
|
|
22504
|
+
var f = attr["data-fcolor"];
|
|
22505
|
+
var b = attr["data-bgcolor"];
|
|
22506
|
+
if (isNaN(p))
|
|
22507
|
+
p = 66;
|
|
22508
|
+
if (!f)
|
|
22509
|
+
f = "#3b5998";
|
|
22510
|
+
if (!b)
|
|
22511
|
+
b = "#CCCCCC";
|
|
22512
|
+
this.set("percent", Math.max(0, Math.min(100, p)));
|
|
22513
|
+
this.set("bgcolor", b);
|
|
22514
|
+
this.set("fcolor", f);
|
|
22498
22515
|
this.on("change:percent", this.updateScale);
|
|
22499
22516
|
this.on("change:bgcolor", this.updateScale);
|
|
22500
22517
|
this.on("change:fcolor", this.updateScale);
|
|
22501
22518
|
},
|
|
22502
22519
|
updateScale: function () {
|
|
22503
|
-
var p = this.get("percent");
|
|
22504
|
-
var
|
|
22505
|
-
var
|
|
22520
|
+
var p = parseInt(this.get("percent"));
|
|
22521
|
+
var f = this.get("fcolor") || "#3b5998";
|
|
22522
|
+
var b = this.get("bgcolor") || "#CCCCCC";
|
|
22523
|
+
if (isNaN(p))
|
|
22524
|
+
p = 0;
|
|
22525
|
+
p = Math.max(0, Math.min(100, p));
|
|
22506
22526
|
this.set("attributes", {
|
|
22527
|
+
"data-scale": "true",
|
|
22507
22528
|
"data-percent": p,
|
|
22508
|
-
"data-bgcolor": b,
|
|
22509
22529
|
"data-fcolor": f,
|
|
22530
|
+
"data-bgcolor": b,
|
|
22531
|
+
"aria-label": "".concat(p, " %"),
|
|
22510
22532
|
});
|
|
22511
22533
|
this.addStyle({
|
|
22512
22534
|
background: "linear-gradient(to right, ".concat(f, " ").concat(p, "%, ").concat(b, " ").concat(p, "%)"),
|