Git-Mirrors/DISARMframeworks
1
0
Fork 0
mirror of https://github.com/DISARMFoundation/DISARMframeworks.git synced 2025-05-08 09:44:58 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Copy AMITT repository, clean up and rebrand

Browse source 
Took a copy of the current AMITT github repository - we'll be updating this and merging the SPICE branch back in
Rebranded to DISARM
Moved generated pages to their own folder, to make looking at the repository less confusing
This commit is contained in:
Sara-Jayne Terp 2022-01-29 11:34:46 -05:00
commit 22abaf93d8
448 changed files with 58066 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

79
visualisations/grid.js Normal file
View file

@ -0,0 +1,79 @@
var gridnames = ["#bluegrid", "#redgrid"];
for (gridname in gridnames) {
fillGrid(gridname)
}
function fillGrid(gridname) {
function gridData() {
var data = new Array();
var xpos = 1; //starting xpos and ypos at 1 so the stroke will show when we make the grid below
var ypos = 1;
var width = 50;
var height = 50;
var click = 0;
// iterate for rows
for (var row = 0; row < 10; row++) {
data.push( new Array() );
// iterate for cells/columns inside rows
for (var column = 0; column < 12; column++) {
data[row].push({
x: xpos,
y: ypos,
width: width,
height: height,
text: "test",
click: click
})
// increment the x position. I.e. move it over by 50 (width variable)
xpos += width;
}
// reset the x position after a row is complete
xpos = 1;
// increment the y position for the next row. Move it down 50 (height variable)
ypos += height;
}
return data;
}
var gridData = gridData();
// I like to log the data to the console for quick debugging
console.log(gridData);
var grid = d3.select("#bluegrid")
.append("svg")
.attr("width","610px")
.attr("height","510px");
var row = grid.selectAll(".row")
.data(gridData)
.enter().append("g")
.attr("class", "row");
var column = row.selectAll(".square")
.data(function(d) { return d; })
.enter().append("rect")
.attr("class","square")
.attr("x", function(d) { return d.x; })
.attr("y", function(d) { return d.y; })
.attr("width", function(d) { return d.width; })
.attr("height", function(d) { return d.height; })
.style("fill", "#fff")
.style("stroke", "#222")
.on('click', function(d) {
d.click ++;
if ((d.click)%4 == 0 ) { d3.select(this).style("fill","#fff"); }
if ((d.click)%4 == 1 ) { d3.select(this).style("fill","#2C93E8"); }
if ((d.click)%4 == 2 ) { d3.select(this).style("fill","#F56C4E"); }
if ((d.click)%4 == 3 ) { d3.select(this).style("fill","#838690"); }
});
}