forked from kopipejst/gifeeno
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.php
129 lines (100 loc) · 4.02 KB
/
index.php
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
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Gifeeno - Animated GIF creator</title>
<meta description="Web Camera API experiment" />
<link rel="stylesheet" href="css/main.css">
</head>
<body>
<div id="thumbs-holder">
<div class="close" id="thumbs-holder-close"></div>
<img src="img/your_funny_images.png" />
<div id="thumbs"></div>
</div>
<div id="main-window">
<div id="video-holder">
<img src="img/start2.gif" id="start-image" />
<video autoplay id="video"></video>
<canvas width="320" height="240" style="display: none;"></canvas>
<div id="showSettings"></div>
<div id="indicator"></div>
</div>
<button class="button" id="start">
Start
</button>
<button class="button disabled" id="start-fake">
Start
</button>
<div class="share">
Share: <a href="http://twitter.com/share?text=Use%20Web%20Camera%20API%20to%20Create%20Animated%20GIF%20%23gifeeno&url=http://gifeeno.workshop.rs" class="social twitter"> </a> <a href="http://www.facebook.com/sharer.php?u=http://gifeeno.workshop.rs" class="social facebook"> </a>
</div>
</div>
<div id="note">
<b>Please note:</b>
<p>
Gifeeno is Web Camera API experiment and works only in modern browsers such as Google Chrome.
</p>
<p>
Unfortunately, due to limited storage space, saving on server is not possible at the moment.
</p>
<p>
This is open source project, so feel free to fork on <a href="https://github.com/kopipejst/gifeeno">GitHub</a>.
</p>
</div>
<div id="footer">
Created by <a href="http://workshop.rs">Ivan Lazarevic</a> and <a href="http://www.jovanstojanovic.com">Jovan Stojanovic</a>
</div>
<div id="overlay-bg"></div>
<div id="overlay">
<div class="close" id="overlay-close"></div>
<div id="preview" class="panel">
<div id="result-gif"></div>
<p>
Right click on image and "Save Image As" to save image on your computer.
</p>
<p>
Unfortunately, due to limited storage space, saving on server is not possible at the moment.
</p>
<button class="button disabled" id="save">
Save Image
</button>
or
<button class="button new">
Create New
</button>
<span id="url"></span>
</div>
<div id="settings" class="panel">
<h2>Settings</h2>
Delay between snapshots (in miliseconds):<br /><br />
<input type="range" min="500" max="5000" id="snapshotPause" value="1000" />
<span class="value">1000</span>
<br /><br />
Delay between frames in animated gif (in miliseconds):<br /><br />
<input type="range" min="100" max="1000" id="framesPause" value="200" />
<span class="value">200</span>
<br /><br /><br />
<button class="button new">
Create New
</button>
</div>
</div>
<script src="javascripts/LZWEncoder.js"></script>
<script src="javascripts/NeuQuant.js"></script>
<script src="javascripts/GIFEncoder.js"></script>
<script src="javascripts/b64.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="javascripts/gifeeno.js"></script>
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try {
var pageTracker = _gat._getTracker("UA-11860629-1");
pageTracker._trackPageview();
} catch(err) {}
</script>
</body>
</html>