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
|
/* ************************************************************************
#module(Smokeping)
************************************************************************ */
/**
* The widget showing a detail graph
*/
qx.Class.define('Smokeping.ui.Navigator',
{
extend: qx.ui.window.Window,
/*
*****************************************************************************
CONSTRUCTOR
*****************************************************************************
*/
/**
* @param graph_url {String} Url to the explorable graph
*
*/
construct: function (src,width,height) {
this._graph_src = src;
this._graph_width = width;
this._graph_height = height;
with(this){
base(arguments,tr("Smokeping Graph Navigator"));
set({
showMaximize: false,
showMinimize: false,
width: width,
height: height,
minWidth: 120,
minHeight: 80,
backgroundColor: '#f0f0f0'
});
}
this._lastrun = 0;
this._loader = new Smokeping.ui.LoadingAnimation();
this._update_image();
},
members: {
// resizable objects have a changeWidth method
// which we can override to take part in the fun
// why I have to access this._graph_width without the this.
// in this case
_changeWidth: function(newWidth) {
var diff = newWidth - this.getBoxWidth();
this.base(arguments, newWidth);
this.add(this._loader);
this._graph_width = this._graph_width + diff;
qx.client.Timer.once(this._update_image,this,250);
},
_changeHeight: function(newHeight) {
var diff = newHeight - this.getBoxHeight();
this.base(arguments, newHeight);
this.add(this._loader);
this._graph_height = this._graph_height + diff;
qx.client.Timer.once(this._update_image,this,250);
},
_update_image: function(){
var now = (new Date()).getTime();
if (this._lastrun + 1000 < now) {
this._preloader = qx.io.image.PreloaderManager.getInstance().create(
this._graph_src+';w='+this._graph_width+';h='+this._graph_height);
if (this._preloader.isLoaded()){
qx.client.Timer.once(this._show_image,this,0);
} else {
this._preloader.addEventListener('load', this._show_image, this);
}
this._lastrun = now;
}
else {
this.debug('Skipping update since previous update less tahn 1 second')
}
},
_show_image: function(e){
with(this){
set({
width: 'auto',
height: 'auto'
});
var image = new qx.ui.basic.Image();
image.setPreloader(this._preloader);
qx.io.image.PreloaderManager.getInstance().remove(this._preloader);
removeAll();
add(image);
var zoomer = new Smokeping.ui.Zoomer(image,this._graph_width,this._graph_height,33,30);
add(zoomer);
}
}
}
});
|