elements.js

export const userIDElem = document.getElementById("user-id")

export const peerIDElem = document.getElementById("peer-id")
export const peerButton = document.getElementById("peer-connect")
export const connectedPeers = document.getElementById("connected-peers")

export const overallStatusIcon = document.getElementById("overall-status-icon")
export const overallStatusIconImage = document.getElementById(
  "overall-status-icon-img",
)

export const canvas = document.getElementById("canvas")
export const penButton = document.getElementById("pen-tool")
export const eraserButton = document.getElementById("eraser-tool")
export const recognitionModeButton = document.getElementById("recognition-mode")

export const fastUndoButton = document.getElementById("fast-undo-tool")
export const undoButton = document.getElementById("undo-tool")

export const roomIDElem = document.getElementById("room-id")
export const roomConnectButton = document.getElementById("room-connect")
export const connectedRoomID = document.getElementById("connected-room-id")
export const connectedRoomInfoContainer = document.getElementById(
  "connected-room-info",
)

export const penProperties = document.getElementById("pen-properties")
export const closeButton = document.querySelectorAll(".close")
export const palette = document.getElementById("palette")
export const rectangle = document.getElementById("rectangle")
export const wheel = document.getElementById("wheel")
export const strokeColorPicker = document.getElementById("other-colours")
export const strokeRadiusSlider = document.getElementById("range")
export const output = document.getElementById("value")
export const labelColours = document.getElementById("colours")
export const userInfo = document.getElementById("user-avatar")
export const topPanel = document.getElementById("top-panel")