$(function() {
	$(".img-zoom .thumbs a").bind('click', function(e){ 
		e.preventDefault();
		var imageUrl = $(this).attr("href");
		
		$(".img-zoom").css('background-image', 'url(' + imageUrl + ')');
        //$(".img-zoom").css('background-size', '100%');

	}); 
});

jQuery(document).ready(function($){
    var dragging = false,
        scrolling = false,
        resizing = false;
        tvsOpen = false;
        remoteOpen = false;
    var imageComparisonContainers = $('.cd-image-container');
    var tvsContainer = $("#historia");
    var remotesContainer = $("#remote-container");





    $(parent.window).on('scroll', function(){
        if( !scrolling) {
            scrolling =  true;
            ( !parent.window.requestAnimationFrame )
                ? setTimeout(function(){checkPositionRemote(remotesContainer);}, 1000)
                : requestAnimationFrame(function(){checkPositionRemote(remotesContainer);});                             
        }
    });

    

    function checkLabel(container) {
        container.each(function(){
            var actual = $(this);

            updateLabel(actual.find('.cd-image-label[data-type="modified"]'), actual.find('.cd-resize-img'), 'left');
            updateLabel(actual.find('.cd-image-label[data-type="original"]'), actual.find('.cd-resize-img'), 'right');
        });

        resizing = false;
    }

     function checkPositionRemote(container) {
        container.each(function(){
            var actualContainer = $(this);

            if(!remoteOpen && $(parent.window).scrollTop() + $(parent.window).height()*0.5 > actualContainer.offset().top) {
                console.log("initRemotes()");
                initRemotes();
                remoteOpen = true;
            }
        });

        scrolling = false;
    }     

    function initRemotes(){
       setTimeout(function(){
           $('#remote').removeClass('hid');
       },2000);

       setTimeout(function(){

            $("#oneRemote .texto").show();
       },3000);
        setTimeout(function(){
            $('#playstation').removeClass('hid');
            $('#playstation-icon').removeClass('hid');
            $('#remote-playstation').removeClass('hid');
        },2000);

        setTimeout(function(){
            $('#box').removeClass('hid');
            $('#box-icon').removeClass('hid');
            $('#remote-box').removeClass('hid');
        },2000);

        setTimeout(function(){
            $('#blueray').removeClass('hid');
            $('#blueray-icon').removeClass('hid');
            $('#remote-blueray').removeClass('hid');
        },2000);

        setTimeout(function(){
            $('#oneRemote').addClass('one');
        },2000);

        setTimeout(function(){
            $('#oneRemote').addClass('one wifi');
        },2000);        
    }    

    function drags(dragElement, resizeElement, container, labelContainer, labelResizeElement) {
        dragElement.on("mousedown vmousedown", function(e) {
            dragElement.addClass('draggable');
            resizeElement.addClass('resizable');

            var dragWidth = dragElement.outerWidth(),
                xPosition = dragElement.offset().left + dragWidth - e.pageX,
                containerOffset = container.offset().left,
                containerWidth = container.outerWidth(),
                minLeft = containerOffset + 10,
                maxLeft = containerOffset + containerWidth - dragWidth - 10;
            
            dragElement.parents().on("mousemove vmousemove", function(e) {
                if( !dragging) {
                    dragging =  true;
                    ( !window.requestAnimationFrame )
                        ? setTimeout(function(){animateDraggedHandle(e, xPosition, dragWidth, minLeft, maxLeft, containerOffset, containerWidth, resizeElement, labelContainer, labelResizeElement);}, 100)
                        : requestAnimationFrame(function(){animateDraggedHandle(e, xPosition, dragWidth, minLeft, maxLeft, containerOffset, containerWidth, resizeElement, labelContainer, labelResizeElement);});
                }
            }).on("mouseup vmouseup", function(e){
                dragElement.removeClass('draggable');
                resizeElement.removeClass('resizable');
            });
            e.preventDefault();
        }).on("mouseup vmouseup", function(e) {
            dragElement.removeClass('draggable');
            resizeElement.removeClass('resizable');
        });
    }

    function animateDraggedHandle(e, xPosition, dragWidth, minLeft, maxLeft, containerOffset, containerWidth, resizeElement, labelContainer, labelResizeElement) {
        var leftValue = e.pageX + xPosition - dragWidth;   
        //constrain the draggable element to move inside his container
        if(leftValue < minLeft ) {
            leftValue = minLeft;
        } else if ( leftValue > maxLeft) {
            leftValue = maxLeft;
        }

        var widthValue = (leftValue + dragWidth/2 - containerOffset)*100/containerWidth+'%';
        
        $('.draggable').css('left', widthValue).on("mouseup vmouseup", function() {
            $(this).removeClass('draggable');
            resizeElement.removeClass('resizable');
        });

        $('.resizable').css('width', widthValue); 

        updateLabel(labelResizeElement, resizeElement, 'left');
        updateLabel(labelContainer, resizeElement, 'right');
        dragging =  false;
    }

    function updateLabel(label, resizeElement, position) {
        if(position == 'left') {
            ( label.offset().left + label.outerWidth() < resizeElement.offset().left + resizeElement.outerWidth() ) ? label.removeClass('is-hidden') : label.addClass('is-hidden') ;
        } else {
            ( label.offset().left > resizeElement.offset().left + resizeElement.outerWidth() ) ? label.removeClass('is-hidden') : label.addClass('is-hidden') ;
        }
    }
});


