123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244 |
- function toggleFullscreen(elem) {
- elem = elem || document.documentElement;
- if (!document.fullscreenElement && !document.mozFullScreenElement &&
- !document.webkitFullscreenElement && !document.msFullscreenElement) {
- img_fullscreen = $(elem).attr("src").split("-");
- img_fullscreen = img_fullscreen[0] + "-" + img_fullscreen[1] + img_fullscreen[2].slice(7);
- $(elem).attr("src", img_fullscreen);
- if (elem.requestFullscreen) {
- elem.requestFullscreen();
- } else if (elem.msRequestFullscreen) {
- elem.msRequestFullscreen();
- } else if (elem.mozRequestFullScreen) {
- elem.mozRequestFullScreen();
- } else if (elem.webkitRequestFullscreen) {
- elem.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
- }
- } else {
- img_fullscreen = $(elem).attr("src").split("&");
- img_fullscreen = img_fullscreen[0] + "&" + img_fullscreen[1] + "&" + img_fullscreen[2] + "-resized&" + img_fullscreen[3];
- $(elem).attr("src", img_fullscreen);
- if (document.exitFullscreen) {
- document.exitFullscreen();
- } else if (document.msExitFullscreen) {
- document.msExitFullscreen();
- } else if (document.mozCancelFullScreen) {
- document.mozCancelFullScreen();
- } else if (document.webkitExitFullscreen) {
- document.webkitExitFullscreen();
- }
- }
- }
- $(function() {
- $("#front-quality-text").text( ($("#img-front").width() / parseInt($("#top-count").text())).toFixed(2).toString() + "%");
- $("#top-quality-text").text( ($("#img-top").width() / parseInt($("#front-count").text())).toFixed(2).toString() + "%");
- $("#left-quality-text").text( ($("#placeholder-left").width() / parseInt($("#front-count").text())).toFixed(2).toString() + "%");
- $( "#slider-left" ).slider({
- range: "max",
- min: 1,
- max: parseInt($("#left-count").text()),
- value: 1,
- slide: function( event, ui ) {
- //console.log(ui.value);
- var name = $( "select option:selected" ).text();
- var id = $( "select option:selected" ).val();
- $("#left-text").text(ui.value);
- // update image src
- $("#placeholder-left").attr("src", "img?id="+id+"&name="+name+"&type=left-resized&counter="+(ui.value-1));
- }
- });
-
- $( "#slider-right" ).slider({
- range: "max",
- min: 1,
- max: parseInt($("#front-count").text()),
- value: 1,
- slide: function( event, ui ) {
- //console.log(ui.value);
- var name = $( "select option:selected" ).text();
- var id = $( "select option:selected" ).val();
- $("#front-text").text(ui.value);
- // update image src
- $("#img-front").attr("src", "img?id="+id+"&name="+name+"&type=front-resized&counter="+(ui.value-1));
- }
- });
-
- $( "#slider-center" ).slider({
- range: "max",
- min: 1,
- max: parseInt($("#top-count").text()),
- value: 1,
- slide: function( event, ui ) {
- //console.log(ui.value);
- var name = $( "select option:selected" ).text();
- var id = $( "select option:selected" ).val();
- $("#top-text").text(ui.value);
- // update image src
- $("#img-top").attr("src", "img?id="+id+"&name="+name+"&type=top-resized&counter="+(ui.value-1));
- }
- });
-
- $( "#download" ).click(function(e) {
- var did = $( "select option:selected" ).text();
- e.preventDefault(); //stop the browser from following
- window.location.href = 'download?did=' + did;
- });
- $('.target').change(function() {
- var name = $(this).find("option:selected").text();
- var index = $(this).find("option:selected").val();
- $.ajax({
- url: 'update?index=' + index + '&name=' + name,
- type: 'GET',
- success: function (response) {
- console.log("Success.");
- console.log(response);
- $("#size").text("("+response.data_size+" GB)");
- var html = "<span>Description</span>";
- for (i = 0; i < response["desc"].length; i++) {
- if (response["desc"][i]["type"] == "i") {
- tmp = "<i>" + response["desc"][i]["text"] + "</i>";
- } else if (response["desc"][i]["type"] == "p") {
- tmp = response["desc"][i]["text"];
- }
- html += tmp;
- }
- $("#description").empty().append(html);
- $("#front-count-text").text(" (max: " + response.front_count + ")");
- $("#left-count-text").text(" (max: " + response.left_count + ")");
- $("#top-count-text").text(" (max: " + response.top_count + ")");
- $("#front-count").text(response.front_count);
- $("#left-count").text(response.left_count);
- $("#top-count").text(response.top_count);
- $("#slider-right").slider("option", "max" , response.front_count );
- $("#slider-left").slider("option", "max" , response.left_count );
- $("#slider-center").slider("option", "max" , response.top_count );
-
- var left_index = $( "#slider-left" ).slider( "option", "value" );
- var top_index = $( "#slider-center" ).slider( "option", "value" );
- var front_index = $( "#slider-right" ).slider( "option", "value" );
- $("#placeholder-left").attr("src", "img?id="+index+"&name="+name+"&type=left-resized&counter="+(left_index-1));
- $("#img-top").attr("src", "img?id="+index+"&name="+name+"&type=top-resized&counter="+(top_index-1));
- $("#img-front").attr("src", "img?id="+index+"&name="+name+"&type=front-resized&counter="+(front_index-1));
-
- $("#front-quality-text").text( " " + ($("#img-front").width() / response.front_count).toFixed(2).toString() + "%");
- $("#top-quality-text").text(" " + ($("#img-top").width() / response.top_count).toFixed(2).toString() + "%");
- $("#left-quality-text").text(" " + ($("#placeholder-left").width() / response.left_count).toFixed(2).toString() + "%");
-
- },
- error: function () {
- console.log("Error.")
- }
- });
- $("#img-preview").attr("src", "img?id="+index+"&name="+name+"&type=preview&counter=0");
- });
- $("#front-left").click( function() {
- var index = parseInt($("#front-text").text());
- var name = $( "select option:selected" ).text();
- var id = $( "select option:selected" ).val();
- index -= 1;
- if (index < 1) {
- index = 1;
- }
- $("#front-text").text(index);
- $("#img-front").attr("src", "img?id="+id+"&name="+name+"&type=front-resized&counter="+index.toString());
- });
-
- $("#front-right").click( function() {
- var index = parseInt($("#front-text").text());
- var max_count = parseInt($("#front-count").text());
- var name = $( "select option:selected" ).text();
- var id = $( "select option:selected" ).val();
- //console.log(index, max_count);
- index += 1;
- if (index > max_count) {
- index = max_count;
- }
- $("#front-text").text(index);
- // update image src
- $("#img-front").attr("src", "img?id="+id+"&name="+name+"&type=front-resized&counter="+index.toString());
- });
-
- $("#top-left").click( function() {
- var index = parseInt($("#top-text").text());
- var name = $( "select option:selected" ).text();
- var id = $( "select option:selected" ).val();
- index -= 1;
- if (index < 1) {
- index = 1;
- }
- $("#top-text").text(index);
- $("#img-top").attr("src", "img?id="+id+"&name="+name+"&type=top-resized&counter="+index.toString());
- });
-
- $("#top-right").click( function() {
- var index = parseInt($("#top-text").text());
- var max_count = parseInt($("#top-count").text());
- var name = $( "select option:selected" ).text();
- var id = $( "select option:selected" ).val();
- //console.log(index, max_count);
- index += 1;
- if (index > max_count) {
- index = max_count;
- }
- $("#top-text").text(index);
- // update image src
- $("#img-top").attr("src", "img?id="+id+"&name="+name+"&type=top-resized&counter="+index.toString());
- });
-
- $("#left-left").click( function() {
- var index = parseInt($("#left-text").text());
- var name = $( "select option:selected" ).text();
- var id = $( "select option:selected" ).val();
- index -= 1;
- if (index < 1) {
- index = 1;
- }
- $("#left-text").text(index);
- $("#placeholder-left").attr("src", "img?id="+id+"&name="+name+"&type=left-resized&counter="+index.toString());
- });
-
- $("#left-right").click( function() {
- var index = parseInt($("#left-text").text());
- var max_count = parseInt($("#left-count").text());
- var name = $( "select option:selected" ).text();
- var id = $( "select option:selected" ).val();
- //console.log(index, max_count);
- index += 1;
- if (index > max_count) {
- index = max_count;
- }
- $("#left-text").text(index);
- // update image src
- $("#placeholder-left").attr("src", "img?id="+id+"&name="+name+"&type=left-resized&counter="+index.toString());
- });
- document.getElementById("img-front").addEventListener("click", function() {
- console.log(this);
- toggleFullscreen(this);
- });
- document.getElementById('img-top').addEventListener('click', function() {
- console.log(this);
- toggleFullscreen(this);
- });
- document.getElementById('placeholder-left').addEventListener('click', function() {
- console.log(this);
- toggleFullscreen(this);
- });
- });
|