// Staya Widget helper...
var SWH = {};

SWH.TPL = function (tpl,dict) {
    if(typeof tpl == "undefined")
        return '';
  return tpl.replace(
    /\{([\w-]+)\}/g,
    function(str,key){
      return dict[key]||(typeof(dict[key])=='number'?0:'');
    }
  );
}

SWH.copy = function(src) {
    return JSON.parse(JSON.stringify(src));
}

SWH.trim = function(str) {
    return str.replace(/^\s\s*/, '').replace(/\s\s*$/, '');
}

SWH.CP = function(dst,src,def)
{
    var o = SWH.copy(src);
    for(var i in src) dst[i]=o[i];
    return dst;
}

if(!Function.prototype.bind)
Function.prototype.bind=function(scope)
{
    var fn=this;
    if(arguments.length<2){
        return function(){
            return fn.apply(scope, arguments);
        };
    }else{
        var args=Array.prototype.slice.call(arguments,1);
        return function(){
            return fn.apply(scope, args.concat(Array.prototype.slice.call(arguments,0)));
        };
    }
};

SWH.JS_CLASS = function(superclass, overrides)
{
    var subclass, F, supp, subp, i, s, d;

    // normalize params
    i=superclass instanceof Function;
    overrides=overrides || !i && superclass || {};
    superclass=i && superclass || null;

    // find subclass constructor
    if(overrides.constructor!=Object.prototype.constructor)
        subclass=overrides.constructor, delete overrides.constructor;
    else if(superclass)
        subclass=function(){ arguments.callee.SWH_SUPER.apply(this,arguments); };
    else
        subclass=function(){};

    if(!superclass){
        subclass.prototype=overrides;
    }else{
        // prototyping
        F=function(){};
        supp=F.prototype=superclass.prototype;
        subp=subclass.prototype=new F();
        subp.constructor=subclass;
        subclass.SWH_SUPER=superclass;

        if(supp.constructor==Object.prototype.constructor)
            supp.constructor=superclass;

        for(i in overrides){
            s=overrides[i], d=subp[i];
            if(s instanceof Function && d instanceof Function)
                s.SWH_SUPER=d;
            subp[i]=s;
        }
    }

    return this.constructor==arguments.callee ? new subclass() : subclass;
}

function SWH_SUPER(scope,args)
{
    var fn=args.callee.SWH_SUPER;
    if(arguments.length>2)
        args=Array.prototype.slice.call(arguments,2);
    return fn && fn.apply(scope,args);
}

SWH.E = function(el)
{
    if (typeof el == 'string') {
        if (el.charAt(0) == '.') {
            return DOMQUERY.down(document.body, el);
        }
        else {
            return document.getElementById(el);
        }
    }
    else {
        return (el||null);
    }
};


