V. Implémentation : 3e étape - les données▲
Pour terminer notre implémentation, voici quelques fonctions utiles pour étoffer notre HtmlEditTable.
V-A. Qui es-tu ?▲
Il est intéressant pour l'utilisateur de notre contrôle de pouvoir accéder aux noms des lignes et colonnes de la table.
LineNames
:
function(
){
if (
arguments.
length >
0
){
this.
lines =
lines;
}
return this.
lines;
},
ColumnNames
:
function(
){
if (
arguments.
length >
0
){
this.
columns =
columns;
}
return this.
columns;
},
Suivant que vous passiez ou non en argument un Array contenant les noms des lignes ou colonnes, vous affectez ou accédez à l'Array correspondant du HtmlEditTable. Ces fonctions ont le rôle d'accesseur et de mutateur sur les attributs lines et columns de notre contrôle.
V-B. Où es-tu ?▲
Tout comme les noms des lignes et colonnes, il est très utile de pouvoir accéder aux données d'une ligne ou d'une colonne entière. C'est le rôle des fonctions Line() et Column(). La fonction Line() attend en paramètre un objet définissant les propriétés name, nom de la ligne, et data, Array contenant les données à affecter à la ligne. La fonction Column() attend en paramètre un objet définissant les propriétés name et data, ainsi que la propriété head, titre de la colonne.
Line
:
function(
){
if (
arguments.
length ==
0
||
typeof arguments[
0
].
name
==
"undefined"
){
return undefined;
}
var data =
[];
var y =
Tools.IndexOf
(
this.
lines,
arguments[
0
].
name
);
if (
y >
-
1
){
var cells =
this.
control.getElementsByTagName
(
"tbody"
)[
0
].
rows[
y].
cells;
if (
typeof arguments[
0
].
data !=
"undefined"
){
data =
arguments[
0
].
data;
for (
var i=
0
,
imax=
data.
length;
i<
imax;
i++
){
cells[
i].
firstChild.
data =
data[
i];
}
}
else{
for (
var x=
0
,
xmax=
cells.
length;
x<
xmax;
x++
){
data.push
(
cells[
x].
firstChild.
data);
}
}
}
else if (
typeof arguments[
0
].
data !=
"undefined"
){
this.
lines.push
(
arguments[
0
].
name
);
data =
arguments[
0
].
data;
var row =
this.
control.insertRow
(-
1
);
for (
var j=
0
,
jmax=
this.
columns.
length;
j<
jmax;
j++
){
var cell =
row.insertCell
(-
1
);
HtmlEditTableHelper.CellInitialize
(
cell,
data[
j]
);
}
}
return data;
},
Column
:
function(
){
if (
arguments.
length ==
0
||
typeof arguments[
0
].
name
==
"undefined"
){
return undefined;
}
var data =
[];
var rows =
this.
control.getElementsByTagName
(
"tbody"
)[
0
].
rows;
var x =
Tools.IndexOf
(
this.
columns,
arguments[
0
].
name
);
if (
x >
-
1
){
if (
typeof arguments[
0
].
data !=
"undefined"
){
data =
arguments[
0
].
data;
for (
var i,
imax=
data.
length;
i<
imax;
i++
){
rows[
i].
cells[
x].
firstChild.
data =
data[
i];
}
}
else{
this.
lines.push
(
arguments[
0
].
name
);
for (
var y=
0
,
ymax=
rows.
length;
y<
ymax;
y++
){
data.push
(
rows[
y].
cells[
x].
firstChild.
data);
}
}
}
else if (
typeof arguments[
0
].
data !=
"undefined"
){
this.
columns.push
(
arguments[
0
].
name
);
data =
arguments[
0
].
data;
for (
var y=
0
,
ymax=
rows.
length;
y<
ymax;
y++
){
var cell =
rows[
y]
.insertCell
(-
1
);
HtmlEditTableHelper.CellInitialize
(
cell,
data[
y]
);
}
var thead =
this.
control.getElementsByTagName
(
"thead"
);
if (
thead.
length >
0
){
thead =
thead[
0
];
var title =
typeof arguments[
0
].
head !=
"undefined"
?
arguments[
0
].
head
:
""
;
var cell =
thead.
rows[
0
]
.insertCell
(-
1
);
cell.appendChild
(
document
.createTextNode
(
title));
}
}
return data;
},
Ces fonctions ont également le rôle d'accesseur et de mutateur. Accesseur si l'unique paramètre passé aux fonctions est le nom de la ligne ou de la colonne à laquelle on désire accéder. Mutateur si, en plus du nom de la ligne ou colonne, on passe un Array contenant les données que l'on veut affecter à ladite ligne ou colonne.
Dans le cas où la ligne ou la colonne existe et que la propriété data du paramètre est définie, les données que la ligne ou la colonne contient sont remplacées par celles passées en paramètre. Si la ligne ou la colonne n'existe pas, elle est créée et initialisée. Pour la colonne, si le paramètre définit également la propriété head, alors l'en-tête de la colonne prendra cette valeur.
V-C. Tous pour un, un pour tous▲
Nous pouvons maintenant accéder à la totalité des données via la fonction AllData(), à une ligne ou une colonne via les fonctions Line() et Column(). Il ne nous manque plus que pouvoir accéder à la donnée d'une cellule particulière. C'est ce que nous permet la fonction Data().
Data
:
function(
column,
line,
data){
if (
arguments.
length <
2
){
return undefined;
}
var x,
y;
x =
Tools.IndexOf
(
this.
columns,
arguments[
0
]
);
if (
x >
-
1
){
y =
Tools.IndexOf
(
this.
lines,
arguments[
1
]
);
if (
y >
-
1
){
if (
arguments.
length >
2
){
this.
control.
rows[
y].
cells[
x]
.appendChild
(
document
.createTextNode
(
arguments[
2
]
));
}
return this.
control.
rows[
y].
cells[
x].
firstChild.
data;
}
}
return undefined;
}
Encore une fois, cette fonction est à la fois accesseur et mutateur. Accesseur si on lui passe en paramètre les noms de la colonne et de la ligne qui permettront d'identifier la cellule cherchée. Mutateur si, en plus des paramètres précédents, on passe la valeur à affecter à la cellule.
V-D. Interface finale▲
À l'issue de l'ajout des fonctionnalités précédentes, voici l'interface finale de notre contrôle mise à disposition de l'utilisateur :
/*
public class HtmlEditTable {
public:
HtmlEditTable(object o);
void AppendTo(control parent);
Array LineNames();
Array LineNames(Array t);
Array ColumnNames();
Array ColumnNames(Array t);
object Dimensions();
object Dimensions(object d);
Array Line();
Array Line(object o);
Array Column();
Array Column(object o);
void Clean();
void Populate(Array data);
void Build(object o);
T Data(string col, string row);
T Data(string col, string row, T data);
Array AllData();
};
*/