Scala dom类代码示例

//设置package包名称以及导入依赖的类
import scala.scalajs.js
import scala.scalajs.js.Dynamic.global
import org.scalajs.dom
import scalatags.JsDom.all._
import shared.SharedMessages
import org.scalajs.dom.ext.Ajax
import scala.concurrent.ExecutionContext

object Hellp extends js.JSApp {

  def main(): Unit = {
    if (!js.isUndefined(global.window.console)) {
      global.console.log("Welcome to your Play application's JavaScript!");
    }
    addItems
  }

  def addItems = {
    import scala.concurrent.ExecutionContext.Implicits.global
    dom.document
      .getElementById("scalajsclientDiv")
      .appendChild(ul(id := "itemList")(li("ScalaJS shouts out: ", em(SharedMessages.itWorks))).render)

    timeAt("UTC")
    timeAt("ECT")

  }

  def timeAt(tz: String)(implicit ec: ExecutionContext) = {
    Ajax.get("/api/timeAt/" + tz).onSuccess {
      case xhr =>
        dom.document
          .getElementById("itemList").appendChild(li(s"Time service (timeAt $tz): ", em(xhr.responseText)).render)
    }
  }

} 

//设置package包名称以及导入依赖的类
package com.karasiq.torrentstream.frontend

import com.karasiq.bootstrap.BootstrapImplicits._
import com.karasiq.bootstrap.grid.GridSystem
import com.karasiq.bootstrap.icons.FontAwesome
import com.karasiq.bootstrap.navbar.{NavigationBar, NavigationTab}
import com.karasiq.torrentstream.frontend.components.TorrentManagementPanel
import org.scalajs.dom
import org.scalajs.jquery.jQuery
import rx._

import scala.scalajs.js.JSApp
import scala.scalajs.js.annotation.JSExport
import scalatags.JsDom.all._

@JSExport
object TorrentStreamFrontend extends JSApp {
  private implicit val context = implicitly[Ctx.Owner]

  @JSExport
  override def main(): Unit = {
    jQuery(() ? {
      val navigationBar = NavigationBar(
        NavigationTab("Torrents", "torrents", "file".fontAwesome(FontAwesome.fixedWidth), new TorrentManagementPanel)
      )
      val body = dom.document.body
      body.appendChild(navigationBar.navbar("TorrentStream").render)
      body.appendChild {
        GridSystem.container(id := "main-container")(
          GridSystem.mkRow(navigationBar.content)
        ).render
      }
    })
  }
} 

//设置package包名称以及导入依赖的类
package com.karasiq.torrentstream.frontend.components

import com.karasiq.bootstrap.BootstrapHtmlComponent
import com.karasiq.bootstrap.BootstrapImplicits._
import com.karasiq.bootstrap.grid.GridSystem
import com.karasiq.bootstrap.table.TableStyle
import org.scalajs.dom
import rx._

import scalatags.JsDom.all._

final class TorrentManagementPanel(implicit ctx: Ctx.Owner) extends BootstrapHtmlComponent[dom.html.Div] {
  override def renderTag(md: Modifier*): RenderedTag = {
    val panel = new TorrentInfoPanel()
    val table = new TorrentTable(panel, 8)
    val fileForm = new TorrentUploadForm(table, panel)
    div(
      GridSystem.mkRow(fileForm),
      GridSystem.mkRow(table.render(TableStyle.bordered, TableStyle.condensed, TableStyle.hover, TableStyle.striped)),
      GridSystem.mkRow(panel),
      md
    )
  }
} 

//设置package包名称以及导入依赖的类
package no.vestein.webapp

import no.vestein.webapp.App.Ctx2D
import org.scalajs.dom

import scala.collection.mutable.ListBuffer
import scala.scalajs.js

class Screen(val width: Int, val height: Int, val canvas: dom.html.Canvas, val game: Game) {
  type KeyboardEvent = dom.KeyboardEvent
  type FocusEvent = dom.FocusEvent

