Edit File by line

mid = self._stylesData[id].mid;

[9500] Fix | Delete

self.select.update(mid, self.getStyleVal(mid), self);

[9501] Fix | Delete

for (let rangeField in ranges) {

[9502] Fix | Delete

let type = rangeField === 'hue' ? 'angle' : 'range',

[9503] Fix | Delete

fid = id + '_' + rangeField;

[9504] Fix | Delete

self[type].update(fid, self.getStyleVal(fid), self);

[9505] Fix | Delete

}

[9506] Fix | Delete

[9507] Fix | Delete

render(data, self) {

[9508] Fix | Delete

const sel = data.selector,

[9509] Fix | Delete

ranges = this._getFields(),

[9510] Fix | Delete

f = createDocumentFragment(),

[9511] Fix | Delete

ul = createElement('ul', 'tb_seperate_items tb_filters_fields'),

[9512] Fix | Delete

mode = self.create([{

[9513] Fix | Delete

id: data.mid,

[9514] Fix | Delete

type: 'select',

[9515] Fix | Delete

label: 'b_m',

[9516] Fix | Delete

prop: 'mix-blend-mode',

[9517] Fix | Delete

selector: sel,

[9518] Fix | Delete

blend: true

[9519] Fix | Delete

}]);

[9520] Fix | Delete

for (let rangeField in ranges) {

[9521] Fix | Delete

let rField = ranges[rangeField],

[9522] Fix | Delete

li = createElement('li');

[9523] Fix | Delete

rField.id = data.id + '_' + rangeField;

[9524] Fix | Delete

rField.class = 'tb_filters_field';

[9525] Fix | Delete

rField.type = rangeField === 'hue' ? 'angle' : 'range';

[9526] Fix | Delete

rField.selector = sel;

[9527] Fix | Delete

li.appendChild(self.create([rField]));

[9528] Fix | Delete

ul.appendChild(li);

[9529] Fix | Delete

}

[9530] Fix | Delete

f.append(mode, ul);

[9531] Fix | Delete

return f;

[9532] Fix | Delete

}

[9533] Fix | Delete

[9534] Fix | Delete

