var containers = new Array();
$(document).ready(function () {
 var isAndroid = navigator.userAgent.toLowerCase().indexOf("android");
 resetCanvasWidth('reset');
});
$(window).load(function () {
 $(window).on('resize', function(){
 resetCanvasWidth();
 });
});
function resetCanvasWidth(doonce) {
 var screenheight = getScreenHeight();
 var screenwidth  = (getScreenWidth() + 2);
 $('.respond').each(function() {
 var x = $(this);
 if (x.hasClass('scale-h')) {
 setNewHeight("#"+this.id);
 //   console.log('scale-h:'+this.id);
 }
 var papi;
 var papid;
 if (x.hasClass('scrollablewrapper')) {
 papi = x.find(".scrollable");
 papid = papi.attr('id');
 }
 if(papid) {
 // original.  var scrollablecw = $(".scrollablewrapper").outerWidth();
 // var pw = x.find(".scrollable").css("width");
 // var pw = x.find(".scrollable").innerWidth();
 var pw = papi.innerWidth();
 // get the width of the columns.
 papi.find(".scrollable-column").css("width", pw );
 var scrollableapi = $("#"+papid).data("scrollable");
 if(scrollableapi){
 var scrollpanel = scrollableapi.getIndex(); // ((scrollmodulus * scrollmodulus2)* -1);
 // scrollableapi.move(2);
 // kind of works. shouldn't be done here though.    scrollableapi.seekTo(scrollpanel);
 scrollpanel = (scrollpanel); // + 1for circular galleries only.
 var scrolldiff = ((scrollpanel * pw) * -1);
 papi.find('.scrollh').css('left', scrolldiff + 'px');
 // $('.scrollh').css('left', scrolldiff + 'px');
 // console.log('scrollpanel:'+ scrollpanel + ' scrolldif:' + scrolldiff + "px from:" + pw);
 // console.log(scrollableapi);
 }
 }
 });
}
function setNewHeight(el) {
 var owidth;
 var oheight;
 if (typeof containers[el] != 'undefined') {
 owidth = containers[el].owidth;
 oheight = containers[el].oheight;
 } else {
 owidth = ($(el).attr('width'))? ($(el).attr('width')) : '';
 oheight = ($(el).attr('height'))? ($(el).attr('height')) : '';
 if(!owidth) {
 owidth = ($(el).css('max-width'))? (parseInt($(el).css('max-width'))) : ($(el).outerWidth());
 }
 if(!oheight) {
 oheight = ($(el).css('max-height'))? (parseInt($(el).css('max-height'))) : ($(el).outerHeight());
 }
 containers[el] = ({'owidth' : owidth,'oheight' : oheight });
 }
 var cowidth = $(el).outerWidth();
 var cwidth = $(el).innerWidth();
 var nheight = ((cwidth * oheight)/owidth);
 if(nheight > oheight) {
 $(el).css({'height':oheight +'px','max-height':oheight +'px'});
 } else if (cwidth < owidth) {
 $(el).css({'height':nheight +'px','max-height':nheight +'px'});
 } else {
 $(el).css({'height':oheight +'px','max-height':oheight +'px'});
 }
}
function getScreenHeight() { /* $(window).height() does not working properly on window resizing */
 if (window.innerHeight) return window.innerHeight;
 else if (document.documentElement.clientHeight) return document.documentElement.clientHeight;
 else if (window.clientHeight) return window.clientHeight;
 else if (document.body.clientHeight) return document.body.clientHeight;
 else return 0;
}
function getScreenWidth() {
 if (window.innerWidth) return window.innerWidth;
 else if (document.documentElement.clientWidth) return document.documentElement.clientWidth;
 else if (window.clientWidth) return window.clientWidth;
 else if (document.body.clientWidth) return document.body.clientWidth;
 else return 0;
}
var currentdiv = "";
function scrollto(whichdiv) {
 var curContent = $('#content').find("#"+whichdiv);
 if (curContent.length>0)
 $('html, body').animate( {
 scrollTop: curContent.offset().top -60
 }, 800);
 currentdiv = whichdiv;
}
function scrolltocurrent() {
 if (!currentdiv) {return}
 var curContent = $('#content').find("#"+currentdiv);
 if (curContent.length>0)
 $('html, body').animate({
 scrollTop: curContent.offset().top
 }, 1);
}