Initial revision

4afb6ea5 · Will Billingsley · 4afb6ea5 · 4afb6ea5 · 4afb6ea5 · 4afb6ea5
Commit 4afb6ea5 authored 2 years ago by Will Billingsley
--- a/.gitattributes
+++ b/.gitattributes
+* text=auto eol=lf
+
+*.{cmd,[cC][mM][dD]} text eol=crlf
+*.{bat,[bB][aA][tT]} text eol=crlf
\ No newline at end of file
--- a/.gitignore
+++ b/.gitignore
+.vscode/
+.scala-build/
+.bsp/
+.metals/
+*.js
+*.js.map
+
+.DS_Store
\ No newline at end of file
--- a/Main.scala
+++ b/Main.scala
+//> using dep "com.wbillingsley::doctacular::0.3.0"
+
+import com.wbillingsley.veautiful.html.*
+import com.wbillingsley.veautiful.doctacular.*
+
+case class Counter() extends DHtmlComponent { 
+  val count = stateVariable(0)
+
+  override def render = div(
+    button("Increment", ^.on.click --> { count.value += 1 }),
+    span(s"I've been clicked ${count.value} times")
+  )
+}
+
+val root = mountToBody(div("Loading..."))
+
+@main def main = 
+  // Now just script and mount the deck
+  DeckBuilder(1280, 720)
+    .veautifulSlide(
+        div(
+          h1("A slide desck from Scala!"),
+          p("Just a little demo of what you can do with Doctacular"),
+        )
+    ).withClass("center middle")
+    .veautifulSlide(
+        div(
+          h1("Interactive content"),
+          p("The world's smallest demo..."),
+          Counter()
+        )
+    )
+    .markdownSlide(
+        """
+        |# Markdown slides
+        |## Just write your slides in Markdown
+        |""".stripMargin
+    )
+    .mountToRoot(root)
+
--- a/boilerplate.scala
+++ b/boilerplate.scala
+import com.wbillingsley.veautiful.html.*
+
+import scala.scalajs.js
+import scala.scalajs.js.annotation._
+
+@js.native
+@JSGlobal("marked")
+object Marked extends js.Object:
+  def parse(s:String):String = js.native
+
+given markdown:Markup = new Markup({ (s:String) => Marked.parse(s).asInstanceOf[String] })
--- a/index.html
+++ b/index.html
+<!DOCTYPE html>
+<html>
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <body style="min-height: calc(100vh); background: #444; margin: 0;">
+        <div id="render-here" style="margin: auto; max-width: 480px; min-height: 660px; background: white; padding-bottom: 2em;"></div>
+        
+        <script src="https://cdn.jsdelivr.net/npm/marked@4.0.4/lib/marked.umd.min.js">
+
+        </script><script src="main.js"></script>
+    </body>
+</html>
\ No newline at end of file