var set = [];
$.each($('#input-container input'), function() {
set.push("*" + $(this).val());
});
console.log(set);
var params = {
// объект параметров плагина
};
// Инициализируем при загрузки DOM
initScrollbar($('.content'), params);
// Инициализируем/разгрушаем по изменению окна браузера
$(window).on('resize', function() {
initScrollbar($('.content'), params);
});
function initScrollbar($selector, options) {
// Если ширина окна меньше чем 992 px
if ($(window).width() < 992) {
// Если на этом селекторе уже был инициализирован плагин, то разрушим его
// Если нет, то ничего не делаем
if ($selector.data('mCS')) $selector.mCustomScrollbar('destroy');
} else {
// Если ширина окна больше 992 px, То инициализируем плагин
$selector.mCustomScrollbar(options || {});
}
}
timer({
container: '.timer',
date: '09/30/2018',
template: function() {
return `
<div>
<span v-time-days></span>
:
<span v-time-hours></span>
:
<span v-time-minutes></span>
:
<span v-time-seconds></span>
</div>
`;
},
finish: function() {
return '<span>Время вышло</span>';
}
});
function timer(options) {
var setting = extend({
container: '.timer',
date: '09/30/2018',
template: function() {},
finish: function() {}
}, options || {});
var general = {
context: document.querySelector(setting.container),
date: new Date(setting.date).getTime(),
time: {},
inverval: 0
};
general.context.innerHTML = setting.template.call(general.context);
initTimer();
general.interval = setInterval(initTimer, 1e3);
function initTimer() {
var remaining = general.date - Date.now();
general.time = getTimeObject(remaining);
if (remaining <= 1e3) {
var html = setting.finish.call(general.context);
if (html) general.context.innerHTML = html;
clearInterval(general.inverval);
} else {
changeTime(general.time);
}
}
function changeTime(time) {
['days', 'hours', 'minutes', 'seconds'].forEach(function(name) {
[].forEach.call(general.context.querySelectorAll('[v-time-' + name + ']'), function(node) {
if (node.innerText !== time[name]) node.innerText = time[name];
});
});
}
function getTimeObject(time) {
return doubleDigits({
seconds: Math.floor((time / 1e3) % 60),
minutes: Math.floor((time / 1e3 / 60) % 60),
hours: Math.floor((time / (1e3 * 60 * 60) % 24)),
days: Math.floor(time / (1e3 * 60 * 60 * 24))
});
}
function doubleDigits(time) {
if (typeof time === 'object') {
for (var item in time) {
time[item] = time[item] < 10 ? '0' + time[item] : String(time[item]);
}
} else {
time = time < 10 ? '0' + time : time;
}
return time;
}
function extend(out) {
out = out || {};
for (var i = 1; i < arguments.length; i++) {
var obj = arguments[i];
if (!obj) continue;
for (var key in obj) {
if (obj.hasOwnProperty(key)) {
if (typeof obj[key] === 'object') {
out[key] = extend(out[key], obj[key]);
}
else {
out[key] = obj[key];
}
}
}
}
return out;
}
}
load('header.html', function(html) {
document.getElementById('includedContent').innerHTML = html;
}, console.error);
function ajax(params) {
var request = new XMLHttpRequest();
request.open(params.method || 'GET', params.url || window.location.href, params.async || true);
request.setRequestHeader('Content-Type', params.contentType || 'application/x-www-form-urlencoded; charset=UTF-8');
request.onreadystatechange = function() {
if (this.readyState === 4) {
if (this.status >= 200 && this.status < 400) {
if (params.success) params.success(this.response, this.statusText, this.status);
} else {
if (params.error) params.error(this);
}
}
};
request.send(params.data ? JSON.stringify(params.data) : '');
request = null;
}
function load(link, success, error) {
ajax({
url: link,
method: 'GET',
success: success,
error: error
});
}
// Возможные параметры функции ajax
// ajax({
// method: 'GET',
// url: 'https://text.com',
// async: true,
// contentType: 'application/json',
// data: { test: true },
// success: function(response, statusText, status) {},
// error: function(xhr)
// })
;(function(factory) {
if (typeof define === 'function' && define.amd) {
define(['jquery'], factory);
} else if (typeof module === 'object' && module.exports) {
module.exports = function(root, jQuery) {
if (jQuery === undefined) {
if (typeof window !== 'undefined') {
jQuery = require('jquery');
} else {
jQuery = require('jquery')(root);
}
}
factory(jQuery);
return jQuery;
};
} else {
factory(jQuery);
}
}(function($) {
// код плагина
}));
`
<article>
<h2>${news.Title}</h2>
<div>
${store.loop(news.Channels, function(channel, index) {
return `<span>${channel.Name} (${channel.ID})</span>${store.semiclon(news.Channels.length, ++index)}`;
})}
</div>
<hr>
<small>
<a href="${news.Link}">${news.Link}</a>
</small>
<hr>
<p>${news.Description}</p>
<hr>
<div>
${store.loop(news.Tags, function(tag, index) {
return `<span>${tag.Name}</span>${store.semiclon(news.Tags.length, ++index)}`;
})}
</div>
<small>${news.Creator} | ${store.date('{DD}/{MM}/{YYYY} {hh}:{mm}:{ss}', news.PublishDate)}</small>
</article>
`
localhost:3001
а на external адрес вида 192.168.xx.xx:3001
$(function() {
let $chart = $('[data-type="chart"]');
for (let i = 0; i < $chart.length; i++) {
(function(index) {
$.ajax({
success: function() {
console.log('Замыкание', index);
}
})
})(i);
}
});
$(function() {
var $chart = $('[data-type="chart"]');
if ($chart.length) {
ajaxAll($chart, function(index) {
return getChartData($(this).data('url'), index);
}).done(function() {
console.log('ajaxAll', 'Все запросы завершенны');
});
}
function ajaxAll($selector, each) {
var promise = [];
$.each($selector, function() {
promise.push(each.apply(this, arguments));
});
return $.when.apply(null, promise);
}
function getChartData(link, index) {
return $.ajax({
url: link,
method: 'POST',
dataType: 'json',
contentType: 'application/json',
data: JSON.stringify({
data: {
item: index
}
}),
success: function(response) {
console.log('getChartData', 'Одиночный запрос завершен успешно', index);
}
});
}
});
if (localStorage.getItem('addClass') === 'true') {
$('.target').addClass('custom');
}
$('button').on('click', function() {
$('.target').addClass('custom');
localStorage.setItem('addClass', 'true');
});
<div class="crypto"></div>
var $crypto = $('.crypto').btcav({
crypto: ['BTC', 'ETH', 'LTC'],
currency: 'USD',
sort: {
key: 'open.day',
order: 'desc'
},
show: function(data) {
return `
<div class="item">
<span class="item-name">${data.symbol}</span>
<span v-trand class="item-price">$${data.open.day}</span>
</div>
`;
}
});
<div class="crypto">
<div class="item">
<span class="item-name">BTC</span>
<span class="item-price up">$7016.04</span>
</div>
<div class="item">
<span class="item-name">ETH</span>
<span class="item-price up">$281.6768</span>
</div>
<div class="item">
<span class="item-name">LTC</span>
<span class="item-price up">$62.1099</span>
</div>
</div>
<div class="crypto"></div>
var $crypto = $('.crypto').btcav({
crypto: ['BTC', 'ETH', 'LTC'],
currency: 'USD',
sort: {
key: 'open.day',
order: 'desc'
},
show: function(data) {
return `
<div class="item">
<span class="item-name">${data.symbol}</span>
<span v-trand class="item-price">$${data.open.day}</span>
</div>
`;
}
});
<div class="crypto">
<div class="item">
<span class="item-name">BTC</span>
<span class="item-price up">$7016.04</span>
</div>
<div class="item">
<span class="item-name">ETH</span>
<span class="item-price up">$281.6768</span>
</div>
<div class="item">
<span class="item-name">LTC</span>
<span class="item-price up">$62.1099</span>
</div>
</div>
console.time('Image loading');
document.querySelector('img').addEventListener('load', function() {
console.timeEnd('Image loading'); //> Image loading: 1192.903076171875ms
});
var start = performance.now();
document.querySelector('img').addEventListener('load', function() {
var end = performance.now();
console.log(end - start); //> 13.999999999214197
});