Tissevert/Constellations
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Implement grid loading and saving

Browse source
This commit is contained in:
Tissevert 2022-07-26 19:25:56 +02:00
parent ccc48a3c8d
commit 6071977123
4 changed files with 42 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
Makefile
View file

@ -1,4 +1,4 @@
LIB = unitJS LIB = unitJS WTK
WEBAPP = index.html style.css main.js WEBAPP = index.html style.css main.js
ROOT = $(PREFIX)/var/www ROOT = $(PREFIX)/var/www

6
guix.scm
View file

@ -7,7 +7,8 @@
(let (let
((%source-dir (dirname (current-filename))) ((%source-dir (dirname (current-filename)))
(SJW (load "/home/Bureau/sjw/SJW.scm")) (SJW (load "/home/Bureau/sjw/SJW.scm"))
(UnitJS (load "/home/Bureau/unitJS/guix.scm"))) (UnitJS (load "/home/Bureau/unitJS/guix.scm"))
(WTK (load "/home/Bureau/WTK/guix.scm")))
(package (package
(name "etoiles") (name "etoiles")
(version "devel") (version "devel")
@ -19,7 +20,8 @@
(native-inputs (native-inputs
(list (list
SJW SJW
UnitJS)) UnitJS
WTK))
(arguments (arguments
`(#:make-flags `(#:make-flags
,#~(list (string-append "PREFIX=" #$output)) ,#~(list (string-append "PREFIX=" #$output))

6
index.html
View file

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ul id="mode"> <ul id="mode">
<li id="edit">Édition</li> <li id="edit">Edit</li>
</ul> </ul>
<div id="playground"> <div id="playground">
<ul id="toolbox"> <ul id="toolbox">
@ -24,7 +24,9 @@
<select id="colors" class="color0"></select> <select id="colors" class="color0"></select>
</li> </li>
</ul> </ul>
<table id="grid"/> <button id="load">Load</button>
<table id="grid"></table>
<button id="save">Save</button>
</div> </div>
</body> </body>
</html> </html>

33
js/Grid.js
View file

@ -1,6 +1,10 @@
import * as File from WTK.File;
import * as Async from UnitJS.Async;
import compose from UnitJS.Fun;
import * as Dom from UnitJS.Dom; import * as Dom from UnitJS.Dom;
import {color, tool} from Toolbox; import {color, tool} from Toolbox;
var grid = { var grid = {
element: null, element: null,
data: null data: null
@ -22,6 +26,8 @@ function init(size, elementId) {
grid.element.addEventListener('mouseleave', function() { grid.element.addEventListener('mouseleave', function() {
down = false; down = false;
}); });
document.getElementById('load').addEventListener('click', load);
document.getElementById('save').addEventListener('click', save);
} }
function emptyGrid(size) { function emptyGrid(size) {
@ -88,3 +94,30 @@ function paint(i0, j0) {
queue.shift(); queue.shift();
} }
} }
function load() {
Async.run(
Async.bind(
File.pick({accept: 'text/json,.json'}),
function(input) {
return File.load(input.files[0]);
},
Async.map(compose(setGridData, JSON.parse))
)
);
}
function setGridData(data) {
if(data != undefined) {
for(var row = 0; row < grid.element.children.length; row++) {
for(var column = 0; column < grid.element.children[row].children.length; column++) {
grid.data[row][column] = data[row][column];
grid.element.children[row].children[column].className = data[row][column];
}
}
}
}
function save() {
File.save('data:text/json,' + JSON.stringify(grid.data), "grid.json");
}