|
@@ -1,32 +1,51 @@
|
|
|
$(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: 2016,
|
|
|
+ max: parseInt($("#left-count").text()),
|
|
|
value: 1,
|
|
|
slide: function( event, ui ) {
|
|
|
- console.log(ui.value);
|
|
|
+ //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: 2016,
|
|
|
+ max: parseInt($("#front-count").text()),
|
|
|
value: 1,
|
|
|
slide: function( event, ui ) {
|
|
|
- console.log(ui.value);
|
|
|
+ //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: 2016,
|
|
|
+ max: parseInt($("#top-count").text()),
|
|
|
value: 1,
|
|
|
slide: function( event, ui ) {
|
|
|
- console.log(ui.value);
|
|
|
+ //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));
|
|
|
}
|
|
|
});
|
|
|
|
|
@@ -52,11 +71,33 @@ $(function() {
|
|
|
if (response["desc"][i]["type"] == "i") {
|
|
|
tmp = "<i>" + response["desc"][i]["text"] + "</i>";
|
|
|
} else if (response["desc"][i]["type"] == "p") {
|
|
|
- tmp = "<p>" + response["desc"][i]["text"] + "</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.")
|
|
@@ -64,4 +105,88 @@ $(function() {
|
|
|
});
|
|
|
$("#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());
|
|
|
+ });
|
|
|
});
|