/* * jQuery iGuider v 5.3.1 * * Copyright 2017, Linnik Yura | LI MASS CODE | http://masscode.ru * * Last Update 12/11/2021 */ var iGuider; (function ($) { "use strict"; var methods = { init: function (options) { var p = { tourID:'anyTourID', //This string allows you to save data with a unique name about tour progress. //It can be used to save information on the progress of the tour for several users. //Or save the progress of each tour separately tourTitle:'Tour Title Default', //Tour title tourSubtitle:'Tour Subtitle Default', startStep:1, //Step from which the tour begins overlayClickable:true, //This parameter enables or disables the click event for overlying layer overlayColor:'#000', //Global color values of the overlay layer. overlayOpacity:0.5, //Global opacity values of the overlay layer. pagination:true, //Shows the total number of steps and the current step number registerMissingElements:true, //Shows an absent element in tour map and find this element in DOM. textDirection:'ltr', //Global text direction. (ltr, rtl) shape:0, //Global shape of highlighting. 0 - rectangle (default), 1 - circle, 2 - rounded rectangle shapeBorderRadius:5, //Global corner radius of rounded rectangle shape. Only when "shape" value is "2" width:320, //Global width of the message block bgColor:false, //Global background color of the message block titleColor:false, //Global title color of the message block modalContentColor:false, //Global content color of the message block modalTypeColor:false, //Global modal type color of the message block paginationColor:false, //Global pagination color of the message block timerColor:false, //Global timer color of the message block btnColor:false, //Global buttons color btnHoverColor:false, //Global buttons hover color spacing:10, //Global indent highlighting around the element baseurl:false, //The initial portion of the URL that is common to all steps. //Required if you specify a relative URL in the LOC parameter value. loc:false, //Global relative/absolute path to the page for steps for which the LOC parameter is not specified timer:false, //Global time after which an automatic switching to the next step timerType:'line', //Global timer shape type: 'line' or 'circle' keyboard:true, //Tour control by keyboard buttons. Left - the previous step, right - the next step, Esc - close tour. keyboardEvent:false, //This parameter sets the permission to trigger custom events. intro:{ //Default intro settings enable:true, //If set to true, before the tour you will see the introductory slide, which will offer to see a tour. title:'Welcome to the interactive tour', //Title of introduction dialog content:'This tour will tell you about the main site functionalities', //Content of introduction dialog cover:'', //Path to the cover of intro overlayColor:false, //For intro, you can specify the different color values of the overlay layer. overlayOpacity:false, //For intro, you can specify the different opacity values of the overlay layer. width:false, //Width of the intro message block bgColor:false, //Background color of the intro message block titleColor:false, //Title color of the intro message block modalContentColor:false, //Content color of the intro message block modalTypeColor:false, //Modal type color of the intro message block btnColor:false, //Buttons color of the intro message block btnHoverColor:false //Buttons Hover color of the intro message block }, continue:{ //Default the continue message settings enable:true, //This parameter add the ability to continue the unfinished tour. title:'Continue the unfinished tour?', //Title of continue dialog content:'Click "Continue" to start with step on which finished last time.', //Content of continue dialog cover:'', //Path to the cover of continue message overlayColor:false, //For continue message, you can specify the different color values of the overlay layer. overlayOpacity:false, //For continue message, you can specify the different opacity values of the overlay layer. width:false, //Width of the continue message block bgColor:false, //Background color of the continue message block titleColor:false, //Title color of the continue message block modalContentColor:false, //Content color of the continue message block modalTypeColor:false, //Modal type color of the continue message block btnColor:false, //Buttons color of the continue message block btnHoverColor:false //Buttons Hover color of the continue message block }, tourMap: { //Default Tour Checklist settings enable:true, //This parameter add the ability view list of steps. position:'right', //Checklist Position clickable:true, //Specifies the clickability of links in the checklist of steps: true - clickable, false - disabled, or 'ready' - clickable only completed steps and current open:false, //Specifies to show or hide the Checklist at the start of the tour bgColor:false, //Background color of the Checklist titleColor:false, //Title color of the Checklist btnColor:false, //Buttons color of the checklist block btnHoverColor:false, //Buttons hover color of the checklist block itemColor:false, //Item color of the Checklist itemHoverColor:false, //Item hover color of the Checklist itemActiveColor:false, //Item Active color of the Checklist itemActiveBg:false, //Item Active BG color of the Checklist itemNumColor:false, //Item Number color of the Checklist checkColor:false, //Check color of the Checklist checkReadyColor:false //Check Ready color of the Checklist }, steps:[{ //Default step settings cover:'', //Path to image file title:'New Step Title', //Name of step content:'New Step Description', //Description of step position:'auto', //Position of message target:'uniqueName', //Unique Name (
) of highlighted element or .className (
) or #idValue (
) disable:false, //Block access to element overlayOpacity:0.5, //For each step, you can specify the different opacity values of the overlay layer. overlayColor:'#000', //For each step, you can specify the different color values of the overlay layer in HEX . spacing:10, //Indent highlighting around the element, px shape:0, //Shape of highlighting (0 - rectangle, 1 - circle, 2 - rounded rectangle) shapeBorderRadius:5, //The corner radius of rounded rectangle shape. Only when "shape" value is "2" timer:false, //The time after which an automatic switching to the next step event:'next', //An event that you need to do to go to the next step eventMessage:'Follow the required conditions to continue.', //Message hint for steps with custom events skip: false, //Step can be skipped if you set parameter "skip" to true. nextText:'Next', //The text in the Next Button prevText:'Prev', //The text in the Prev Button trigger:false, //An event which is generated on the selected element, in the transition from step to step stepID:'', //Unique ID Name. This name is assigned to the "html" tag as "data-g-stepid" attribute (If not specified, the plugin generates it automatically in the form: "step-N") waitElementTime:0, //The parameter "waitElementTime" sets the time (ms) to wait for an item to appear loc:false, //The path to the page on which the step should work ready:false, //This parameter indicates whether the step was completed or not. width:320, //Width of the message block autofocus:true, //Automatically puts the cursor in the selected form element. bgColor:false, //Background color of the message block titleColor:false, //Title color of the message block modalContentColor:false, //Content color of the message block paginationColor:false, //Pagination color of the message block timerColor:false, //Timer color of the message block btnColor:false, //Buttons color of the message block btnHoverColor:false, //Buttons Hover color of the message block keyboardEvent:false, //This parameter sets the permission to simulate user events for step. checkNext:{ //Function in which you can carry out any verification by clicking on the "Next" button. func:function(){return true;}, ////If the function returns True, the step will be switched. messageError:'Fulfill all conditions!' //If the function returns "False", an error message will appear in the message window }, checkPrev:{ //Function in which you can carry out any verification by clicking on the "Prev" button. func:function(){return true;}, messageError:'Fulfill all conditions!' }, before:function(target){}, //Triggered before the start of step during:function(target){}, //Triggered after the onset of step after:function(target){}, //Triggered After completion of the step, but before proceeding to the next delayBefore:0, //The delay before the element search, ms delayAfter:0 //The delay before the transition to the next step, ms }], lang: { //Default language settings cancelTitle: 'Cancel Tour', //The title in the cancel tour button cancelText: '×', //The text in the cancel tour button hideText: 'Hide Tour Map', //The text in the hidden tour map button tourMapText:'≡', //The text in the show tour button tourMapTitle: 'Tour Map', //Title of Tour map button nextTextDefault:'Next', //The text in the Next Button prevTextDefault:'Prev', //The text in the Prev Button endText:'End Tour', //The text in the End Tour Button contDialogBtnBegin:'Start over', //Text in the start button of continue dialog contDialogBtnContinue:'Continue', //Text in the continue button of continue dialog introDialogBtnStart:'Start', //Text in the start button of introduction dialog introDialogBtnCancel:'Cancel', //Text in the cancel button of introduction dialog modalIntroType:'Tour Intro', //Type Name of intro dialog modalContinueType:'Unfinished Tour' //Type Name of continue dialog }, create: function(){}, //Triggered when the iGuider is created start: function(){}, //Triggered before first showing the step progress: function(data){}, //Triggered together with start any step end: function(){}, //Triggered when the tour ended, or was interrupted abort: function(){}, //Triggered when the tour aborted finish: function(){}, //Triggered when step sequence is over play: function(){}, //Triggered when the timer state switches to "play" pause: function(){}, //Triggered when the timer state switches to "pause" modalTemplate: //Modal window template '
'+ '
[modal-cover]
'+ '
'+ '[modal-type]'+ '[modal-map]'+ '[modal-close]'+ '
[modal-timer]
'+ '
'+ '
'+ '
[modal-header]
'+ '
[modal-body]
'+ '
'+ '
'+ ''+ '[step-value]'+ '[step-total]'+ ''+ '[modal-prev]'+ '[modal-next]'+ '[modal-cancel]'+ '[modal-start]'+ '[modal-begin-first]'+ '[modal-begin-continue]'+ '
'+ '
', mapTemplate: //Tour Map template '
'+ '
'+ '[map-toggle]'+ '[map-hide]'+ '
'+ '
[map-header]
'+ ''+ '[step-value]'+ '[step-total]'+ ''+ '
[map-content]
'+ '
'+ '
', debug: false //Display of messages in the console }; if(!$.iGuider){ $.iGuider = {}; } /*create method attr()*/ (function(old) { $.fn.attr = function() { if(arguments.length === 0) { if(this.length === 0) { return null; } var obj = {}; $.each(this[0].attributes, function() { if(this.specified) { obj[this.name] = this.value; } }); return obj; } return old.apply(this, arguments); }; })($.fn.attr); if(!$.iGuider.opt){ /*Set dinamic variables*/ var requestID; var overlayCreateFlag = false; var savePar = []; var resizeID = function(){}; var waitInterval = 500; /**/ /*save all options in base data object*/ /**/ $.iGuider.opt = {}; if (options) { $.extend(p.lang, options.lang); $.extend(p.intro, options.intro); $.extend(p.continue, options.continue); $.extend(p.tourMap, options.tourMap); $.extend(options.lang,p.lang); $.extend(options.intro,p.intro); $.extend(options.continue,p.continue); $.extend(options.tourMap,p.tourMap); p.stepsDef = p.steps; if(options.steps && options.steps.length){ p.steps = options.steps; }else{ p.steps = false; } if(options.modalTemplate && $.trim(options.modalTemplate) != ''){ p.modalTemplate = options.modalTemplate; }else{ p.modalTemplate = false; } if(options.mapTemplate && $.trim(options.mapTemplate) != ''){ p.mapTemplate = options.mapTemplate; }else{ p.mapTemplate = false; } $.extend(p, options); } $.extend($.iGuider.opt, p); /*Fix Number Values*/ $.iGuider.opt.startStep = parseFloat($.iGuider.opt.startStep); $.iGuider.opt.overlayOpacity = parseFloat($.iGuider.opt.overlayOpacity); $.iGuider.opt.intro.overlayOpacity = parseFloat($.iGuider.opt.intro.overlayOpacity); $.iGuider.opt.continue.overlayOpacity = parseFloat($.iGuider.opt.continue.overlayOpacity); var setIntroDefaultColor = function(){ $.iGuider.opt.intro.overlayColor = $.iGuider.opt.overlayColor; }; var setContDefaultColor = function(){ $.iGuider.opt.continue.overlayColor = $.iGuider.opt.overlayColor; }; var setIntroDefaultOpacity = function(){ $.iGuider.opt.intro.overlayOpacity = $.iGuider.opt.overlayOpacity; }; var setContDefaultOpacity = function(){ $.iGuider.opt.continue.overlayOpacity = $.iGuider.opt.overlayOpacity; }; if($.iGuider.opt.overlayColor){ if(options.intro){ if(!options.intro.overlayColor) { setIntroDefaultColor(); } }else{ setIntroDefaultColor(); } if(options.continue){ if(!options.continue.overlayColor) { setContDefaultColor(); } }else{ setContDefaultColor(); } } if($.iGuider.opt.overlayOpacity > -1){ if(options.intro){ if(!options.intro.overlayOpacity && options.intro.overlayOpacity !== 0) { setIntroDefaultOpacity(); } }else{ setIntroDefaultOpacity(); } if(options.continue){ if(!options.continue.overlayOpacity && options.continue.overlayOpacity !== 0) { setContDefaultOpacity(); } }else{ setContDefaultOpacity(); } } if($.iGuiderLang){ $.extend($.iGuider.opt.lang, $.iGuiderLang); } /**/ /*creating object for addition vars*/ /**/ $.iGuider.v = {}; $.iGuider.v.scrollDoc = $('html,body'); /**/ /*Creating tour map block*/ /**/ var mapTemplate = $.iGuider.opt.mapTemplate ? $($.iGuider.opt.mapTemplate) : $(mapTpl); $.iGuider.v.gMapPos = mapTemplate.addClass('g-map-pos-'+$.iGuider.opt.tourMap.position).appendTo('body'); $.iGuider.v.stepTimerId = function(){}; $.iGuider.v.delayAfterId = function(){}; $.iGuider.v.delayBeforeId = function(){}; $.iGuider.v.duration = 300; $.iGuider.v.sTop = {}; $.iGuider.v.sBot = {}; $.iGuider.v.sLeft = {}; $.iGuider.v.sRight = {}; /*new*/ window.requestAnimFrame = (function(){ return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame || function(callback, element){ window.setTimeout(callback, 1000 / 60); }; })(); $.iGuider.v.easeOutQuad = function(currentIteration, startValue, changeInValue, totalIterations) { return (parseFloat(-changeInValue * (currentIteration /= totalIterations) * (currentIteration - 2)) + parseFloat(startValue)); }; /*Detect old IE browser*/ var GetIEVersion = function() { var sAgent = window.navigator.userAgent; var Idx = sAgent.indexOf("MSIE"); if (Idx > 0) { return parseInt(sAgent.substring(Idx+ 5, sAgent.indexOf(".", Idx))); }else{ if (!!navigator.userAgent.match(/Trident\/7\./)){ return 11; }else{ return 0; //It is not IE } } }; var ieFlag = GetIEVersion(); if (ieFlag > 0){ if(ieFlag >= 11){ if(window.location.protocol == 'file:'){ console.log('Some plugin functions "localStorage" is not available on local files (using the file: protocol) for this browser!'); return false; } }else{ console.log('The plugin \"iGuider\" does not support this version of the browser!'); return false; } } $.iGuider.v.debug = function(text){ if($.iGuider.opt.debug){ console.log(text); } }; /*This function create preloader*/ var createPreloader = function(){ $.iGuider.v.gLoader = $('
'); $.iGuider.v.gLoader.appendTo('body'); }; var showPreloader = function(){ $.iGuider.v.createOverlayLayer(); $('html').addClass('g-preloader'); }; var hidePreloader = function(){ $('html').removeClass('g-preloader'); }; createPreloader(); /*Create Circle Progress bar animation*/ var RADIUS = 21; var CIRCUMFERENCE = 2 * Math.PI * RADIUS; $.iGuider.v.progressCircleTimer = function(value){ var progress = value / 100; var dashoffset = CIRCUMFERENCE * (1 - progress); //console.log('progress:', value + '%', '|', 'offset:', dashoffset) $.iGuider.v.progressValue.style.strokeDashoffset = dashoffset; }; $.iGuider.v.correctColor = function(myColor){ function RGBColor(color_string) { this.ok = false; // strip any leading # if (color_string.charAt(0) == '#') { // remove # if any color_string = color_string.substr(1,6); } color_string = color_string.replace(/ /g,''); color_string = color_string.toLowerCase(); // before getting into regexps, try simple matches // and overwrite the input var simple_colors = { aliceblue: 'f0f8ff', antiquewhite: 'faebd7', aqua: '00ffff', aquamarine: '7fffd4', azure: 'f0ffff', beige: 'f5f5dc', bisque: 'ffe4c4', black: '000000', blanchedalmond: 'ffebcd', blue: '0000ff', blueviolet: '8a2be2', brown: 'a52a2a', burlywood: 'deb887', cadetblue: '5f9ea0', chartreuse: '7fff00', chocolate: 'd2691e', coral: 'ff7f50', cornflowerblue: '6495ed', cornsilk: 'fff8dc', crimson: 'dc143c', cyan: '00ffff', darkblue: '00008b', darkcyan: '008b8b', darkgoldenrod: 'b8860b', darkgray: 'a9a9a9', darkgreen: '006400', darkkhaki: 'bdb76b', darkmagenta: '8b008b', darkolivegreen: '556b2f', darkorange: 'ff8c00', darkorchid: '9932cc', darkred: '8b0000', darksalmon: 'e9967a', darkseagreen: '8fbc8f', darkslateblue: '483d8b', darkslategray: '2f4f4f', darkturquoise: '00ced1', darkviolet: '9400d3', deeppink: 'ff1493', deepskyblue: '00bfff', dimgray: '696969', dodgerblue: '1e90ff', feldspar: 'd19275', firebrick: 'b22222', floralwhite: 'fffaf0', forestgreen: '228b22', fuchsia: 'ff00ff', gainsboro: 'dcdcdc', ghostwhite: 'f8f8ff', gold: 'ffd700', goldenrod: 'daa520', gray: '808080', green: '008000', greenyellow: 'adff2f', honeydew: 'f0fff0', hotpink: 'ff69b4', indianred : 'cd5c5c', indigo : '4b0082', ivory: 'fffff0', khaki: 'f0e68c', lavender: 'e6e6fa', lavenderblush: 'fff0f5', lawngreen: '7cfc00', lemonchiffon: 'fffacd', lightblue: 'add8e6', lightcoral: 'f08080', lightcyan: 'e0ffff', lightgoldenrodyellow: 'fafad2', lightgrey: 'd3d3d3', lightgreen: '90ee90', lightpink: 'ffb6c1', lightsalmon: 'ffa07a', lightseagreen: '20b2aa', lightskyblue: '87cefa', lightslateblue: '8470ff', lightslategray: '778899', lightsteelblue: 'b0c4de', lightyellow: 'ffffe0', lime: '00ff00', limegreen: '32cd32', linen: 'faf0e6', magenta: 'ff00ff', maroon: '800000', mediumaquamarine: '66cdaa', mediumblue: '0000cd', mediumorchid: 'ba55d3', mediumpurple: '9370d8', mediumseagreen: '3cb371', mediumslateblue: '7b68ee', mediumspringgreen: '00fa9a', mediumturquoise: '48d1cc', mediumvioletred: 'c71585', midnightblue: '191970', mintcream: 'f5fffa', mistyrose: 'ffe4e1', moccasin: 'ffe4b5', navajowhite: 'ffdead', navy: '000080', oldlace: 'fdf5e6', olive: '808000', olivedrab: '6b8e23', orange: 'ffa500', orchid: 'da70d6', palegoldenrod: 'eee8aa', palegreen: '98fb98', paleturquoise: 'afeeee', palevioletred: 'd87093', papayawhip: 'ffefd5', peachpuff: 'ffdab9', peru: 'cd853f', pink: 'ffc0cb', plum: 'dda0dd', powderblue: 'b0e0e6', purple: '800080', red: 'ff0000', rosybrown: 'bc8f8f', royalblue: '4169e1', saddlebrown: '8b4513', salmon: 'fa8072', sandybrown: 'f4a460', seagreen: '2e8b57', seashell: 'fff5ee', sienna: 'a0522d', silver: 'c0c0c0', skyblue: '87ceeb', slateblue: '6a5acd', slategray: '708090', snow: 'fffafa', springgreen: '00ff7f', steelblue: '4682b4', tan: 'd2b48c', teal: '008080', thistle: 'd8bfd8', tomato: 'ff6347', turquoise: '40e0d0', violet: 'ee82ee', violetred: 'd02090', wheat: 'f5deb3', white: 'ffffff', whitesmoke: 'f5f5f5', yellow: 'ffff00', yellowgreen: '9acd32' }; for (var key in simple_colors) { if (color_string == key) { color_string = simple_colors[key]; } } // end of simple type-in colors // array of color definition objects var color_defs = [ { re: /^rgb\((\d{1,3}),\s*(\d{1,3}),\s*(\d{1,3})\)$/, example: ['rgb(123, 234, 45)', 'rgb(255,234,245)'], process: function (bits){ return [ parseInt(bits[1]), parseInt(bits[2]), parseInt(bits[3]) ]; } }, { re: /^(\w{2})(\w{2})(\w{2})$/, example: ['#00ff00', '336699'], process: function (bits){ return [ parseInt(bits[1], 16), parseInt(bits[2], 16), parseInt(bits[3], 16) ]; } }, { re: /^(\w{1})(\w{1})(\w{1})$/, example: ['#fb0', 'f0f'], process: function (bits){ return [ parseInt(bits[1] + bits[1], 16), parseInt(bits[2] + bits[2], 16), parseInt(bits[3] + bits[3], 16) ]; } } ]; // search through the definitions to find a match for (var i = 0; i < color_defs.length; i++) { var re = color_defs[i].re; var processor = color_defs[i].process; var bits = re.exec(color_string); if (bits) { var channels = processor(bits); this.r = channels[0]; this.g = channels[1]; this.b = channels[2]; this.ok = true; } } // validate/cleanup values this.r = (this.r < 0 || isNaN(this.r)) ? 0 : ((this.r > 255) ? 255 : this.r); this.g = (this.g < 0 || isNaN(this.g)) ? 0 : ((this.g > 255) ? 255 : this.g); this.b = (this.b < 0 || isNaN(this.b)) ? 0 : ((this.b > 255) ? 255 : this.b); // some getters this.toRGB = function () { return 'rgb(' + this.r + ', ' + this.g + ', ' + this.b + ')'; }; this.toHex = function () { var r = this.r.toString(16); var g = this.g.toString(16); var b = this.b.toString(16); if (r.length == 1) r = '0' + r; if (g.length == 1) g = '0' + g; if (b.length == 1) b = '0' + b; return '#' + r + g + b; }; } if(myColor.search('gradient') !== -1 || myColor.search('rgba') !== -1){ return myColor; }else{ var color = new RGBColor(myColor); if (color.ok) { return color.toHex(); } } }; /*Convert hex to rgba*/ $.iGuider.v.hexToRGBA = function(hex, opacity) { var c; if(/^#([A-Fa-f0-9]{3}){1,2}$/.test(hex)){ c= hex.substring(1).split(''); if(c.length== 3){ c= [c[0], c[0], c[1], c[1], c[2], c[2]]; } c= '0x'+c.join(''); return 'rgba('+[(c>>16)&255, (c>>8)&255, c&255].join(',')+','+opacity+')'; } }; $.iGuider.v.hexToRGBCODE = function(hex) { var c; if(/^#([A-Fa-f0-9]{3}){1,2}$/.test(hex)){ c= hex.substring(1).split(''); if(c.length== 3){ c= [c[0], c[0], c[1], c[1], c[2], c[2]]; } c= '0x'+c.join(''); return [(c>>16)&255, (c>>8)&255, c&255]; } }; $.iGuider.v.clearSavePar = function(){ savePar = []; }; /*create overlay*/ $.iGuider.v.createOverlayLayer = function(){ if($.iGuider.v.tCanvas.tColor && $.iGuider.v.tCanvas.tOpacity > -1){ if(!overlayCreateFlag){ overlayCreateFlag = true; $('html').addClass('g-show g-event'); $.iGuider.v.ctx.fillStyle = $.iGuider.v.hexToRGBA($.iGuider.v.tCanvas.tColor,$.iGuider.v.tCanvas.tOpacity); $.iGuider.v.ctx.fillRect(0,0,$.iGuider.v.tCanvas.width,$.iGuider.v.tCanvas.height); }else{ var hexCode = $.iGuider.v.hexToRGBCODE($.iGuider.v.tCanvas.tColor); $.iGuider.v.redrawOverlay(hexCode[0],hexCode[1],hexCode[2],$.iGuider.v.tCanvas.tOpacity); } } }; /*delete overlay*/ $.iGuider.v.deleteOverlayLayer = function(){ if(overlayCreateFlag){ $('html').removeClass('g-show'); $.iGuider.v.shapeRemove(); $('html').removeClass('g-event'); overlayCreateFlag = false; $.iGuider.v.ctx.clearRect(0,0,$.iGuider.v.tCanvas.width,$.iGuider.v.tCanvas.height); $('.g-active').removeClass('g-active'); $.iGuider.v.clearSavePar(); } }; /*Redraw Overlay*/ $.iGuider.v.redrawOverlay = function(r,g,b,a){ if(overlayCreateFlag){ $.iGuider.v.ctx.clearRect(0,0,$.iGuider.v.tCanvas.width,$.iGuider.v.tCanvas.height); $.iGuider.v.ctx.fillStyle = 'rgba('+r+','+g+','+b+','+a+')'; $.iGuider.v.ctx.fillRect(0,0,$.iGuider.v.tCanvas.width,$.iGuider.v.tCanvas.height); } }; var addSuccess = function(stepItemLink){ stepItemLink.addClass('g-step-success'); }; /*Create Canvas*/ $.iGuider.v.createCanvas = function(){ if(!$('#g-overlay-wrap').length){ $.iGuider.v.tCanvas = document.createElement('canvas'); $($.iGuider.v.tCanvas).appendTo('body'); $.iGuider.v.tCanvas.id = 'g-overlay-wrap'; }else{ $.iGuider.v.tCanvas = document.getElementById('g-overlay-wrap'); } $.iGuider.v.ctx = $.iGuider.v.tCanvas.getContext('2d'); }; /*Set Canvas Size*/ $.iGuider.v.setCanvasSize = function(){ $.iGuider.v.tCanvas.width = $(window).width(); $.iGuider.v.tCanvas.height = $(window).height(); $.iGuider.v.createOverlayLayer(); }; /*Remove All Rectangles*/ $.iGuider.v.delRect = function(sLength){ if(overlayCreateFlag){ for(var i = 0; i < sLength; i++){ var index = i; var delX = savePar[index].prevX; var delY = savePar[index].prevY; var delW = savePar[index].prevW; var delH = savePar[index].prevH; if($.iGuider.v.tCanvas.shape === 0){ $.iGuider.v.ctx.clearRect(delX,delY,delW,delH); $.iGuider.v.ctx.fillRect(delX,delY,delW,delH); } if($.iGuider.v.tCanvas.shape == 1){ $.iGuider.v.redrawOverlay($.iGuider.v.tCanvas.saveColorR,$.iGuider.v.tCanvas.saveColorG,$.iGuider.v.tCanvas.saveColorB,$.iGuider.v.tCanvas.saveOpacity); } if($.iGuider.v.tCanvas.shape == 2){ $.iGuider.v.redrawOverlay($.iGuider.v.tCanvas.saveColorR,$.iGuider.v.tCanvas.saveColorG,$.iGuider.v.tCanvas.saveColorB,$.iGuider.v.tCanvas.saveOpacity); } if(i == (sLength - 1)){ savePar = []; } } $.iGuider.v.shapeRemove(); } }; /*Start Animate*/ $.iGuider.v.start_animate = function(rectPar,lengthDef) { if(overlayCreateFlag){ cancelAnimationFrame(requestID); /*Set dinamic variables*/ var iteration = 0; var durationFrame = $.iGuider.v.tCanvas.tDuration / 16.666; var durationF = durationFrame+1; var startOp = $.iGuider.v.tCanvas.saveOpacity*10; /*opacity*/ var pathOp = $.iGuider.v.tCanvas.pathOpacity*10; /*opacity*/ /*Draw Rectangle*/ $.iGuider.v.tCanvas.draw = function(){ var newColorR,newColorG,newColorB,newOpacity,newBR; if($.iGuider.v.tCanvas.changeColor){ if($.iGuider){ newColorR = $.iGuider.v.easeOutQuad(iteration, $.iGuider.v.tCanvas.saveColorR, $.iGuider.v.tCanvas.pathColorR, durationF); /*color*/ newColorG = $.iGuider.v.easeOutQuad(iteration, $.iGuider.v.tCanvas.saveColorG, $.iGuider.v.tCanvas.pathColorG, durationF); /*color*/ newColorB = $.iGuider.v.easeOutQuad(iteration, $.iGuider.v.tCanvas.saveColorB, $.iGuider.v.tCanvas.pathColorB, durationF); /*color*/ newOpacity = $.iGuider.v.easeOutQuad(iteration, startOp, pathOp, durationF) / 10; /*opacity*/ $.iGuider.v.redrawOverlay(newColorR,newColorG,newColorB,newOpacity); } } if($.iGuider.v.tCanvas.saveShape == 1){ /*Remove Old Arc*/ if($.iGuider.v.tCanvas.changeColor){ $.iGuider.v.redrawOverlay(newColorR,newColorG,newColorB,newOpacity); }else{ $.iGuider.v.redrawOverlay($.iGuider.v.tCanvas.saveColorR,$.iGuider.v.tCanvas.saveColorG,$.iGuider.v.tCanvas.saveColorB,$.iGuider.v.tCanvas.saveOpacity); } } if($.iGuider.v.tCanvas.saveShape == 2){ if($.iGuider.v.tCanvas.changeColor){ $.iGuider.v.redrawOverlay(newColorR,newColorG,newColorB,newOpacity); }else{ $.iGuider.v.redrawOverlay($.iGuider.v.tCanvas.saveColorR,$.iGuider.v.tCanvas.saveColorG,$.iGuider.v.tCanvas.saveColorB,$.iGuider.v.tCanvas.saveOpacity); } } for(var i = 0; i < rectPar.length; i++){ /*Set dinamic variables*/ var index = i; if(!savePar[index]){ savePar.push({}); } var saveParItem = savePar[index]; var rectParItem = rectPar[index]; var prevX = saveParItem.prevX || rectParItem.x; var prevY = saveParItem.prevY || rectParItem.y; var prevW = saveParItem.prevW || rectParItem.width; var prevH = saveParItem.prevH || rectParItem.height; var prevBR = saveParItem.prevBR || rectParItem.BR; if($.iGuider.v.tCanvas.saveShape === 0){ /*Remove Old Rect*/ $.iGuider.v.ctx.clearRect(prevX,prevY,prevW,prevH); $.iGuider.v.ctx.fillRect(prevX,prevY,prevW,prevH); } /*Get New Position*/ var newPosX = $.iGuider.v.easeOutQuad(iteration, rectParItem.saveX, rectParItem.pathX, durationF); var newPosY = $.iGuider.v.easeOutQuad(iteration, rectParItem.saveY, rectParItem.pathY, durationF); var newW = $.iGuider.v.easeOutQuad(iteration, rectParItem.saveW, rectParItem.pathW, durationF); var newH = $.iGuider.v.easeOutQuad(iteration, rectParItem.saveH, rectParItem.pathH, durationF); var newBR = $.iGuider.v.easeOutQuad(iteration, rectParItem.saveBR, rectParItem.pathBR, durationF); /*Draw New Rect*/ if($.iGuider.v.tCanvas.shape === 0){ $.iGuider.v.ctx.clearRect(newPosX,newPosY,newW,newH); } /*Draw New Arc*/ if($.iGuider.v.tCanvas.shape == 1){ var arcLeft = (newPosX + newW/2).toFixed(0); var arcTop = (newPosY + newH/2).toFixed(0); var radius = (Math.sqrt(newW * newW + newH * newH)/2).toFixed(0); $.iGuider.v.ctx.globalCompositeOperation = 'destination-out'; $.iGuider.v.ctx.beginPath(); $.iGuider.v.ctx.arc(arcLeft,arcTop,radius,0,Math.PI*2); $.iGuider.v.ctx.closePath(); $.iGuider.v.ctx.fillStyle = 'rgba(0,0,0,1)'; $.iGuider.v.ctx.fill(); $.iGuider.v.ctx.globalCompositeOperation = 'source-over'; } /*Draw New Round Rect*/ if($.iGuider.v.tCanvas.shape == 2){ $.iGuider.v.ctx.globalCompositeOperation = 'destination-out'; $.iGuider.v.ctx.fillStyle = 'rgba(0,0,0,1)'; if (typeof newBR === 'undefined') { newBR = 5; } $.iGuider.v.ctx.beginPath(); $.iGuider.v.ctx.moveTo(newPosX + newBR, newPosY); $.iGuider.v.ctx.lineTo(newPosX + newW - newBR, newPosY); $.iGuider.v.ctx.quadraticCurveTo(newPosX + newW, newPosY, newPosX + newW, newPosY + newBR); $.iGuider.v.ctx.lineTo(newPosX + newW, newPosY + newH - newBR); $.iGuider.v.ctx.quadraticCurveTo(newPosX + newW, newPosY + newH, newPosX + newW - newBR, newPosY + newH); $.iGuider.v.ctx.lineTo(newPosX + newBR, newPosY + newH); $.iGuider.v.ctx.quadraticCurveTo(newPosX, newPosY + newH, newPosX, newPosY + newH - newBR); $.iGuider.v.ctx.lineTo(newPosX, newPosY + newBR); $.iGuider.v.ctx.quadraticCurveTo(newPosX, newPosY, newPosX + newBR, newPosY); $.iGuider.v.ctx.closePath(); $.iGuider.v.ctx.fill(); $.iGuider.v.ctx.globalCompositeOperation = 'source-over'; } saveParItem.prevX = newPosX; saveParItem.prevY = newPosY; saveParItem.prevW = newW; saveParItem.prevH = newH; saveParItem.saveX = rectParItem.x; saveParItem.saveY = rectParItem.y; saveParItem.saveW = rectParItem.width; saveParItem.saveH = rectParItem.height; saveParItem.saveBR = rectParItem.BR; } if (iteration < durationFrame) { iteration ++; requestID = requestAnimFrame($.iGuider.v.tCanvas.draw); }else{ iteration = 0; cancelAnimationFrame(requestID); $.iGuider.v.tCanvas.saveColor = $.iGuider.v.tCanvas.color; /*color*/ $.iGuider.v.tCanvas.saveColorR = $.iGuider.v.tCanvas.colorR; /*color*/ $.iGuider.v.tCanvas.saveColorG = $.iGuider.v.tCanvas.colorG; /*color*/ $.iGuider.v.tCanvas.saveColorB = $.iGuider.v.tCanvas.colorB; /*color*/ $.iGuider.v.tCanvas.saveOpacity = $.iGuider.v.tCanvas.opacity; /*color*/ $.iGuider.v.tCanvas.saveShape = $.iGuider.v.tCanvas.shape; /*color*/ if(lengthDef){ for(var j = 0; j < lengthDef; j++){ savePar.pop(); } } } }; /*Start Draw Rect*/ $.iGuider.v.tCanvas.draw(); } }; $.iGuider.v.shapeRemove = function(){ $('.g-shape').remove(); }; $.iGuider.v.searchEl = function(collect){ $.iGuider.v.createOverlayLayer(); if(overlayCreateFlag){ var rectPar = []; var color = $.iGuider.v.tCanvas.tColor; /*color*/ var colorCode = $.iGuider.v.hexToRGBCODE(color); /*color*/ var colorR = colorCode[0]; /*color*/ var colorG = colorCode[1]; /*color*/ var colorB = colorCode[2]; /*color*/ var opacity = $.iGuider.v.tCanvas.tOpacity; /*opacity*/ var shape = $.iGuider.v.tCanvas.shape; /*shape*/ var saveColor = $.iGuider.v.tCanvas.saveColor || color; /*color*/ var saveColorR = $.iGuider.v.tCanvas.saveColorR || colorR; /*color*/ var saveColorG = $.iGuider.v.tCanvas.saveColorG || colorG; /*color*/ var saveColorB = $.iGuider.v.tCanvas.saveColorB || colorB; /*color*/ var saveOpacity = $.iGuider.v.tCanvas.saveOpacity >= 0 ? $.iGuider.v.tCanvas.saveOpacity : opacity; /*opacity*/ $.iGuider.v.tCanvas.colorR = colorR; /*color*/ $.iGuider.v.tCanvas.colorG = colorG; /*color*/ $.iGuider.v.tCanvas.colorB = colorB; /*color*/ $.iGuider.v.tCanvas.saveColor = saveColor; /*color*/ $.iGuider.v.tCanvas.saveColorR = saveColorR; /*color*/ $.iGuider.v.tCanvas.saveColorG = saveColorG; /*color*/ $.iGuider.v.tCanvas.saveColorB = saveColorB; /*color*/ $.iGuider.v.tCanvas.saveShape = $.iGuider.v.tCanvas.saveShape || shape; /*shape*/ $.iGuider.v.tCanvas.saveOpacity = saveOpacity; /*opacity*/ $.iGuider.v.tCanvas.pathColorR = colorR - saveColorR; /*color*/ $.iGuider.v.tCanvas.pathColorG = colorG - saveColorG; /*color*/ $.iGuider.v.tCanvas.pathColorB = colorB - saveColorB; /*color*/ $.iGuider.v.tCanvas.pathOpacity = opacity - saveOpacity; /*opacity*/ if($.iGuider.v.tCanvas.saveColor != $.iGuider.v.tCanvas.color || $.iGuider.v.tCanvas.saveOpacity != $.iGuider.v.tCanvas.opacity){ $.iGuider.v.tCanvas.changeColor = true; }else{ $.iGuider.v.tCanvas.changeColor = false; } $.iGuider.v.shapeRemove(); collect.each(function(i){ var index = i; var el = $(this); var elW = el.outerWidth(); var elH = el.outerHeight(); var elLeft = (el.offset().left - $(window).scrollLeft()).toFixed(0); var elTop = (el.offset().top - $(window).scrollTop()).toFixed(0); var margin = $.iGuider.v.tCanvas.tMargin; var width = elW + margin * 2; var height = elH + margin * 2; var x = elLeft - margin; var y = elTop - margin; var maxBRSize = width > height ? height/2 : width/2; var shapeBorderRadius = $.iGuider.v.tCanvas.shapeBorderRadius; var shapeLeft = el.offset().left - margin; var shapeTop = el.offset().top - margin; var shapeW = width; var shapeH = height; var shapeBRadius = 0; if($.iGuider.v.tCanvas.shape == 2){ shapeBRadius = shapeBorderRadius > maxBRSize ? maxBRSize : shapeBorderRadius; shapeBorderRadius = shapeBRadius; } if(el.is('body')){ margin = 0; width = 0; height = 0; x = $(window).width()/2; y = $(window).height()/2; } if(!savePar[index]){ savePar.push({}); } var saveX = savePar[index].saveX || x; var saveY = savePar[index].saveY || y; var saveW = savePar[index].saveW || width; var saveH = savePar[index].saveH || height; var saveBR = savePar[index].saveBR || shapeBorderRadius; rectPar.push({ width:width, height:height, x:x, y:y, BR:shapeBorderRadius, saveX:saveX, saveY:saveY, saveW:saveW, saveH:saveH, saveBR:saveBR, pathX:x - saveX, pathY:y - saveY, pathW:width - saveW, pathH:height - saveH, pathBR:shapeBorderRadius - saveBR, prevX:savePar[index].prevX || x, prevY:savePar[index].prevY || y, prevW:savePar[index].prevW || width, prevH:savePar[index].prevH || height, prevBR:savePar[index].prevBR || shapeBorderRadius }); if(i == (collect.length - 1)){ $.iGuider.v.setEmpty(savePar,rectPar); } /*if $.iGuider.v.tCanvas.shape == 0*/ if($.iGuider.v.tCanvas.shape == 1){ var radius = (Math.sqrt(shapeW * shapeW + shapeH * shapeH)/2); shapeLeft = (shapeLeft - (radius - shapeW/2)); shapeTop = (shapeTop - (radius - shapeH/2)); shapeW = radius*2; shapeH = radius*2; shapeBRadius = '50%'; } var fixedTop = (shapeTop - $(window).scrollTop()); var fixedLeft = (shapeLeft - $(window).scrollLeft()); $('
') .addClass('g-shape') .css({left:fixedLeft, top:fixedTop, width:shapeW, height:shapeH, borderRadius:shapeBRadius}) .appendTo('body'); }); if(!collect.length){ $.iGuider.v.delRect(savePar.length); } } }; $.iGuider.v.fixStepNumVal = function(stepObj){ if(stepObj){ if(stepObj.overlayOpacity > -1){stepObj.overlayOpacity = parseFloat(stepObj.overlayOpacity);} if(stepObj.spacing > -1){stepObj.spacing = parseFloat(stepObj.spacing);} if(stepObj.shape > -1){stepObj.shape = parseFloat(stepObj.shape);} if(stepObj.shapeBorderRadius > -1){stepObj.shapeBorderRadius = parseFloat(stepObj.shapeBorderRadius);} if(stepObj.waitElementTime > -1){stepObj.waitElementTime = parseFloat(stepObj.waitElementTime);} } return stepObj; }; /*Set Addition Empty Objects*/ $.iGuider.v.setEmpty = function(savePar,rectPar){ var sLength = savePar.length; var rLength = rectPar.length; if(sLength > rLength){ var saveIndex = (rLength-1); var lengthDef = sLength - rLength; var jsonItem = JSON.stringify(rectPar[saveIndex]); var saveItem = JSON.parse(jsonItem); for(var i = 0; i < sLength; i++){ var index = i; if(index > (rLength - 1)){ rectPar[index] = saveItem; rectPar[index].saveX = savePar[index].saveX; rectPar[index].saveY = savePar[index].saveY; rectPar[index].saveW = savePar[index].saveW; rectPar[index].saveH = savePar[index].saveH; rectPar[index].prevX = savePar[index].prevX; rectPar[index].prevY = savePar[index].prevY; rectPar[index].prevW = savePar[index].prevW; rectPar[index].prevH = savePar[index].prevH; rectPar[index].pathX = rectPar[index].x - savePar[index].saveX; rectPar[index].pathY = rectPar[index].y - savePar[index].saveY; rectPar[index].pathW = rectPar[index].width - savePar[index].saveW; rectPar[index].pathH = rectPar[index].height - savePar[index].saveH; if(index == (sLength - 1)){ $.iGuider.v.start_animate(rectPar,lengthDef); } } } }else{ if(rLength){ $.iGuider.v.start_animate(rectPar); }else{ $.iGuider.v.delRect(savePar.length); } } }; /*Set Canvas Def Options*/ $.iGuider.v.setCanvasDefault = function(){ $.iGuider.v.tCanvas.def = { tOpacity:$.iGuider.opt.overlayOpacity > -1 ? $.iGuider.opt.overlayOpacity : 0.5, tColor:$.iGuider.opt.overlayColor || '#000', tMargin:parseFloat($.iGuider.opt.spacing) > -1 ? parseFloat($.iGuider.opt.spacing) : 10, tDuration:300, shape:parseFloat($.iGuider.opt.shape) > -1 ? parseFloat($.iGuider.opt.shape) : 0, shapeBorderRadius:parseFloat($.iGuider.opt.shapeBorderRadius) > -1 ? parseFloat($.iGuider.opt.shapeBorderRadius) : 5 }; $.iGuider.v.tCanvas.startOpt = { tOpacity:1.1, tColor:'#0000', tMargin:10, tDuration:300, shape:0, shapeBorderRadius:4 }; $.iGuider.v.tCanvas.tOpacity = $.iGuider.v.tCanvas.def.tOpacity; $.iGuider.v.tCanvas.tColor = $.iGuider.v.tCanvas.def.tColor; $.iGuider.v.tCanvas.tMargin = $.iGuider.v.tCanvas.def.tMargin; $.iGuider.v.tCanvas.tDuration = $.iGuider.v.tCanvas.def.tDuration; $.iGuider.v.tCanvas.shape = $.iGuider.v.tCanvas.def.shape; $.iGuider.v.tCanvas.shapeBorderRadius = $.iGuider.v.tCanvas.def.shapeBorderRadius; }; $.iGuider.v.tIni = function(){ $.iGuider.v.createCanvas(); $.iGuider.v.setCanvasSize(); $.iGuider.v.setCanvasDefault(); }; $.iGuider.v.tIni(); /**/ /*Any Tour ID*/ /**/ $.iGuider.v.tourid = ''; if($.iGuider.opt.tourTitle){ $.iGuider.v.tourid = $.iGuider.opt.tourTitle; $.iGuider.v.gMapHeader = $('
') .addClass('g-map-header') .html($.iGuider.opt.tourTitle) .appendTo($(':contains([map-header])',mapTemplate).last().empty()); } $.iGuider.v.gMapContent = $('
') .addClass('g-map-content') .appendTo($(':contains([map-content])',mapTemplate).last().empty()); /**/ /*Step can be skipped if you set parameter "skip" to true.*/ /**/ var actualStepsCombine = []; var actualIndex = 0; var uid = 0; var stepReplace = function(hStepItem){ if(!hStepItem.loc){ if($.iGuider.opt.baseurl){ hStepItem.loc = $.iGuider.opt.loc || location.href.split($.iGuider.opt.baseurl)[1]; }else{ hStepItem.loc = $.iGuider.opt.loc || location.href; } } if(typeof hStepItem.keyboardEvent == "undefined"){ hStepItem.keyboardEvent = $.iGuider.opt.keyboardEvent; } /*Set Step Timer*/ if(!parseFloat(hStepItem.timer)){ if(hStepItem.timer === false || hStepItem.timer === 0 || hStepItem.timer === '0'){ hStepItem.timer = false; }else{ if(parseFloat($.iGuider.opt.timer) > 0){ hStepItem.timer = $.iGuider.opt.timer; }else{ hStepItem.timer = false; } } } actualStepsCombine.push(hStepItem); /**/ /*Creating step links*/ /**/ var hStepItemTitle = hStepItem.title ? hStepItem.title : '№'+(actualIndex+1); var hindexStep = $('
'+hStepItemTitle+'
').appendTo($.iGuider.v.gMapContent); if(hStepItem.ready){ addSuccess(hindexStep); } actualIndex++; }; var escapeRe = function (value) { return value.replace(/[\-\[\]{}()*+?.,\\\^$|#\s]/g, "\\$&"); }; if($.iGuider.opt.steps && $.iGuider.opt.steps.length){ for(var i = 0; i < $.iGuider.opt.steps.length; i++){ var skip = $.iGuider.opt.steps[i].skip; if(!skip){ var hStepItem = $.iGuider.opt.steps[i]; if($.iGuider.opt.registerMissingElements || hStepItem.position == 'center'){ stepReplace(hStepItem); }else{ var targetElement; if($(hStepItem.target).length){ targetElement = $(hStepItem.target); }else{ targetElement = $('[data-target ="'+hStepItem.target+'"]'); } if(targetElement.length){ stepReplace(hStepItem); } } } $.iGuider.v.tourid = $.iGuider.v.tourid + $.iGuider.opt.steps[i].target; } $.iGuider.opt.steps = actualStepsCombine; } /**/ /*Save Desktop Events $ Save Touch Events*/ /**/ var iOs = /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream; $.iGuider.v.clickEvent = iOs ? 'touchend' : 'click'; var touchMoving = false; if (iOs){ document.ontouchmove = function(e){ touchMoving = true; }; document.ontouchend = function(e){ setTimeout(function(){ touchMoving = false; },100); }; } var mousemoveEvent = 'mousemove.'+$.iGuider.hName; var mousedownEvent = 'mousedown.'+$.iGuider.hName; var mouseupEvent = 'mouseup.'+$.iGuider.hName; if('ontouchstart' in window){ mousemoveEvent = 'touchmove.'+$.iGuider.hName; mousedownEvent = 'touchstart.'+$.iGuider.hName; mouseupEvent = 'touchend.'+$.iGuider.hName; } $.iGuider.v.mousemoveEvent = mousemoveEvent; $.iGuider.v.mouseupEvent = mouseupEvent; $.iGuider.v.mousedownEvent = mousedownEvent; /**/ /*Detect Privacy Mode in Safari (iOS)*/ /**/ var iOS = !!navigator.platform && /iPad|iPhone|iPod/.test(navigator.platform); if(iOS){ try { localStorage.test = 2; } catch (e) { alert('You are in Privacy Mode\nPlease deactivate Privacy Mode and then reload the page to view the Tour.'); $.fn.iGuider('destroy'); return false; } } /**/ /*This function converts the parameters of the object to a string*/ /**/ var toStringObjIndex = 0; var typeDetect = function(per){ if(typeof per == 'function'){ //function return typeof per; } if(typeof per == 'boolean'){ //boolean return typeof per; } if(typeof per == 'string'){ //string return typeof per; } if(typeof per == 'number'){ //number return typeof per; } if(typeof per == 'object'){ if(Array.isArray(per)){ //Array return 'array'; }else{ //Object return 'object'; } } }; $.iGuider.v.toStringObj = function(obj){ var newIndex = toStringObjIndex++; var objEnter = obj; var tempObj = {}; tempObj[newIndex] = {}; for (var i in objEnter) { if(objEnter.hasOwnProperty(i)){ var key1 = i; var val = objEnter[key1]; //function if(typeDetect(val) == 'function'){ tempObj[newIndex][key1] = val.toString(); } //array if(typeDetect(val) == 'array'){ var valEach = val; for(var f = 0; f < valEach.length; f++){ if(typeDetect(valEach[f]) == 'object'){ var objMass = valEach[f]; var val3 = $.iGuider.v.toStringObj(objMass); valEach[f] = val3; } } tempObj[newIndex][key1] = valEach; } //object if(typeDetect(val) == 'object'){ var val2 = $.iGuider.v.toStringObj(val); tempObj[newIndex][key1] = val2; } //string, number, boolean if(typeDetect(val) == 'string' || typeDetect(val) == 'number' || typeDetect(val) == 'boolean'){ tempObj[newIndex][key1] = objEnter[key1]; } } } return tempObj[newIndex]; }; $.iGuider.v.coneHide = function(){ $.iGuider.v.modalPos.addClass('cone-hide'); }; $.iGuider.v.coneShow = function(){ $.iGuider.v.modalPos.removeClass('cone-hide'); }; $.iGuider.v.selectCallback = function(){ if($.iGuider.opt.steps[$.iGuider.v.startIndex].autofocus !== false){ $(':focus').blur(); $.iGuider.v.targetEl.focus(); } $.iGuider.v.messHide(); $.iGuider.v.messEvHide(); }; $.iGuider.v.posCorrect = function(pos_0, pos_1, pos_2){ if(!pos_0){ pos_0 = $.iGuider.v.modalPos.attr('data-pos'); } if(!pos_1){ pos_1 = $.iGuider.v.modalPos.attr('data-cone'); } if(!pos_2){ pos_2 = $.iGuider.v.modalPos.attr('data-cont'); } var ww = $(window).width(); var sizeW = $.iGuider.v.modalSize.outerWidth(); if(sizeW > (ww - 20)){ $.iGuider.v.modalSize.css({minWidth:(ww - 20)}); } var corrected = false; $.iGuider.v.modalSize.css({marginTop:'', marginLeft:''}); $.iGuider.v.modalPos.css({marginLeft:''}); var sumW = ($.iGuider.v.modalSize.offset().left + $.iGuider.v.modalSize.width()); var wh = $(window).height(); var elOffsetTop = ($.iGuider.v.modalSize.offset().top - $(window).scrollTop()); var sumH = elOffsetTop + $.iGuider.v.modalSize.height(); $.iGuider.v.coneShow(); var corVal; $.iGuider.v.coneCheckHor = function(corVal){ if(pos_0 == 'l' || pos_0 == 'r'){ //hide cone $.iGuider.v.coneHide(); } if(pos_0 == 't' || pos_0 == 'b'){ if(pos_2 == 'r' && corVal > 0){ //hide cone $.iGuider.v.coneHide(); } if(pos_2 == 'l' && corVal < 0){ //hide cone $.iGuider.v.coneHide(); } if(pos_1 == 'c'){ if(pos_2 == 'c'){ if(corVal < 0){ if((corVal-15) < -$.iGuider.v.modalSize.outerWidth()/2){ //hide cone $.iGuider.v.coneHide(); } } if(corVal > 0){ if((corVal+15) > $.iGuider.v.modalSize.outerWidth()/2){ //hide cone $.iGuider.v.coneHide(); } } } if(pos_2 == 'r'){ if(corVal < 0){ if((corVal-15) < -$.iGuider.v.modalSize.outerWidth()){ //hide cone $.iGuider.v.coneHide(); } } } if(pos_2 == 'l'){ if(corVal > 0){ if((corVal+15) > $.iGuider.v.modalSize.outerWidth()){ //hide cone $.iGuider.v.coneHide(); } } } } if(pos_1 == 'r' || pos_1 == 'l'){ if(pos_2 == 'r'){ if(corVal < 0){ if((corVal-15) < -$.iGuider.v.modalSize.outerWidth()){ //hide cone $.iGuider.v.coneHide(); } } } if(pos_2 == 'l'){ if(corVal > 0){ if((corVal+15) > $.iGuider.v.modalSize.outerWidth()){ //hide cone $.iGuider.v.coneHide(); } } } if(pos_2 == 'c'){ if(corVal < 0){ if((corVal-15) < -$.iGuider.v.modalSize.outerWidth()/2){ //hide cone $.iGuider.v.coneHide(); } } if(corVal > 0){ if((corVal+15) > $.iGuider.v.modalSize.outerWidth()/2){ //hide cone $.iGuider.v.coneHide(); } } } } } }; $.iGuider.v.coneCheckVert = function(corVal){ if(pos_0 == 't' || pos_0 == 'b'){ //hide cone $.iGuider.v.coneHide(); } if(pos_0 == 'l' || pos_0 == 'r'){ if(pos_2 == 'b' && corVal > 0){ //hide cone $.iGuider.v.coneHide(); } if(pos_2 == 't' && corVal < 0){ //hide cone $.iGuider.v.coneHide(); } if(pos_1 == 'c'){ if(pos_2 == 'c'){ if(corVal < 0){ if((corVal-15) < -$.iGuider.v.modalSize.outerHeight()/2){ //hide cone $.iGuider.v.coneHide(); } } if(corVal > 0){ if((corVal+15) > $.iGuider.v.modalSize.outerHeight()/2){ //hide cone $.iGuider.v.coneHide(); } } } if(pos_2 == 'b'){ if(corVal < 0){ if((corVal-15) < -$.iGuider.v.modalSize.outerHeight()){ //hide cone $.iGuider.v.coneHide(); } } } if(pos_2 == 't'){ if(corVal > 0){ if((corVal+15) > $.iGuider.v.modalSize.outerHeight()){ //hide cone $.iGuider.v.coneHide(); } } } } if(pos_1 == 'b' || pos_1 == 't'){ if(pos_2 == 'b'){ if(corVal < 0){ if((corVal-15) < -$.iGuider.v.modalSize.outerHeight()){ //hide cone $.iGuider.v.coneHide(); } } } if(pos_2 == 't'){ if(corVal > 0){ if((corVal+15) > $.iGuider.v.modalSize.outerHeight()){ //hide cone $.iGuider.v.coneHide(); } } } if(pos_2 == 'c'){ if(corVal < 0){ if((corVal-15) < -$.iGuider.v.modalSize.outerHeight()/2){ //hide cone $.iGuider.v.coneHide(); } } if(corVal > 0){ if((corVal+15) > $.iGuider.v.modalSize.outerHeight()/2){ //hide cone $.iGuider.v.coneHide(); } } } } } }; /*start correct*/ /*for horizontal correct*/ if(sumW > (ww - 10)){ corrected = true; corVal = -((sumW - ww)+10); $.iGuider.v.modalSize.css({marginLeft:corVal}); $.iGuider.v.coneCheckHor(corVal); } if($.iGuider.v.modalSize.offset().left < 10){ corrected = true; corVal = -$.iGuider.v.modalSize.offset().left+10; $.iGuider.v.modalSize.css({marginLeft:corVal}); $.iGuider.v.coneCheckHor(corVal); } /*for vertical correct*/ if(sumH > (wh - 10)){ corrected = true; corVal = -((sumH - wh)+10); $.iGuider.v.modalSize.css({marginTop:corVal}); $.iGuider.v.coneCheckVert(corVal); } if(elOffsetTop < 10){ corrected = true; corVal = (elOffsetTop*-1+10); $.iGuider.v.modalSize.css({marginTop:corVal}); $.iGuider.v.coneCheckVert(corVal); } /*end correct*/ if(pos_0 == 'c' && pos_1 == 'c' && pos_2 == 'c'){ $.iGuider.v.modalSize.css({marginLeft:''}); } if(pos_2 !== 'c' && corrected){ //hide cone //$.iGuider.v.coneHide(); } if($.iGuider.v.modalSize.height() > wh - 20){ //hide cone $.iGuider.v.coneHide(); } if(corrected){ $.iGuider.v.modalPos.addClass('g-pos-correct'); }else{ $.iGuider.v.modalPos.removeClass('g-pos-correct'); } }; $.iGuider.v.play = function(){ if ($.iGuider.opt.play !== undefined) { try{ var play_Func = new Function('return ' + $.iGuider.opt.play)(); play_Func(); }catch(e) { $.iGuider.v.debug(new Error().lineNumber+ ' The callback function specified is not correct.'); } } }; $.iGuider.v.pause = function(){ if ($.iGuider.opt.pause !== undefined) { try{ var pause_Func = new Function('return ' + $.iGuider.opt.pause)(); pause_Func(); }catch(e) { $.iGuider.v.debug(new Error().lineNumber+ ' The callback function specified is not correct.'); } } }; /*Callback functions*/ $.iGuider.v.start = function(){ localStorage.setItem('iGuider_event','start'); if ($.iGuider.opt.start !== undefined) { try{ var start_Func = new Function('return ' + $.iGuider.opt.start)(); start_Func(); }catch(e) { $.iGuider.v.debug(new Error().lineNumber+ ' The callback function specified is not correct.'); } } }; $.iGuider.v.end = function(){ localStorage.setItem('iGuider_event','end'); //$.iGuider.v.progressFunc(0); if ($.iGuider.opt.end !== undefined) { try{ var end_Func = new Function('return ' + $.iGuider.opt.end)(); end_Func(); }catch(e) { $.iGuider.v.debug(new Error().lineNumber+ ' The callback function specified is not correct.'); } } }; $.iGuider.v.abort = function(){ localStorage.setItem('iGuider_event','abort'); localStorage.setItem('iGuider_restored','0'); localStorage.removeItem('iGuider_opt'); localStorage.removeItem('iGuider_step'); if ($.iGuider.opt.abort !== undefined) { try{ var abort_Func = new Function('return ' + $.iGuider.opt.abort)(); abort_Func(); }catch(e) { $.iGuider.v.debug(new Error().lineNumber+ ' The callback function specified is not correct.'); } } }; $.iGuider.v.finish = function(){ localStorage.setItem('iGuider_event','finish'); if ($.iGuider.opt.finish !== undefined) { try{ var finish_Func = new Function('return ' + $.iGuider.opt.finish)(); finish_Func(); }catch(e) { $.iGuider.v.debug(new Error().lineNumber+ ' The callback function specified is not correct.'); } } localStorage.removeItem('iGuider_step'); localStorage.removeItem('iGuider_opt'); localStorage.removeItem('iGuider_data-'+$.iGuider.opt.tourID); localStorage.removeItem('itour_options'); }; $.iGuider.v.create = function(){ localStorage.setItem('iGuider_event','create'); if ($.iGuider.opt.create !== undefined) { try{ var create_Func = new Function('return ' + $.iGuider.opt.create)(); create_Func(); }catch(e) { $.iGuider.v.debug(new Error().lineNumber+ ' The callback function specified is not correct.'); } } if(!$.iGuider.opt.steps){ localStorage.setItem('iGuider_event','no_steps'); } }; $(document).on('keydown.iGuider',function(e){ if($.iGuider){ if(!$.iGuider.v.design){ if($.iGuider.opt.keyboard){ if(parseFloat(e.keyCode) == 27){ $.iGuider.v.debug(new Error().lineNumber+ ' Click Esc and Destroy'); $.iGuider.v.end(); $.iGuider.v.abort(); $.fn.iGuider('destroy'); } if(parseFloat(e.keyCode) == 39){ $.iGuider.v.debug(new Error().lineNumber+ ' Click Keyboard Next'); iGuider('next'); } if(parseFloat(e.keyCode) == 37){ $.iGuider.v.debug(new Error().lineNumber+ ' Click Keyboard Prev'); iGuider('prev'); } if(parseFloat(e.keyCode) == 13){ $.iGuider.v.debug(new Error().lineNumber+ ' Click Keyboard Enter'); if($('html').is('.g-modal-intro-show')){ $.iGuider.v.debug(new Error().lineNumber+ ' Click Keyboard Start'); $.iGuider.v.modalStart.addClass('active'); $.iGuider.v.modalStart.trigger('click'); } if($('html').is('.g-modal-continue-show')){ $.iGuider.v.debug(new Error().lineNumber+ ' Click Keyboard Continue'); $.iGuider.v.modalBeginContinue.addClass('active'); $.iGuider.v.modalBeginContinue.trigger('click'); } } } } } }); /**/ /*Overlay Elements Positioning*/ /**/ $.iGuider.v.overlayPos = function(targetEl){ $.iGuider.v.debug(new Error().lineNumber+ ' Start overlayPos func'); if(targetEl && targetEl.length){ $.iGuider.v.modalData = []; var vw = $(window).width(); var vh = $(window).height(); var wst = $(window).scrollTop(); var wsl = $(window).scrollLeft(); var indent = 10; targetEl.each(function(i){ var targetElItem = $(this); var targetElWidth = Math.round(targetElItem.outerWidth()); var targetElHeight = Math.round(targetElItem.outerHeight()); var targetElTop = Math.round(targetElItem.offset().top); var targetElLeft = Math.round(targetElItem.offset().left); /**/ /*Specifies the data for the starting step*/ /**/ var targetOpt = $.iGuider.opt.steps[$.iGuider.v.startIndex]; var contentPos = $.trim(targetOpt.position).split(''); var top; var left; var blockTransLeft = '0'; var blockTransTop = '0'; var blockLeft; var blockTop; if($.iGuider.opt.steps){ if($.iGuider.opt.steps[$.iGuider.v.startIndex].disable){ $('html').addClass('g-disable'); }else{ $('html').removeClass('g-disable'); } var setSpacing = $.iGuider.v.tCanvas.tMargin; /*Set Width of Message Block*/ var widthVal = ''; var widthPar = $.iGuider.opt.steps[$.iGuider.v.startIndex].width || $.iGuider.opt.width; if(widthPar){ widthVal = widthPar; widthVal = widthVal.toString(); if(widthVal.search('%') != -1 || widthVal.search('vw') != -1){ widthVal = widthVal.replace('%','vw'); }else{ widthVal = parseFloat(widthVal); } } $.iGuider.v.modalSize.css({minWidth:widthVal}); /*Set Background of Message Block*/ var bgColorPar = $.iGuider.opt.steps[$.iGuider.v.startIndex].bgColor || $.iGuider.opt.bgColor; if(bgColorPar){ $.iGuider.v.modalTimerControll.css({background:bgColorPar}); $.iGuider.v.modalSize.css({background:bgColorPar}); $.iGuider.v.modalPos.css({color:bgColorPar}); }else{ $.iGuider.v.modalTimerControll.css({background:''}); $.iGuider.v.modalSize.css({background:''}); $.iGuider.v.modalPos.css({color:''}); } /*Set Title Color of Message Block*/ var titleColorPar = $.iGuider.opt.steps[$.iGuider.v.startIndex].titleColor || $.iGuider.opt.titleColor; if(titleColorPar){ $.iGuider.v.modalHeader.css({color:titleColorPar}); }else{ $.iGuider.v.modalHeader.css({color:''}); } /*Set Content Color of Message Block*/ var modalContentColorPar = $.iGuider.opt.steps[$.iGuider.v.startIndex].modalContentColor || $.iGuider.opt.modalContentColor; if(modalContentColorPar){ $.iGuider.v.modalBody.css({color:modalContentColorPar}); }else{ $.iGuider.v.modalBody.css({color:''}); } /*Set Pagination Color of Message Block*/ var paginationColorPar = $.iGuider.opt.steps[$.iGuider.v.startIndex].paginationColor || $.iGuider.opt.paginationColor; if(paginationColorPar){ $('#paginationColorStyle').remove(); $('