news/plugins/admin/themes/grav/app/whitelabel/presets.js

170 lines
4.6 KiB
JavaScript
Raw Normal View History

import $ from 'jquery';
import Forms from '../forms';
let body = $('body');
let fields = [];
const FormState = Forms.FormState.Instance;
const setField = (field, value) => {
let name = field.prop('name');
let tag = field.prop('tagName').toLowerCase();
let type = field.prop('type');
fields.push(name);
switch (tag) {
case 'select':
field.val(value);
field.data('selectize').setValue(value);
field.trigger('change');
break;
case 'input':
if (type === 'radio') {
let strValue = value ? '1' : '0';
field.filter((index, radio) => $(radio).val() === strValue).prop('checked', true);
break;
}
if (type === 'checkbox') {
field.prop('checked', value);
break;
}
field.val(value);
field.trigger('keyup');
}
};
body.on('click', '[data-preset-values]', (event) => {
let target = $(event.currentTarget);
let data = target.data('preset-values');
Object.keys(data).forEach((section) => {
if (typeof data[section] === 'string') {
return;
}
Object.keys(data[section]).forEach((key) => {
let field = $(`[name="data[whitelabel][color_scheme][${section}][${key}]"], [name="data[${section}][${key}]"]`);
let value = data[section][key];
setField(field, value);
});
});
});
body.on('click', '[data-reset-scss]', (event) => {
event && event.preventDefault();
let element = $(event.currentTarget);
let links = $('link[id^=admin-pro-preview-]');
element.remove();
links.remove();
fields.forEach((field) => {
let value = FormState.loadState.get(field);
setField($(`[name="${field}"]`), value);
});
fields = [];
});
// Horizontal Scroll Functionality
$.fn.hscrollarrows = function() {
return this.each(function() {
let navNext = $('<a class="nav-next hide"></a>');
let navPrev = $('<a class="nav-prev hide"></a>');
let scrollTime = null;
let resizeTime = null;
let scrolling = false;
let elm_w = 0;
let elem_data_w = 0;
let max_scroll = 0;
let inc_scroll = 0;
let calcData = function() {
elm_w = elem.width();
elem_data_w = elem_data.get(0).scrollWidth;
max_scroll = elem_data_w - elm_w;
inc_scroll = elm_w * 0.3; // 20%
};
let revalidate = function() {
calcData();
stateNavs();
};
let run = function() {
calcData();
setupNavs();
};
let setupNavs = function() {
elem.parent().prepend(navNext);
elem.parent().prepend(navPrev);
navNext.on('click', next);
navPrev.on('click', prev);
stateNavs();
$(elem).scroll(function() {
if (!scrolling) {
clearTimeout(scrollTime);
scrollTime = setTimeout(function() {
stateNavs();
}, 250);
}
});
$(window).resize(function() {
clearTimeout(resizeTime);
resizeTime = setTimeout(function() {
revalidate();
}, 250);
});
};
let stateNavs = function() {
let current_scroll = elem.scrollLeft();
if (current_scroll < max_scroll) {
navNext.removeClass('hide');
} else {
navNext.addClass('hide');
}
if (current_scroll > 0) {
navPrev.removeClass('hide');
} else {
navPrev.addClass('hide');
}
scrolling = false;
};
let next = function() {
let current_scroll = elem.scrollLeft();
if (current_scroll < max_scroll) {
scrolling = true;
elem.stop().animate({
scrollLeft: (current_scroll + inc_scroll)
}, stateNavs);
}
};
let prev = function() {
let current_scroll = elem.scrollLeft();
if (current_scroll > 0) {
scrolling = true;
elem.stop().animate({
scrollLeft: (current_scroll - inc_scroll)
}, stateNavs);
}
};
let elem = $(this);
let elem_data = $(':first-child', elem);
run();
});
};
$(document).ready(() => {
$('.jquery-horizontal-scroll').hscrollarrows();
});