help(text) {

[9535] Fix | Delete

const help = createElement('','tb_help tf_rel'),

[9536] Fix | Delete

helpContent = createElement('', 'tb_help_content tf_hide tf_box'),

[9537] Fix | Delete

icon = createElement('i',{class:'icon',tabindex:-1});

[9538] Fix | Delete

helpContent.innerHTML = i18n[text] || text;

[9539] Fix | Delete

icon.appendChild(api.Helper.getIcon('ti-help'));

[9540] Fix | Delete

help.append(icon, helpContent);

[9541] Fix | Delete

return help;

[9542] Fix | Delete

[9543] Fix | Delete

hint(text) {

[9544] Fix | Delete

return createElement('span', 'tb_tooltip_up',i18n[text] || text);

[9545] Fix | Delete

[9546] Fix | Delete

description(text) {

[9547] Fix | Delete

const d = createElement('small');

[9548] Fix | Delete

d.innerHTML = i18n[text] || text;

[9549] Fix | Delete

return d;

[9550] Fix | Delete

[9551] Fix | Delete

after(data) {

[9552] Fix | Delete

const afterElem = createElement('span','tb_input_after',i18n[data.after] || data.after);

[9553] Fix | Delete

if ((data.label === undefined || data.label === '')

[9554] Fix | Delete

&& (data.help !== undefined && data.help !== '')) {

[9555] Fix | Delete

afterElem.appendChild(this.help(data.help));

[9556] Fix | Delete

}

[9557] Fix | Delete

return afterElem;

[9558] Fix | Delete

[9559] Fix | Delete

toggle_switch: {

[9560] Fix | Delete

update(id, v, self) {

[9561] Fix | Delete

self.checkbox.update(id, self.getStyleVal(id), self);

[9562] Fix | Delete

[9563] Fix | Delete

_controlChange(el, args) {

[9564] Fix | Delete

el.tfOn('change', function () {

[9565] Fix | Delete

this.value = this.checked === true ? args.on.name : (args.off?.name || '');

[9566] Fix | Delete

if ('visibility' === ThemifyConstructor.clicked && null !== api.activeModel) {

[9567] Fix | Delete

api.activeModel.visibilityLabel();

[9568] Fix | Delete

}

[9569] Fix | Delete

}, {passive: true});

[9570] Fix | Delete

[9571] Fix | Delete

render(data, self) {

[9572] Fix | Delete

let clone = api.Helper.cloneObject(data),

[9573] Fix | Delete

orig = {},

[9574] Fix | Delete

label = createElement('','switch_label'),

[9575] Fix | Delete

state = 'off',

[9576] Fix | Delete

v = self.getStyleVal(data.id);

[9577] Fix | Delete

clone.control = false;

[9578] Fix | Delete

if (clone.class === undefined) {

[9579] Fix | Delete

clone.class = 'toggle_switch';

[9580] Fix | Delete

} else {

[9581] Fix | Delete

clone.class += ' toggle_switch';

[9582] Fix | Delete

}

[9583] Fix | Delete

let options = clone.options;

[9584] Fix | Delete

if (options === undefined || options === 'simple') {

[9585] Fix | Delete

if (options === 'simple') {

[9586] Fix | Delete

options = {

[9587] Fix | Delete

on: {

[9588] Fix | Delete

[9589] Fix | Delete

value: 'y'

[9590] Fix | Delete

[9591] Fix | Delete

off: {

[9592] Fix | Delete

[9593] Fix | Delete

value: 'no'

[9594] Fix | Delete

}

[9595] Fix | Delete

};

[9596] Fix | Delete

} else {

[9597] Fix | Delete

options = {

[9598] Fix | Delete

on: {

[9599] Fix | Delete

[9600] Fix | Delete

value: 's'

[9601] Fix | Delete

[9602] Fix | Delete

off: {

[9603] Fix | Delete

[9604] Fix | Delete

value: 'hi'

[9605] Fix | Delete

}

[9606] Fix | Delete

};

[9607] Fix | Delete

clone.default??= 'on';

[9608] Fix | Delete

}

[9609] Fix | Delete

}

[9610] Fix | Delete

if (v === undefined) {

[9611] Fix | Delete

if (clone.default === 'on') {

[9612] Fix | Delete

state = 'on';

[9613] Fix | Delete

}

[9614] Fix | Delete

v = state === 'on' ? (options.on.name ?? '') : (options.off?.name ?? '');

[9615] Fix | Delete

} else {

[9616] Fix | Delete

if (v === false) {

[9617] Fix | Delete

v = '';

[9618] Fix | Delete

}

[9619] Fix | Delete

state = options.on.name === v ? 'on' : 'off';

[9620] Fix | Delete

}

[9621] Fix | Delete

for (let i in options) {

[9622] Fix | Delete

let val=options[i].value;

[9623] Fix | Delete

if (clone.after === undefined && val !== undefined) {

[9624] Fix | Delete

label.dataset[i] = i18n[val]?? val;

[9625] Fix | Delete

}

[9626] Fix | Delete

orig[i] = options[i];

[9627] Fix | Delete

}

[9628] Fix | Delete

const k = Object.keys(options)[0];

[9629] Fix | Delete

delete clone.binding;

[9630] Fix | Delete

delete options[k].value;

[9631] Fix | Delete

delete clone.default;

[9632] Fix | Delete

clone.options = [options[k]];

[9633] Fix | Delete

clone.wrap_checkbox??= '';

[9634] Fix | Delete

clone.wrap_checkbox += ' tb_switcher';

[9635] Fix | Delete

const checkBox = self.checkboxGenerate('checkbox', clone),

[9636] Fix | Delete

sw = checkBox.querySelector('.toggle_switch');

[9637] Fix | Delete

sw.value = v;

[9638] Fix | Delete

sw.checked = state === 'on';

[9639] Fix | Delete

this._controlChange(sw, orig);

[9640] Fix | Delete

sw.parentNode.appendChild(label);

[9641] Fix | Delete

self._initControl(sw, data);

[9642] Fix | Delete

return checkBox;

[9643] Fix | Delete

}

[9644] Fix | Delete

[9645] Fix | Delete

height: {

[9646] Fix | Delete

update(id, v, self) {

[9647] Fix | Delete

self.width.update(id, v, self);

[9648] Fix | Delete

[9649] Fix | Delete

render(data, self) {

[9650] Fix | Delete

let units = {

[9651] Fix | Delete

px: {

[9652] Fix | Delete

max: 3500

[9653] Fix | Delete

[9654] Fix | Delete

vh: '',

[9655] Fix | Delete

'%': '',

[9656] Fix | Delete

em: {

[9657] Fix | Delete

max: 200

[9658] Fix | Delete

}

[9659] Fix | Delete

[9660] Fix | Delete

{minid,maxid} = data;

[9661] Fix | Delete

/* explicit FALSE means to hide the option */

[9662] Fix | Delete

if ( ! minid && false !== minid ) {

[9663] Fix | Delete

minid = 'mi_h';

[9664] Fix | Delete

}

[9665] Fix | Delete

if ( ! maxid && false !== maxid ) {

[9666] Fix | Delete

maxid = 'mx_h';

[9667] Fix | Delete

}

[9668] Fix | Delete

[9669] Fix | Delete

return self.width.render(data, self, minid, maxid, units);

[9670] Fix | Delete

}

[9671] Fix | Delete

[9672] Fix | Delete

width: {

[9673] Fix | Delete

update(id, v, self) {

[9674] Fix | Delete

self.range.update(id, v, self);

[9675] Fix | Delete

[9676] Fix | Delete

render(data, self, minId, maxId, units) {

[9677] Fix | Delete

if (!units) {

[9678] Fix | Delete

units = {

[9679] Fix | Delete

px: {

[9680] Fix | Delete

max: 2000

[9681] Fix | Delete

[9682] Fix | Delete

'%': '',

[9683] Fix | Delete

em: {

[9684] Fix | Delete

max: 20

[9685] Fix | Delete

}

[9686] Fix | Delete

};

[9687] Fix | Delete

}

[9688] Fix | Delete

const id = data.id,

[9689] Fix | Delete

prop = data.prop,

[9690] Fix | Delete

sel = data.selector,

[9691] Fix | Delete

wrapClass = 'tb_wrap_' + prop + '_field';

[9692] Fix | Delete

[9693] Fix | Delete

if (prop === 'width') {

[9694] Fix | Delete

if (!minId) {

[9695] Fix | Delete

minId = 'min_' + id;

[9696] Fix | Delete

}

[9697] Fix | Delete

if (!maxId) {

[9698] Fix | Delete

maxId = 'max_' + id;

[9699] Fix | Delete

}

[9700] Fix | Delete

}

[9701] Fix | Delete

[9702] Fix | Delete

const opt =

[9703] Fix | Delete

[{

[9704] Fix | Delete

label: prop === 'width' ? 'w' : 'ht',

[9705] Fix | Delete

id: id,

[9706] Fix | Delete

type: 'range',

[9707] Fix | Delete

prop: prop,

[9708] Fix | Delete

selector: sel,

[9709] Fix | Delete

wrap_class: wrapClass,

[9710] Fix | Delete

units: units

[9711] Fix | Delete

[9712] Fix | Delete

{

[9713] Fix | Delete

id: id + '_auto_' + prop,

[9714] Fix | Delete

origId: id,

[9715] Fix | Delete

type: 'checkbox',

[9716] Fix | Delete

label: '',

[9717] Fix | Delete

prop: prop,

[9718] Fix | Delete

selector: sel,

[9719] Fix | Delete

options: [

[9720] Fix | Delete

{value: prop === 'width' ? 'a_wd' : 'a_ht', name: 'auto'}

[9721] Fix | Delete

[9722] Fix | Delete

binding: {

[9723] Fix | Delete

checked: {hide: wrapClass},

[9724] Fix | Delete

not_checked: {show: wrapClass}

[9725] Fix | Delete

}

[9726] Fix | Delete

}

[9727] Fix | Delete

];

[9728] Fix | Delete

if ( minId !== false ) {

[9729] Fix | Delete

opt.push( {

[9730] Fix | Delete

label: prop === 'width' ? 'mi_wd' : 'm_ht',

[9731] Fix | Delete

id: minId,

[9732] Fix | Delete

type: 'range',

[9733] Fix | Delete

prop: 'min-' + prop,

[9734] Fix | Delete

selector: sel,

[9735] Fix | Delete

units: units

[9736] Fix | Delete

} );

[9737] Fix | Delete

}

[9738] Fix | Delete

if ( maxId !== false ) {

[9739] Fix | Delete

opt.push( {

[9740] Fix | Delete

label: prop === 'width' ? 'ma_wd' : 'mx_ht',

[9741] Fix | Delete

id: maxId,

[9742] Fix | Delete

type: 'range',

[9743] Fix | Delete

prop: 'max-' + prop,

[9744] Fix | Delete

selector: sel,

[9745] Fix | Delete

units: units

[9746] Fix | Delete

} );

[9747] Fix | Delete

}

[9748] Fix | Delete

return self.create(opt);

[9749] Fix | Delete

}

[9750] Fix | Delete

[9751] Fix | Delete

aspectRatio: {

[9752] Fix | Delete

update(id, v, self) {

[9753] Fix | Delete

const range = v.split('/'),

[9754] Fix | Delete

from = range[0] || '',

[9755] Fix | Delete

to = range[1] || '',

[9756] Fix | Delete

inputs = self.getEl(id).closest('.tb_aspect_ratio').tfClass('tb_range');

[9757] Fix | Delete

self.hidden.update(id, v, self);

[9758] Fix | Delete

inputs[0].value = inputs[0].classList.contains('tb_aspect_to') ? to : from;

[9759] Fix | Delete

inputs[1].value = inputs[1].classList.contains('tb_aspect_to') ? to : from;

[9760] Fix | Delete

[9761] Fix | Delete

render(data, self) {

[9762] Fix | Delete

const v = self.getStyleVal(data.id) || '',

[9763] Fix | Delete

range = v.split('/'),

[9764] Fix | Delete

opt = {

[9765] Fix | Delete

type: 'multi',

[9766] Fix | Delete

label: 'asp',

[9767] Fix | Delete

wrap_class: 'tb_aspect_ratio',

[9768] Fix | Delete

options: [

[9769] Fix | Delete

{

[9770] Fix | Delete

type: 'hidden',

[9771] Fix | Delete

id: data.id,

[9772] Fix | Delete

prop: data.prop,

[9773] Fix | Delete

value: v || '',

[9774] Fix | Delete

selector: data.selector

[9775] Fix | Delete

[9776] Fix | Delete

{

[9777] Fix | Delete

type: 'range',

[9778] Fix | Delete

value: range[0] || '',

[9779] Fix | Delete

id: '',

[9780] Fix | Delete

min: 1

[9781] Fix | Delete

[9782] Fix | Delete

{

[9783] Fix | Delete

type: 'message',

[9784] Fix | Delete

comment: '/'

[9785] Fix | Delete

[9786] Fix | Delete

{

[9787] Fix | Delete

id: '',

[9788] Fix | Delete

[9789] Fix | Delete

type: 'range',

[9790] Fix | Delete

value: range[1] || '',

[9791] Fix | Delete

min: 1

[9792] Fix | Delete

}

[9793] Fix | Delete

]

[9794] Fix | Delete

[9795] Fix | Delete

fields = self.create([opt]),

[9796] Fix | Delete

hidden = fields.querySelector('#' + data.id);

[9797] Fix | Delete

for (let inputs = fields.querySelectorAll('.tb_lb_option'), i = inputs.length - 1; i > -1; --i) {

[9798] Fix | Delete

if (inputs[i] !== hidden) {

[9799] Fix | Delete

inputs[i].tfOn('keyup', e => {

[9800] Fix | Delete

const el = e.currentTarget;

[9801] Fix | Delete

requestAnimationFrame(() => {

[9802] Fix | Delete

let oldV = hidden.value,

[9803] Fix | Delete

index = el.classList.contains('tb_aspect_to') ? 1 : 0,

[9804] Fix | Delete

nextIndex = index === 1 ? 0 : 1;

[9805] Fix | Delete

oldV = oldV.split('/');

[9806] Fix | Delete

oldV[index] = el.value;

[9807] Fix | Delete

if (!oldV[nextIndex]) {

[9808] Fix | Delete

oldV[nextIndex] = 1;

[9809] Fix | Delete

}

[9810] Fix | Delete

hidden.value = oldV.join('/');

[9811] Fix | Delete

Themify.triggerEvent(hidden, 'change');

[9812] Fix | Delete

});

[9813] Fix | Delete

}, {passive: true});

[9814] Fix | Delete

}

[9815] Fix | Delete

}

[9816] Fix | Delete

return fields;

[9817] Fix | Delete

}

[9818] Fix | Delete

[9819] Fix | Delete

zIndex: {

[9820] Fix | Delete

update(id, v, self) {

[9821] Fix | Delete

self.range.update(id, v, self);

[9822] Fix | Delete

[9823] Fix | Delete

render(data, self) {

[9824] Fix | Delete

return self.create([

[9825] Fix | Delete

{

[9826] Fix | Delete

id: data.id,

[9827] Fix | Delete

label: 'zi',

[9828] Fix | Delete

type: 'range',

[9829] Fix | Delete

prop: data.prop,

[9830] Fix | Delete

selector: data.selector,

[9831] Fix | Delete

min: -99999,

[9832] Fix | Delete

max: 99999,

[9833] Fix | Delete

help: 'zhelp'

[9834] Fix | Delete

}

[9835] Fix | Delete

]);

[9836] Fix | Delete

}

[9837] Fix | Delete

[9838] Fix | Delete

fontSize: {

[9839] Fix | Delete

update(id, v, self) {

[9840] Fix | Delete

self.range.update(id, v, self);

[9841] Fix | Delete

[9842] Fix | Delete

render(data, self, units) {

[9843] Fix | Delete

if (!units) {

[9844] Fix | Delete

units = data.units || {

[9845] Fix | Delete

px: {

[9846] Fix | Delete

min: 1,

[9847] Fix | Delete

max: 900

[9848] Fix | Delete

[9849] Fix | Delete

em: {

[9850] Fix | Delete

min: .1,

[9851] Fix | Delete

max: 50

[9852] Fix | Delete

[9853] Fix | Delete

'%': {

[9854] Fix | Delete

min: 1,

[9855] Fix | Delete

max: 4000

[9856] Fix | Delete

[9857] Fix | Delete

vw: {

[9858] Fix | Delete

min: 1,

[9859] Fix | Delete

max: 100

[9860] Fix | Delete

[9861] Fix | Delete

rem: {

[9862] Fix | Delete

min: .1,

[9863] Fix | Delete

max: 50

[9864] Fix | Delete

}

[9865] Fix | Delete

};

[9866] Fix | Delete

}

[9867] Fix | Delete

const res = self.create([{

[9868] Fix | Delete

type: 'range',

[9869] Fix | Delete

id: data.id,

[9870] Fix | Delete

selector: data.selector,

[9871] Fix | Delete

prop: data.prop,

[9872] Fix | Delete

wrap_class: data.wrap_class,

[9873] Fix | Delete

[9874] Fix | Delete

help: data.help,

[9875] Fix | Delete

description: data.description,

[9876] Fix | Delete

after: data.after,

[9877] Fix | Delete

units: units

[9878] Fix | Delete

}]);

[9879] Fix | Delete

if (data.prop === 'font-size') {

[9880] Fix | Delete

data.label??= 'f_s';

[9881] Fix | Delete

}

[9882] Fix | Delete

return res;

[9883] Fix | Delete

}

[9884] Fix | Delete

[9885] Fix | Delete

lineHeight: {

[9886] Fix | Delete

update(id, v, self) {

[9887] Fix | Delete

self.range.update(id, v, self);

[9888] Fix | Delete

[9889] Fix | Delete

render(data, self) {

[9890] Fix | Delete

const units = data.units || {

[9891] Fix | Delete

px: {

[9892] Fix | Delete

min: -400,

[9893] Fix | Delete

max: 400

[9894] Fix | Delete

[9895] Fix | Delete

em: {

[9896] Fix | Delete

min: .1,

[9897] Fix | Delete

max: 50

[9898] Fix | Delete

[9899] Fix | Delete

'%': {

[9900] Fix | Delete

min: 1,

[9901] Fix | Delete

max: 4000

[9902] Fix | Delete

[9903] Fix | Delete

vw: {

[9904] Fix | Delete

min: 1,

[9905] Fix | Delete

max: 100

[9906] Fix | Delete

[9907] Fix | Delete

rem: {

[9908] Fix | Delete

min: .1,

[9909] Fix | Delete

max: 50

[9910] Fix | Delete

}

[9911] Fix | Delete

[9912] Fix | Delete

res = self.fontSize.render(data, self, units);

[9913] Fix | Delete

data.label??= 'l_h';

[9914] Fix | Delete

return res;

[9915] Fix | Delete

}

[9916] Fix | Delete

[9917] Fix | Delete

letterSpace: {

[9918] Fix | Delete

update(id, v, self) {

[9919] Fix | Delete

self.range.update(id, v, self);

[9920] Fix | Delete

[9921] Fix | Delete

render(data, self) {

[9922] Fix | Delete

const units = data.units || {

[9923] Fix | Delete

px: {

[9924] Fix | Delete

min: -50,

[9925] Fix | Delete

max: 500

[9926] Fix | Delete

[9927] Fix | Delete

em: {

[9928] Fix | Delete

min: -3,

[9929] Fix | Delete

max: 50

[9930] Fix | Delete

[9931] Fix | Delete

vw: {

[9932] Fix | Delete

min: 1,

[9933] Fix | Delete

max: 100

[9934] Fix | Delete

[9935] Fix | Delete

rem: {

[9936] Fix | Delete

min: .1,

[9937] Fix | Delete

max: 50

[9938] Fix | Delete

}

[9939] Fix | Delete

[9940] Fix | Delete

res = self.fontSize.render(data, self, units);

[9941] Fix | Delete

data.label??= 'l_s';

[9942] Fix | Delete

return res;

[9943] Fix | Delete

}

[9944] Fix | Delete

[9945] Fix | Delete

fontStyle: {

[9946] Fix | Delete

update(id, v, self) {

[9947] Fix | Delete

const id2 = self._stylesData[id].id2;

[9948] Fix | Delete

self.radio.update(id, v, self);

[9949] Fix | Delete

self.radio.update(id2, self.getStyleVal(id2), self);

[9950] Fix | Delete

[9951] Fix | Delete

render(data, self) {

[9952] Fix | Delete

const selector = data.selector,

[9953] Fix | Delete

res = self.create([{

[9954] Fix | Delete

type: 'multi',

[9955] Fix | Delete

wrap_class: 'tb_multi_fonts',

[9956] Fix | Delete

options: [

[9957] Fix | Delete

{

[9958] Fix | Delete

id: data.id + '_regular',

[9959] Fix | Delete

type: 'icon_radio',

[9960] Fix | Delete

options: self.getOptions('font_style'),

[9961] Fix | Delete

prop: data.prop,

[9962] Fix | Delete

selector: selector

[9963] Fix | Delete

[9964] Fix | Delete

{

[9965] Fix | Delete

id: data.id2,

[9966] Fix | Delete

type: 'icon_radio',

[9967] Fix | Delete

options: self.getOptions('font_weight'),

[9968] Fix | Delete

prop: 'font-weight',

[9969] Fix | Delete

selector: selector

[9970] Fix | Delete

}

[9971] Fix | Delete

]

[9972] Fix | Delete

}]);

[9973] Fix | Delete

data.label??= 'f_st';

[9974] Fix | Delete

return res;

[9975] Fix | Delete

}

[9976] Fix | Delete

[9977] Fix | Delete

position: {

[9978] Fix | Delete

update(id, v, self) {

[9979] Fix | Delete

self.select.update(id, v, self);

[9980] Fix | Delete

for (let sides = ['top', 'right', 'bottom', 'left'], i = sides.length - 1; i > -1; --i) {

[9981] Fix | Delete

let sid = id + '_' + sides[i],

[9982] Fix | Delete

autoId = sid + '_auto';

[9983] Fix | Delete

self.range.update(sid, self.getStyleVal(sid), self);

[9984] Fix | Delete

self.checkbox.update(autoId, self.getStyleVal(autoId), self);

[9985] Fix | Delete

}

[9986] Fix | Delete

[9987] Fix | Delete

render(data, self) {

[9988] Fix | Delete

const {id,selector,prop} = data,

[9989] Fix | Delete

cl = 'tb_css_pos',

[9990] Fix | Delete

groupOptions = [

[9991] Fix | Delete

{

[9992] Fix | Delete

type: 'select',

[9993] Fix | Delete

prop: prop,

[9994] Fix | Delete

id: id,

[9995] Fix | Delete

selector: selector,

[9996] Fix | Delete

[9997] Fix | Delete

options: {

[9998] Fix | Delete

'': '',

[9999] Fix | Delete

1 ...17 18 192021 22