Again replaced some jQuery to native and cleaned up normalize.css without IE

This commit is contained in:
djmaze 2020-08-31 12:45:43 +02:00
parent 4977494f6b
commit 645831368d
13 changed files with 649 additions and 318 deletions

View file

@ -1,4 +1,3 @@
import { pInt } from 'Common/Utils';
import { SaveSettingsStep } from 'Common/Enums';
import { AbstractComponent, componentExportHelper } from 'Component/Abstract';
@ -9,68 +8,32 @@ class SaveTriggerComponent extends AbstractComponent {
constructor(params) {
super();
this.element = jQuery(params.element) || null;
const el = params.element;
this.element = el || null;
this.value = params.value && params.value.subscribe ? params.value : null;
if (this.element) {
if (el) {
if (this.value) {
this.element.css('display', 'inline-block');
el.style.display = 'inline-block';
if (params.verticalAlign) {
this.element.css('vertical-align', params.verticalAlign);
el.style.verticalAlign = params.verticalAlign;
}
this.setState(this.value());
this.disposable.push(this.value.subscribe(this.setState, this));
} else {
this.element.hide();
el.style.display = 'none';
}
}
}
setState(value) {
switch (pInt(value)) {
case SaveSettingsStep.TrueResult:
this.element
.find('.animated,.error')
.hide()
.removeClass('visible')
.end()
.find('.success')
.show()
.addClass('visible');
break;
case SaveSettingsStep.FalseResult:
this.element
.find('.animated,.success')
.hide()
.removeClass('visible')
.end()
.find('.error')
.show()
.addClass('visible');
break;
case SaveSettingsStep.Animate:
this.element
.find('.error,.success')
.hide()
.removeClass('visible')
.end()
.find('.animated')
.show()
.addClass('visible');
break;
case SaveSettingsStep.Idle:
default:
this.element
.find('.animated')
.hide()
.end()
.find('.error,.success')
.removeClass('visible');
break;
}
value = parseInt(value,10);
this.element.querySelector('.animated').hidden = value !== SaveSettingsStep.Animate;
this.element.querySelector('.success').hidden = value !== SaveSettingsStep.TrueResult;
this.element.querySelector('.error').hidden = value !== SaveSettingsStep.FalseResult;
}
}

View file

@ -10,24 +10,19 @@ class ScriptComponent extends AbstractComponent {
if (
params.component &&
params.component.templateNodes &&
params.element &&
params.element[0] &&
params.element[0].outerHTML
params.element
) {
let script = params.element[0].outerHTML;
script = !script ? '' : script.replace(/<x-script/i, '<script').replace(/<b><\/b><\/x-script>/i, '</script>');
let el = params.element, script = el.outerHTML;
script = script ? script.replace(/<x-script/i, '<script').replace(/<b><\/b><\/x-script>/i, '</script>') : '';
if (script) {
params.element.text('');
params.element.replaceWith(
jQuery(script).text(
params.component.templateNodes[0] && params.component.templateNodes[0].nodeValue
? params.component.templateNodes[0].nodeValue
: ''
)
const koNodes = params.component.templateNodes[0];
el.textContent = '';
el.replaceWith(
Element.fromHTML(script).textContent = koNodes && koNodes.nodeValue ? koNodes.nodeValue : ''
);
} else {
params.element.remove();
el.remove();
}
}
}

107
dev/External/ko.js vendored
View file

@ -341,85 +341,30 @@ ko.bindingHandlers.droppable = {
ko.bindingHandlers.saveTrigger = {
init: (element) => {
const $el = $(element);
element.saveTriggerType = element.matches('input[type=text],input[type=email],input[type=password],select,textarea')
? 'input' : 'custom';
$el.data(
'save-trigger-type',
element.matches('input[type=text],input[type=email],input[type=password],select,textarea') ? 'input' : 'custom'
);
if ('custom' === $el.data('save-trigger-type')) {
$el
.append(
'&nbsp;&nbsp;' +
'<i class="icon-spinner animated"></i>' +
'<i class="icon-remove error"></i>' +
'<i class="icon-ok success"></i>'
)
.addClass('settings-saved-trigger');
if ('custom' === element.saveTriggerType) {
element.append(
'&nbsp;&nbsp;',
Element.fromHTML('<i class="icon-spinner animated"></i>'),
Element.fromHTML('<i class="icon-remove error"></i>'),
Element.fromHTML('<i class="icon-ok success"></i>')
);
element.classList.add('settings-saved-trigger');
} else {
$el.addClass('settings-saved-trigger-input');
element.classList.add('settings-saved-trigger-input');
}
},
update: (element, fValueAccessor) => {
const value = ko.unwrap(fValueAccessor()),
$el = $(element);
if ('custom' === $el.data('save-trigger-type')) {
switch (value.toString()) {
case '1':
$el
.find('.animated,.error')
.hide()
.removeClass('visible')
.end()
.find('.success')
.show()
.addClass('visible');
break;
case '0':
$el
.find('.animated,.success')
.hide()
.removeClass('visible')
.end()
.find('.error')
.show()
.addClass('visible');
break;
case '-2':
$el
.find('.error,.success')
.hide()
.removeClass('visible')
.end()
.find('.animated')
.show()
.addClass('visible');
break;
default:
$el
.find('.animated')
.hide()
.end()
.find('.error,.success')
.removeClass('visible');
break;
}
} else {
switch (value.toString()) {
case '1':
$el.addClass('success').removeClass('error');
break;
case '0':
$el.addClass('error').removeClass('success');
break;
case '-2':
break;
default:
$el.removeClass('error success');
break;
}
const value = parseInt(ko.unwrap(fValueAccessor()),10);
if ('custom' === element.saveTriggerType) {
element.querySelector('.animated').hidden = value !== SaveSettingsStep.Animate;
element.querySelector('.success').hidden = value !== SaveSettingsStep.TrueResult;
element.querySelector('.error').hidden = value !== SaveSettingsStep.FalseResult;
} else if (value !== SaveSettingsStep.Animate) {
element.classList.toggle('success', value === SaveSettingsStep.TrueResult);
element.classList.toggle('error', value === SaveSettingsStep.FalseResult);
}
}
};
@ -457,7 +402,7 @@ ko.bindingHandlers.emailsTags = {
item => (item.toLine ? [item.toLine(false), item] : [item, null])
),
change: event => {
$el.data('EmailsTagsValue', event.target.value);
element.EmailsTagsValue = event.target.value;
fValue(event.target.value);
}
});
@ -469,14 +414,12 @@ ko.bindingHandlers.emailsTags = {
}
},
update: (element, fValueAccessor) => {
const $oEl = $(element),
fValue = fValueAccessor(),
value = ko.unwrap(fValue);
const value = ko.unwrap(fValueAccessor());
if ($oEl.data('EmailsTagsValue') !== value) {
$oEl.val(value);
$oEl.data('EmailsTagsValue', value);
$oEl.inputosaurus('refresh');
if (element.EmailsTagsValue !== value) {
element.value = value;
element.EmailsTagsValue = value;
$(element).inputosaurus('refresh');
}
}
};

View file

@ -129,28 +129,34 @@
.settings-saved-trigger {
display: inline-block;
height: 17px;
line-height: 17px;
font-size: 16px;
position: relative;
.animated {
color: green;
color: #888;
}
.success {
color: green;
transition: opacity 0.5s linear;
opacity: 0;
color: #080;
}
.error {
color: red;
transition: opacity 0.5s linear;
opacity: 0;
color: #F00;
}
.visible {
i {
transition: opacity 2s linear;
position: absolute;
}
i:not([hidden]) {
opacity: 1;
}
i[hidden] {
opacity: 0;
}
}
.settings-saved-trigger-input {