  val updateInterval: Double = 16
  val keys: ListBuffer[Int] = new ListBuffer[Int]
  val ctx: Ctx2D = canvas.getContext("2d").asInstanceOf[Ctx2D]

  var active: Boolean = true
  var prevTime: Double = js.Date.now()

  canvas.tabIndex = 1
  canvas.width = width
  canvas.height = height
  canvas.onkeydown = (e : KeyboardEvent) => if (!keys.contains(e.keyCode)) keys += e.keyCode
  canvas.onkeyup = (e: KeyboardEvent) => keys -= e.keyCode
  canvas.onfocus = (e: FocusEvent) => active = true
  canvas.onblur = (e: FocusEvent) => active = false

  def update(): Unit = {
    val now = js.Date.now()

    if (active) {
      val delta = now - prevTime

      if (delta > updateInterval) {
        game.update(delta, keys.toSet[Int])
        game.render(this)
        prevTime = now
      }
    } else {
      prevTime = now
    }
  }

} 

//设置package包名称以及导入依赖的类
import scala.scalajs.js.JSApp
import org.scalajs.dom
import xyz.ariwaranosai.tidori.dom.DomElements._
import xyz.ariwaranosai.tidori.dom.OperatorContext

import scalatags.JsDom.all._
import xyz.ariwaranosai.tidori.dom.DomOperator._
import xyz.ariwaranosai.tidori.dom.BeatOperatorImplicit._



object Example extends JSApp {
  @scala.scalajs.js.annotation.JSExport
  override def main(): Unit = {
    println("hello world!")
    val pNode = dom.document.getElementById("broad")
    val c = OperatorContext(pNode, 200)

    val twitter = a(href:="https://twitter.com/ariwaranosai").render.bbs("twitter")
    val blog = a(href:="http://ariwaranosai.xyz").render.bbs("blog")

    val title = "????-???? ? ?? ".bb ~: htmlBR.b ~:
      " ??????,???????,?????? ".bb ~: htmlBR.b ~:
      " ????,?????,????".bb ~: 4.del() ~: 1.delay ~:
      speed(4) ~: "???".bb ~: speed(0.25) ~: ",???? ".bb ~: htmlBR.b ~:
      " ????? ????? ?????? ".bb ~: htmlBR.b ~:
      " vim? ??? ???? ?3ds??? ".bb ~: htmlBR.b ~:
      " ?haskell????,????Scala??,?????Python ".bb ~: htmlBR.b ~:
      " C++????????,????????? ".bb ~: htmlBR.b ~:
      " ????????,?????? ".bb ~: htmlBR.b ~:
      " OSX Fedora Arch Win HHKB ".bb ~: htmlBR.b ~:
      " ?????,??????????? ".bb ~: htmlBR.b ~:
      " ??: ".bb ~: twitter ~: " ".bb ~: blog

    title.run(c)
  }
} 

//设置package包名称以及导入依赖的类
package walfie.gbf.raidfinder.client

import com.thoughtworks.binding
import com.thoughtworks.binding.Binding
import com.thoughtworks.binding.Binding._
import org.scalajs.dom
import org.scalajs.dom.raw._
import scala.collection.mutable.Buffer
import scala.scalajs.js
import walfie.gbf.raidfinder.client.ViewModel.ImageQuality
import walfie.gbf.raidfinder.protocol._

import js.Dynamic.global

package object syntax {
  implicit class HTMLElementOps[T <: HTMLElement](val elem: T) extends AnyVal {
    
    def :=(elements: TraversableOnce[T]): Buffer[T] = {
      buffer.clear()
      buffer ++= elements
    }
  }

  implicit class StringOps(val string: String) extends AnyVal {
    def addIf(condition: Boolean, s: String): String =
      if (condition) s"$string $s" else string
  }

  implicit class LanguageOps(val language: Language) extends AnyVal {
    def shortName: Option[String] = language match {
      case Language.JAPANESE => Some("JP")
      case Language.ENGLISH => Some("EN")
      case _ => None
    }
  }
} 