jQuery(document).ready(function($) {
    $('.menu a[href^="#"]').bind('click.smoothscroll',function (e) {
        e.preventDefault();
        var target = this.hash,
        $target = $(target);

        $('html, body').stop().animate( {
            'scrollTop': $target.offset().top
        }, 900, 'swing', function () {
            window.location.hash = target;
        } );
    } );
} );

jQuery(document).ready(function($) {
	$('#sd').addClass('ellipse');
	$('#resolucao .slider2 figure').click(function(){
	   var idToSRC = 'img/'+ this.id +'.jpg';
	   $('.zoom').attr('src', idToSRC);
	   var fig = '#'+this.id;
	   $('#resolucao .slider2 figure').removeClass('ellipse');
	   $(fig).addClass('ellipse');
	});

	$("#mdesign, #msmartv, #mimagem").hover(function(){
		if (this.id=="mdesign"){
			var str = "Design";
		} else if(this.id=="mimagem"){
			var str = "Qualidade de Imagem";
		} else if(this.id=="msmartv"){
			var str = "Smart TV";
		}
		$(this).find('a').html(str).fadeIn(200);
	    }, function(){
	    $(this).find('a').html("").fadeOut(200);
	});

    var hdrVal = $('#hrdval');
      $("#slider").slider({
        max: 100,
        slide: function( event, ui ) {
          var val = $( "#slider" ).slider("option", "value" );
          var hdr = val*10;
          var hdrV = val*3.59;

          console.log("slide: " + hdrV);
          
              hdrVal.css('width',hdrV+"px");

              //if(hdr<100) hdr = 100;
              $( "#slider").attr('aria-valuenow',hdr);
              $('#lowQuality').css('opacity',val/100 );
              $('#lowQuality').attr('alt',"HDR "+hdr+" SUHD TV picture quality" );
          
          
          
        },
        change: function( event, ui ) {
          var val = $( "#slider" ).slider("option", "value" );
          var hdr = val*10;
          var hdrV = val*3.59;
          console.log("change: " + hdrV);
          hdrVal.css('width',hdrV+"px");
          //if(hdr<100) hdr = 100;
          $('#lowQuality').css('opacity',val/100 );
          $('#lowQuality').attr('alt',"HDR "+hdr+" SUHD TV picture quality" );
          $( "#slider").attr('aria-valuenow',hdr);
          
        }
      });    
	  
	  	$("#myModal-quantum").on('hidden.bs.modal', function (e) {
    $("#myModal-quantum iframe").attr("src", $("#myModal-quantum iframe").attr("src"));
});

	$("#myModal-hdr").on('hidden.bs.modal', function (e) {
    $("#myModal-hdr iframe").attr("src", $("#myModal-hdr iframe").attr("src"));
});
});


var canvas1, stage1, exportRoot1;

function init() {
    canvas1 = document.getElementById("canvas1");
    images = images||{};

    var manifest = [
        {src:"img/own01.png", id:"own01"},
        {src:"img/own01-shadow.png", id:"own01shadow"},
        {src:"img/own02.png", id:"own02"},
        {src:"img/own02-shadow.png", id:"own02shadow"},
        {src:"img/own03.png", id:"own03"},
        {src:"img/own03-shadow.png", id:"own03shadow"},
        {src:"img/screen-own-content.png", id:"screenowncontent"}
    ];

    var loader = new createjs.LoadQueue(false);
    loader.addEventListener("fileload", handleFileLoad1);
    loader.addEventListener("complete", handleComplete1);
    loader.loadManifest(manifest);
}

function handleFileLoad1(evt) {
    if (evt.item.type == "image") { images[evt.item.id] = evt.result; }
}

function handleComplete1() {
    exportRoot1 = new lib.owncontent();

    stage1 = new createjs.Stage(canvas1);
    stage1.addChild(exportRoot1);
    stage1.update();

    createjs.Ticker.setFPS(30);
    createjs.Ticker.addEventListener("tick", stage1);
}

var canvas2, stage2, exportRoot2;

function init2() {
    canvas2 = document.getElementById("canvas2");
    images = images||{};

    var manifest = [
        {src:"img/globoplay-app.png", id:"globoplayapp"},
        {src:"img/globoplay-app-shadow.png", id:"globoplayappshadow"},
        {src:"img/globosat-app.png", id:"globosatapp"},
        {src:"img/globosat-app-shadow.png", id:"globosatappshadow"},
        {src:"img/netflix-app.png", id:"netflixapp"},
        {src:"img/netflix-app-shadow.png", id:"netflixappshadow"},
        {src:"img/screen-apps.png", id:"screenapps"},
        
        {src:"img/youtube-app.png", id:"youtubeapp"},
        {src:"img/youtube-app-shadow.png", id:"youtubeappshadow"}
    ];

    var loader = new createjs.LoadQueue(false);
    loader.addEventListener("fileload", handleFileLoad2);
    loader.addEventListener("complete", handleComplete2);
    loader.loadManifest(manifest);
}

function handleFileLoad2(evt) {
    if (evt.item.type == "image") { images[evt.item.id] = evt.result; }
}

function handleComplete2() {
    exportRoot2 = new lib.samsungapps();

    stage2 = new createjs.Stage(canvas2);
    stage2.addChild(exportRoot2);
    stage2.update();

    createjs.Ticker.setFPS(30);
    createjs.Ticker.addEventListener("tick", stage2);
}