+ const modalFenEdit = [
+ h('input',
+ {
+ attrs: { "id": "modal-fenedit", type: "checkbox" },
+ "class": { "modal": true },
+ }),
+ h('div',
+ {
+ attrs: { "role": "dialog", "aria-labelledby": "modal-fenedit" },
+ },
+ [
+ h('div',
+ {
+ "class": { "card": true, "smallpad": true },
+ },
+ [
+ h('label',
+ {
+ attrs: { "id": "close-fenedit", "for": "modal-fenedit" },
+ "class": { "modal-close": true },
+ }
+ ),
+ h('h3',
+ {
+ "class": { "section": true },
+ domProps: { innerHTML: "Position + flags (FEN):" },
+ }
+ ),
+ h('input',
+ {
+ attrs: {
+ "id": "input-fen",
+ type: "text",
+ value: VariantRules.GenRandInitFen(),
+ },
+ }
+ ),
+ h('button',
+ {
+ on: { click:
+ () => {
+ const fen = document.getElementById("input-fen").value;
+ document.getElementById("modal-fenedit").checked = false;
+ this.newGame("friend", fen);
+ }
+ },
+ domProps: { innerHTML: "Ok" },
+ }
+ ),
+ h('button',
+ {
+ on: { click:
+ () => {
+ document.getElementById("input-fen").value =
+ VariantRules.GenRandInitFen();
+ }
+ },
+ domProps: { innerHTML: "Random" },
+ }
+ ),
+ ]
+ )
+ ]
+ )
+ ];
+ elementArray = elementArray.concat(modalFenEdit);
+ const modalSettings = [
+ h('input',
+ {
+ attrs: { "id": "modal-settings", type: "checkbox" },
+ "class": { "modal": true },
+ }),
+ h('div',
+ {
+ attrs: { "role": "dialog", "aria-labelledby": "modal-settings" },
+ },
+ [
+ h('div',
+ {
+ "class": { "card": true, "smallpad": true },
+ },
+ [
+ h('label',
+ {
+ attrs: { "id": "close-settings", "for": "modal-settings" },
+ "class": { "modal-close": true },
+ }
+ ),
+ h('h3',
+ {
+ "class": { "section": true },
+ domProps: { innerHTML: "Preferences" },
+ }
+ ),
+ h('fieldset',
+ { },
+ [
+ //h('legend', { domProps: { innerHTML: "Show " } }),
+ h('label',
+ {
+ attrs: {
+ for: "setHints",
+ },
+ domProps: { innerHTML: "Show hints?" },
+ },
+ ),
+ h('input',
+ {
+ attrs: {
+ "id": "setHints",
+ type: "checkbox",
+ checked: this.hints,
+ },
+ on: { "change": this.toggleHints },
+ }
+ ),
+ ]
+ ),
+ h('fieldset',
+ { },
+ [
+ h('label',
+ {
+ attrs: {
+ for: "selectColor",
+ },
+ domProps: { innerHTML: "Board colors" },
+ },
+ ),
+ h("select",
+ {
+ attrs: { "id": "selectColor" },
+ on: { "change": this.setColor },
+ },
+ [
+ h("option",
+ {
+ domProps: {
+ "value": "lichess",
+ innerHTML: "lichess"
+ },
+ attrs: { "selected": this.color=="lichess" },
+ }
+ ),
+ h("option",
+ {
+ domProps: {
+ "value": "chesscom",
+ innerHTML: "chess.com"
+ },
+ attrs: { "selected": this.color=="chesscom" },
+ }
+ ),
+ h("option",
+ {
+ domProps: {
+ "value": "chesstempo",
+ innerHTML: "chesstempo"
+ },
+ attrs: { "selected": this.color=="chesstempo" },
+ }
+ ),
+ ],
+ ),
+ ]
+ ),
+ h('fieldset',
+ { },
+ [
+ h('label',
+ {
+ attrs: {
+ for: "selectSound",
+ },
+ domProps: { innerHTML: "Sound level" },
+ },
+ ),
+ h("select",
+ {
+ attrs: { "id": "selectSound" },
+ on: { "change": this.setSound },
+ },
+ [
+ h("option",
+ {
+ domProps: {
+ "value": "0",
+ innerHTML: "No sound"
+ },
+ }
+ ),
+ h("option",
+ {
+ domProps: {
+ "value": "1",
+ innerHTML: "Newgame sound"
+ },
+ }
+ ),
+ h("option",
+ {
+ domProps: {
+ "value": "2",
+ innerHTML: "All sounds"
+ },
+ }
+ ),
+ ],
+ ),
+ ]
+ ),
+ ]
+ )
+ ]
+ )
+ ];
+ elementArray = elementArray.concat(modalSettings);