//设置package包名称以及导入依赖的类
package net.xylophones.frogger

import org.scalajs.dom
import org.scalajs.dom.document
import org.scalajs.dom.html.{Canvas}

import scala.scalajs.js.JSApp
import scala.scalajs.js.timers._

object App extends JSApp {
  private val canvas = document.getElementById("frogger").asInstanceOf[Canvas]
  val ctx = canvas.getContext("2d").asInstanceOf[dom.CanvasRenderingContext2D]
  private val mediaPath = canvas.getAttribute("mediaPath")
  private val soundPlayer = new SoundPlayer(mediaPath)

  def main(): Unit = {
    addCanvas()
    val m = Layers.initialModel()
    loop(model = m)
  }

  def loop(lastTime: Long = System.currentTimeMillis, model: Model): Unit = {
    draw(model)

    val interval: Long = System.currentTimeMillis() - lastTime
    val desiredPause = 1000 / 25
    val pause = Math.max(0, desiredPause - interval)

    setTimeout(pause) {
      val newModel: Model = updateModel(model)

      loop(System.currentTimeMillis(), newModel)
    }
  }

  private def updateModel(model: Model): Model = {
    val newModel = ModelUpdaters.updaters.foldLeft(model) {
      (updatedModel: Model, updater: ModelUpdater) => updater.updateIfApplicable(updatedModel)
    }

    for (s <- newModel.sounds) {soundPlayer.play(s)}

    newModel.copy(sounds = Seq())
  }

  def draw(model: Model) = {
    (model.layers.all zip model.positions).foreach { case (l, p) => l.draw(ctx, p, model) }

    model.layers.frogLayer.draw(ctx, model.frogPosition, model)
  }

  def addCanvas(): Unit = {
    canvas.width = Config.gameWidth
    canvas.height = Config.gameHeight
  }
} 

//设置package包名称以及导入依赖的类
package org.codeape.sc.frontend

import io.udash._
import io.udash.wrappers.jquery._
import org.codeape.sc.shared.MainServerREST
import org.scalajs.dom
import org.scalajs.dom.{Element, document}

import scala.scalajs.js.JSApp
import scala.scalajs.js.annotation.JSExport
import scala.util.Try

object Context {
  implicit val executionContext = scalajs.concurrent.JSExecutionContext.Implicits.queue
  private val routingRegistry = new RoutingRegistryDef
  private val viewPresenterRegistry = new StatesToViewPresenterDef

  implicit val applicationInstance = new Application[RoutingState](routingRegistry, viewPresenterRegistry, RootState)

  import io.udash.rest._
  val port = Try(dom.window.location.port.toInt).getOrElse(80)
  val host = dom.window.location.hostname
  val restServer = DefaultServerREST[MainServerREST](host, port, "/api/")
}

object Init extends JSApp with StrictLogging {
  import Context._

  @JSExport
  override def main(): Unit = {
    logger.info("StampClock started")
    jQ(document).ready((_: Element) => {
      val appRoot = jQ("#application").get(0)
      if (appRoot.isEmpty) {
        logger.error("Application root element not found! Check your index.html file!")
      } else {
        applicationInstance.run(appRoot.get)
      }
    })
  }
} 

//设置package包名称以及导入依赖的类
package com.github.lettenj61.mavoapp

import scala.scalajs.js
import scalatags.JsDom.all._
import org.scalajs.dom

import mavo.tagdsl._

object MavoApp extends js.JSApp {

  val Components = div(
    mvApp := "mavo-app",
    mvStorage.none,
    h4("Properties"),
    p(property := "exampleText", "Hello"),
    p(property := "exampleText2", "Mavo")
  )

  def main(): Unit = {
    val wrapper = dom.document.getElementById("wrapper")
    wrapper.appendChild(
      Components.render
    )
  }
} 

//设置package包名称以及导入依赖的类
package formulate