SWH.WidgetProto = SWH.JS_CLASS({
  
  remoteWorkText: 'удаленно',

  init: function () {
    
    

     if (parseInt(StayaWidgetParams.borderthickness) == 3) {
        StayaWidgetParams.cornerWtop = 3;
        StayaWidgetParams.cornerWbottom = -4;
      }
      else
      if (parseInt(StayaWidgetParams.borderthickness) == 2) {
        StayaWidgetParams.cornerWtop = 3;
        StayaWidgetParams.cornerWbottom = -4;
      }
      else {
        StayaWidgetParams.cornerWtop = 1;
        StayaWidgetParams.cornerWbottom = -2;
      }

    if (StayaWidgetParams.cell_width=='auto' ||
      (StayaWidgetParams.cell_width.indexOf && StayaWidgetParams.cell_width.indexOf('%') >= 0)) {
      StayaWidgetParams.cell_width2 = StayaWidgetParams.cell_width;
    }
    else {
      StayaWidgetParams.cell_width2 = StayaWidgetParams.cell_width - 2 * parseInt(StayaWidgetParams.borderthickness) + 'px';
      StayaWidgetParams.cell_width = StayaWidgetParams.cell_width  + 'px';
    }

    if (StayaWidgetParams.cell_height=='auto' ||
      (StayaWidgetParams.cell_height.indexOf && StayaWidgetParams.cell_height.indexOf('%') >= 0))  {
      StayaWidgetParams.cell_height2 = StayaWidgetParams.cell_height;
    }
    else {
      StayaWidgetParams.cell_height2 = StayaWidgetParams.cell_height - 2 * parseInt(StayaWidgetParams.borderthickness) + 'px';
      StayaWidgetParams.cell_height = StayaWidgetParams.cell_height + 'px';
    }

    if (StayaWidgetParams.borderthickness && parseInt(StayaWidgetParams.borderthickness) > 2) {
        StayaWidgetParams.borderthickness = '2px';
    }

    if (StayaWidgetParams.border == 'false') {
      StayaWidgetParams.border = false;
    }

    if (!StayaWidgetParams.border) {
        StayaWidgetParams.borderthickness = 0;
    }

    if (StayaWidgetParams.verticalWidget == true || StayaWidgetParams.verticalWidget == 'true') {
        StayaWidgetParams.verticalWidget = true;
    }
    else {
        StayaWidgetParams.verticalWidget = false;
        if (StayaWidgetParams.cell_h_width) {
          StayaWidgetParams.cell_width =  StayaWidgetParams.cell_h_width;
          if (StayaWidgetParams.cell_width.indexOf && StayaWidgetParams.cell_width != 'auto' && StayaWidgetParams.cell_width.indexOf('%') == -1) {
            StayaWidgetParams.cell_width = StayaWidgetParams.cell_width + 'px';
          }
        }
    }

    StayaWidgetParams.cellDividerStyle = 'display:none';
    if (StayaWidgetParams.cell_divider_color && StayaWidgetParams.cell_divider_thickness) {
        var borderStyle = StayaWidgetParams.verticalWidget ? 'border-bottom' : 'border-right';
        StayaWidgetParams.cellDividerStyle = 'box-sizing: border-box; ' + borderStyle + ': solid ' + StayaWidgetParams.cell_divider_thickness + ' ' + StayaWidgetParams.cell_divider_color;
    }

    /*StayaWidgetParams.hideJobButton =
      StayaWidgetParams.hideJobButton == true
      || StayaWidgetParams.hideJobButton == 'true';*/

    StayaWidgetParams.jobButtonStyle = StayaWidgetParams.hideJobButton
      ? "display: none"
      : "";

    var self = this;
    xdLocalStorage.init(
        {
            iframeUrl: StayaWidgetParams.iframeUrl,
            initCallback: function () {
                self.getLastProfAreas();
            }
        }
    );
  },

  getLastProfAreas: function () {
      clearInterval(this.getDataWithoutProfAreasInt);
      var self = this;
      try {

        xdLocalStorage.getItem('last-selected-prof-areas', function (data) {
            self.lastProfAreas = data.value;
            xdLocalStorage.getItem('last-viewed-jobs', function (data) {
                self.lastViewedJobs = data.value;
                xdLocalStorage.getItem('jobs-with-feedback', function (data) {
                  self.jobsWithFeedback = data.value;
                  self.getData();
                })
            });

        });
      }
      catch (e) {
        this.getData();
      }
  },

  jsonpData: null,

  getDataWithoutProfAreas: function () {
    this.getData();
  },

  getData: function (lastProfAreas) {

    var siteUrl = StayaWidgetIncomeParams.path ? '//'+StayaWidgetIncomeParams.path : StayaWidgetIncomeParams.siteUrl;


    var api = siteUrl+"/dapi/widget?offset=0&limit=" + StayaWidgetParams.numvac +
      "&order_by=date_update&direction=desc&locale=" + StayaWidgetParams.locale + (StayaWidgetParams.placeid ? '&placeid=' + StayaWidgetParams.placeid : '');

    {
      var metaText = '';
      var metas = document.getElementsByTagName('meta');

      for (var i=0; i < metas.length; i++) {
        var name = metas[i].getAttribute("name");
        if (!name)
          name = metas[i].getAttribute("property");

        if (name == "keywords"
          || name == "description"
          || name == "og:title"
          || name == "og:description"
        )
        {
          if (metaText != '')
            metaText += ' ';

          metaText += metas[i].getAttribute("content");
        }
      }

      if (!!metaText)
        api += '&meta=' + encodeURIComponent(SWH.trim(metaText));
    }

    api += '&title=' + encodeURIComponent(SWH.trim(document.title));

    /*if (this.lastProfAreas) {
      var lastProfAreasArray = JSON.parse(this.lastProfAreas);
      api += '&lastprofareas=' + lastProfAreasArray.join();
      api += '&prof_areas=' + lastProfAreasArray.slice(0, 3).join();
    }

    if (this.lastViewedJobs) {
      api += '&lastviewedjobs=' + JSON.parse(this.lastViewedJobs).join();
    }

    if (this.jobsWithFeedback) {
      api += '&jobswithfeedback=' + JSON.parse(this.jobsWithFeedback).join();
    }*/

    var script = document.createElement('script');
    script.src = api +'&r='+Math.random();

    document.body.appendChild(script);

  },

  prepareFieldsforListing: function(list) {
      for (var i=0; i < list.length; i++) {
          var v = list[i];
          if (!v.salary_from) {
              v.salary_undefined = true;
          }
          v.cityForListing =  (v.city && v.city.name) ? v.city.name +  (v.city.region ? ', ' + v.city.region : '') : StayaWidgetParams.remoteWorkText;
      }
      if (list.length) {
          list[list.length - 1].lastItem = true;
      }
  },

  jsonp_callback: function(data) {
      this.stayaJsonpData = data;
      this.prepareFieldsforListing(data.list || []);
      SWH.listController = new SWH.ListController();
  }

})

var DOMQUERY={};

DOMQUERY.select = function(root, selector, one)
{
    root = root || document;
    if (one)
        return root.querySelector(selector);

    var ar=[], col=root.querySelectorAll(selector);
    for (var i=0, n=col.length; i<n; i++)
        ar[i]=col[i];
    return ar;
};

DOMQUERY.down = function(node, selector){ return DOMQUERY.select(node, selector, true) };

DOMQUERY.up = function(node, selector)
{
    if(!node) return null;

    var s1, p = node;

    switch (selector.charAt(0)) {
    case '#':
        s1 = selector.slice(1);
        while ((p=p.parentNode))
            if (p.id == s1) return p;
        break;
    case '.':
        s1 = ' ' + selector.slice(1) + ' ';
        while ((p=p.parentNode))
            if ((' ' + p.className + ' ').indexOf(s1) != -1) return p;
        break;
    default:
        while ((p=p.parentNode))
            if (p.nodeName.toLowerCase() === selector) return p;
    }
    return null;

};

