Subversion Repositories Applications.papyrus

Rev

Go to most recent revision | Details | Last modification | View Log | RSS feed

Rev Author Line No. Line
1318 alexandre_ 1
/*
2
	Copyright (c) 2004-2006, The Dojo Foundation
3
	All Rights Reserved.
4
 
5
	Licensed under the Academic Free License version 2.1 or above OR the
6
	modified BSD license. For more information on Dojo licensing, see:
7
 
8
		http://dojotoolkit.org/community/licensing.shtml
9
*/
10
 
1422 alexandre_ 11
 
12
 
1318 alexandre_ 13
dojo.provide("dojo.widget.Clock");
14
dojo.require("dojo.widget.*");
15
dojo.require("dojo.gfx.*");
16
dojo.require("dojo.uri.Uri");
17
dojo.require("dojo.lang.common");
18
dojo.require("dojo.lang.timing.Timer");
19
dojo.widget.defineWidget("dojo.widget.Clock", dojo.widget.HtmlWidget, function () {
20
	var self = this;
21
	this.timeZoneOffset = 0;
22
	this.label = "";
23
	this.date = new Date();
24
	this.handColor = "#788598";
25
	this.handStroke = "#6f7b8c";
26
	this.secondHandColor = [201, 4, 5, 0.8];
27
	this.topLabelColor = "#efefef";
28
	this.labelColor = "#fff";
29
	this.timer = new dojo.lang.timing.Timer(1000);
30
	this.center = {x:75, y:75};
31
	this.hands = {hour:null, minute:null, second:null};
32
	this.shadows = {hour:{shadow:null, shift:{dx:2, dy:2}}, minute:{shadow:null, shift:{dx:2, dy:3}}, second:{shadow:null, shift:{dx:4, dy:4}}};
33
	this.image = dojo.uri.moduleUri("dojo.widget", "templates/images/clock.png");
34
	this.surface = null;
35
	this.labelNode = null;
36
	this.topLabelNode = null;
37
	this.draw = function () {
38
		self.date = new Date();
39
		var h = (self.date.getHours() + self.timeZoneOffset) % 12;
40
		var m = self.date.getMinutes();
41
		var s = self.date.getSeconds();
42
		self.placeHour(h, m, s);
43
		self.placeMinute(m, s);
44
		self.placeSecond(s);
45
		self.topLabelNode.innerHTML = ((self.date.getHours() + self.timeZoneOffset) > 11) ? "PM" : "AM";
46
	};
47
	this.timer.onTick = self.draw;
48
}, {set:function (dt) {
49
	this.date = dt;
50
	if (!this.timer.isRunning) {
51
		this.draw();
52
	}
53
}, start:function () {
54
	this.timer.start();
55
}, stop:function () {
56
	this.timer.stop();
57
}, _initPoly:function (parent, points) {
58
	var path = parent.createPath();
59
	var first = true;
60
	dojo.lang.forEach(points, function (c) {
61
		if (first) {
62
			path.moveTo(c.x, c.y);
63
			first = false;
64
		} else {
65
			path.lineTo(c.x, c.y);
66
		}
67
	});
68
	return path;
69
}, _placeHand:function (shape, angle, shift) {
70
	var move = {dx:this.center.x + (shift ? shift.dx : 0), dy:this.center.y + (shift ? shift.dy : 0)};
71
	return shape.setTransform([move, dojo.gfx.matrix.rotateg(-angle)]);
72
}, placeHour:function (h, m, s) {
73
	var angle = 30 * (h + m / 60 + s / 3600);
74
	this._placeHand(this.hands.hour, angle);
75
	this._placeHand(this.shadows.hour.shadow, angle, this.shadows.hour.shift);
76
}, placeMinute:function (m, s) {
77
	var angle = 6 * (m + s / 60);
78
	this._placeHand(this.hands.minute, angle);
79
	this._placeHand(this.shadows.minute.shadow, angle, this.shadows.minute.shift);
80
}, placeSecond:function (s) {
81
	var angle = 6 * s;
82
	this._placeHand(this.hands.second, angle);
83
	this._placeHand(this.shadows.second.shadow, angle, this.shadows.second.shift);
84
}, init:function () {
85
	if (this.domNode.style.position != "absolute") {
86
		this.domNode.style.position = "relative";
87
	}
88
	while (this.domNode.childNodes.length > 0) {
89
		this.domNode.removeChild(this.domNode.childNodes[0]);
90
	}
91
	this.domNode.style.width = "150px";
92
	this.domNode.style.height = "150px";
93
	this.surface = dojo.gfx.createSurface(this.domNode, 150, 150);
94
	this.surface.createRect({width:150, height:150});
95
	this.surface.createImage({width:150, height:150, src:this.image + ""});
96
	var hP = [{x:-3, y:-4}, {x:3, y:-4}, {x:1, y:-27}, {x:-1, y:-27}, {x:-3, y:-4}];
97
	var mP = [{x:-3, y:-4}, {x:3, y:-4}, {x:1, y:-38}, {x:-1, y:-38}, {x:-3, y:-4}];
98
	var sP = [{x:-2, y:-2}, {x:2, y:-2}, {x:1, y:-45}, {x:-1, y:-45}, {x:-2, y:-2}];
99
	this.shadows.hour.shadow = this._initPoly(this.surface, hP).setFill([0, 0, 0, 0.1]);
100
	this.hands.hour = this._initPoly(this.surface, hP).setStroke({color:this.handStroke, width:1}).setFill({type:"linear", x1:0, y1:0, x2:0, y2:-27, colors:[{offset:0, color:"#fff"}, {offset:0.33, color:this.handColor}]});
101
	this.shadows.minute.shadow = this._initPoly(this.surface, mP).setFill([0, 0, 0, 0.1]);
102
	this.hands.minute = this._initPoly(this.surface, mP).setStroke({color:this.handStroke, width:1}).setFill({type:"linear", x1:0, y1:0, x2:0, y2:-38, colors:[{offset:0, color:"#fff"}, {offset:0.33, color:this.handColor}]});
103
	this.surface.createCircle({r:6}).setStroke({color:this.handStroke, width:2}).setFill("#fff").setTransform({dx:75, dy:75});
104
	this.shadows.second.shadow = this._initPoly(this.surface, sP).setFill([0, 0, 0, 0.1]);
105
	this.hands.second = this._initPoly(this.surface, sP).setFill(this.secondHandColor);
106
	this.surface.createCircle({r:4}).setFill(this.secondHandColor).setTransform({dx:75, dy:75});
107
	this.topLabelNode = document.createElement("div");
108
	with (this.topLabelNode.style) {
109
		position = "absolute";
110
		top = "3px";
111
		left = "0px";
112
		color = this.topLabelColor;
113
		textAlign = "center";
114
		width = "150px";
115
		fontFamily = "sans-serif";
116
		fontSize = "11px";
117
		textTransform = "uppercase";
118
		fontWeight = "bold";
119
	}
120
	this.topLabelNode.innerHTML = ((this.date.getHours() + this.timeZoneOffset) > 11) ? "PM" : "AM";
121
	this.domNode.appendChild(this.topLabelNode);
122
	this.labelNode = document.createElement("div");
123
	with (this.labelNode.style) {
124
		position = "absolute";
125
		top = "134px";
126
		left = "0px";
127
		color = this.labelColor;
128
		textAlign = "center";
129
		width = "150px";
130
		fontFamily = "sans-serif";
131
		fontSize = "10px";
132
		textTransform = "uppercase";
133
		fontWeight = "bold";
134
	}
135
	this.labelNode.innerHTML = this.label || " ";
136
	this.domNode.appendChild(this.labelNode);
137
	this.draw();
138
}, postCreate:function () {
139
	this.init();
140
	this.start();
141
}});
142