first commit
This commit is contained in:
@@ -0,0 +1,382 @@
|
||||
var Tour = (function() {
|
||||
var t = [],
|
||||
o, cur
|
||||
T = {
|
||||
step: {
|
||||
pl: "krok",
|
||||
en: "step",
|
||||
be: "крок",
|
||||
ca: "pas",
|
||||
cs: "krok",
|
||||
da: "trin",
|
||||
de: "Schritt",
|
||||
el: "βήμα",
|
||||
es: "paso",
|
||||
et: "samm",
|
||||
fi: "vaihe",
|
||||
fr: "étape",
|
||||
hu: "lépés",
|
||||
it: "passo",
|
||||
lt: "žingsnis",
|
||||
lv: "solis",
|
||||
mk: "чекор",
|
||||
nl: "stap",
|
||||
no: "trinn",
|
||||
pt: "passo",
|
||||
ru: "шаг",
|
||||
sk: "krok",
|
||||
sl: "korak",
|
||||
sq: "hapi",
|
||||
sv: "steg",
|
||||
tr: "adım",
|
||||
uk: "крок"
|
||||
},
|
||||
Next: {
|
||||
pl: "Następny",
|
||||
en: "Next",
|
||||
be: "Далей",
|
||||
ca: "Següent",
|
||||
cs: "Další",
|
||||
da: "Næste",
|
||||
de: "Weiter",
|
||||
el: "Την επόμενη",
|
||||
es: "Siguiente",
|
||||
et: "Järgmine",
|
||||
fi: "Seuraava",
|
||||
fr: "Prochaine",
|
||||
hu: "Következő",
|
||||
it: "Accanto",
|
||||
lt: "Kitas",
|
||||
lv: "Nākamā",
|
||||
mk: "Следна",
|
||||
nl: "Volgende",
|
||||
no: "Neste",
|
||||
pt: "Próximo",
|
||||
ru: "Далее",
|
||||
sk: "Ďalej",
|
||||
sl: "Naprej",
|
||||
sq: "Tjetër",
|
||||
sv: "Nästa",
|
||||
tr: "Gelecek",
|
||||
uk: "Далі"
|
||||
},
|
||||
Previous: {
|
||||
pl: "Poprzedni",
|
||||
en: "Previous",
|
||||
be: "Папярэдні",
|
||||
ca: "Anteriors",
|
||||
cs: "Předchozí",
|
||||
da: "Tidligere",
|
||||
de: "Vorherige",
|
||||
el: "Προηγούμενο",
|
||||
es: "Anterior",
|
||||
et: "Eelmine",
|
||||
fi: "Edellinen",
|
||||
fr: "Précédente",
|
||||
hu: "Előző",
|
||||
it: "Precedente",
|
||||
lt: "Ankstesnis",
|
||||
lv: "Iepriekšējā",
|
||||
mk: "Претходна",
|
||||
nl: "Vorige",
|
||||
no: "Tidligere",
|
||||
pt: "Anterior",
|
||||
ru: "Предыдущий",
|
||||
sk: "Predchádzajúce",
|
||||
sl: "Prejšnji",
|
||||
sq: "E mëparshme",
|
||||
sv: "Föregående",
|
||||
tr: "Önceki",
|
||||
uk: "Попередній"
|
||||
},
|
||||
Finish: {
|
||||
pl: "Zakończ",
|
||||
en: "Finish",
|
||||
be: "Аздабленне",
|
||||
ca: "Acabat",
|
||||
cs: "Dokončit",
|
||||
da: "Finish",
|
||||
de: "Finish",
|
||||
el: "Τελειώνει",
|
||||
es: "Acabado",
|
||||
et: "Lõpeta",
|
||||
fi: "Loppuun",
|
||||
fr: "Finition",
|
||||
hu: "Befejezés",
|
||||
it: "Finitura",
|
||||
lt: "Apdaila",
|
||||
lv: "Apdare",
|
||||
mk: "Заврши",
|
||||
nl: "Afwerking",
|
||||
no: "Ferdig",
|
||||
pt: "Acabamento",
|
||||
ru: "Отделка",
|
||||
sk: "Povrch",
|
||||
sl: "Zaključek",
|
||||
sq: "Finish",
|
||||
sv: "Avsluta",
|
||||
tr: "Bitir",
|
||||
uk: "Оздоблення"
|
||||
}
|
||||
};
|
||||
|
||||
function _t(s) {
|
||||
return T[s][t[cur].language] || T[s]['en'];
|
||||
}
|
||||
|
||||
function step(n) {
|
||||
|
||||
cur = n;
|
||||
$('.tourStep, .tourBg').remove();
|
||||
|
||||
if (!t[n]) {
|
||||
return;
|
||||
}
|
||||
|
||||
$('body').append([
|
||||
'<div class="tourStep popover" step="' + n + '">',
|
||||
'<div class="arrow"></div>',
|
||||
'<div class="card">',
|
||||
'<div class="card-header">',
|
||||
!t[n].close ? '' : '<button class="tourClose btn-close float-end">× </button>',
|
||||
'</div>',
|
||||
'<div class="card-body">',
|
||||
t[n].content,
|
||||
'</div>',
|
||||
'<div class="card-footer">',
|
||||
'<div class="pull-right">',
|
||||
'<div class="tourPrev btn btn-default btn-sm">' + _t('Previous') + '</div> ',
|
||||
'<div class="tourNext btn btn-primary btn-sm">' + _t('Next') + '</div>',
|
||||
'</div>',
|
||||
'</div>',
|
||||
'</div>',
|
||||
'</div>'
|
||||
].join(''));
|
||||
|
||||
var el = $('.tourStep')
|
||||
.addClass(t[n].position)
|
||||
.css({
|
||||
minWidth: 250
|
||||
}),
|
||||
x = 0,
|
||||
y = 0;
|
||||
|
||||
if (t[n].element && !!t[n].element.length) {
|
||||
var x1 = 1e6,
|
||||
y1 = 1e6,
|
||||
x2 = 0,
|
||||
y2 = 0;
|
||||
|
||||
t[n].element.each(function(k, v) {
|
||||
var ofs = $(v).offset();
|
||||
x1 = Math.min(x1, ofs.left + t[n].forceCorrectionLeft);
|
||||
y1 = Math.min(y1, ofs.top + t[n].forceCorrectionTop);
|
||||
|
||||
x2 = Math.max(x2, ofs.left + t[n].forceCorrectionLeft + t[n].forceCorrectionWidth
|
||||
+ parseInt($(v).css('border-left-width'))
|
||||
+ parseInt($(v).css('padding-left'))
|
||||
+ $(v).width()
|
||||
+ parseInt($(v).css('padding-right'))
|
||||
+ parseInt($(v).css('border-right-width'))
|
||||
);
|
||||
|
||||
y2 = Math.max(y2, ofs.top + t[n].forceCorrectionTop + t[n].forceCorrectionHeight
|
||||
+ parseInt($(v).css('border-top-width'))
|
||||
+ parseInt($(v).css('padding-top'))
|
||||
+ $(v).height()
|
||||
+ parseInt($(v).css('padding-bottom'))
|
||||
+ parseInt($(v).css('border-bottom-width'))
|
||||
);
|
||||
});
|
||||
|
||||
switch (t[n].position) {
|
||||
case 'top':
|
||||
y = y1 - el.height();
|
||||
x = ((x1 + x2) >> 1) - (el.width() >> 1);
|
||||
break;
|
||||
|
||||
case 'right':
|
||||
y = ((y1 + y2) >> 1) - (el.height()>> 1);
|
||||
x = x2;
|
||||
break;
|
||||
|
||||
case 'left':
|
||||
y = ((y1 + y2) >> 1) - (el.height()>> 1);
|
||||
x = x1 - el.width();
|
||||
break;
|
||||
|
||||
case 'bottom':
|
||||
y = y2;
|
||||
x = ((x1 + x2) >> 1) - (el.width() >> 1);
|
||||
break;
|
||||
};
|
||||
};
|
||||
|
||||
el
|
||||
.css({
|
||||
position: 'absolute',
|
||||
left: x,
|
||||
top: y
|
||||
})
|
||||
.show();
|
||||
|
||||
if (t[n].spotlight) {
|
||||
var p = t[n].padding;
|
||||
$('body').append(Array(5).join('<div class="tourBg"></div>'));
|
||||
|
||||
var pos = [
|
||||
{
|
||||
bottom: 'auto',
|
||||
height: y1 - p
|
||||
},
|
||||
{
|
||||
top: y2 + p,
|
||||
height: $(document).height() - y2 - p
|
||||
},
|
||||
{
|
||||
right: 'auto',
|
||||
bottom: 'auto',
|
||||
top: y1 - p,
|
||||
width: x1 - p,
|
||||
height: 2 * p + y2 - y1
|
||||
},
|
||||
{
|
||||
left: x2 + p,
|
||||
bottom: 'auto',
|
||||
top: y1 - p,
|
||||
height: 2 * p + y2 - y1
|
||||
}
|
||||
];
|
||||
|
||||
$('.tourBg')
|
||||
.css({
|
||||
position: 'absolute',
|
||||
zIndex: 1000,
|
||||
top: 0,
|
||||
bottom: 0,
|
||||
right: 0,
|
||||
left: 0,
|
||||
background: '#000',
|
||||
opacity: 0.3
|
||||
}).each(function(k, v){
|
||||
$(v).css(pos[k]);
|
||||
});
|
||||
}
|
||||
|
||||
if (!!t[n].scroll) {
|
||||
var my = ((Math.min(y, y1) + Math.max(y + el.height(), y2)) >> 1) - ($(window).height() >> 1),
|
||||
mx = ((Math.min(x, x1) + Math.max(x + el.width(), x2)) >> 1) - ($(window).width() >> 1);
|
||||
|
||||
$('html, body').animate({
|
||||
scrollTop: Math.max(0, Math.min(y, y1, my)),
|
||||
scrollLeft: Math.max(0, Math.min(x, x1, mx))
|
||||
});
|
||||
}
|
||||
|
||||
if (!n) {
|
||||
$('.tourPrev').remove();
|
||||
}
|
||||
|
||||
if (n > t.length - 2) {
|
||||
$('.tourNext').text(_t('Finish'));
|
||||
}
|
||||
|
||||
$('.tourStep')
|
||||
.on('click', '.tourNext:not([disabled])', Tour.next)
|
||||
.on('click', '.tourPrev:not([disabled])', Tour.prev)
|
||||
.on('click', '.tourClose:not([disabled])', Tour.close);
|
||||
|
||||
(t[n].onstep || Tour.onstep || function(){})(t[n]);
|
||||
}
|
||||
|
||||
$(window).on('resize', function() {
|
||||
if (!!Tour.onresize) {
|
||||
Tour.onresize();
|
||||
}
|
||||
});
|
||||
|
||||
return {
|
||||
run: function(tour, options) {
|
||||
try {
|
||||
t = [];
|
||||
cur = 0;
|
||||
|
||||
o = {
|
||||
close: true,
|
||||
content: '',
|
||||
language: 'en',
|
||||
padding: 5,
|
||||
position: 'right',
|
||||
scroll: true,
|
||||
spotlight: true,
|
||||
forceCorrectionLeft: 0,
|
||||
forceCorrectionTop: 0,
|
||||
forceCorrectionWidth: 0,
|
||||
forceCorrectionHeight: 0,
|
||||
onstep: null,
|
||||
};
|
||||
|
||||
for (var k in options) {
|
||||
o[k] = options[k];
|
||||
}
|
||||
|
||||
$(tour).each(function(k, v) {
|
||||
for (var kk in o) {
|
||||
v[kk] = v[kk] || o[kk];
|
||||
};
|
||||
|
||||
if (v.element && !!v.element.length) {
|
||||
t.push(v);
|
||||
}
|
||||
});
|
||||
|
||||
step(cur);
|
||||
|
||||
if (!!Tour.onstart) {
|
||||
Tour.onstart();
|
||||
}
|
||||
} catch(e) {}
|
||||
},
|
||||
|
||||
next: function() {
|
||||
step(cur + 1);
|
||||
|
||||
if (cur == t.length) {
|
||||
if (!!Tour.onfinish) {
|
||||
Tour.onfinish();
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
prev: function(){
|
||||
step(cur - 1);
|
||||
},
|
||||
|
||||
current: function(){
|
||||
return cur;
|
||||
},
|
||||
|
||||
close: function(){
|
||||
step(-1);
|
||||
|
||||
if (!!Tour.onclose) {
|
||||
Tour.onclose();
|
||||
}
|
||||
},
|
||||
|
||||
onstart: null,
|
||||
onfinish: null,
|
||||
onclose: null,
|
||||
onstep: null,
|
||||
|
||||
onresize: function() {
|
||||
var n = cur - 1;
|
||||
step(-1);
|
||||
cur = n;
|
||||
|
||||
setTimeout(function() {
|
||||
Tour.next();
|
||||
}, 20);
|
||||
}
|
||||
};
|
||||
})();
|
||||
Reference in New Issue
Block a user