SWH.ListController = SWH.JS_CLASS({

    vacancies: null,
    verticalWidget: false,


hTpl: '<a id="{vacCellId}" href="//{path}/job/{vacancy_id}?utm_source={path}&utm_campaign=staya_widget&utm_medium=display" target="_blank" onclick="SWH.listController.handleOpenVacancyClick({vacancy_id})" class=" b-widget-tile stayaWidget__cell_height stayaWidget__border" style=" width: {cell_width};">\
    <div class="stayaWidget__cell_height b-widget-h-tile__wrap">\
      <div class="b-widget-tile__company">\
        <div class="g-pad-l-0" style="max-width: {cell_width};">\
            <span class="b-widget-tile__company__text m-text-color1 g-pad-l-0" style="color: {text_body_color};">\
               {vacancy_user_name}\
            </span>\
        </div>\
      </div>\
      <div class="b-widget-tile__position_title" >\
        <div id="{vacancyTopicHId}" class="b-widget-tile__position_title_text" style="max-width: {cell_width};">\
          {vacancy_topic}\
        </div>\
      </div>\
      <div class="b-vac-tile__position_tags g-w-100"  >\
        <div class="b-table-row-mobile__tags">\
          <div class="b-table-row-mobile__tags__tag m-border-color" style="border: solid 1px {border_color}; max-width: {cell_width};" >\
            {cityForListing}\
          </div>\
          <div class="b-table-row-mobile__tags__tag m-border-color" style="border: solid 1px {border_color}; max-width: {cell_width};">\
            {job_type}\
          </div>\
        </div>\
      </div>\
      <div class="b-widget-tile__income" style="{vacancy_salary_from_display}; max-width: {cell_width};" >\
        <span style=" "><span class="b-widget-tile__income__label-text">{incomeText}:</span> {vacancy_salary_from} <span class="b-widget-tile__income__cur">{vacancy_salary_currency_symbol}</span> </span>\
      </div>\
      <div class="b-vac-tile__description js-hor-widget-description" style="color: {text_body_color}; max-width: {cell_width};" >\
        {vacancy_description_short}\
      </div>\
      <div class="b-vac-tile__resp-btn-wrap" >\
        <div class="b-vac-tile__resp-btn" style="border: solid 1px {border_color}; color: {text_body_color}; " >\
          {jobResponseText}\
        </div>\
      </div>\
    </div>\
  </a><div class="b-widget-h-divider" style="{cellDividerStyle};"></div>',

vTpl: '<a id="{vacCellId}" href="//{path}/job/{vacancy_id}?utm_source={path}&utm_campaign=staya_widget&utm_medium=display" \
target="_blank" \
onclick="SWH.listController.handleOpenVacancyClick({vacancy_id})" \
class=" b-widget-tile b-widget-v-tile__wrap b-widget stayaWidget__border" \
style="width: {cell_width}; display: table-row; ">\
      <div class="b-widget-tile__company">\
        <div class="g-pad-l-0" style="max-width: {cell_width}; line-height: 14px; ">\
                <span class="b-widget-tile__company__text b-widget-tile__company__text-tp m-text-color1 g-pad-l-0" style="color: {text_body_color};">\
                   {vacancy_user_name}\
                </span>\
        </div>\
      </div>\
      <div class="b-widget-tile__position_title" >\
        <div id="{vacancyTopicVId}" class="b-widget-tile__position_title_text b-widget-tile__position_title_text-tp" style=" max-width: {cell_width};">\
          {vacancy_topic}\
        </div>\
      </div>\
      <div class="b-widget-tile__income" style="{vacancy_salary_from_display}; max-width: {cell_width};" >\
        <span style=" "><span class="b-widget-tile__income__label-text">{incomeText}:</span> {vacancy_salary_from} <span class="b-widget-tile__income__cur">{vacancy_salary_currency_symbol}</span> </span>\
      </div>\
      <div class="b-vac-tile__position_tags g-w-100">\
        <div class="b-table-row-mobile__tags">\
          <div class="b-table-row-mobile__tags__tag m-border-color" style="border: solid 1px {border_color}; max-width: {cell_width};" >\
            {cityForListing}\
          </div>\
          <div class="b-table-row-mobile__tags__tag m-border-color" style="border: solid 1px {border_color}; max-width: {cell_width};">\
            {job_type}\
          </div>\
        </div>\
      </div>\
      <div class="b-vac-tile__description" style="color: {text_body_color}; max-width: {cell_width};" >\
        {vacancy_description_short}\
      </div>\
      <div class="b-vac-tile__resp-btn-wrap" >\
        <div class="b-vac-tile__resp-btn" style="border: solid 1px {border_color}; color: {text_body_color}; " >\
          {jobResponseText}\
        </div>\
      </div>\
      <div class="b-widget-v-divider" style="max-width: {cell_width}; {cellDividerStyle};"></div>\
      <div class="b-widget-tile__corner" style="border-bottom-color: {border_color}; {vacancyCornerDisplay}; "; >\
  </div>\
  <div class="b-widget-tile__corner-w"  style="border-bottom-color: {background_color}; top: {cornerWtop}px; margin-top: -1px; {vacancyCornerDisplay}; ">\
  </div>\
  </a>',

pageTpl: '<style>\
  {widgetCSS}\
  </style>\
  <div style="display: none;" class="g-w-100 staya_job_container2"   >\
  <div class="b-widget-table " style="{vWidgetDisplay}; width: 100%;" >\
  <a href="//{path}/" target="_blank" onclick="SWH.listController.handleCreateVacancyClick()" class="b-widget-table__v-post-vac b-widget-table__v-post-vac-tp" style=" width: {cell_width};  " >\
  {postJobText}\
</a>\
  </div>\
  <div class="b-widget-table " style="{vWidgetDisplay}; width: {cell_width};" >\
{vListHTML}\
</div>\
<div class="b-widget-table " style="{hWidgetDisplay};  position: relative; width: {cell_width}; " >\
<a href="//{path}/" target="_blank" onclick="SWH.listController.handleCreateVacancyClick()" class="b-widget-table__h-post-vac" style=" width: {cell_width};  " >\
  {postJobText}\
</a>\
</div>\
<div class="b-widget-table " style="{hWidgetDisplay};  position: relative; " >\
   {hListHTML}\
  <div class="b-widget-tile__corner {cornerDisplay}" style=" border-bottom-color: {border_color}; position: absolute;bottom: 0;right: 0; " >\
  </div>\
  <div class="b-widget-tile__corner-w {cornerDisplay}"  style=" border-bottom-color: {background_color};   bottom: {cornerWbottom}px; right: -2px; position: absolute; margin-right: 0px;">\
  </div>\
</div>\
<div ng-show="SWH.listController.errorMsg" class=" " style="display: none;" >\
  Что то пошло не так... Мы не смогли получить данные, но Стая не бросает своих — попробуйте повторить попытку через несколько минут.\
</div>\
</div>',    

    constructor: function () {

        var self = this;

        this.vacancies = SWH.Widget.stayaJsonpData.list;
        if (this.vacancies) {
          this.vacancies = this.vacancies.slice(0, StayaWidgetParams.numvac);
        }

        SWH.CP(this, StayaWidgetParams);

        this.refresh()

        SWH.E('.staya_job_container2').style.display = 'block';

        this.initGA();

    },

    refresh: function () {

        var renderParams = SWH.copy(StayaWidgetParams);

        renderParams.vWidgetDisplay = StayaWidgetParams.verticalWidget ? 'display: table' :  'display: none';
        renderParams.hWidgetDisplay = !StayaWidgetParams.verticalWidget ? 'display: table' :  'display: none';
        renderParams.vWidgetDisplayGrid = StayaWidgetParams.verticalWidget ? 'display: grid' :  'display: none';
        renderParams.hWidgetDisplayGrid = !StayaWidgetParams.verticalWidget ? 'display: grid' :  'display: none';
        renderParams.cornerDisplay = StayaWidgetParams.border ? '' : 'b-staya-widget-hidden';

        renderParams.vListHTML = this.getListHTML(this.vTpl);
        renderParams.hListHTML = this.getListHTML(this.hTpl);

        renderParams.widgetCSS =  SWH.TPL(SWH.cssTpl, renderParams);

        if (StayaWidgetParams.container && document.getElementById(StayaWidgetParams.container)) {
          var containerEl = document.getElementById(StayaWidgetParams.container);
          if (!StayaWidgetParams.verticalWidget) {
             containerEl.className += ' b-staya-widget-hor';
          }
          else {
              containerEl.className += ' b-staya-widget-vert';
          }
          containerEl.innerHTML = SWH.TPL(this.pageTpl, renderParams);
        }
        else {
          var d = document.createElement("div");
          d.innerHTML = SWH.TPL(this.pageTpl, renderParams);
          document.body.appendChild(d);
        }
        //this.startAnim();
    },

    getListHTML: function (tpl) {
        var h = [];
        for (var i=0; i < this.vacancies.length; i++) {
            var v= this.vacancies[i];
            if (v.topic === 'disabled') continue
            var p = SWH.copy(StayaWidgetParams);
            p.vacancyTopicVId = 'stayaWidgetItemV' + i;
            p.vacancyTopicHId = 'stayaWidgetItemH' + i;

            p.cellDividerStyle = v.lastItem ? 'display: none' : p.cellDividerStyle;
            p.vacancy_id = v.id;

            if (v.user) {
              p.vacancy_user_name = v.user.name;
            }
            else {
              p.vacancy_user_name = "company NO DATA";
            }

            p.vacancy_topic = v.topic;
            p.cityForListing = v.cityForListing;
			if (v.job_types != 'undefined' && v.job_types.length != 0)
				p.job_type = v.job_types[0].name;
			else
				p.job_type = '';
            p.vacancy_salary_from = v.salary_from;
            p.vacancy_description_short = v.description_short;

            p.vacancy_salary_currency_symbol = v.salary_currency.symbol;
            p.vacancy_salary_from_display = v.salary_from ? 'display: block' : 'display: none';
            p.vacancy_salary_undef_display = v.salary_from ? 'display: none' : 'display: block';
            p.vacancyCornerDisplay = v.lastItem && p.border ? 'display: block' : 'display: none';
            h.push(SWH.TPL(tpl, p));
        }
        return h.join('');
    },

    initGA: function () {
        if (typeof(ga) == 'undefined') {
            (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function() {
              (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
              m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
              })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

        }
        this.initGATracker();
        ga('stayaWidgetTracker.send', 'event', 'Widget', 'Showed', 'Showed', 1);
    },

    initGATracker: function (e) {
      ga('create', 'UA-61115176-3', 'auto', 'stayaWidgetTracker');
    },

    handleCreateVacancyClick: function (e) {
        if (typeof(ga) != 'undefined') {
            this.initGATracker();
            ga('stayaWidgetTracker.send', 'event', 'Widget', StayaWidgetParams.gaCreateVacEventName,  StayaWidgetParams.path, 1);
        }
    },

    handleOpenVacancyClick: function (vacancy_id) {
        if (typeof(ga) != 'undefined') {
            this.initGATracker();
            ga('stayaWidgetTracker.send', 'event', 'Widget', StayaWidgetParams.gaFeedbackEventName, StayaWidgetParams.gaFeedbackEventName, vacancy_id);
        }
    },

    lowestOpacity: 35,
    animTimout: 100,
    animCircleCounter: 0,
    animCircleNumRepeats: 3,
    newCircleRepeatTimeout: 2000,

    startAnim: function () {
      this.animFrameInterval = setInterval(this.animFrame.bind(this), this.animTimout);
    },

    animFrame: function () {
      for (var i=0; i < this.vacancies.length; i++) {
          if (this.animState[i].animOn) {

            var elV = document.getElementById('stayaWidgetItemV' + i);
            var elH = document.getElementById('stayaWidgetItemH' + i);

            if (elV && this.animState[i].animOn) {

              this.animState[i].o += this.animState[i].animStep;
              if (this.animState[i].o <= this.lowestOpacity) {
                this.animState[i].o = this.lowestOpacity;
                this.animState[i].animStep = -this.animState[i].animStep;
              }
              else if (this.animState[i].o >= 100) {
                this.animState[i].animOn = false;
                this.animState[i].o = 100;
                this.animState[i].animStep = -this.animState[i].animStep;
              }

              if (this.animState[i].o < 70) {
                if (i < this.vacancies.length - 1) {
                    this.animState[i + 1].animOn=true;
                  }
                  else {
                    this.animCircleCounter++;
                    if (this.animCircleCounter < this.animCircleNumRepeats) {
                      this.animState[0].animOn=true;
                    }
                    else {
                      if (!this.startNewCircleTimeout) {
                        this.startNewCircleTimeout = setTimeout(this.startNewCircle.bind(this), this.newCircleRepeatTimeout);
                      }
                    }
                  }
              }

              elV.style.opacity = this.animState[i].o / 100;
              elH.style.opacity = this.animState[i].o / 100;

            }
          }
      }
    },

    startNewCircle: function () {
      if (this.startNewCircleTimeout)
          delete this.startNewCircleTimeout;
      this.animCircleCounter = 0;
      this.animState[0].animOn = true;
    },

});


/**
 * Created by dagan on 07/04/2014.
 */
/* global console, XdUtils */

window.XdUtils = window.XdUtils || (function () {

  function extend(object, defaultObject) {
    var result = defaultObject || {};
    var key;
    for (key in object) {
      if (object.hasOwnProperty(key)) {
        result[key] = object[key];
      }
    }
    return result;
  }

  //public interface
  return {
    extend : extend
  };
})();

window.xdLocalStorage = window.xdLocalStorage || (function () {
  var MESSAGE_NAMESPACE = 'cross-domain-local-message';
  var options = {
    iframeId: 'cross-domain-iframe',
    iframeUrl: undefined,
    initCallback: function () {}
  };
  var requestId = -1;
  var iframe;
  var requests = {};
  var wasInit = false;
  var iframeReady = true;

  function applyCallback(data) {
    if (requests[data.id]) {
      requests[data.id](data);
      delete requests[data.id];
    }
  }

  function receiveMessage(event) {
    var data;
    try {
      data = JSON.parse(event.data);
    } catch (err) {
      //not our message, can ignore
    }
    if (data && data.namespace === MESSAGE_NAMESPACE) {
      if (data.id === 'iframe-ready') {
        iframeReady = true;
        options.initCallback();
      } else {
        applyCallback(data);
      }
    }
  }

  function buildMessage(action, key, value, callback) {
    requestId++;
    requests[requestId] = callback;
    var data = {
      namespace: MESSAGE_NAMESPACE,
      id: requestId,
      action: action,
      key: key,
      value: value
    };
    iframe.contentWindow.postMessage(JSON.stringify(data), '*');
  }
  function init(customOptions) {
    options = XdUtils.extend(customOptions, options);
    var temp = document.createElement('div');

    if (window.addEventListener) {
      window.addEventListener('message', receiveMessage, false);
    } else {
      window.attachEvent('onmessage', receiveMessage);
    }

    temp.innerHTML = '<iframe id="' + options.iframeId + '" src=' + options.iframeUrl + ' style="display: none;"></iframe>';
    document.body.appendChild(temp);
    iframe = document.getElementById(options.iframeId);
  }

  function isApiReady() {
    if (!wasInit) {
      console.log('You must call xdLocalStorage.init() before using it.');
      return false;
    }
    if (!iframeReady) {
      console.log('You must wait for iframe ready message before using the api.');
      return false;
    }
    return true;
  }

  return {
    //callback is optional for cases you use the api before window load.
    init: function (customOptions) {
      if (!customOptions.iframeUrl) {
        throw 'You must specify iframeUrl';
      }
      if (wasInit) {
        console.log('xdLocalStorage was already initialized!');
        return;
      }
      wasInit = true;
      /*if (document.readyState === 'complete') {
        init(customOptions);
      } else {
        window.onload = function () {
          init(customOptions);
        };
      }*/
      init(customOptions);
    },
    setItem: function (key, value, callback) {
      if (!isApiReady()) {
        return;
      }
      buildMessage('set', key, value, callback);
    },

    getItem: function (key, callback) {
      if (!isApiReady()) {
        return;
      }
      buildMessage('get', key,  null, callback);
    },
    removeItem: function (key, callback) {
      if (!isApiReady()) {
        return;
      }
      buildMessage('remove', key,  null, callback);
    },
    key: function (index, callback) {
      if (!isApiReady()) {
        return;
      }
      buildMessage('key', index,  null, callback);
    },
    getSize: function(callback) {
      if(!isApiReady()) {
        return;
      }
      buildMessage('size', null, null, callback);
    },
    clear: function (callback) {
      if (!isApiReady()) {
        return;
      }
      buildMessage('clear', null,  null, callback);
    },
    wasInit: function () {
      return wasInit;
    }
  };
})();


    var StayaWidgetDefaultPath = 'jobs.staya.vc';
  var StayaWidgetDefault_border_color = '#ccc';

  StayaWidgetDefault_border_color = '#3d5aa9';

    var StayaWidgetIncomeParams = {
    siteUrl: '//' + StayaWidgetDefaultPath,
  };

      StayaWidgetIncomeParams.path = 'jobs.3dyuriki.com';
      StayaWidgetIncomeParams.branding = 'true';
      StayaWidgetIncomeParams.cell_width = '500';
      StayaWidgetIncomeParams.locale = 'RU';
      StayaWidgetIncomeParams.background_color = '#f6f6f6';
      StayaWidgetIncomeParams.text_head_color = '#000';
      StayaWidgetIncomeParams.text_body_color = '#000';
      StayaWidgetIncomeParams.border = 'true';
      StayaWidgetIncomeParams.borderthickness = '3px';
      StayaWidgetIncomeParams.border_color = '#e2259b';
      StayaWidgetIncomeParams.container = 'staya_jobs_container';
  
  var StayaWidgetParams = {
  base_url: StayaWidgetIncomeParams.base_url ? StayaWidgetIncomeParams.base_url : '',
  numvac: StayaWidgetIncomeParams.numvac ? StayaWidgetIncomeParams.numvac : 3,
  gaFeedbackEventName: StayaWidgetIncomeParams.gaFeedbackEventName ? StayaWidgetIncomeParams.gaFeedbackEventName : 'Job clicked',
  gaCreateVacEventName: StayaWidgetIncomeParams.gaCreateVacEventName ? StayaWidgetIncomeParams.gaCreateVacEventName : 'From widget create job clicked',
  path: StayaWidgetIncomeParams.path ? StayaWidgetIncomeParams.path : StayaWidgetDefaultPath,
  container: StayaWidgetIncomeParams.container ? StayaWidgetIncomeParams.container : null,
  placeid: StayaWidgetIncomeParams.placeid ? StayaWidgetIncomeParams.placeid : null,
  siteUrl: StayaWidgetIncomeParams.siteUrl,
  verticalWidget: typeof(StayaWidgetIncomeParams.vertical_widget) != 'undefined' ? StayaWidgetIncomeParams.vertical_widget : true,
  cell_width: StayaWidgetIncomeParams.cell_width ? StayaWidgetIncomeParams.cell_width : 310,
  cell_h_width:  StayaWidgetIncomeParams.cell_h_width,
  cell_height: StayaWidgetIncomeParams.cell_height ? StayaWidgetIncomeParams.cell_height : 400,
  locale: StayaWidgetIncomeParams.locale ? StayaWidgetIncomeParams.locale : "RU",
  background_color: StayaWidgetIncomeParams.background_color ? StayaWidgetIncomeParams.background_color : '#fff',
  text_head_color: StayaWidgetIncomeParams.text_head_color ? StayaWidgetIncomeParams.text_head_color : '#3d5aa9',
  text_body_color: StayaWidgetIncomeParams.text_body_color ? StayaWidgetIncomeParams.text_body_color : '#888',
  border: typeof(StayaWidgetIncomeParams.border)!='undefined' ? StayaWidgetIncomeParams.border : true,
  borderthickness: StayaWidgetIncomeParams.borderthickness ? StayaWidgetIncomeParams.borderthickness : '1px',
  border_color: StayaWidgetIncomeParams.border_color ? StayaWidgetIncomeParams.border_color : StayaWidgetDefault_border_color,
  cell_divider_color: StayaWidgetIncomeParams.cell_divider_color,
  cell_divider_thickness: StayaWidgetIncomeParams.cell_divider_thickness,
  remoteWorkText: 'удаленно',
  postJobText: 'Разместить вакансию',
  jobResponseText: 'Откликнуться на вакансию',
  incomeText: 'з/п',
  incomeIsNotDefText: 'з/п не указана',
  iframeUrl: StayaWidgetIncomeParams.iframeUrl ? StayaWidgetIncomeParams.iframeUrl : 'https://' + StayaWidgetDefaultPath + '/localstorageiframe.php',
  hideJobButton: StayaWidgetIncomeParams.hide_job_button ? StayaWidgetIncomeParams.hide_job_button : false,
  };

  StayaWidgetParams.verticalWidget = true;
  StayaWidgetParams.branding = StayaWidgetIncomeParams.branding ? StayaWidgetIncomeParams.branding && StayaWidgetIncomeParams.branding != 'false' : false;

SWH.Widget=new SWH.JS_CLASS(SWH.WidgetProto,{init:function(){3==parseInt(StayaWidgetParams.borderthickness)?StayaWidgetParams.cornerWtop=2:2==parseInt(StayaWidgetParams.borderthickness)?StayaWidgetParams.cornerWtop=2:StayaWidgetParams.cornerWtop=0,StayaWidgetParams.cell_width2=StayaWidgetParams.cell_width-2*parseInt(StayaWidgetParams.borderthickness),StayaWidgetParams.cell_height2=StayaWidgetParams.cell_height-2*parseInt(StayaWidgetParams.borderthickness),StayaWidgetParams.borderthickness&&parseInt(StayaWidgetParams.borderthickness)>2&&(StayaWidgetParams.borderthickness="2px"),"false"==StayaWidgetParams.border&&(StayaWidgetParams.border=!1),StayaWidgetParams.border||(StayaWidgetParams.borderthickness=0),StayaWidgetParams.cell_width=StayaWidgetParams.cell_width,this.getDataWithoutProfAreasInt=setTimeout(this.getDataWithoutProfAreas.bind(this),1e3),SWH_SUPER(this,arguments)}}),SWH.ListController=SWH.JS_CLASS(SWH.ListController,{itemTpl:'<a href="//{path}/job/{vacancy_id}?utm_source={path}&utm_campaign=staya_widget&utm_medium=display" target="_blank" onclick="SWH.listController.handleOpenVacancyClick()"  class=" " style="width: {cell_width}px; "  >      <div class="b-widget-tile__company" style="padding: 2px 20px;">        <div class="b-table-row1280_col5__profile-name g-pad-l-0" style="max-width: {cell_width}px;">                <span class="b-table-row-mobile__company m-text-color1 g-pad-l-0" style="font-size:0.7em; padding: 0; "  >                   {vacancy_user_name}                </span>        </div>      </div>      <div class="b-widget-tile__position_title" >        <div class="b-widget-tile__position_title_text" style="color: {text_head_color}; font-size:0.8em;  max-width: {cell_width}px;">          {vacancy_topic}        </div>      </div>      <div class="b-vac-tile__position_tags g-left " style=" width: 50%;  float: left;" >        <div class="b-table-row-mobile__tags" style="margin-top:0;">          <div class="b-table-row-mobile__tags__tag m-border-color" style="border: solid 1px {border_color}; font-size: 0.6em; line-height: 18px;padding: 0 10px; margin-top: 10px;  max-width: {cell_width}px;" >            {vacancy_cityForListing}          </div>        </div>      </div>      <div class="b-widget-tile__income g-left" style="{vacancy_salary_from_display}; width: 50%; text-align: right; float: left; height: 0; overflow: inherit; font-size: 12px; font-size: 12px; margin-top: 8px;  max-width: {cell_width}px;"  >        <span style="color: {text_body_color}; "> {vacancy_salary_from} {vacancy_salary_currency_symbol}</span>      </div>      <div style="width:100%; padding: 0 20px; box-sizing: border-box; clear:both; position: relative; top: 5px;  max-width: {cell_width}px;">        <div style="border-top-style: solid; border-color: {border_color}; clear: both; margin:0; border-width: {borderthickness}; "></div>      </div>  </a>',pageTpl:'<style>  {widgetCSS}  .b-staya-widget a,.b-staya-widget a:hover { color: {text_body_color}; } .g-staya-widget__border { border: solid {borderthickness} {border_color}; } .stayaWidget__cell_height { width: {cell_height}px;}  .stayaWidget__cell_height2 { width: {cell_height2}px;}  </style><div style="display: none;" class="g-w-100 staya_job_container2"   >  <div ng-show="!SWH.listController.errorMsg" class="b-staya-widget g-staya-widget__border" style="width: {cell_width}px; " >    <a href="//{path}/" target="_blank" style="{brandingDisplay}; width: 100%; padding: 0 20px; box-sizing: border-box;">      <div class="b-staya-widget__head" >          <div class="b-logo-mobile" style="background: transparent; position: relative; top: 10px; left: 6px; " >              <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 92 29" enable-background="new 0 0 92 29" xml:space="preserve"><g>  <path fill="{border_color}" d="M40.6,3.3c0.5,0.3,0.7,0.6,0.7,1.1c0,0.6-0.5,1.1-1.1,1.1c-0.4,0-0.6-0.1-1-0.3c-1-0.4-1.7-0.5-2.8-0.5    c-1.3,0-2.5,0.7-2.5,1.9c0,1.1,0.6,1.6,1.9,2.2l2.7,1.2c1.5,0.7,3.2,1.7,3.2,4.4c0,2.8-2.2,4.5-5.2,4.5c-1.6,0-3-0.3-4.3-0.9    c-0.5-0.2-0.7-0.6-0.7-1.1c0-0.7,0.5-1.1,1.1-1.1c0.3,0,0.5,0.1,1,0.3c0.8,0.3,1.7,0.6,2.9,0.6c1.7,0,2.8-0.8,2.8-2.2    c0-1.2-0.7-1.8-2.1-2.4l-2.8-1.3c-1.6-0.8-2.9-1.9-2.9-4.1c0-2.6,2.1-4.2,5.1-4.2C38.2,2.5,39.4,2.8,40.6,3.3 M53.7,2.7    c0.6,0,1.1,0.5,1.1,1.1c0,0.6-0.5,1.2-1.1,1.2h-3.5v12.7c0,0.7-0.6,1.2-1.2,1.2c-0.7,0-1.2-0.5-1.2-1.2V5h-3.4    c-0.7,0-1.2-0.5-1.2-1.2c0-0.6,0.5-1.1,1.2-1.1H53.7z M62.5,3.3l4.9,14c0.1,0.2,0.1,0.4,0.1,0.5c0,0.7-0.5,1.1-1.2,1.1    c-0.5,0-1-0.3-1.1-0.8l-1-3.2h-5.7l-1,3.2c-0.2,0.5-0.6,0.8-1.1,0.8c-0.7,0-1.2-0.5-1.2-1.1c0-0.1,0-0.3,0.1-0.5l4.9-14    c0.2-0.5,0.7-0.9,1.3-0.9C61.8,2.5,62.3,2.8,62.5,3.3 M59.1,12.8h4.3l-2.2-6.6L59.1,12.8z M79,3.6c0,0.3-0.1,0.5-0.3,0.7l-4.2,7.3    v6c0,0.7-0.5,1.2-1.2,1.2c-0.7,0-1.2-0.5-1.2-1.2v-6l-4.2-7.3c-0.1-0.3-0.3-0.5-0.3-0.7c0-0.7,0.5-1.1,1.2-1.1c0.4,0,0.8,0.1,1,0.5    l3.5,6.3L76.8,3c0.2-0.4,0.6-0.6,1-0.6C78.4,2.5,79,2.9,79,3.6 M86.7,3.3l4.9,14c0.1,0.2,0.1,0.4,0.1,0.5c0,0.7-0.5,1.1-1.2,1.1    c-0.5,0-1-0.3-1.1-0.8l-1-3.2h-5.7l-1,3.2c-0.2,0.5-0.6,0.8-1.1,0.8c-0.7,0-1.2-0.5-1.2-1.1c0-0.1,0-0.3,0.1-0.5l4.9-14    c0.2-0.5,0.7-0.9,1.3-0.9C85.9,2.5,86.5,2.8,86.7,3.3 M83.2,12.8h4.3l-2.2-6.6L83.2,12.8z"/>  <path fill="{border_color}" d="M5.9,10.5c0,2.3,1.9,4.2,4.2,4.2c2.3,0,4.2-1.9,4.2-4.2c0-2.3-1.9-4.2-4.2-4.2C7.8,6.3,5.9,8.1,5.9,10.5z     M10.1,8.3c1.2,0,2.2,1,2.2,2.2c0,1.2-1,2.2-2.2,2.2c-1.2,0-2.2-1-2.2-2.2C7.9,9.2,8.9,8.3,10.1,8.3z M24.7,11.4    c0.3-0.2,0.4-0.6,0.3-1c0-0.2-0.1-0.3-0.3-0.5l-5.9-5.8V0.8c0-0.6-0.4-1-1-1H9c-8.4,0-9,3.7-9,9.8v6.5l16.3,13l2.5-2.4v-9.5    L24.7,11.4z M18.8,7l3.8,3.7l-3.8,3.7V7z M16.8,25.9l-0.6,0.6L2,15.2V9.7c0-5.8,0.3-7.8,7-7.8h7.7V25.9z"/></g></svg>          </div>          <div class="b-staya-widget__head__text" style="color: {text_head_color};" >            Вакансии          </div>      </div>      <div style="border-top-style: solid; border-color: {border_color}; position: relative; top: 0; clear: both; margin:0; border-width: {borderthickness}; "></div>    </a>    {listHTML}  <a href="//{path}/job/create" target="_blank" class="b-staya-widget__post-btn" >    <div class="b-staya-widget__post-btn__text" style="border-color: {border_color}; ">        Разместить вакансию    </div>    <div  class="b-widget-tile__corner {cornerDisplay}" style="border-bottom-color: {border_color}; margin-top: -24px; "; >    </div>    <div  class="b-widget-tile__corner-w {cornerDisplay}"  style="border-bottom-color: {background_color}; margin-top: -24px; top: {cornerWtop}px; ">    </div>  </a><div ng-show="SWH.listController.errorMsg" style=" display: none; " >  Что то пошло не так... Мы не смогли получить данные, но Стая не бросает своих — попробуйте повторить попытку через несколько минут.</div></div>',refresh:function(){var a=SWH.copy(StayaWidgetParams);if(a.vWidgetDisplay=StayaWidgetParams.verticalWidget?"display: table":"display: none",a.hWidgetDisplay=StayaWidgetParams.verticalWidget?"display: none":"display: table",a.cornerDisplay=StayaWidgetParams.border?"":"b-staya-widget-hidden",a.brandingDisplay=StayaWidgetParams.branding?"display: none":"display: block",a.widgetCSS=SWH.TPL(SWH.cssTpl,a),a.listHTML=this.getListHTML(this.itemTpl),StayaWidgetParams.container&&document.getElementById(StayaWidgetParams.container)){var t=document.getElementById(StayaWidgetParams.container);StayaWidgetParams.verticalWidget?t.className+=" b-staya-widget-vert":t.className+=" b-staya-widget-hor",t.innerHTML=SWH.TPL(this.pageTpl,a)}else{var e=document.createElement("div");e.innerHTML=SWH.TPL(this.pageTpl,a),document.body.appendChild(e)}},getListHTML:function(a){for(var t=[],e=0;e<this.vacancies.length;e++){var i=this.vacancies[e],r=SWH.copy(StayaWidgetParams);r.vacancy_id=i.id,r.vacancy_user_name=i.user.name,r.vacancy_topic=i.topic,r.vacancy_cityForListing=i.cityForListing,r.job_type=i.job_types[0].name,r.vacancy_salary_from=i.salary_from,r.vacancy_description_short=i.description_short,r.vacancy_salary_currency_symbol=i.salary_currency.symbol,r.vacancy_salary_from_display=i.salary_from?"display: block":"display: none",r.vacancyCornerDisplay=i.lastItem&&r.border?"display: block":"display: none",t.push(SWH.TPL(a,r))}return t.join("")}});


SWH.cssTpl = '\
.b-widget-tile__company {\
  margin-top:6px; \
  width:100%; \
  padding: 20px; \
  box-sizing: border-box;\
}\
.b-table-row1280_col5__profile-name {\
}\
.b-table-row-mobile__company {\
  margin-top: 10px; \
  width: 100%; \
  color: #666; \
  box-sizing: border-box; \
  padding: 0 3px; \
  font-size: 0.9em; \
  overflow: hidden; \
  text-overflow: ellipsis;\
}\
.b-widget-tile__position_title {\
  font-size: 1.2em; \
  width:100%; \
  clear:both; \
  box-sizing: border-box;\
}\
.b-widget-tile__position_title_text {\
  width: 100%; \
  color: #3d5aa9; \
  box-sizing: border-box; \
  padding: 0 20px; \
  font-size: 1.2em; \
  overflow: hidden; \
  text-overflow: ellipsis;\
}\
.b-table-row-mobile__tags {\
  margin-top: 5px; \
  width: 100%; \
  box-sizing: \
  border-box; \
  padding: 0 20px; \
  overflow: hidden;\
}\
.b-table-row-mobile__tags__tag {\
  box-sizing: border-box; \
  float: left; \
  margin-right: 10px; \
  font-size: 0.75em; \
  line-height: 20px; \
  padding: 0 15px; \
  border: solid 1px #3d5aa9; \
  border-radius: 15px;\
  white-space: nowrap;\
  max-width: 100%;\
  overflow: hidden;\
  text-overflow: ellipsis;\
  margin-top: 15px;\
}\
.b-widget-tile__income {\
  margin-top: 15px; \
  width: 100%; \
  color: #3d5aa9; \
  box-sizing: border-box; \
  padding: 0 20px; \
  height: 16px; \
  font-size: 1em; \
  overflow: hidden; \
  text-overflow: ellipsis;\
}\
.b-staya-widget a,\
.b-staya-widget a:hover {\
  text-decoration: none;\
}\
a.b-widget-table,\
a.b-widget-tile {\
   text-decoration: none!important;\
   line-height: 1.2!important;\
}\
.b-staya-widget__head {\
  width: 100%; \
  height:50px; \
  line-height: 50px;\
}\
.b-logo-mobile {\
  width:100px; \
  height:50px;\
  margin-left: -6px;\
  float: left; \
  background: url(/i/logo_mobile_b.svg) no-repeat center center;\
  background-size: 92px 29px; \
}\
.b-staya-widget__head__text {\
  float: right; \
  font-size: 1em; \
  color: #3d5aa9; \
  height:50px; \
  line-height: 50px;\
}\
.b-staya-widget__post-btn {\
  position: relative; \
  display: block; \
  height:50px; \
  box-sizing: border-box;\
}\
.b-staya-widget__post-btn__text {\
  margin: 0 auto; \
  width: 180px; \
  text-align: center; \
  height: 30px; \
  line-height: 30px; \
  font-size:0.8em; \
  border-style: solid; \
  border-width: 1px; \
  border-radius: 20px; \
  margin-top: 20px;\
}\
.b-staya-widget-hor .b-widget-tile__corner,\
.b-staya-widget-hor .b-widget-tile__corner-w {\
    display: none;\
}\
.b-widget-tile__corner {\
  float: right;\
  border-bottom: 40px solid #3d5aa9; \
  border-left: 40px solid transparent;\
  position: relative;\
  top: 3px;\
}\
.b-widget-tile__corner-w {\
  float: right;\
  margin-right: -44px;\
  border-bottom: 43px solid #fff; \
  border-left: 43px solid transparent;\
  position: relative;\
  top: 2px;\
}\
\
}\
';

SWH.Widget.init();