import formulate.react._
import japgolly.scalajs.react._
import japgolly.scalajs.react.vdom.prefix_<^._
import monocle._
import org.scalajs.dom
import scala.scalajs.js.JSApp

object Main extends JSApp {
  val form: Form =
    GroupForm((1 to 100).map(i => TextField(s"Item $i")).toList)

  val Main = ReactComponentB[Unit]("FormBuilder example")
    .initialState(form)
    .render { proxy =>
      <.table(
        <.tbody(
          <.tr(
            <.td(FormRenderer.Default(proxy)),
            <.td(FormRenderer.ReadOnly(proxy))
          )
        )
      )
    }
    .build

  def main(): Unit =
    ReactDOM.render(Main(), dom.document.getElementById("app"))
} 

//设置package包名称以及导入依赖的类
package com.karasiq.taboverridejs

import org.scalajs.dom
import org.scalajs.dom.Element

import scala.scalajs.js
import scala.scalajs.js.annotation.JSName


@js.native
@JSName("tabOverride")
object TabOverride extends TabOverride

@js.native
trait TabOverride extends js.Object {
  def set(textArea: dom.html.TextArea): Unit = js.native
  def tabSize(size: Int = ???): Int = js.native
  def autoIndent(value: Boolean = ???): Boolean = js.native
  def tabKey(key: Int = ???, mod: js.Array[String] = ???): Int = js.native
  def addExtension(hook: String, function: js.Function): Unit = js.native

  def delay(delay: Int = ???): Int = js.native
  def escape(escape: Boolean = ???): Boolean = js.native
  def style: TabOverrideStyle = js.native
}

@js.native
trait TabOverrideStyle extends js.Object {
  def apply(enabled: Boolean = ???): Boolean = js.native
  def enabledClass(cls: String = ???): String = js.native
  def activeClass(cls: String = ???): String = js.native
  def hardTabSize(tab: Int = ???): Int = js.native
  def utils: TabOverrideStyleUtils = js.native
}

@js.native
trait TabOverrideStyleUtils extends js.Object {
  def hardTabSizeSupported: Boolean = js.native
  def addEnabledClass(e: Element): Unit = js.native
  def addActiveClass(e: Element): Unit = js.native
  def removeEnabledClass(e: Element): Unit = js.native
  def removeActiveClass(e: Element): Unit = js.native
  def updateEnabledClass(cls: String = ???): Unit = js.native
  def updateActiveClass(cls: String = ???): Unit = js.native
  def addTabSizeCSSSelector(cls: String = ???): Unit = js.native
  def removeTabSizeCSSSelector(cls: String = ???): Unit = js.native
} 

//设置package包名称以及导入依赖的类
package com.github.kelebra.akka.js.snake

import akka.actor.{Actor, ActorLogging, PoisonPill}
import org.scalajs.dom
import org.scalajs.dom.html

trait Drawing extends Actor with ActorLogging {

  def draw(block: Block): Unit

  def erase(block: Block): Unit
}

case class CanvasDrawing(canvas: html.Canvas) extends Drawing {

  private val ctx = canvas.getContext("2d").asInstanceOf[dom.CanvasRenderingContext2D]

  def draw(block: Block): Unit = ctx.fillRect(block.x, block.y, block.radius, block.radius)

  def erase(block: Block): Unit = ctx.clearRect(block.x, block.y, block.radius, block.radius)

  def canDraw(block: Block): Boolean = {
    val radius = block.radius
    (block.x + radius) < canvas.width &&
      (block.x - radius) > 0 &&
      (block.y + radius) < canvas.height &&
      (block.y - radius) > 0
  }

  def receive: Receive = {
    case Draw(block) if canDraw(block) => draw(block)
    case Erase(block) => erase(block)
    case _ =>
      sender() ! PoisonPill
      ctx.clearRect(0, 0, canvas.width, canvas.height)
      ctx.font = "20px Georgia"
      ctx.fillText("You lost!", canvas.width / 2, canvas.height / 2)
  }
} 

//设置package包名称以及导入依赖的类
package suzaku.platform.web.widget

