Launchpad Mini

web/package.json

@@ -18,17 +18,18 @@
  "alertifyjs": "^1.13.1",
  "can-ndjson-stream": "^1.0.2",
  "chess.js": "^0.12.1",
- "chessground": "^8.2.0",
+ "chessground": "^8.3.6",
  "construct-ui": "^0.3.3",
  "javascript-astar": "^0.4.1",
  "jwt-decode": "^3.1.2",
  "material-design-icons-iconfont": "^6.1.0",
- "mithril": "^2.0.4",
- "webmidi": "^3.0.14"
+ "mithril": "^2.2.2",
+ "webmidi": "^3.0.25"
  },
  "devDependencies": {
  "@babel/cli": "^7.12.10",
  "@babel/preset-env": "^7.12.11",
- "parcel": "^2.2.0"
+ "parcel": "^2.2.0",
+ "process": "^0.11.10"
  }
 }

web/src/Actions.js

@@ -1,22 +1,25 @@
 import m from 'mithril'
-let Stream = require("mithril/stream")
+let Stream = require('mithril/stream')
 import { Chess } from 'chess.js'
 import { COLORS } from './Launchpad'
 import { uci } from './ChessMaths'
 import { playOtherSide } from './utils'
 import { auth } from './User'
 
-export const range = (start, end) => Array.apply(0, Array(end - 1)).map((element, index) => index + start)
+export const range = (start, end) =>
+ Array.apply(0, Array(end - 1)).map((element, index) => index + start)
 
 export const State = () => ({
  theme: 'dark',
- input: null, 
+ input: null,
  output: null,
  inputName: null,
  outputName: null,
  inputs: Stream([]),
  outputs: Stream([]),
  deviceId: null,
+ deviceName: null,
+ deviceType: null,
  connected: false,
  top: range(91, 10),
  header: null,
@@ -70,33 +73,42 @@ export const Actions = (state, actions) => ({
  highlightAvailableMoves: () => null,
 })
 
-
 export const OnlineActions = (state, actions) => ({
  onmove: (orig, dest) => {
- let move = {from: orig, to: dest}
+ let move = { from: orig, to: dest }
  let piece = state.chess.get(move.from)
- if (piece.type == 'p' && ((piece.color == 'w' && move.to.charAt(1) == 8 ) || (piece.color == 'b' && move.to.charAt(1) == 1 ))) {
+ if (
+ piece.type == 'p' &&
+ ((piece.color == 'w' && move.to.charAt(1) == 8) ||
+ (piece.color == 'b' && move.to.charAt(1) == 1))
+ ) {
  console.log('promotion! Auto promote to Queen')
  move.promotion = 'q'
  }
  state.chess.move(move)
  console.log('moved', move, piece, state.chess.ascii())
- state.ground.set({fen: state.chess.fen()})
- 
+ state.ground.set({ fen: state.chess.fen() })
+
  actions.lightBoard(true)
  playOtherSide(state.chess, state.ground)(orig, dest)
  m.redraw()
  // send to lichess api
  let move_uci = uci(move)
- auth('https://lichess.org/api/board/game/' + m.route.param('id') + '/move/' + move_uci, {
- method: 'post',
- }).then(e => {
+ auth(
+ 'https://lichess.org/api/board/game/' +
+ m.route.param('id') +
+ '/move/' +
+ move_uci,
+ {
+ method: 'post',
+ }
+ ).then(e => {
  console.log('played move', move_uci, e)
  })
  },
  afterInit: () => {
  console.log('initing online actions')
  actions.afterInit()
  actions.streamGame()
- }
+ },
 })

web/src/Board.js

@@ -5,9 +5,10 @@ import '../node_modules/chessground/assets/chessground.brown.css'
 import '../node_modules/chessground/assets/chessground.cburnett.css'
 import './board.css'
 
-
 export const Board = (state, actions) => ({
  oncreate: vnode => {
  state.ground = new Chessground(vnode.dom, vnode.attrs.config)
  },
- view: vnode => m('.board', {class: vnode.attrs.class, onclick: vnode.attrs.onclick})})
+ view: vnode =>
+ m('.board', { class: vnode.attrs.class, onclick: vnode.attrs.onclick }),
+})

web/src/ChessMaths.js

@@ -5,10 +5,10 @@ export const FILES = 'abcdefgh'
 let squares = []
 let files = [...FILES]
 files.forEach(f => {
- for (let i=1; i<=8; i++) {
-  squares.push(f + i)
-  }
- })
+ for (let i = 1; i <= 8; i++) {
+ squares.push(f + i)
+ }
+})
 
 export const SQUARES = squares
 
@@ -22,7 +22,7 @@ export function uci(move) {
 
 export function calculateInfluence(fen) {
  let chess = new Chess(fen)
- let moves = chess.moves({verbose: true})//, legal: false})
+ let moves = chess.moves({ verbose: true }) //, legal: false})
  let defenders = Array(64).fill(0)
  moves.forEach((move, i) => {
  let index = chess.SQUARES.indexOf(move.to)
@@ -47,7 +47,7 @@ export function fenForOtherSide(fen) {
 
 export function makeDests(fen) {
  let chess = new Chess(fen)
- let moves = chess.moves({verbose: true})
+ let moves = chess.moves({ verbose: true })
  let dests = {}
  moves.forEach((m, i) => {
  if (dests[m.from]) {
@@ -60,16 +60,14 @@ export function makeDests(fen) {
  return dests
 }
 
-
 export function getPieceLocations(chess, piece) {
  let res = []
  chess.board().map((rank, r) => {
  rank.map((p, f) => {
  if (p && p.type == piece.type && p.color == piece.color) {
- res.push( FILES[f] + (8-r) )
+ res.push(FILES[f] + (8 - r))
  }
  })
- }) 
+ })
  return res
 }
-

web/src/Color.js

@@ -1,16 +1,17 @@
 import m from 'mithril'
 import './color.css'
 
-export const Color = color => m('input[type=color]', {
- value: LAUNCHPAD_COLORS[color]
-}, )
+export const Color = color =>
+ m('input[type=color]', {
+ value: LAUNCHPAD_COLORS[color],
+ })
 
-export const ColorSelector = state => m('.colors', {}, [
- Object.keys(state.colors).map((k, n) => m('span.color', {}, [
- m('p.type', {}, k),
- Color(state.colors[k]),
- ])),
-])
+export const ColorSelector = state =>
+ m('.colors', {}, [
+ Object.keys(state.colors).map((k, n) =>
+  m('span.color', {}, [m('p.type', {}, k), Color(state.colors[k])])
+  ),
+ ])
 
 export const LAUNCHPAD_COLORS = [
  '#000000',