Tidori(千鳥) is a toy inspired by Typed.js in scalajs.
Add the following to your sbt build definition: `
resolvers += Resolver.bintrayRepo("ariwarasai","maven")
libraryDependencies += "xyz.ariwaranosai" %%% "tidori" % lastVersionYou can build your typing animation with following way.
// select node to show animation
val pNode = dom.document.getElementById("broad")
// set speed for typing in ms
val context = OperatorContext(pNode, 200)
// write your text and change to animation
val text = "typing animation".bb
// run
text.run(context)Add run script in your html.
A more complex example is shown in example and html.
tidori provids more power to control typing animation.
import xyz.ariwaranosai.tidori.dom.DomOperator._
import xyz.ariwaranosai.tidori.dom.BeatOperatorImplicit._
"kancolle".bb // typing string in each of character
"kancolle".b // typing string at once
speed(0.5) // change typing speed 1 * 0.5 = 0.5 in following typing
3.delay // pause typing in 3 beat
2.del() // delete 2 charactertidori uses scalatags to build html element.
import xyz.ariwaranosai.tidori.dom.DomOperator._
import xyz.ariwaranosai.tidori.dom.BeatOperatorImplicit._
import scalatags.JsDom.all._
val node = a(href:= "https://github.com/ariwaranosai/tidori").render
node.b // typing node
node.bs("tidori") // typing string in node at one
node.bbs("tidori") // typing each of character in nodeyou can use ~: to connect two operations. There are also some html elements in tidori.dom.DomElements.
"Jintsu".bb ~: htmlBR.b ~: "Sendai".bbYou can find more operations in DomOperator
tidori can build animation with multi-nest elements in a easy way.
import xyz.ariwaranosai.tidori.dom.DomOperator._
import xyz.ariwaranosai.tidori.dom.BeatOperatorImplicit._
import xyz.ariwaranosai.tidori.dom.DomElements._
import scalatags.JsDom.all._
val pNode = p().render.b
val internalOp = "Katori".bb ~: htmlBR.b ~: "Kashima".bb
val aNode = a().render
pNode ~: "kancolle".bb ~: subElement(aNode, internalOp) ~: htmlBR.bCore type of tidori is
class BeatDomOperator[A](time: Double, op: OpC => Future[(A, OpC)]) {
def run(m: OpC): Future[(A, OpC)] = ???
}BeatDomOperator likes StateT[Future, T, S]. But context which future is running in, is implemented by setTimeout in javascript (in fact, BeatDomOperator is not implemented by StateT since the type we used to replace future is not a monad). Liking state monad, we also provide flatMap, get and set, and function for sub-context used them. So, it is easy to combine those operations.