<commit_before>package com.mogproject.mogami.playground.view

import com.mogproject.mogami.playground.controller.{Cursor, _}
import com.mogproject.mogami._
import com.mogproject.mogami.core.Game.GameStatus
import com.mogproject.mogami.core.Game.GameStatus.GameStatus
import com.mogproject.mogami.playground.view.piece.PieceRenderer
import com.mogproject.mogami.playground.api.Clipboard
import com.mogproject.mogami.playground.controller.mode.{Editing, Mode, Playing, Viewing}
import com.mogproject.mogami.playground.view.modal.{AlertDialog, YesNoDialog}
import com.mogproject.mogami.util.Implicits._
import org.scalajs.dom
import org.scalajs.dom.{CanvasRenderingContext2D, Element}
import org.scalajs.dom.html.{Canvas, Div}
import org.scalajs.dom.raw.HTMLSelectElement

import scalatags.JsDom.all._

/**
  * controls canvas rendering
  */
case class Renderer(elem: Element, layout: Layout) extends CursorManageable {

  // main canvas
  protected val canvas0: Canvas = createCanvas(0)
  protected val canvas1: Canvas = createCanvas(1)
  protected val canvas2: Canvas = createCanvas(2)
  protected val canvas3: Canvas = createCanvas(3)

  protected val layer0: CanvasRenderingContext2D = canvas0.getContext("2d").asInstanceOf[CanvasRenderingContext2D]
  protected val layer1: CanvasRenderingContext2D = canvas1.getContext("2d").asInstanceOf[CanvasRenderingContext2D]
  protected val layer2: CanvasRenderingContext2D = canvas2.getContext("2d").asInstanceOf[CanvasRenderingContext2D]
  protected val layer3: CanvasRenderingContext2D = canvas3.getContext("2d").asInstanceOf[CanvasRenderingContext2D]

  private[this] val canvasContainer: Div = div(cls := "col-md-6",
    padding := 0,
    height := layout.canvasHeight,
    canvas0,
    canvas1,
    canvas2,
    canvas3
  ).render

  // forms
  private[this] val recordSelector: HTMLSelectElement = select(
    cls := "form-control thin-select",
    onchange := (() => Controller.setRecord(recordSelector.selectedIndex))
  ).render

  private[this] val modeLabel = a(href := "#", cls := "dropdown-toggle", data.toggle := "dropdown", role := "button", aria.haspopup := true, aria.expanded := false).render

  private[this] val langLabel = a(href := "#", cls := "dropdown-toggle", data.toggle := "dropdown", role := "button", aria.haspopup := true, aria.expanded := false).render

  private[this] val navigator = tag("nav")(cls := "navbar navbar-default navbar-fixed-top",
    div(cls := "container",
      div(cls := "row")(
        div(cls := "navbar-header col-md-10 col-md-offset-1",
          ul(cls := "nav navbar-nav",
            li(cls := "dropdown",
              widthA := "60px",
              modeLabel,
              ul(cls := "dropdown-menu",
                li(cls := "dropdown-header", "Mode"),
                li(a(href := "#", "Play", onclick := (() => Controller.setMode(Playing)))),
                li(a(href := "#", "View", onclick := (() => Controller.setMode(Viewing)))),
                li(a(href := "#", "Edit", onclick := (() => Controller.setMode(Editing))))
              )
            ),
            li(cls := "navbar-form",
              div(cls := "form-group",
                recordSelector
              )
            ),
            li(cls := "dropdown pull-right",
              textAlign := "right",
              langLabel,
              ul(cls := "dropdown-menu",
                li(cls := "dropdown-header", "Language"),
                li(a(href := "#", "Japanese", onclick := (() => Controller.setLanguage(Japanese)))),
                li(a(href := "#", "English", onclick := (() => Controller.setLanguage(English))))
              )
            )
          )
        )
      )
    )
  )

  private[this] val snapshotInput = createInput("snapshot")
  private[this] val recordInput = createInput("record")


  private[this] def createInput(ident: String) = input(
    tpe := "text", id := ident, cls := "form-control", aria.label := "...", readonly := "readonly"
  ).render

  private[this] def createInputGroup(labelString: String, inputElem: Element, target: String) = div(
    label(labelString),
    div(cls := "input-group",
      inputElem,
      span(
        cls := "input-group-btn",
        button(cls := "btn btn-default", data("clipboard-target") := s"#${target}", tpe := "button", "Copy!")
      )
    )
  ).render

  private[this] def createControlInput(controlType: Int, glyph: String) = button(cls := "btn btn-default",
    onclick := { () => Controller.setControl(controlType) },
    span(cls := s"glyphicon glyphicon-${glyph}", aria.hidden := true)
  ).render

  private[this] val controlInput0 = createControlInput(0, "step-backward")
  private[this] val controlInput1 = createControlInput(1, "backward")
  private[this] val controlInput2 = createControlInput(2, "forward")
  private[this] val controlInput3 = createControlInput(3, "step-forward")

  private[this] val controlSection = div(
    div(
      label("Control"),
      div(cls := "btn-group btn-group-justified", role := "group", aria.label := "...",
        div(cls := "btn-group", role := "group", controlInput0),
        div(cls := "btn-group", role := "group", controlInput1),
        div(cls := "btn-group", role := "group", controlInput2),
        div(cls := "btn-group", role := "group", controlInput3)
      )
    ),
    br(),
    createInputGroup("Snapshot URL", snapshotInput, "snapshot"),
    br(),
    createInputGroup("Record URL", recordInput, "record")
  ).render

  object EditTurn {
    private[this] val anchors: Map[Player, Element] = Map(
      BLACK -> a(cls := "btn btn-primary active", onclick := { () => Controller.setEditTurn(BLACK) }).render,
      WHITE -> a(cls := "btn btn-primary notActive", onclick := { () => Controller.setEditTurn(WHITE) }).render
    )

    val element: Div = div(cls := "form-group",
      label("Turn"),
      div(cls := "row",
        div(cls := "col-sm-8 col-md-8",
          div(cls := "input-group",
            div(id := "radioBtn", cls := "btn-group btn-group-justified",
              anchors(BLACK),
              anchors(WHITE)
            )
          )
        )
      )
    ).render

    def updateEditTurnLabel(lang: Language): Unit = lang match {
      case Japanese =>
        anchors(BLACK).innerHTML = "先手番"
        anchors(WHITE).innerHTML = "後手番"
      case English =>
        anchors(BLACK).innerHTML = "Black"
        anchors(WHITE).innerHTML = "White"
    }

    def updateEditTurnValue(newValue: Player): Unit = {
      anchors(newValue).classList.remove("notActive")
      anchors(newValue).classList.add("active")
      anchors(!newValue).classList.remove("active")
      anchors(!newValue).classList.add("notActive")
    }
  }

  object EditReset {
    private[this] val states = Seq(
      State.HIRATE, State.MATING_BLACK, State.MATING_WHITE,
      State.HANDICAP_LANCE, State.HANDICAP_BISHOP, State.HANDICAP_ROOK, State.HANDICAP_ROOK_LANCE,
      State.HANDICAP_2_PIECE, State.HANDICAP_3_PIECE, State.HANDICAP_4_PIECE, State.HANDICAP_5_PIECE,
      State.HANDICAP_6_PIECE, State.HANDICAP_8_PIECE, State.HANDICAP_10_PIECE,
      State.HANDICAP_THREE_PAWNS, State.HANDICAP_NAKED_KING
    )

    private[this] val labels: Map[Language, Seq[String]] = Map(
      Japanese -> Seq(
        "平手", "詰将棋 (先手)", "詰将棋 (後手)",
        "香落ち", "角落ち", "飛車落ち", "飛香落ち",
        "二枚落ち", "三枚落ち", "四枚落ち", "五枚落ち",
        "六枚落ち", "八枚落ち", "十枚落ち",
        "歩三兵", "裸玉"),
      English -> Seq("Even", "Mating (Black)", "Mating (White)",
        "Lance", "Bishop", "Rook", "Rook-Lance",
        "2-Piece", "3-Piece", "4-Piece", "5-Piece",
        "6-Piece", "8-Piece", "10-Piece",
        "Three Pawns", "Naked King")
    )

    private[this] val buttons = states.map(st => button(cls := "btn btn-default col-sm-3 col-sm-offset-1", onclick := { () => Controller.setEditInitialState(st) }, "").render)

    val element: Div = div(
      label("Reset"),
      div(cls := "row", buttons)
    ).render

    def updateLabel(lang: Language): Unit = buttons.zipWithIndex.foreach { case (b, i) => b.innerHTML = labels(lang)(i) }
  }

  private[this] val editSection = div(display := "none",
    EditTurn.element,
    EditReset.element<commit_msg>adjusted button sizes<commit_after>package com.mogproject.mogami.playground.view

import com.mogproject.mogami.playground.controller.{Cursor, _}
import com.mogproject.mogami._
import com.mogproject.mogami.core.Game.GameStatus
import com.mogproject.mogami.core.Game.GameStatus.GameStatus
import com.mogproject.mogami.playground.view.piece.PieceRenderer
import com.mogproject.mogami.playground.api.Clipboard
import com.mogproject.mogami.playground.controller.mode.{Editing, Mode, Playing, Viewing}
import com.mogproject.mogami.playground.view.modal.{AlertDialog, YesNoDialog}
import com.mogproject.mogami.util.Implicits._
import org.scalajs.dom
import org.scalajs.dom.{CanvasRenderingContext2D, Element}
import org.scalajs.dom.html.{Canvas, Div}
import org.scalajs.dom.raw.HTMLSelectElement

import scalatags.JsDom.all._

/**
  * controls canvas rendering
  */
case class Renderer(elem: Element, layout: Layout) extends CursorManageable {

  // main canvas
  protected val canvas0: Canvas = createCanvas(0)
  protected val canvas1: Canvas = createCanvas(1)
  protected val canvas2: Canvas = createCanvas(2)
  protected val canvas3: Canvas = createCanvas(3)

  protected val layer0: CanvasRenderingContext2D = canvas0.getContext("2d").asInstanceOf[CanvasRenderingContext2D]
  protected val layer1: CanvasRenderingContext2D = canvas1.getContext("2d").asInstanceOf[CanvasRenderingContext2D]
  protected val layer2: CanvasRenderingContext2D = canvas2.getContext("2d").asInstanceOf[CanvasRenderingContext2D]
  protected val layer3: CanvasRenderingContext2D = canvas3.getContext("2d").asInstanceOf[CanvasRenderingContext2D]

  private[this] val canvasContainer: Div = div(cls := "col-md-6",
    padding := 0,
    height := layout.canvasHeight,
    canvas0,
    canvas1,
    canvas2,
    canvas3
  ).render

  // forms
  private[this] val recordSelector: HTMLSelectElement = select(
    cls := "form-control thin-select",
    onchange := (() => Controller.setRecord(recordSelector.selectedIndex))
  ).render

  private[this] val modeLabel = a(href := "#", cls := "dropdown-toggle", data.toggle := "dropdown", role := "button", aria.haspopup := true, aria.expanded := false).render

  private[this] val langLabel = a(href := "#", cls := "dropdown-toggle", data.toggle := "dropdown", role := "button", aria.haspopup := true, aria.expanded := false).render

  private[this] val navigator = tag("nav")(cls := "navbar navbar-default navbar-fixed-top",
    div(cls := "container",
      div(cls := "row")(
        div(cls := "navbar-header col-md-10 col-md-offset-1",
          ul(cls := "nav navbar-nav",
            li(cls := "dropdown",
              widthA := "60px",
              modeLabel,
              ul(cls := "dropdown-menu",
                li(cls := "dropdown-header", "Mode"),
                li(a(href := "#", "Play", onclick := (() => Controller.setMode(Playing)))),
                li(a(href := "#", "View", onclick := (() => Controller.setMode(Viewing)))),
                li(a(href := "#", "Edit", onclick := (() => Controller.setMode(Editing))))
              )
            ),
            li(cls := "navbar-form",
              div(cls := "form-group",
                recordSelector
              )
            ),
            li(cls := "dropdown pull-right",
              textAlign := "right",
              langLabel,
              ul(cls := "dropdown-menu",
                li(cls := "dropdown-header", "Language"),
                li(a(href := "#", "Japanese", onclick := (() => Controller.setLanguage(Japanese)))),
                li(a(href := "#", "English", onclick := (() => Controller.setLanguage(English))))
              )
            )
          )
        )
      )
    )
  )

  private[this] val snapshotInput = createInput("snapshot")
  private[this] val recordInput = createInput("record")


  private[this] def createInput(ident: String) = input(
    tpe := "text", id := ident, cls := "form-control", aria.label := "...", readonly := "readonly"
  ).render

  private[this] def createInputGroup(labelString: String, inputElem: Element, target: String) = div(
    label(labelString),
    div(cls := "input-group",
      inputElem,
      span(
        cls := "input-group-btn",
        button(cls := "btn btn-default", data("clipboard-target") := s"#${target}", tpe := "button", "Copy!")
      )
    )
  ).render

  private[this] def createControlInput(controlType: Int, glyph: String) = button(cls := "btn btn-default",
    onclick := { () => Controller.setControl(controlType) },
    span(cls := s"glyphicon glyphicon-${glyph}", aria.hidden := true)
  ).render

  private[this] val controlInput0 = createControlInput(0, "step-backward")
  private[this] val controlInput1 = createControlInput(1, "backward")
  private[this] val controlInput2 = createControlInput(2, "forward")
  private[this] val controlInput3 = createControlInput(3, "step-forward")

  private[this] val controlSection = div(
    div(
      label("Control"),
      div(cls := "btn-group btn-group-justified", role := "group", aria.label := "...",
        div(cls := "btn-group", role := "group", controlInput0),
        div(cls := "btn-group", role := "group", controlInput1),
        div(cls := "btn-group", role := "group", controlInput2),
        div(cls := "btn-group", role := "group", controlInput3)
      )
    ),
    br(),
    createInputGroup("Snapshot URL", snapshotInput, "snapshot"),
    br(),
    createInputGroup("Record URL", recordInput, "record")
  ).render

  object EditTurn {
    private[this] val anchors: Map[Player, Element] = Map(
      BLACK -> a(cls := "btn btn-primary active", onclick := { () => Controller.setEditTurn(BLACK) }).render,
      WHITE -> a(cls := "btn btn-primary notActive", onclick := { () => Controller.setEditTurn(WHITE) }).render
    )

    val element: Div = div(cls := "form-group",
      label("Turn"),
      div(cls := "row",
        div(cls := "col-sm-8 col-md-8",
          div(cls := "input-group",
            div(id := "radioBtn", cls := "btn-group btn-group-justified",
              anchors(BLACK),
              anchors(WHITE)
            )
          )
        )
      )
    ).render

    def updateEditTurnLabel(lang: Language): Unit = lang match {
      case Japanese =>
        anchors(BLACK).innerHTML = "先手番"
        anchors(WHITE).innerHTML = "後手番"
      case English =>
        anchors(BLACK).innerHTML = "Black"
        anchors(WHITE).innerHTML = "White"
    }

    def updateEditTurnValue(newValue: Player): Unit = {
      anchors(newValue).classList.remove("notActive")
      anchors(newValue).classList.add("active")
      anchors(!newValue).classList.remove("active")
      anchors(!newValue).classList.add("notActive")
    }
  }

  object EditReset {
    private[this] val states = Seq(
      State.HIRATE, State.MATING_BLACK, State.MATING_WHITE,
      State.HANDICAP_LANCE, State.HANDICAP_BISHOP, State.HANDICAP_ROOK, State.HANDICAP_ROOK_LANCE,
      State.HANDICAP_2_PIECE, State.HANDICAP_3_PIECE, State.HANDICAP_4_PIECE, State.HANDICAP_5_PIECE,
      State.HANDICAP_6_PIECE, State.HANDICAP_8_PIECE, State.HANDICAP_10_PIECE,
      State.HANDICAP_THREE_PAWNS, State.HANDICAP_NAKED_KING
    )

    private[this] val labels: Map[Language, Seq[String]] = Map(
      Japanese -> Seq(
        "平手", "詰将棋 (先手)", "詰将棋 (後手)",
        "香落ち", "角落ち", "飛車落ち", "飛香落ち",
        "二枚落ち", "三枚落ち", "四枚落ち", "五枚落ち",
        "六枚落ち", "八枚落ち", "十枚落ち",
        "歩三兵", "裸玉"),
      English -> Seq("Even", "Mating (Black)", "Mating (White)",
        "Lance", "Bishop", "Rook", "Rook-Lance",
        "2-Piece", "3-Piece", "4-Piece", "5-Piece",
        "6-Piece", "8-Piece", "10-Piece",
        "Three Pawns", "Naked King")
    )

    private[this] val buttons = states.map(st =>
      button(
        tpe := "button",
        cls := "btn btn-default btn-block",
        onclick := { () => Controller.setEditInitialState(st) }, ""
      ).render)

    val element: Div = div(
      label("Reset"),
      div(cls := "row", buttons.map(b => div(cls := "col-md-4 col-xs-6", b)))
    ).render

    def updateLabel(lang: Language): Unit = buttons.zipWithIndex.foreach { case (b, i) => b.innerHTML = labels(lang)(i) }
  }

  private[this] val editSection = div(display := "none",
    EditTurn.element,
    EditReset.element
{'fraction_non_alphanumeric': 0.15875434212931927, 'fraction_numerical': 0.008775671887378877, 'mean_word_length': 3.0780318091451293, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 40, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1116316', 'n_tokens_mistral': 5351, 'n_tokens_neox': 5342, 'n_words': 1035}