1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
|
$(function() {
$( "#blur-slider" ).slider({
value:0,
min: 0,
max: 20,
step: 1,
slide: function( event, ui ) {
$( "#img-blur" ).val(ui.value);
}
});
$( "#img-blur" ).val( $( "#blur-slider" ).slider( "value" ) );
$( "#brightness-slider" ).slider({
value:100,
min: 0,
max: 200,
step: 1,
slide: function( event, ui ) {
$( "#img-brightness" ).val(ui.value);
}
});
$( "#img-brightness" ).val( $( "#brightness-slider" ).slider( "value" ) );
$( "#hue-slider" ).slider({
value:100,
min: 0,
max: 200,
step: 1,
slide: function( event, ui ) {
$( "#img-hue" ).val(ui.value);
}
});
$( "#img-hue" ).val($( "#hue-slider" ).slider( "value" ) );
$( "#saturation-slider" ).slider({
value:100,
min: 0,
max: 200,
step: 1,
slide: function( event, ui ) {
$( "#img-saturation" ).val(ui.value);
}
});
$( "#img-saturation" ).val($( "#saturation-slider" ).slider( "value" ) );
});
var Main =
{
API_HEADER: "#@imgradient",
enter: function (e)
{
// console.log("calling enter")
if (e.keyCode === 13){
Main.go()
}
},
go: function ()
{
$("#output-cmd").html('generating...').show()
$("#result").show()
var data =
{
flip: $('#img-flip:checked').val() !== undefined ? "true" : "false",
flop: $('#img-flop:checked').val() !== undefined ? "true" : "false",
tilt: $('#img-tilt').val(),
rotate: $("#img-rotate").val(),
subtract: $("#img-subtract").val(),
width: $("#img-width").val(),
height: $("#img-height").val(),
color2: $("#img-color2").val(),
color1: $("#img-color1").val(),
brightness: $("#img-brightness").val(),
saturation: $("#img-saturation").val(),
blurriness: $("#img-blur").val(),
hue: $("#img-hue").val(),
contrast: $("#img-contrast").val(),
gradienttype: $('#gradient-type :selected').val(),
bevel: $('#bevel-type :selected').val(),
percentbeveled: $('#percentbeveled').val(),
halftone: $('#halftone-type :selected').val(),
stripes: $('#stripes:checked').val() !== undefined ? "true" : "false",
stripenumber: $('#stripenumber').val(),
stripeintensity: $('#stripeintensity').val(),
format: $('#img-format :selected').text(),
name: $("#img-name").val(),
}
if (data.name.length > 0){
document.cookie = "imname="+data.name+";path=/;domain=.asdf.us;max-age=1086400"
}
$.post("/im/api/imgradient", data, Main.callback)
$("#controls").css('margin',"")
},
error: function (s)
{
$("#output-cmd").html("<span class='error'>ERROR: " + s + "</span>").show()
$("#output-url").hide()
$("#output-img").hide()
},
callback: function (data)
{
if (data.error){
return Main.error(data.error)
}
$("#output-cmd").html("size: "+Main.filesize(data.size)+"<br/>"+data.height + " x " + data.width)
$("#output-url").val(data.url)
$("#output-img").hide().attr("src", data.url).fadeIn(700)
},
filesize: function (size)
{
if (size < 1024)
return size + " bytes"
if (size < 1024 * 1024)
return Math.floor (size/1024) + " KB"
else
return Math.floor (size/(1024*1024)) + " MB"
},
cookie: function ()
{
if (document.cookie)
{
var cookies = document.cookie.split(";")
for (i in cookies)
{
var cookie = cookies[i].split("=")
if (cookie[0].indexOf("imname") !== -1)
{
if (cookie[1] !== 'false' && cookie[1] !== 'undefined' && cookie[1].length)
{
return cookie[1]
}
}
}
}
return ""
},
init: function ()
{
var name = Main.cookie ()
$("#img-name").val(name)
},
}
$(document).ready(function(){
Main.init ()
$('form').submit(function() {
return false;
});
$(document).keydown(Main.enter)
$("#img-generate").click(Main.go)
document.getElementById("reset").reset()
})
|
