-
Notifications
You must be signed in to change notification settings - Fork 0
/
demo1.html
110 lines (91 loc) · 3.7 KB
/
demo1.html
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>PaintWeb simple demo</title>
<link rel="author" type="text/html" href="http://www.robodesign.ro"
title="Marius and Mihai Şucan, ROBO Design">
<meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1">
<!-- $URL: http://code.google.com/p/paintweb $
$Date: 2010-06-26 22:58:27 +0300 $ -->
</head>
<body>
<h1>PaintWeb simple demo</h1>
<p>This is a demonstration page showing an image you can edit using <a
href="http://code.google.com/p/paintweb">PaintWeb</a>.</p>
<p>
<a title="Freshalicious" href="http://www.robodesign.ro/marius/my-projects/images/freshalicious">
<img id="editableImage" src="images/freshalicious.jpg" alt="Freshalicious">
</a>
</p>
<p><button id="buttonEditImage">Edit image!</button></p>
<div id="PaintWebTarget"></div>
<p>Do you have any feedback to provide? Please <a
href="http://groups.google.com/group/paintweb">post it in the public
mailing list</a>!</p>
<!--[if lte IE 8]>
<p>Please note that this application does not work in Internet Explorer
8. Please try this in Internet Explorer 9, or use any other modern web
browser: <a href="http://www.google.com/chrome">Chrome</a>, <a
href="http://www.mozilla.com">Firefox</a>, <a
href="http://www.apple.com/safari">Safari</a>, <a
href="http://www.opera.com">Opera</a> or <a
href="http://www.konqueror.org">Konqueror</a>.</p>
<![endif]-->
<script type="text/javascript" src="./src/jquery-2.1.3.min.js"></script>
<script type="text/javascript" src="./src/hammer.js"></script>
<script type="text/javascript" src="./src/main.js"></script>
<script type="text/javascript" src="./src/paintweb.js"></script>
<script type="text/javascript"><!--
(function () {
// Function called when the user clicks the "Edit image" button.
function pwStart () {
document.body.insertBefore(loadp, btn.parentNode);
timeStart = (new Date()).getTime();
pw.init(pwInit);
};
// Function called when the PaintWeb application fires the "appInit" event.
function pwInit (ev) {
var initTime = (new Date()).getTime() - timeStart,
str = 'Demo: Yay, PaintWeb loaded in ' + initTime + ' ms! ' +
pw.toString();
document.body.removeChild(loadp);
if (ev.state === PaintWeb.INIT_ERROR) {
alert('Demo: PaintWeb initialization failed.');
return;
} else if (ev.state === PaintWeb.INIT_DONE) {
if (window.console && console.log) {
console.log(str);
} else if (window.opera) {
opera.postError(str);
}
} else {
alert('Demo: Unrecognized PaintWeb initialization state ' + ev.state);
return;
}
img.style.display = 'none';
btn.style.display = 'none';
};
var img = document.getElementById('editableImage'),
btn = document.getElementById('buttonEditImage'),
target = document.getElementById('PaintWebTarget'),
loadp = document.createElement('p'),
timeStart = null,
// Create a PaintWeb instance.
pw = new PaintWeb();
pw.config.guiPlaceholder = target;
pw.config.imageLoad = img;
pw.config.configFile = 'config-example.json';
loadp.appendChild(document.createTextNode('Loading, please wait...'));
if (btn.addEventListener) {
btn.addEventListener('click', pwStart, false);
} else if (btn.attachEvent) {
btn.attachEvent('onclick', pwStart);
} else {
btn.onclick = pwStart;
}
})();
--></script>
</body>
<!-- vim:set spell spl=en fo=tcroqwanl1 tw=80 ts=2 sw=2 sts=2 sta et ai cin fenc=utf-8 ff=unix: -->
</html>