mirror of
https://github.com/dataarts/dat.gui.git
synced 2024-12-12 04:08:27 +00:00
Fixed eslint issues
This commit is contained in:
parent
963154824e
commit
3deaee0d7a
@ -16,7 +16,6 @@ import common from '../utils/common';
|
|||||||
|
|
||||||
class CenteredDiv {
|
class CenteredDiv {
|
||||||
constructor() {
|
constructor() {
|
||||||
|
|
||||||
this.backgroundElement = document.createElement('div');
|
this.backgroundElement = document.createElement('div');
|
||||||
common.extend(this.backgroundElement.style, {
|
common.extend(this.backgroundElement.style, {
|
||||||
backgroundColor: 'rgba(0,0,0,0.8)',
|
backgroundColor: 'rgba(0,0,0,0.8)',
|
||||||
@ -46,14 +45,14 @@ class CenteredDiv {
|
|||||||
document.body.appendChild(this.backgroundElement);
|
document.body.appendChild(this.backgroundElement);
|
||||||
document.body.appendChild(this.domElement);
|
document.body.appendChild(this.domElement);
|
||||||
|
|
||||||
var _this = this;
|
const _this = this;
|
||||||
dom.bind(this.backgroundElement, 'click', function () {
|
dom.bind(this.backgroundElement, 'click', function() {
|
||||||
_this.hide();
|
_this.hide();
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
show() {
|
show() {
|
||||||
var _this = this;
|
const _this = this;
|
||||||
|
|
||||||
this.backgroundElement.style.display = 'block';
|
this.backgroundElement.style.display = 'block';
|
||||||
|
|
||||||
@ -64,29 +63,26 @@ class CenteredDiv {
|
|||||||
|
|
||||||
this.layout();
|
this.layout();
|
||||||
|
|
||||||
common.defer(function () {
|
common.defer(function() {
|
||||||
_this.backgroundElement.style.opacity = 1;
|
_this.backgroundElement.style.opacity = 1;
|
||||||
_this.domElement.style.opacity = 1;
|
_this.domElement.style.opacity = 1;
|
||||||
_this.domElement.style.webkitTransform = 'scale(1)';
|
_this.domElement.style.webkitTransform = 'scale(1)';
|
||||||
});
|
});
|
||||||
|
}
|
||||||
};
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Hide centered div
|
* Hide centered div
|
||||||
*/
|
*/
|
||||||
hide() {
|
hide() {
|
||||||
var _this = this;
|
const _this = this;
|
||||||
|
|
||||||
var hide = function () {
|
|
||||||
|
|
||||||
|
const hide = function() {
|
||||||
_this.domElement.style.display = 'none';
|
_this.domElement.style.display = 'none';
|
||||||
_this.backgroundElement.style.display = 'none';
|
_this.backgroundElement.style.display = 'none';
|
||||||
|
|
||||||
dom.unbind(_this.domElement, 'webkitTransitionEnd', hide);
|
dom.unbind(_this.domElement, 'webkitTransitionEnd', hide);
|
||||||
dom.unbind(_this.domElement, 'transitionend', hide);
|
dom.unbind(_this.domElement, 'transitionend', hide);
|
||||||
dom.unbind(_this.domElement, 'oTransitionEnd', hide);
|
dom.unbind(_this.domElement, 'oTransitionEnd', hide);
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
dom.bind(this.domElement, 'webkitTransitionEnd', hide);
|
dom.bind(this.domElement, 'webkitTransitionEnd', hide);
|
||||||
@ -97,8 +93,7 @@ class CenteredDiv {
|
|||||||
// this.domElement.style.top = '48%';
|
// this.domElement.style.top = '48%';
|
||||||
this.domElement.style.opacity = 0;
|
this.domElement.style.opacity = 0;
|
||||||
this.domElement.style.webkitTransform = 'scale(1.1)';
|
this.domElement.style.webkitTransform = 'scale(1.1)';
|
||||||
|
}
|
||||||
};
|
|
||||||
|
|
||||||
layout() {
|
layout() {
|
||||||
this.domElement.style.left = window.innerWidth / 2 - dom.getWidth(this.domElement) / 2 + 'px';
|
this.domElement.style.left = window.innerWidth / 2 - dom.getWidth(this.domElement) / 2 + 'px';
|
||||||
@ -106,8 +101,4 @@ class CenteredDiv {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function lockScroll(e) {
|
|
||||||
console.log(e);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default CenteredDiv;
|
export default CenteredDiv;
|
||||||
|
@ -13,26 +13,27 @@
|
|||||||
|
|
||||||
import common from '../utils/common';
|
import common from '../utils/common';
|
||||||
|
|
||||||
var EVENT_MAP = {
|
const EVENT_MAP = {
|
||||||
'HTMLEvents': ['change'],
|
'HTMLEvents': ['change'],
|
||||||
'MouseEvents': ['click', 'mousemove', 'mousedown', 'mouseup', 'mouseover'],
|
'MouseEvents': ['click', 'mousemove', 'mousedown', 'mouseup', 'mouseover'],
|
||||||
'KeyboardEvents': ['keydown']
|
'KeyboardEvents': ['keydown']
|
||||||
};
|
};
|
||||||
|
|
||||||
var EVENT_MAP_INV = {};
|
const EVENT_MAP_INV = {};
|
||||||
common.each(EVENT_MAP, function (v, k) {
|
common.each(EVENT_MAP, function(v, k) {
|
||||||
common.each(v, function (e) {
|
common.each(v, function(e) {
|
||||||
EVENT_MAP_INV[e] = k;
|
EVENT_MAP_INV[e] = k;
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
var CSS_VALUE_PIXELS = /(\d+(\.\d+)?)px/;
|
const CSS_VALUE_PIXELS = /(\d+(\.\d+)?)px/;
|
||||||
|
|
||||||
function cssValueToPixels(val) {
|
function cssValueToPixels(val) {
|
||||||
|
if (val === '0' || common.isUndefined(val)) {
|
||||||
|
return 0;
|
||||||
|
}
|
||||||
|
|
||||||
if (val === '0' || common.isUndefined(val)) return 0;
|
const match = val.match(CSS_VALUE_PIXELS);
|
||||||
|
|
||||||
var match = val.match(CSS_VALUE_PIXELS);
|
|
||||||
|
|
||||||
if (!common.isNull(match)) {
|
if (!common.isNull(match)) {
|
||||||
return parseFloat(match[1]);
|
return parseFloat(match[1]);
|
||||||
@ -41,45 +42,49 @@ function cssValueToPixels(val) {
|
|||||||
// TODO ...ems? %?
|
// TODO ...ems? %?
|
||||||
|
|
||||||
return 0;
|
return 0;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @namespace
|
* @namespace
|
||||||
* @member dat.dom
|
* @member dat.dom
|
||||||
*/
|
*/
|
||||||
var dom = {
|
const dom = {
|
||||||
|
|
||||||
/**
|
/**
|
||||||
*
|
*
|
||||||
* @param elem
|
* @param elem
|
||||||
* @param selectable
|
* @param selectable
|
||||||
*/
|
*/
|
||||||
makeSelectable: function (elem, selectable) {
|
makeSelectable: function(elem, selectable) {
|
||||||
|
|
||||||
if (elem === undefined || elem.style === undefined) return;
|
if (elem === undefined || elem.style === undefined) return;
|
||||||
|
|
||||||
elem.onselectstart = selectable ? function () {
|
elem.onselectstart = selectable ? function() {
|
||||||
return false;
|
return false;
|
||||||
} : function () {
|
} : function() {
|
||||||
};
|
};
|
||||||
|
|
||||||
elem.style.MozUserSelect = selectable ? 'auto' : 'none';
|
elem.style.MozUserSelect = selectable ? 'auto' : 'none';
|
||||||
elem.style.KhtmlUserSelect = selectable ? 'auto' : 'none';
|
elem.style.KhtmlUserSelect = selectable ? 'auto' : 'none';
|
||||||
elem.unselectable = selectable ? 'on' : 'off';
|
elem.unselectable = selectable ? 'on' : 'off';
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
*
|
*
|
||||||
* @param elem
|
* @param elem
|
||||||
* @param horizontal
|
* @param horizontal
|
||||||
* @param vertical
|
* @param vert
|
||||||
*/
|
*/
|
||||||
makeFullscreen: function (elem, horizontal, vertical) {
|
makeFullscreen: function(elem, hor, vert) {
|
||||||
|
let vertical = vert;
|
||||||
|
let horizontal = hor;
|
||||||
|
|
||||||
if (common.isUndefined(horizontal)) horizontal = true;
|
if (common.isUndefined(horizontal)) {
|
||||||
if (common.isUndefined(vertical)) vertical = true;
|
horizontal = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (common.isUndefined(vertical)) {
|
||||||
|
vertical = true;
|
||||||
|
}
|
||||||
|
|
||||||
elem.style.position = 'absolute';
|
elem.style.position = 'absolute';
|
||||||
|
|
||||||
@ -91,7 +96,6 @@ var dom = {
|
|||||||
elem.style.top = 0;
|
elem.style.top = 0;
|
||||||
elem.style.bottom = 0;
|
elem.style.bottom = 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@ -100,27 +104,30 @@ var dom = {
|
|||||||
* @param eventType
|
* @param eventType
|
||||||
* @param params
|
* @param params
|
||||||
*/
|
*/
|
||||||
fakeEvent: function (elem, eventType, params, aux) {
|
fakeEvent: function(elem, eventType, pars, aux) {
|
||||||
params = params || {};
|
const params = pars || {};
|
||||||
var className = EVENT_MAP_INV[eventType];
|
const className = EVENT_MAP_INV[eventType];
|
||||||
if (!className) {
|
if (!className) {
|
||||||
throw new Error('Event type ' + eventType + ' not supported.');
|
throw new Error('Event type ' + eventType + ' not supported.');
|
||||||
}
|
}
|
||||||
var evt = document.createEvent(className);
|
const evt = document.createEvent(className);
|
||||||
switch (className) {
|
switch (className) {
|
||||||
case 'MouseEvents':
|
case 'MouseEvents':
|
||||||
var clientX = params.x || params.clientX || 0;
|
{
|
||||||
var clientY = params.y || params.clientY || 0;
|
const clientX = params.x || params.clientX || 0;
|
||||||
|
const clientY = params.y || params.clientY || 0;
|
||||||
evt.initMouseEvent(eventType, params.bubbles || false,
|
evt.initMouseEvent(eventType, params.bubbles || false,
|
||||||
params.cancelable || true, window, params.clickCount || 1,
|
params.cancelable || true, window, params.clickCount || 1,
|
||||||
0, //screen X
|
0, // screen X
|
||||||
0, //screen Y
|
0, // screen Y
|
||||||
clientX, //client X
|
clientX, // client X
|
||||||
clientY, //client Y
|
clientY, // client Y
|
||||||
false, false, false, false, 0, null);
|
false, false, false, false, 0, null);
|
||||||
break;
|
break;
|
||||||
|
}
|
||||||
case 'KeyboardEvents':
|
case 'KeyboardEvents':
|
||||||
var init = evt.initKeyboardEvent || evt.initKeyEvent; // webkit || moz
|
{
|
||||||
|
const init = evt.initKeyboardEvent || evt.initKeyEvent; // webkit || moz
|
||||||
common.defaults(params, {
|
common.defaults(params, {
|
||||||
cancelable: true,
|
cancelable: true,
|
||||||
ctrlKey: false,
|
ctrlKey: false,
|
||||||
@ -136,11 +143,13 @@ var dom = {
|
|||||||
params.shiftKey, params.metaKey,
|
params.shiftKey, params.metaKey,
|
||||||
params.keyCode, params.charCode);
|
params.keyCode, params.charCode);
|
||||||
break;
|
break;
|
||||||
|
}
|
||||||
default:
|
default:
|
||||||
evt.initEvent(eventType, params.bubbles || false,
|
{
|
||||||
params.cancelable || true);
|
evt.initEvent(eventType, params.bubbles || false, params.cancelable || true);
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
common.defaults(evt, aux);
|
common.defaults(evt, aux);
|
||||||
elem.dispatchEvent(evt);
|
elem.dispatchEvent(evt);
|
||||||
},
|
},
|
||||||
@ -152,12 +161,13 @@ var dom = {
|
|||||||
* @param func
|
* @param func
|
||||||
* @param bool
|
* @param bool
|
||||||
*/
|
*/
|
||||||
bind: function (elem, event, func, bool) {
|
bind: function(elem, event, func, newBool) {
|
||||||
bool = bool || false;
|
const bool = newBool || false;
|
||||||
if (elem.addEventListener)
|
if (elem.addEventListener) {
|
||||||
elem.addEventListener(event, func, bool);
|
elem.addEventListener(event, func, bool);
|
||||||
else if (elem.attachEvent)
|
} else if (elem.attachEvent) {
|
||||||
elem.attachEvent('on' + event, func);
|
elem.attachEvent('on' + event, func);
|
||||||
|
}
|
||||||
return dom;
|
return dom;
|
||||||
},
|
},
|
||||||
|
|
||||||
@ -168,12 +178,13 @@ var dom = {
|
|||||||
* @param func
|
* @param func
|
||||||
* @param bool
|
* @param bool
|
||||||
*/
|
*/
|
||||||
unbind: function (elem, event, func, bool) {
|
unbind: function(elem, event, func, newBool) {
|
||||||
bool = bool || false;
|
const bool = newBool || false;
|
||||||
if (elem.removeEventListener)
|
if (elem.removeEventListener) {
|
||||||
elem.removeEventListener(event, func, bool);
|
elem.removeEventListener(event, func, bool);
|
||||||
else if (elem.detachEvent)
|
} else if (elem.detachEvent) {
|
||||||
elem.detachEvent('on' + event, func);
|
elem.detachEvent('on' + event, func);
|
||||||
|
}
|
||||||
return dom;
|
return dom;
|
||||||
},
|
},
|
||||||
|
|
||||||
@ -182,12 +193,12 @@ var dom = {
|
|||||||
* @param elem
|
* @param elem
|
||||||
* @param className
|
* @param className
|
||||||
*/
|
*/
|
||||||
addClass: function (elem, className) {
|
addClass: function(elem, className) {
|
||||||
if (elem.className === undefined) {
|
if (elem.className === undefined) {
|
||||||
elem.className = className;
|
elem.className = className;
|
||||||
} else if (elem.className !== className) {
|
} else if (elem.className !== className) {
|
||||||
var classes = elem.className.split(/ +/);
|
const classes = elem.className.split(/ +/);
|
||||||
if (classes.indexOf(className) == -1) {
|
if (classes.indexOf(className) === -1) {
|
||||||
classes.push(className);
|
classes.push(className);
|
||||||
elem.className = classes.join(' ').replace(/^\s+/, '').replace(/\s+$/, '');
|
elem.className = classes.join(' ').replace(/^\s+/, '').replace(/\s+$/, '');
|
||||||
}
|
}
|
||||||
@ -200,16 +211,14 @@ var dom = {
|
|||||||
* @param elem
|
* @param elem
|
||||||
* @param className
|
* @param className
|
||||||
*/
|
*/
|
||||||
removeClass: function (elem, className) {
|
removeClass: function(elem, className) {
|
||||||
if (className) {
|
if (className) {
|
||||||
if (elem.className === undefined) {
|
if (elem.className === className) {
|
||||||
// elem.className = className;
|
|
||||||
} else if (elem.className === className) {
|
|
||||||
elem.removeAttribute('class');
|
elem.removeAttribute('class');
|
||||||
} else {
|
} else {
|
||||||
var classes = elem.className.split(/ +/);
|
const classes = elem.className.split(/ +/);
|
||||||
var index = classes.indexOf(className);
|
const index = classes.indexOf(className);
|
||||||
if (index != -1) {
|
if (index !== -1) {
|
||||||
classes.splice(index, 1);
|
classes.splice(index, 1);
|
||||||
elem.className = classes.join(' ');
|
elem.className = classes.join(' ');
|
||||||
}
|
}
|
||||||
@ -220,7 +229,7 @@ var dom = {
|
|||||||
return dom;
|
return dom;
|
||||||
},
|
},
|
||||||
|
|
||||||
hasClass: function (elem, className) {
|
hasClass: function(elem, className) {
|
||||||
return new RegExp('(?:^|\\s+)' + className + '(?:\\s+|$)').test(elem.className) || false;
|
return new RegExp('(?:^|\\s+)' + className + '(?:\\s+|$)').test(elem.className) || false;
|
||||||
},
|
},
|
||||||
|
|
||||||
@ -228,43 +237,43 @@ var dom = {
|
|||||||
*
|
*
|
||||||
* @param elem
|
* @param elem
|
||||||
*/
|
*/
|
||||||
getWidth: function (elem) {
|
getWidth: function(elem) {
|
||||||
|
const style = getComputedStyle(elem);
|
||||||
var style = getComputedStyle(elem);
|
|
||||||
|
|
||||||
return cssValueToPixels(style['border-left-width']) +
|
return cssValueToPixels(style['border-left-width']) +
|
||||||
cssValueToPixels(style['border-right-width']) +
|
cssValueToPixels(style['border-right-width']) +
|
||||||
cssValueToPixels(style['padding-left']) +
|
cssValueToPixels(style['padding-left']) +
|
||||||
cssValueToPixels(style['padding-right']) +
|
cssValueToPixels(style['padding-right']) +
|
||||||
cssValueToPixels(style['width']);
|
cssValueToPixels(style.width);
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
*
|
*
|
||||||
* @param elem
|
* @param elem
|
||||||
*/
|
*/
|
||||||
getHeight: function (elem) {
|
getHeight: function(elem) {
|
||||||
|
const style = getComputedStyle(elem);
|
||||||
var style = getComputedStyle(elem);
|
|
||||||
|
|
||||||
return cssValueToPixels(style['border-top-width']) +
|
return cssValueToPixels(style['border-top-width']) +
|
||||||
cssValueToPixels(style['border-bottom-width']) +
|
cssValueToPixels(style['border-bottom-width']) +
|
||||||
cssValueToPixels(style['padding-top']) +
|
cssValueToPixels(style['padding-top']) +
|
||||||
cssValueToPixels(style['padding-bottom']) +
|
cssValueToPixels(style['padding-bottom']) +
|
||||||
cssValueToPixels(style['height']);
|
cssValueToPixels(style.height);
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
*
|
*
|
||||||
* @param elem
|
* @param el
|
||||||
*/
|
*/
|
||||||
getOffset: function (elem) {
|
getOffset: function(el) {
|
||||||
var offset = {left: 0, top: 0};
|
let elem = el;
|
||||||
|
const offset = {left: 0, top: 0};
|
||||||
if (elem.offsetParent) {
|
if (elem.offsetParent) {
|
||||||
do {
|
do {
|
||||||
offset.left += elem.offsetLeft;
|
offset.left += elem.offsetLeft;
|
||||||
offset.top += elem.offsetTop;
|
offset.top += elem.offsetTop;
|
||||||
} while (elem = elem.offsetParent);
|
elem = elem.offsetParent;
|
||||||
|
} while (elem);
|
||||||
}
|
}
|
||||||
return offset;
|
return offset;
|
||||||
},
|
},
|
||||||
@ -274,7 +283,7 @@ var dom = {
|
|||||||
*
|
*
|
||||||
* @param elem
|
* @param elem
|
||||||
*/
|
*/
|
||||||
isActive: function (elem) {
|
isActive: function(elem) {
|
||||||
return elem === document.activeElement && ( elem.type || elem.href );
|
return elem === document.activeElement && ( elem.type || elem.href );
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user