Avoir plusieurs instances
J'ai défini un objet à l'aide du script prototype.js, que je ne peut malheureusement instancier qu'une fois (vraiment très bizarre). Et je ne comprend pas pourquoi ...
Mon objet :
Code:
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
|
var Windows = Class.create();
Windows.prototype = {
initialize : function(_Name,_Left,_Top,_Height,_Width) {
this.Name = _Name;
this.Bar_Name = this.Name+'Bar';
this.Min_Name = this.Name+'Min';
this.Close_Name = this.Name+'Close';
this.Left = _Left;
this.Top = _Top;
this.Height = _Height;
this.Width = _Width;
this.printW();
this.DOM = document.getElementById(this.Name);
this.DOM_Bar = document.getElementById(this.Bar_Name);
this.DOM_Min = document.getElementById(this.Min_Name);
this.DOM_Close = document.getElementById(this.Close_Name);
this.DOM_Bar.onmousedown = this.startDrag.bindAsEventListener(this);
this.DOM_Close.onclick = this.setHidden.bindAsEventListener(this);
},
printW : function() {
document.write('<div style="border-style:solid; border-width:1px; position: absolute; width: '+this.Width+'px; height: '+this.Height+'px; z-index: 1; left: '+this.Left+'px; top: '+this.Top+'px; padding-left:4px; padding-right:4px; padding-top:1px; padding-bottom:1px" id="'+this.Name+'"><div style="border-style:solid; border-width:1px; position: absolute; width: '+this.Width+'px; height: 17px; z-index: 1; left: -1px; top: -1px; padding-left:4px; padding-right:4px; padding-top:1px; padding-bottom:1px; background-color:#0000FF" id="'+this.Name+'Bar"><p align="right"><input type="button" value="_" id="'+this.Name+'Min"><input type="button" value="X" id="'+this.Name+'Close"></div></div>');
},
setVisible : function() {
this.DOM.style.visibility = 'visible';
},
setHidden : function() {
this.DOM.style.visibility = 'hidden';
},
setLeft : function(_left) {
this.DOM.style.left = _left;
},
setTop : function(_top) {
this.DOM.style.top = _top;
},
getLeft : function() {
return this.DOM.style.left;
},
getTop : function() {
return this.DOM.style.top;
},
startDrag : function(evt) {
window.lastX = evt.clientX;
window.lastY = evt.clientY;
// lance doDrag tant que l'on appuie sur le bouton de la souris en la bougeant
this.DOM_Bar.onmousemove= this.doDrag.bindAsEventListener(this);
// lance finirDrag quand on relache le bouton de la souris
this.DOM_Bar.onmouseup= this.endDrag.bindAsEventListener(this);
},
doDrag : function(evt) {
// Calcul de l'?cart de position de la souris
var difX=evt.clientX-window.lastX;
var difY=evt.clientY-window.lastY;
//R?cup?ration de la position du div et ajout de l'?cart de position de la souris
var newX1 = parseInt(this.getLeft())+difX;
var newY1 = parseInt(this.getTop())+difY;
// Assignation des nouvelles coordonn?es au div
this.setLeft(newX1+"px");
this.setTop(newY1+"px");
//Assignation de l'anci?nne position de la souris
window.lastX=evt.clientX;
window.lastY=evt.clientY;
},
endDrag : function(evt) {
this.DOM_Bar.onmousemove=null;
}
} |
Cet objet simule en fait une fenetre dans le navigateur, avec seulement un drag&drop. Jusque la, tout va bien, le script fonctionne très bien sous firefox, et pas du tout sous IE, mais ça, j'ai plutot l'habitude.
Le problème survient lorsque je souhaite instancier deux objets de type Windows. Le premier objet est très bien instancié, et a exactement le comportement souhaité, mais pour le deuxième, le debugger de firefox m'indique :
Code:
1
2
3
|
Erreur : Windows is not defined
Fichier Source : http://localhost/testjs/test.html Ligne : 12 |
Voici test.html, qui contient le code appelant :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
|
<html>
<head><TITLE>
Page de test
</TITLE>
<SCRIPT language="javascript" src="./prototype/prototype.js"></SCRIPT>
<SCRIPT language="javascript" src="./windows.js"></SCRIPT>
<SCRIPT language="javascript">
function start(){
var MyWindow = new Windows('MyWindow',10,10,200,200);
var oWindow = new Windows('oWindow',300,300,200,200);
}
</SCRIPT>
</head>
<body onload="js:start();">
</body>
</html> |
Voila, je ne comprend (une fois de plus) pas très bien pourquoi je ne peut pas instancier deux objets, donc si quelqu'un a une idée ...
Merci !
