feature(images) move out from dom

This commit is contained in:
coderaiser 2017-02-20 16:43:23 +02:00
parent 2d669b4361
commit 4e66ceffc3
2 changed files with 138 additions and 141 deletions

View file

@ -18,10 +18,9 @@ Util.extend(DOMProto, DOMTree);
const DOM = new DOMFunc();
DOM.Images = new ImagesProto();
module.exports = DOM;
DOM.Images = require('./images');
DOM.uploadDirectory = require('./directory');
DOM.Buffer = require('./buffer');
DOM.Events = require('./events');
@ -31,146 +30,8 @@ DOM.RESTful = require('./rest');
DOM.load = require('./load');
DOM.Notify = require('./notify');
function ImagesProto() {
const Images = new ImageElementProto();
function ImageElementProto () {
let LoadingImage;
const LOADING = 'loading';
const HIDDEN = 'hidden';
const ERROR = 'error';
function getLoadingType() {
return DOM.isSVG() ? '-svg' : '-gif';
}
function init() {
if (LoadingImage)
return;
LoadingImage = LOADING + getLoadingType();
}
function getElement() {
init();
return DOM.load({
name : 'span',
id : 'js-status-image',
className : 'icon',
attribute : 'data-progress',
notAppend : true
});
}
this.get = getElement;
/* Функция создаёт картинку загрузки */
this.loading = function() {
var element = getElement();
var classList = element.classList;
classList.add(LOADING, LoadingImage);
classList.remove(ERROR, HIDDEN);
return element;
};
/* Функция создаёт картинку ошибки загрузки */
this.error = function() {
var element = getElement();
var classList = element.classList;
classList.add(ERROR);
classList.remove(HIDDEN, LOADING, LoadingImage);
return element;
};
}
this.show = load;
this.show.load = load;
this.show.error = error;
/**
* Function shows loading spinner
* position = {top: true};
*/
function load(position, panel) {
var current,
image = Images.loading(),
parent = image.parentElement,
refreshButton = DOM.getRefreshButton(panel);
if (position === 'top') {
current = refreshButton.parentElement;
} else {
current = DOM.getCurrentFile();
if (current)
current = DOM.getByDataName('js-name', current);
else
current = refreshButton.parentElement;
}
if (!parent || (parent && parent !== current))
current.appendChild(image);
DOM.show(image);
return image;
}
function error(text) {
var image = Images.error();
DOM.show(image);
image.title = text;
CloudCmd.log(text);
return image;
}
/**
* hide load image
*/
this.hide = function() {
var element = Images.get();
DOM.hide(element);
return this;
};
this.setProgress = function(value, title) {
var DATA = 'data-progress',
element = Images.get();
if (element) {
element.setAttribute(DATA, value + '%');
if (title)
element.title = title;
}
return this;
};
this.clearProgress = function() {
var DATA = 'data-progress',
element = Images.get();
if (element) {
element.setAttribute(DATA, '');
element.title = '';
}
return this;
};
}
function DOMTreeProto() {
var DOM = this;
const DOM = this;
/**
* check class of element

136
client/images.js Normal file
View file

@ -0,0 +1,136 @@
/* global CloudCmd */
'use strict';
const DOM = require('./dom');
const Images = module.exports;
const LOADING = 'loading';
const HIDDEN = 'hidden';
const ERROR = 'error';
const LoadingImage = LOADING + getLoadingType();
function getLoadingType() {
return DOM.isSVG() ? '-svg' : '-gif';
}
module.exports.get = getElement;
function getElement() {
return DOM.load({
name : 'span',
id : 'js-status-image',
className : 'icon',
attribute : 'data-progress',
notAppend : true
});
}
/* Функция создаёт картинку загрузки */
module.exports.loading = () => {
const element = getElement();
const classList = element.classList;
classList.add(LOADING, LoadingImage);
classList.remove(ERROR, HIDDEN);
return element;
};
/* Функция создаёт картинку ошибки загрузки */
module.exports.error = () => {
const element = getElement();
const classList = element.classList;
classList.add(ERROR);
classList.remove(HIDDEN, LOADING, LoadingImage);
return element;
};
module.exports.show = load;
module.exports.show.load = load;
module.exports.show.error = error;
/**
* Function shows loading spinner
* position = {top: true};
*/
function load(position, panel) {
const image = Images.loading();
const parent = image.parentElement;
const refreshButton = DOM.getRefreshButton(panel);
let current;
if (position === 'top') {
current = refreshButton.parentElement;
} else {
current = DOM.getCurrentFile();
if (current)
current = DOM.getByDataName('js-name', current);
else
current = refreshButton.parentElement;
}
if (!parent || (parent && parent !== current))
current.appendChild(image);
DOM.show(image);
return image;
}
function error(text) {
const image = Images.error();
DOM.show(image);
image.title = text;
CloudCmd.log(text);
return image;
}
/**
* hide load image
*/
module.exports.hide = () => {
const element = Images.get();
DOM.hide(element);
return Images;
};
module.exports.setProgress = (value, title) => {
const DATA = 'data-progress';
const element = Images.get();
if (!element)
return Images;
element.setAttribute(DATA, value + '%');
if (title)
element.title = title;
return Images;
};
module.exports.clearProgress = () => {
const DATA = 'data-progress';
const element = Images.get();
if (!element)
return Images;
element.setAttribute(DATA, '');
element.title = '';
return Images;
};