import suzaku.platform.web.{DOMWidget, DOMWidgetArtifact}
import suzaku.ui.{WidgetBuilder, WidgetManager}
import suzaku.widget.TextFieldProtocol
import org.scalajs.dom

class DOMTextField(widgetId: Int, context: TextFieldProtocol.ChannelContext, widgetManager: WidgetManager)
    extends DOMWidget[TextFieldProtocol.type, dom.html.Input](widgetId, widgetManager) {
  import TextFieldProtocol._

  val artifact = {
    val el = tag[dom.html.Input]("input")
    el.addEventListener("input", onChange _)
    el.setAttribute("type", "text")
    el.value = context.initialValue
    DOMWidgetArtifact(el)
  }

  private def onChange(e: dom.Event): Unit = {
    channel.send(ValueChanged(artifact.el.value))
  }

  override def process = {
    case SetValue(text) =>
      modifyDOM { node =>
        // save cursor/selection
        val start = node.selectionStart
        val end   = node.selectionEnd
        node.value = text
        // restore
        node.setSelectionRange(start, end)
      }
    case msg =>
      super.process(msg)
  }

}

class DOMTextFieldBuilder(widgetManager: WidgetManager) extends WidgetBuilder(TextFieldProtocol) {
  import TextFieldProtocol._

  override protected def create(widgetId: Int, context: ChannelContext) =
    new DOMTextField(widgetId, context, widgetManager)
} 

//设置package包名称以及导入依赖的类
package suzaku.platform.web.widget

import suzaku.platform.web.{DOMWidget, DOMWidgetArtifact}
import suzaku.ui.{WidgetBuilder, WidgetManager}
import suzaku.widget.CheckboxProtocol
import org.scalajs.dom

class DOMCheckbox(widgetId: Int, context: CheckboxProtocol.ChannelContext, widgetManager: WidgetManager)
    extends DOMWidget[CheckboxProtocol.type, dom.html.Input](widgetId, widgetManager) {
  import CheckboxProtocol._

  val artifact = {
    val el = tag[dom.html.Input]("input")
    el.addEventListener("click", onChange _)
    el.setAttribute("type", "checkbox")
    el.checked = context.value
    DOMWidgetArtifact(el)
  }

  def onChange(e: dom.Event): Unit = {
    channel.send(ValueChanged(artifact.el.checked))
  }

  override def process = {
    case SetValue(value) =>
      modifyDOM(node => node.checked = value)
    case msg =>
      super.process(msg)
  }
}

class DOMCheckboxBuilder(widgetManager: WidgetManager) extends WidgetBuilder(CheckboxProtocol) {
  import CheckboxProtocol._

  override protected def create(widgetId: Int, context: ChannelContext) =
    new DOMCheckbox(widgetId, context, widgetManager)
} 

//设置package包名称以及导入依赖的类
package suzaku.platform.web.widget

import suzaku.platform.web.{DOMWidget, DOMWidgetArtifact}
import suzaku.ui.{WidgetBuilder, WidgetManager}
import org.scalajs.dom
import suzaku.widget.TextProtocol

class DOMText(widgetId: Int, context: TextProtocol.ChannelContext, widgetManager: WidgetManager)
    extends DOMWidget[TextProtocol.type, dom.html.Span](widgetId, widgetManager) {
  import TextProtocol._

  val innerText = textNode(context.text)

  val artifact = {
    val span = dom.document.createElement("span").asInstanceOf[dom.html.Span]
    span.appendChild(innerText)
    DOMWidgetArtifact(span)
  }

  override def process = {
    case SetText(text) =>
      modifyDOM(_ => innerText.data = text)
    case msg =>
      super.process(msg)
  }
}

class DOMTextBuilder(widgetManager: WidgetManager) extends WidgetBuilder(TextProtocol) {
  import TextProtocol._

  override protected def create(widgetId: Int, context: ChannelContext) =
    new DOMText(widgetId, context, widgetManager)
}