From e3794013fbefc1a05db30151558b6d3c2993bc49 Mon Sep 17 00:00:00 2001
From: ddworak <dawid.dworak@gmail.com>
Date: Thu, 26 Mar 2020 11:41:36 +0100
Subject: [PATCH 01/12] Publish both npm and js deps in jar

---
 build.sbt                          | 5 ++---
 example/project/Dependencies.scala | 2 +-
 project/plugins.sbt                | 1 +
 3 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/build.sbt b/build.sbt
index ed68634..1addc24 100644
--- a/build.sbt
+++ b/build.sbt
@@ -1,5 +1,3 @@
-
-
 name := "udash-jquery"
 
 inThisBuild(Seq(
@@ -75,7 +73,7 @@ val commonJSSettings = Seq(
 )
 
 lazy val root = project.in(file("."))
-  .enablePlugins(ScalaJSBundlerPlugin)
+  .enablePlugins(ScalaJSBundlerPlugin, JSDependenciesPlugin)
   .settings(
     commonSettings,
     commonJSSettings,
@@ -87,5 +85,6 @@ lazy val root = project.in(file("."))
     ),
 
     Compile / npmDependencies += "jquery" -> "3.3.1",
+    jsDependencies += "org.webjars" % "jquery" % "3.3.1" / "3.3.1/jquery.js",
     Test / requireJsDomEnv := true
   )
diff --git a/example/project/Dependencies.scala b/example/project/Dependencies.scala
index 32852d9..8885338 100644
--- a/example/project/Dependencies.scala
+++ b/example/project/Dependencies.scala
@@ -3,7 +3,7 @@ import sbt._
 
 object Dependencies {
   val udashCoreVersion = "0.8.3"
-  val udashJQueryVersion = "3.0.2"
+  val udashJQueryVersion = "3.0.0-SNAPSHOT"
 
   val deps = Def.setting(Seq[ModuleID](
     "io.udash" %%% "udash-core" % udashCoreVersion,
diff --git a/project/plugins.sbt b/project/plugins.sbt
index 418498b..84c42cf 100755
--- a/project/plugins.sbt
+++ b/project/plugins.sbt
@@ -2,6 +2,7 @@ logLevel := Level.Warn
 
 addSbtPlugin("org.scala-js" % "sbt-scalajs" % "1.0.1")
 addSbtPlugin("ch.epfl.scala" % "sbt-scalajs-bundler" % "0.17.0")
+addSbtPlugin("org.scala-js" % "sbt-jsdependencies" % "1.0.0")
 
 // Deployment configuration
 addSbtPlugin("com.jsuereth" % "sbt-pgp" % "2.0.1")

From 69208bc978779717fd54e9874a71cf28dc9bb745 Mon Sep 17 00:00:00 2001
From: ddworak <dawid.dworak@gmail.com>
Date: Thu, 26 Mar 2020 15:59:54 +0100
Subject: [PATCH 02/12] Restore global dep demo

---
 example/build.sbt                  | 53 ++++++++++++++++++++++++++----
 example/project/Dependencies.scala |  7 +++-
 2 files changed, 53 insertions(+), 7 deletions(-)

diff --git a/example/build.sbt b/example/build.sbt
index 422bf9d..103332f 100644
--- a/example/build.sbt
+++ b/example/build.sbt
@@ -28,15 +28,56 @@ val commonSettings = Seq(
 )
 
 val generatedGlobalDir = file("generated/global")
+val compileStatics = taskKey[Unit]("Compiles all static files.")
 val copyAssets = taskKey[Unit]("Copies all assets to the target directory.")
-val root = project.in(file("."))
+
+lazy val root: Project = project.in(file("."))
+  .aggregate(`jquery-bundler-demo`, `jquery-global-demo`)
+  .settings(
+    crossScalaVersions := Nil,
+  )
+
+lazy val `jquery-global-demo` = project.in(file("global-demo"))
   .enablePlugins(ScalaJSPlugin)
-  .settings(commonSettings)
+  .settings(
+    commonSettings,
 
-val generatedBundlerDir = file("generated")
-val compileStatics = taskKey[Unit]("Compiles all static files.")
+    jsDependencies ++= Dependencies.jsDeps.value,
+
+    sourceDirsSettings(_.getParentFile),
+
+    /* move these files out of target/. */
+    Compile / fullOptJS / crossTarget := generatedGlobalDir,
+    Compile / fastOptJS / crossTarget := generatedGlobalDir,
+    Compile / packageJSDependencies / crossTarget := generatedGlobalDir,
+    Compile / packageMinifiedJSDependencies / crossTarget := generatedGlobalDir,
+
+    Compile / fastOptJS := (Compile / fastOptJS).dependsOn(copyAssets).value,
+    Compile / fullOptJS := (Compile / fullOptJS).dependsOn(copyAssets).value,
+
+    scalaJSUseMainModuleInitializer := true,
+
+    copyAssets := {
+      IO.copyFile(
+        root.base / "src/main/assets/index.html",
+        generatedGlobalDir / "index.html"
+      )
+    },
+
+    compileStatics := (Compile / fastOptJS).value,
+
+    Compile / fastOptJS / artifactPath :=
+      (Compile / fastOptJS / crossTarget).value / "scripts" / "frontend-impl.js",
+    Compile / fullOptJS / artifactPath :=
+      (Compile / fullOptJS / crossTarget).value / "scripts" / "frontend-impl.js",
+    Compile / packageJSDependencies / artifactPath :=
+      (Compile / packageJSDependencies / crossTarget).value / "scripts" / "frontend-deps.js",
+    Compile / packageMinifiedJSDependencies / artifactPath :=
+      (Compile / packageMinifiedJSDependencies / crossTarget).value / "scripts" / "frontend-deps.js"
+  )
 
-val example = project.in(file("."))
+val generatedBundlerDir = file("generated/bundler")
+lazy val `jquery-bundler-demo` = project.in(file("bundler-demo"))
   .enablePlugins(ScalaJSBundlerPlugin)
   .settings(
     commonSettings,
@@ -47,7 +88,7 @@ val example = project.in(file("."))
 
     copyAssets := {
       IO.copyFile(
-        sourceDirectory.value / "main/assets/index.html",
+        root.base / "src/main/assets/index.html",
         generatedBundlerDir / "index.html"
       )
     },
diff --git a/example/project/Dependencies.scala b/example/project/Dependencies.scala
index 8885338..92576f0 100644
--- a/example/project/Dependencies.scala
+++ b/example/project/Dependencies.scala
@@ -1,12 +1,17 @@
+import org.scalajs.sbtplugin.ScalaJSPlugin.autoImport._
 import org.portablescala.sbtplatformdeps.PlatformDepsPlugin.autoImport._
 import sbt._
 
 object Dependencies {
   val udashCoreVersion = "0.8.3"
-  val udashJQueryVersion = "3.0.0-SNAPSHOT"
+  val udashJQueryVersion = "3.0.2"
 
   val deps = Def.setting(Seq[ModuleID](
     "io.udash" %%% "udash-core" % udashCoreVersion,
     "io.udash" %%% "udash-jquery" % udashJQueryVersion
   ))
+
+  val jsDeps = Def.setting(Seq[org.scalajs.sbtplugin.JSModuleID](
+    "org.webjars" % "jquery" % "3.3.1" / "3.3.1/jquery.js" minified "3.3.1/jquery.min.js"
+  ))
 }
\ No newline at end of file

From f913939db0a7e114fa797182604f2cbbd26fb2b5 Mon Sep 17 00:00:00 2001
From: ddworak <dawid.dworak@gmail.com>
Date: Thu, 26 Mar 2020 16:03:32 +0100
Subject: [PATCH 03/12] Restore separate index files

---
 example/build.sbt                                   |  6 +++---
 .../{ => bundler-demo}/src/main/assets/index.html   |  0
 example/global-demo/src/main/assets/index.html      | 13 +++++++++++++
 3 files changed, 16 insertions(+), 3 deletions(-)
 rename example/{ => bundler-demo}/src/main/assets/index.html (100%)
 create mode 100644 example/global-demo/src/main/assets/index.html

diff --git a/example/build.sbt b/example/build.sbt
index 103332f..97e63f2 100644
--- a/example/build.sbt
+++ b/example/build.sbt
@@ -31,7 +31,7 @@ val generatedGlobalDir = file("generated/global")
 val compileStatics = taskKey[Unit]("Compiles all static files.")
 val copyAssets = taskKey[Unit]("Copies all assets to the target directory.")
 
-lazy val root: Project = project.in(file("."))
+lazy val root = project.in(file("."))
   .aggregate(`jquery-bundler-demo`, `jquery-global-demo`)
   .settings(
     crossScalaVersions := Nil,
@@ -59,7 +59,7 @@ lazy val `jquery-global-demo` = project.in(file("global-demo"))
 
     copyAssets := {
       IO.copyFile(
-        root.base / "src/main/assets/index.html",
+        sourceDirectory.value / "main/assets/index.html",
         generatedGlobalDir / "index.html"
       )
     },
@@ -88,7 +88,7 @@ lazy val `jquery-bundler-demo` = project.in(file("bundler-demo"))
 
     copyAssets := {
       IO.copyFile(
-        root.base / "src/main/assets/index.html",
+        sourceDirectory.value / "main/assets/index.html",
         generatedBundlerDir / "index.html"
       )
     },
diff --git a/example/src/main/assets/index.html b/example/bundler-demo/src/main/assets/index.html
similarity index 100%
rename from example/src/main/assets/index.html
rename to example/bundler-demo/src/main/assets/index.html
diff --git a/example/global-demo/src/main/assets/index.html b/example/global-demo/src/main/assets/index.html
new file mode 100644
index 0000000..9276c28
--- /dev/null
+++ b/example/global-demo/src/main/assets/index.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html>
+<head lang="en">
+    <meta charset="UTF-8">
+    <title>jquery-demo - ScalaJSBundlerPlugin demo</title>
+</head>
+<body>
+  <div id="application"></div>
+
+  <script src="scripts/frontend.js"></script>
+  <script src="scripts/frontend-deps.js"></script>
+</body>
+</html>
\ No newline at end of file

From 32bad57ae3f1de9edd83ab5ed61f1b8b2386b740 Mon Sep 17 00:00:00 2001
From: ddworak <dawid.dworak@gmail.com>
Date: Thu, 26 Mar 2020 16:08:22 +0100
Subject: [PATCH 04/12] Root project deps

---
 example/build.sbt | 6 ++----
 1 file changed, 2 insertions(+), 4 deletions(-)

diff --git a/example/build.sbt b/example/build.sbt
index 97e63f2..49478f2 100644
--- a/example/build.sbt
+++ b/example/build.sbt
@@ -32,10 +32,8 @@ val compileStatics = taskKey[Unit]("Compiles all static files.")
 val copyAssets = taskKey[Unit]("Copies all assets to the target directory.")
 
 lazy val root = project.in(file("."))
-  .aggregate(`jquery-bundler-demo`, `jquery-global-demo`)
-  .settings(
-    crossScalaVersions := Nil,
-  )
+  .enablePlugins(ScalaJSPlugin)
+  .settings(commonSettings)
 
 lazy val `jquery-global-demo` = project.in(file("global-demo"))
   .enablePlugins(ScalaJSPlugin)

From 6a737892db6aaff4ebc16a4e84c744fbd5670641 Mon Sep 17 00:00:00 2001
From: ddworak <dawid.dworak@gmail.com>
Date: Sun, 29 Mar 2020 13:52:51 +0200
Subject: [PATCH 05/12] Udash-less views

---
 .../global-demo/src/main/assets/index.html    |  4 +-
 example/project/Dependencies.scala            |  6 +--
 .../demos/jquery/{init.scala => Init.scala}   | 12 +----
 .../demos/jquery/RoutingRegistryDef.scala     | 29 ------------
 .../jquery/StatesToViewPresenterDef.scala     | 27 -----------
 .../scala/io/udash/demos/jquery/states.scala  | 32 -------------
 .../udash/demos/jquery/views/ErrorView.scala  | 13 ------
 .../demos/jquery/views/FunctionView.scala     | 15 ++++---
 .../udash/demos/jquery/views/IndexView.scala  | 45 +++++++++----------
 .../udash/demos/jquery/views/RootView.scala   | 16 -------
 .../jquery/views/functions/AddBackView.scala  | 20 ++++-----
 .../jquery/views/functions/AddView.scala      | 14 +++---
 ...{AfterView.scala => AfterBeforeView.scala} | 13 +++---
 .../jquery/views/functions/AnimateView.scala  | 16 +++----
 .../views/functions/AppendPrependView.scala   | 13 +++---
 .../jquery/views/functions/AttrView.scala     | 23 +++++-----
 .../views/functions/CallbacksView.scala       | 17 +++----
 .../jquery/views/functions/ChildrenView.scala | 13 +++---
 .../jquery/views/functions/DataView.scala     | 13 +++---
 .../jquery/views/functions/DeferredView.scala | 13 +++---
 .../jquery/views/functions/EachView.scala     | 13 +++---
 .../jquery/views/functions/HideShowView.scala | 13 +++---
 .../views/functions/OffsetPositionView.scala  | 13 +++---
 .../jquery/views/functions/OnOneOffView.scala | 15 +++----
 24 files changed, 117 insertions(+), 291 deletions(-)
 rename example/src/main/scala/io/udash/demos/jquery/{init.scala => Init.scala} (52%)
 delete mode 100644 example/src/main/scala/io/udash/demos/jquery/RoutingRegistryDef.scala
 delete mode 100644 example/src/main/scala/io/udash/demos/jquery/StatesToViewPresenterDef.scala
 delete mode 100644 example/src/main/scala/io/udash/demos/jquery/states.scala
 delete mode 100644 example/src/main/scala/io/udash/demos/jquery/views/ErrorView.scala
 delete mode 100644 example/src/main/scala/io/udash/demos/jquery/views/RootView.scala
 rename example/src/main/scala/io/udash/demos/jquery/views/functions/{AfterView.scala => AfterBeforeView.scala} (61%)

diff --git a/example/global-demo/src/main/assets/index.html b/example/global-demo/src/main/assets/index.html
index 9276c28..90d7641 100644
--- a/example/global-demo/src/main/assets/index.html
+++ b/example/global-demo/src/main/assets/index.html
@@ -2,12 +2,12 @@
 <html>
 <head lang="en">
     <meta charset="UTF-8">
-    <title>jquery-demo - ScalaJSBundlerPlugin demo</title>
+    <title>jquery-demo - global scope</title>
 </head>
 <body>
   <div id="application"></div>
 
-  <script src="scripts/frontend.js"></script>
+  <script src="scripts/frontend-impl.js"></script>
   <script src="scripts/frontend-deps.js"></script>
 </body>
 </html>
\ No newline at end of file
diff --git a/example/project/Dependencies.scala b/example/project/Dependencies.scala
index 92576f0..7be9655 100644
--- a/example/project/Dependencies.scala
+++ b/example/project/Dependencies.scala
@@ -1,13 +1,13 @@
-import org.scalajs.sbtplugin.ScalaJSPlugin.autoImport._
 import org.portablescala.sbtplatformdeps.PlatformDepsPlugin.autoImport._
+import org.scalajs.sbtplugin.ScalaJSPlugin.autoImport._
 import sbt._
 
 object Dependencies {
-  val udashCoreVersion = "0.8.3"
+  val scalatagsVersion = "0.8.6"
   val udashJQueryVersion = "3.0.2"
 
   val deps = Def.setting(Seq[ModuleID](
-    "io.udash" %%% "udash-core" % udashCoreVersion,
+    "com.lihaoyi" %%% "scalatags" % scalatagsVersion,
     "io.udash" %%% "udash-jquery" % udashJQueryVersion
   ))
 
diff --git a/example/src/main/scala/io/udash/demos/jquery/init.scala b/example/src/main/scala/io/udash/demos/jquery/Init.scala
similarity index 52%
rename from example/src/main/scala/io/udash/demos/jquery/init.scala
rename to example/src/main/scala/io/udash/demos/jquery/Init.scala
index 549798b..0836569 100644
--- a/example/src/main/scala/io/udash/demos/jquery/init.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/Init.scala
@@ -1,22 +1,12 @@
 package io.udash.demos.jquery
 
-import io.udash._
 import io.udash.wrappers.jquery._
 import org.scalajs.dom
 import org.scalajs.dom.Element
 
 import scala.scalajs.js.annotation.JSExport
 
-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)
-}
-
 object Init {
-  import Context._
 
   @JSExport
   def main(args: Array[String]): Unit = {
@@ -25,7 +15,7 @@ object Init {
       if (appRoot.isEmpty) {
         dom.console.error("Application root element not found! Check you index.html file!")
       } else {
-        applicationInstance.run(appRoot.get)
+        //applicationInstance.run(appRoot.get)
       }
     })
   }
diff --git a/example/src/main/scala/io/udash/demos/jquery/RoutingRegistryDef.scala b/example/src/main/scala/io/udash/demos/jquery/RoutingRegistryDef.scala
deleted file mode 100644
index f43d899..0000000
--- a/example/src/main/scala/io/udash/demos/jquery/RoutingRegistryDef.scala
+++ /dev/null
@@ -1,29 +0,0 @@
-package io.udash.demos.jquery
-
-import io.udash._
-
-class RoutingRegistryDef extends RoutingRegistry[RoutingState] {
-  def matchUrl(url: Url): RoutingState =
-    url2State.applyOrElse(url.value.stripSuffix("/"), (x: String) => ErrorState)
-
-  def matchState(state: RoutingState): Url =
-    Url(state2Url.apply(state))
-
-  private val (url2State, state2Url) = bidirectional {
-    case "" => IndexState
-    case "/add" => AddState
-    case "/addBack" => AddBackState
-    case "/after" => AfterBeforeState
-    case "/animate" => AnimateState
-    case "/append" => AppendPrependState
-    case "/attr" => AttrState
-    case "/callbacks" => CallbacksState
-    case "/children" => ChildrenState
-    case "/data" => DataState
-    case "/deferred" => DeferredState
-    case "/each" => EachState
-    case "/hide" => HideShowState
-    case "/offset" => OffsetPositionState
-    case "/on" => OnOneOffState
-  }
-}
\ No newline at end of file
diff --git a/example/src/main/scala/io/udash/demos/jquery/StatesToViewPresenterDef.scala b/example/src/main/scala/io/udash/demos/jquery/StatesToViewPresenterDef.scala
deleted file mode 100644
index dee3a6e..0000000
--- a/example/src/main/scala/io/udash/demos/jquery/StatesToViewPresenterDef.scala
+++ /dev/null
@@ -1,27 +0,0 @@
-package io.udash.demos.jquery
-
-import io.udash._
-import io.udash.demos.jquery.views.functions._
-import io.udash.demos.jquery.views.{ErrorViewPresenter, IndexViewPresenter, RootViewPresenter}
-
-class StatesToViewPresenterDef extends ViewFactoryRegistry[RoutingState] {
-  def matchStateToResolver(state: RoutingState): ViewFactory[_ <: RoutingState] = state match {
-    case RootState => RootViewPresenter
-    case IndexState => IndexViewPresenter
-    case AddState => AddViewPresenter
-    case AddBackState => AddBackViewPresenter
-    case AfterBeforeState => AfterBeforeViewPresenter
-    case AnimateState => AnimateViewPresenter
-    case AppendPrependState => AppendPrependViewPresenter
-    case AttrState => AttrViewPresenter
-    case CallbacksState => CallbacksViewPresenter
-    case ChildrenState => ChildrenViewPresenter
-    case DataState => DataViewPresenter
-    case DeferredState => DeferredViewPresenter
-    case EachState => EachViewPresenter
-    case HideShowState => HideShowViewPresenter
-    case OnOneOffState => OnOneOffViewPresenter
-    case OffsetPositionState => OffsetPositionViewPresenter
-    case _ => ErrorViewPresenter
-  }
-}
\ No newline at end of file
diff --git a/example/src/main/scala/io/udash/demos/jquery/states.scala b/example/src/main/scala/io/udash/demos/jquery/states.scala
deleted file mode 100644
index f4e7452..0000000
--- a/example/src/main/scala/io/udash/demos/jquery/states.scala
+++ /dev/null
@@ -1,32 +0,0 @@
-package io.udash.demos.jquery
-
-import io.udash._
-
-sealed abstract class RoutingState(val parentState: Option[ContainerRoutingState]) extends State {
-  type HierarchyRoot = RoutingState
-
-  def url(implicit application: Application[RoutingState]): String =
-    s"#${application.matchState(this).value}"
-}
-
-sealed abstract class ContainerRoutingState(parentState: Option[ContainerRoutingState]) extends RoutingState(parentState) with ContainerState
-sealed abstract class FinalRoutingState(parentState: ContainerRoutingState) extends RoutingState(Option(parentState)) with FinalState
-
-
-case object RootState extends ContainerRoutingState(None)
-case object ErrorState extends FinalRoutingState(RootState)
-case object IndexState extends FinalRoutingState(RootState)
-case object AddState extends FinalRoutingState(RootState)
-case object AddBackState extends FinalRoutingState(RootState)
-case object AfterBeforeState extends FinalRoutingState(RootState)
-case object AnimateState extends FinalRoutingState(RootState)
-case object AppendPrependState extends FinalRoutingState(RootState)
-case object AttrState extends FinalRoutingState(RootState)
-case object CallbacksState extends FinalRoutingState(RootState)
-case object ChildrenState extends FinalRoutingState(RootState)
-case object DataState extends FinalRoutingState(RootState)
-case object DeferredState extends FinalRoutingState(RootState)
-case object EachState extends FinalRoutingState(RootState)
-case object HideShowState extends FinalRoutingState(RootState)
-case object OffsetPositionState extends FinalRoutingState(RootState)
-case object OnOneOffState extends FinalRoutingState(RootState)
\ No newline at end of file
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/ErrorView.scala b/example/src/main/scala/io/udash/demos/jquery/views/ErrorView.scala
deleted file mode 100644
index a2b8fa7..0000000
--- a/example/src/main/scala/io/udash/demos/jquery/views/ErrorView.scala
+++ /dev/null
@@ -1,13 +0,0 @@
-package io.udash.demos.jquery.views
-
-import io.udash._
-import io.udash.demos.jquery.IndexState
-
-object ErrorViewPresenter extends StaticViewFactory[IndexState.type](() => new ErrorView)
-
-class ErrorView extends FinalView {
-  import scalatags.JsDom.all._
-
-  override def getTemplate: Modifier =
-    h3("URL not found!")
-}
\ No newline at end of file
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/FunctionView.scala b/example/src/main/scala/io/udash/demos/jquery/views/FunctionView.scala
index 5874d47..d26459e 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/FunctionView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/FunctionView.scala
@@ -1,19 +1,20 @@
 package io.udash.demos.jquery.views
 
-import io.udash._
-import org.scalajs.dom.{Element, Event}
+import org.scalajs.dom.Event
+
+abstract class FunctionView {
 
-abstract class FunctionView extends FinalView {
   import scalatags.JsDom.all._
 
-  protected val content: Element
-  protected val script: () => Any
+  protected def content: Modifier
+
+  protected def script: () => Any
 
-  override def getTemplate: Modifier =
+  final def getTemplate: Modifier =
     div(
       content,
       button(
-        onclick :+= ((_: Event) => {
+        onclick := ((_: Event) => {
           script()
           false
         })
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/IndexView.scala b/example/src/main/scala/io/udash/demos/jquery/views/IndexView.scala
index cad18f0..4783c0f 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/IndexView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/IndexView.scala
@@ -1,33 +1,30 @@
 package io.udash.demos.jquery.views
 
-import io.udash._
-import io.udash.demos.jquery._
+import io.udash.demos.jquery.views.functions._
 
-object IndexViewPresenter extends StaticViewFactory[IndexState.type](() => new IndexView)
+object IndexView {
 
-class IndexView extends FinalView {
-  import Context._
   import scalatags.JsDom.all._
 
-  private val content = div(
-    "Take a look at following demo pages:",
-    ul(
-      li(a(href := AddState.url)(".add() & .css()")),
-      li(a(href := AddBackState.url)(".addBack() & .addClass()")),
-      li(a(href := AfterBeforeState.url)(".after() & .before()")),
-      li(a(href := AnimateState.url)(".animate() & .click()")),
-      li(a(href := AppendPrependState.url)(".append() & .prepend()")),
-      li(a(href := AttrState.url)(".attr()")),
-      li(a(href := CallbacksState.url)("Callbacks")),
-      li(a(href := ChildrenState.url)(".children()")),
-      li(a(href := DataState.url)(".data()")),
-      li(a(href := DeferredState.url)("Deferred")),
-      li(a(href := EachState.url)(".each()")),
-      li(a(href := HideShowState.url)(".hide() & .show()")),
-      li(a(href := OnOneOffState.url)(".on() & .one() & .off()")),
-      li(a(href := OffsetPositionState.url)(".offset() & .position()"))
-    )
+  private val demos = Seq(
+    AddBackView,
+    AddView,
+    AfterBeforeView,
+    AnimateView,
+    AppendPrependView,
+    AttrView,
+    CallbacksView,
+    ChildrenView,
+    DataView,
+    DeferredView,
+    EachView,
+    HideShowView,
+    OffsetPositionView,
+    OnOneOffView,
   )
 
-  override def getTemplate: Modifier = content
+  final val content = div(
+    "Take a look at following demo pages:",
+    demos.map(_.getTemplate),
+  )
 }
\ No newline at end of file
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/RootView.scala b/example/src/main/scala/io/udash/demos/jquery/views/RootView.scala
deleted file mode 100644
index 3906559..0000000
--- a/example/src/main/scala/io/udash/demos/jquery/views/RootView.scala
+++ /dev/null
@@ -1,16 +0,0 @@
-package io.udash.demos.jquery.views
-
-import io.udash._
-import io.udash.demos.jquery.{Context, IndexState, RootState}
-
-object RootViewPresenter extends StaticViewFactory[RootState.type](() => new RootView)
-
-class RootView extends ContainerView {
-  import Context._
-  import scalatags.JsDom.all._
-
-  override def getTemplate: Modifier = div(
-    a(href := IndexState.url)(h1("jquery-demo")),
-    childViewContainer
-  )
-}
\ No newline at end of file
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/functions/AddBackView.scala b/example/src/main/scala/io/udash/demos/jquery/views/functions/AddBackView.scala
index cdc25ba..620c320 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/functions/AddBackView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/functions/AddBackView.scala
@@ -1,19 +1,15 @@
 package io.udash.demos.jquery.views.functions
 
-import io.udash._
-import io.udash.demos.jquery.IndexState
 import io.udash.demos.jquery.views.FunctionView
 import io.udash.wrappers.jquery._
-
 import scalatags.JsDom.tags2
 
-object AddBackViewPresenter extends StaticViewFactory[IndexState.type](() => new AddBackView)
-
 /** Based on examples from: <a href="http://api.jquery.com/addBack/">jQuery Docs</a>. */
-class AddBackView extends FunctionView {
+object AddBackView extends FunctionView {
+
   import scalatags.JsDom.all._
 
-  override protected val content = div(cls := "demo")(
+  override protected def content = div(cls := "demo")(
     h3(".addBack() & .addClass()"),
     tags2.style(
       """.demo p, .demo div {
@@ -48,15 +44,15 @@ class AddBackView extends FunctionView {
         p("Second Paragraph")
       )
     )
-  ).render
+  )
 
-  override protected val script = () => {
-    jQ( ".demo div.left, .demo div.right" ).find( "div, div > p" ).addClass( "border" )
+  override protected def script = () => {
+    jQ(".demo div.left, .demo div.right").find("div, div > p").addClass("border")
 
     // First Example
-    jQ( ".demo div.before-addback" ).find( "p" ).addClass( "background" )
+    jQ(".demo div.before-addback").find("p").addClass("background")
 
     // Second Example
-    jQ( ".demo div.after-addback" ).find( "p" ).addBack().addClass( "background" )
+    jQ(".demo div.after-addback").find("p").addBack().addClass("background")
   }
 }
\ No newline at end of file
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/functions/AddView.scala b/example/src/main/scala/io/udash/demos/jquery/views/functions/AddView.scala
index 9c0b0d8..f97749d 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/functions/AddView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/functions/AddView.scala
@@ -1,19 +1,15 @@
 package io.udash.demos.jquery.views.functions
 
-import io.udash._
-import io.udash.demos.jquery.IndexState
 import io.udash.demos.jquery.views.FunctionView
 import io.udash.wrappers.jquery._
-
 import scalatags.JsDom.tags2
 
-object AddViewPresenter extends StaticViewFactory[IndexState.type](() => new AddView)
-
 /** Based on examples from: <a href="http://api.jquery.com/add/">jQuery Docs</a>. */
-class AddView extends FunctionView {
+object AddView extends FunctionView {
+
   import scalatags.JsDom.all._
 
-  override protected val content = div(cls := "demo")(
+  override protected def content = div(cls := "demo")(
     h3(".add() & .css()"),
     tags2.style(
       """.demo div {
@@ -38,9 +34,9 @@ class AddView extends FunctionView {
     div(),
     div(),
     p("Added this... (notice no border)")
-  ).render
+  )
 
-  override protected val script = () => {
+  override protected def script = () => {
     jQ(".demo div").css("border", "2px solid red")
       .add(".demo p")
       .css("background", "yellow")
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/functions/AfterView.scala b/example/src/main/scala/io/udash/demos/jquery/views/functions/AfterBeforeView.scala
similarity index 61%
rename from example/src/main/scala/io/udash/demos/jquery/views/functions/AfterView.scala
rename to example/src/main/scala/io/udash/demos/jquery/views/functions/AfterBeforeView.scala
index 7e61e09..32acbed 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/functions/AfterView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/functions/AfterBeforeView.scala
@@ -1,17 +1,14 @@
 package io.udash.demos.jquery.views.functions
 
-import io.udash._
-import io.udash.demos.jquery.IndexState
 import io.udash.demos.jquery.views.FunctionView
 import io.udash.wrappers.jquery._
 
-object AfterBeforeViewPresenter extends StaticViewFactory[IndexState.type](() => new AfterBeforeView)
-
 /** Based on examples from: <a href="http://api.jquery.com/after/">jQuery Docs</a>. */
-class AfterBeforeView extends FunctionView {
+object AfterBeforeView extends FunctionView {
+
   import scalatags.JsDom.all._
 
-  override protected val content = div(cls := "demo")(
+  override protected def content = div(cls := "demo")(
     h3(".after()"),
     div(
       p(cls := "after")("I would like to say: ")
@@ -20,9 +17,9 @@ class AfterBeforeView extends FunctionView {
     div(
       p(cls := "before")("is what I said...")
     )
-  ).render
+  )
 
-  override protected val script = () => {
+  override protected def script = () => {
     jQ(".after").after("<b>Hello</b>")
     jQ(".before").before("<b>Hello</b>")
   }
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/functions/AnimateView.scala b/example/src/main/scala/io/udash/demos/jquery/views/functions/AnimateView.scala
index c1c8693..ec14da8 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/functions/AnimateView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/functions/AnimateView.scala
@@ -1,20 +1,16 @@
 package io.udash.demos.jquery.views.functions
 
-import io.udash._
-import io.udash.demos.jquery.IndexState
 import io.udash.demos.jquery.views.FunctionView
 import io.udash.wrappers.jquery._
 import org.scalajs.dom.Element
-
 import scalatags.JsDom.tags2
 
-object AnimateViewPresenter extends StaticViewFactory[IndexState.type](() => new AnimateView)
-
 /** Based on examples from: <a href="http://api.jquery.com/animate/">jQuery Docs</a>. */
-class AnimateView extends FunctionView {
+object AnimateView extends FunctionView {
+
   import scalatags.JsDom.all._
 
-  override protected val content = div(cls := "demo")(
+  override protected def content = div(cls := "demo")(
     h3(".animate() & .click()"),
     tags2.style(
       """.demo div {
@@ -36,11 +32,11 @@ class AnimateView extends FunctionView {
     button(id := "go4", disabled := "disabled")("» Reset"),
     div(id := "block1")("Block1"),
     div(id := "block2")("Block2")
-  ).render
+  )
 
-  override protected val script = () => {
+  override protected def script = () => {
     jQ("#go1").on(EventName.click, (_: Element, _: JQueryEvent) => {
-      jQ( "#block1" )
+      jQ("#block1")
         .animate(Map(
           "width" -> "90%"
         ), AnimationOptions(
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/functions/AppendPrependView.scala b/example/src/main/scala/io/udash/demos/jquery/views/functions/AppendPrependView.scala
index 2908b43..90d01e5 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/functions/AppendPrependView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/functions/AppendPrependView.scala
@@ -1,24 +1,21 @@
 package io.udash.demos.jquery.views.functions
 
-import io.udash._
-import io.udash.demos.jquery.IndexState
 import io.udash.demos.jquery.views.FunctionView
 import io.udash.wrappers.jquery._
 
-object AppendPrependViewPresenter extends StaticViewFactory[IndexState.type](() => new AppendPrependView)
-
 /** Based on examples from: <a href="http://api.jquery.com/animate/">jQuery Docs</a>. */
-class AppendPrependView extends FunctionView {
+object AppendPrependView extends FunctionView {
+
   import scalatags.JsDom.all._
 
-  override protected val content = div(cls := "demo")(
+  override protected def content = div(cls := "demo")(
     h3(".append()"),
     p(id := "append")("I would like to say: "),
     h3(".prepend()"),
     p(id := "prepend")("amigo!")
-  ).render
+  )
 
-  override protected val script = () => {
+  override protected def script = () => {
     jQ("#append").append("<b>hello</b>")
     jQ("#prepend").prepend("<i>Hello</i> ")
   }
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/functions/AttrView.scala b/example/src/main/scala/io/udash/demos/jquery/views/functions/AttrView.scala
index 7ae29d0..3fc4748 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/functions/AttrView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/functions/AttrView.scala
@@ -1,45 +1,42 @@
 package io.udash.demos.jquery.views.functions
 
-import io.udash._
-import io.udash.demos.jquery.IndexState
 import io.udash.demos.jquery.views.FunctionView
 import io.udash.wrappers.jquery._
 import org.scalajs.dom.{Element, Event}
 
-object AttrViewPresenter extends StaticViewFactory[IndexState.type](() => new AttrView)
-
 /** Based on examples from: <a href="http://api.jquery.com/animate/">jQuery Docs</a>. */
-class AttrView extends FunctionView {
+object AttrView extends FunctionView {
+
   import scalatags.JsDom.all._
 
-  override protected val content = div(cls := "demo")(
+  override protected def content = div(cls := "demo")(
     h3(".attr() & .prop()"),
     input(id := "check1", tpe := "checkbox", checked := "checked"),
     label(`for` := "check1")("Check me"),
     p(),
-    button(onclick :+= ((_: Event) => {
+    button(onclick := ((_: Event) => {
       jQ(".demo input").attr("data-checked", "checked").trigger("change")
       false
     }))(".attr(\"data-checked\", \"checked\")"),
-    button(onclick :+= ((_: Event) => {
+    button(onclick := ((_: Event) => {
       jQ(".demo input").attr("data-checked", "").trigger("change")
       false
     }))(".attr(\"data-checked\", \"\")"),
-    button(onclick :+= ((_: Event) => {
+    button(onclick := ((_: Event) => {
       jQ(".demo input").attr("data-checked", null).trigger("change")
       false
     }))(".attr(\"data-checked\", null)"), br(),
-    button(onclick :+= ((_: Event) => {
+    button(onclick := ((_: Event) => {
       jQ(".demo input").prop("checked", true).trigger("change")
       false
     }))(".prop(\"checked\", true)"),
-    button(onclick :+= ((_: Event) => {
+    button(onclick := ((_: Event) => {
       jQ(".demo input").prop("checked", false).trigger("change")
       false
     }))(".prop(\"checked\", false)")
-  ).render
+  )
 
-  override protected val script = () => {
+  override protected def script = () => {
     jQ(".demo input").on(EventName.change, (input: Element, _: JQueryEvent) => {
       jQ(".demo p").html(
         s""".attr('data-checked'): ${jQ(input).attr("data-checked")}<br/>
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/functions/CallbacksView.scala b/example/src/main/scala/io/udash/demos/jquery/views/functions/CallbacksView.scala
index e3824bb..639b700 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/functions/CallbacksView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/functions/CallbacksView.scala
@@ -1,35 +1,32 @@
 package io.udash.demos.jquery.views.functions
 
-import io.udash._
-import io.udash.demos.jquery.IndexState
 import io.udash.demos.jquery.views.FunctionView
 import io.udash.wrappers.jquery._
 
 import scala.scalajs.js
 
-object CallbacksViewPresenter extends StaticViewFactory[IndexState.type](() => new CallbacksView)
-
 /** Based on examples from: <a href="http://api.jquery.com/callbacks.add/">jQuery Docs</a>. */
-class CallbacksView extends FunctionView {
+object CallbacksView extends FunctionView {
+
   import scalatags.JsDom.all._
 
-  override protected val content = div(cls := "demo")(
+  override protected def content = div(cls := "demo")(
     h3("Callbacks"),
     ul(id := "plus"),
     ul(id := "minus"),
     ul(id := "mul"),
     ul(id := "div")
-  ).render
+  )
 
-  override protected val script = () => {
+  override protected def script = () => {
     val callbacks = jQ.callbacks[js.Function1[(Int, Int), js.Any], (Int, Int)]()
     callbacks.add((t: (Int, Int)) => {
       val (a, b) = t
-      jQ("#plus").append(li(s"$a + $b = ${a+b}").render)
+      jQ("#plus").append(li(s"$a + $b = ${a + b}").render)
     })
     callbacks.add((t: (Int, Int)) => {
       val (a, b) = t
-      jQ("#minus").append(li(s"$a - $b = ${a-b}").render)
+      jQ("#minus").append(li(s"$a - $b = ${a - b}").render)
     })
     callbacks.add((t: (Int, Int)) => {
       val (a, b) = t
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/functions/ChildrenView.scala b/example/src/main/scala/io/udash/demos/jquery/views/functions/ChildrenView.scala
index ea4d0f6..a1e492e 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/functions/ChildrenView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/functions/ChildrenView.scala
@@ -1,17 +1,14 @@
 package io.udash.demos.jquery.views.functions
 
-import io.udash._
-import io.udash.demos.jquery.IndexState
 import io.udash.demos.jquery.views.FunctionView
 import io.udash.wrappers.jquery._
 
-object ChildrenViewPresenter extends StaticViewFactory[IndexState.type](() => new ChildrenView)
-
 /** Based on examples from: <a href="http://api.jquery.com/children/">jQuery Docs</a>. */
-class ChildrenView extends FunctionView {
+object ChildrenView extends FunctionView {
+
   import scalatags.JsDom.all._
 
-  override protected val content = div(cls := "demo")(
+  override protected def content = div(cls := "demo")(
     h3(".children()"),
     div(
       span("Hello"),
@@ -19,9 +16,9 @@ class ChildrenView extends FunctionView {
       div(cls := "selected")("and again"),
       p("and one last time.")
     )
-  ).render
+  )
 
-  override protected val script = () => {
+  override protected def script = () => {
     jQ(".demo div").children().css("color", "blue")
     jQ(".demo div").children(".selected").css("border-bottom", "3px double red")
     jQ(".demo div").children("div.selected").css("border-top", "1px dashed green")
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/functions/DataView.scala b/example/src/main/scala/io/udash/demos/jquery/views/functions/DataView.scala
index f905ec5..3f315f6 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/functions/DataView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/functions/DataView.scala
@@ -1,17 +1,14 @@
 package io.udash.demos.jquery.views.functions
 
-import io.udash._
-import io.udash.demos.jquery.IndexState
 import io.udash.demos.jquery.views.FunctionView
 import io.udash.wrappers.jquery._
 
-object DataViewPresenter extends StaticViewFactory[IndexState.type](() => new DataView)
-
 /** Based on examples from: <a href="http://api.jquery.com/data/">jQuery Docs</a>. */
-class DataView extends FunctionView {
+object DataView extends FunctionView {
+
   import scalatags.JsDom.all._
 
-  override protected val content = div(cls := "demo")(
+  override protected def content = div(cls := "demo")(
     h3(".data()"),
     div(
       "The values stored were ",
@@ -19,9 +16,9 @@ class DataView extends FunctionView {
       " and ",
       span("_")
     )
-  ).render
+  )
 
-  override protected val script = () => {
+  override protected def script = () => {
     jQ(".demo div").data("test", Map("first" -> 16, "last" -> "pizza!"))
     val data: Map[String, Any] = jQ(".demo div").data("test").get.asInstanceOf[Map[String, Any]]
     jQ(".demo div span:first").text(data.get("first").get.toString)
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/functions/DeferredView.scala b/example/src/main/scala/io/udash/demos/jquery/views/functions/DeferredView.scala
index 82ee717..a4e1cbe 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/functions/DeferredView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/functions/DeferredView.scala
@@ -1,22 +1,19 @@
 package io.udash.demos.jquery.views.functions
 
-import io.udash._
-import io.udash.demos.jquery.IndexState
 import io.udash.demos.jquery.views.FunctionView
 import io.udash.wrappers.jquery._
 import org.scalajs.dom.Event
 
 import scala.scalajs.js
 
-object DeferredViewPresenter extends StaticViewFactory[IndexState.type](() => new DeferredView)
-
 /** Based on examples from: <a href="http://api.jquery.com/deferred/">jQuery Docs</a>. */
-class DeferredView extends FunctionView {
+object DeferredView extends FunctionView {
+
   import scalatags.JsDom.all._
 
   var deferred: JQueryDeferred[js.Function1[Int, js.Any], Int] = null
 
-  override protected val content = div(cls := "demo")(
+  override protected def content = div(cls := "demo")(
     h3("Deferred"),
     div(
       div(id := "deferred")("???"),
@@ -42,9 +39,9 @@ class DeferredView extends FunctionView {
         })
       )("Notify(1)")
     )
-  ).render
+  )
 
-  override protected val script = () => {
+  override protected def script = () => {
     jQ(".demo button").prop("disabled", "")
     deferred = jQ.deferred[js.Function1[Int, js.Any], Int]()
     jQ("#deferred").text(s"Waiting...")
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/functions/EachView.scala b/example/src/main/scala/io/udash/demos/jquery/views/functions/EachView.scala
index 447267b..dd64fc7 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/functions/EachView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/functions/EachView.scala
@@ -1,25 +1,22 @@
 package io.udash.demos.jquery.views.functions
 
-import io.udash._
-import io.udash.demos.jquery.IndexState
 import io.udash.demos.jquery.views.FunctionView
 import io.udash.wrappers.jquery._
 import org.scalajs.dom.Element
 
-object EachViewPresenter extends StaticViewFactory[IndexState.type](() => new EachView)
-
 /** Based on examples from: <a href="http://api.jquery.com/each/">jQuery Docs</a>. */
-class EachView extends FunctionView {
+object EachView extends FunctionView {
+
   import scalatags.JsDom.all._
 
-  override protected val content = div(cls := "demo")(
+  override protected def content = div(cls := "demo")(
     h3(".each()"),
     div("Click button"),
     div("to iterate through"),
     div("these divs.")
-  ).render
+  )
 
-  override protected val script = () => {
+  override protected def script = () => {
     jQ(".demo div").each((el: Element, idx: Int) => {
       jQ(el).replaceWith(span(s"${el.textContent} ").render)
     })
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/functions/HideShowView.scala b/example/src/main/scala/io/udash/demos/jquery/views/functions/HideShowView.scala
index 9ed0a46..4227d2c 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/functions/HideShowView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/functions/HideShowView.scala
@@ -1,22 +1,19 @@
 package io.udash.demos.jquery.views.functions
 
-import io.udash._
-import io.udash.demos.jquery.IndexState
 import io.udash.demos.jquery.views.FunctionView
 import io.udash.wrappers.jquery._
 
-object HideShowViewPresenter extends StaticViewFactory[IndexState.type](() => new HideShowView)
-
 /** Based on examples from: <a href="http://api.jquery.com/hide/">jQuery Docs</a>. */
-class HideShowView extends FunctionView {
+object HideShowView extends FunctionView {
+
   import scalatags.JsDom.all._
 
-  override protected val content = div(cls := "demo")(
+  override protected def content = div(cls := "demo")(
     h3(".hide() & .show()"),
     div("Click button to hide me")
-  ).render
+  )
 
-  override protected val script = () => {
+  override protected def script = () => {
     jQ(".demo div")
       .hide(AnimationOptions(
         duration = Some(3000),
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/functions/OffsetPositionView.scala b/example/src/main/scala/io/udash/demos/jquery/views/functions/OffsetPositionView.scala
index 9ec5d02..9ad4328 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/functions/OffsetPositionView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/functions/OffsetPositionView.scala
@@ -1,25 +1,22 @@
 package io.udash.demos.jquery.views.functions
 
-import io.udash._
-import io.udash.demos.jquery.OffsetPositionState
 import io.udash.demos.jquery.views.FunctionView
 import io.udash.wrappers.jquery._
 
-object OffsetPositionViewPresenter extends StaticViewFactory[OffsetPositionState.type](() => new OffsetPositionView)
-
 /** Based on examples from: <a href="http://api.jquery.com/position/">jQuery Docs</a>. */
-class OffsetPositionView extends FunctionView {
+object OffsetPositionView extends FunctionView {
+
   import scalatags.JsDom.all._
 
-  override protected val content = div(cls := "demo")(
+  override protected def content = div(cls := "demo")(
     h3(".offset() & .position()"),
     div(style := "padding: 12px; border: 1px red solid;")(
       p(style := "margin-left: 10px; border: 1px blue solid;")("Hello world!")
     ),
     p(id := "results")("")
-  ).render
+  )
 
-  override protected val script = () => {
+  override protected def script = () => {
     val div = jQ(".demo div")
     val p = jQ(".demo div p")
     jQ("#results").html(
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/functions/OnOneOffView.scala b/example/src/main/scala/io/udash/demos/jquery/views/functions/OnOneOffView.scala
index 08035d0..1c0de22 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/functions/OnOneOffView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/functions/OnOneOffView.scala
@@ -1,15 +1,12 @@
 package io.udash.demos.jquery.views.functions
 
-import io.udash._
-import io.udash.demos.jquery.IndexState
 import io.udash.demos.jquery.views.FunctionView
 import io.udash.wrappers.jquery._
 import org.scalajs.dom.{Element, Event}
 
-object OnOneOffViewPresenter extends StaticViewFactory[IndexState.type](() => new OnOneOffView)
-
 /** Based on examples from: <a href="http://api.jquery.com/on/">jQuery Docs</a>. */
-class OnOneOffView extends FunctionView {
+object OnOneOffView extends FunctionView {
+
   import scalatags.JsDom.all._
 
   val onCallback = (_: Element, _: JQueryEvent) =>
@@ -17,23 +14,23 @@ class OnOneOffView extends FunctionView {
   val oneCallback = (_: Element, _: JQueryEvent) =>
     jQ(".demo ul").append(li("This will be added only once").render)
 
-  override protected val content = div(cls := "demo")(
+  override protected def content = div(cls := "demo")(
     h3(".on() & .one() & .off()"),
     button(id := "click", disabled := "disabled")("Click me"),
     ul(),
     button(
       id := "off",
       disabled := "disabled",
-      onclick :+= ((_: Event) => {
+      onclick := ((_: Event) => {
         jQ(".demo #click")
           .off(EventName.click, onCallback)
           .off(EventName.click, oneCallback)
         false
       })
     )("Off")
-  ).render
+  )
 
-  override protected val script = () => {
+  override protected def script = () => {
     jQ(".demo #click")
       .on(EventName.click, onCallback)
       .one(EventName.click, oneCallback)

From 02637545b9994ea261b30ce307a94222178402c7 Mon Sep 17 00:00:00 2001
From: ddworak <dawid.dworak@gmail.com>
Date: Mon, 30 Mar 2020 08:25:54 +0200
Subject: [PATCH 06/12] Append demos

---
 example/src/main/scala/io/udash/demos/jquery/Init.scala       | 2 ++
 .../main/scala/io/udash/demos/jquery/views/IndexView.scala    | 4 ++--
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/example/src/main/scala/io/udash/demos/jquery/Init.scala b/example/src/main/scala/io/udash/demos/jquery/Init.scala
index 0836569..40ed49c 100644
--- a/example/src/main/scala/io/udash/demos/jquery/Init.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/Init.scala
@@ -1,5 +1,6 @@
 package io.udash.demos.jquery
 
+import io.udash.demos.jquery.views.IndexView
 import io.udash.wrappers.jquery._
 import org.scalajs.dom
 import org.scalajs.dom.Element
@@ -15,6 +16,7 @@ object Init {
       if (appRoot.isEmpty) {
         dom.console.error("Application root element not found! Check you index.html file!")
       } else {
+        appRoot.get.appendChild(IndexView.content.render)
         //applicationInstance.run(appRoot.get)
       }
     })
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/IndexView.scala b/example/src/main/scala/io/udash/demos/jquery/views/IndexView.scala
index 4783c0f..672b852 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/IndexView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/IndexView.scala
@@ -24,7 +24,7 @@ object IndexView {
   )
 
   final val content = div(
-    "Take a look at following demo pages:",
-    demos.map(_.getTemplate),
+    "Take a look at following demos:",
+    demos.map(demo => div(demo.getTemplate)),
   )
 }
\ No newline at end of file

From 64ddf4b652d5a588601d81addc19693ebe847c94 Mon Sep 17 00:00:00 2001
From: ddworak <dawid.dworak@gmail.com>
Date: Mon, 30 Mar 2020 10:34:05 +0200
Subject: [PATCH 07/12] Fixes for single view scripts

---
 .../demos/jquery/views/FunctionView.scala     |  9 ++++---
 .../udash/demos/jquery/views/IndexView.scala  |  2 +-
 .../jquery/views/functions/AddBackView.scala  | 26 ++++++-------------
 .../jquery/views/functions/AddView.scala      | 12 ++++-----
 .../views/functions/AfterBeforeView.scala     |  8 +++---
 .../jquery/views/functions/AnimateView.scala  | 26 +++++++++----------
 .../views/functions/AppendPrependView.scala   |  8 +++---
 .../jquery/views/functions/AttrView.scala     | 19 +++++++-------
 .../views/functions/CallbacksView.scala       | 12 ++++-----
 .../jquery/views/functions/ChildrenView.scala | 10 +++----
 .../jquery/views/functions/DataView.scala     | 12 ++++-----
 .../jquery/views/functions/DeferredView.scala | 14 +++++-----
 .../jquery/views/functions/EachView.scala     |  6 ++---
 .../jquery/views/functions/HideShowView.scala |  6 ++---
 .../views/functions/OffsetPositionView.scala  | 10 +++----
 .../jquery/views/functions/OnOneOffView.scala | 15 ++++++-----
 16 files changed, 94 insertions(+), 101 deletions(-)

diff --git a/example/src/main/scala/io/udash/demos/jquery/views/FunctionView.scala b/example/src/main/scala/io/udash/demos/jquery/views/FunctionView.scala
index d26459e..e3c7360 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/FunctionView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/FunctionView.scala
@@ -1,23 +1,24 @@
 package io.udash.demos.jquery.views
 
-import org.scalajs.dom.Event
+import org.scalajs.dom.{Element, Event}
 
 abstract class FunctionView {
 
   import scalatags.JsDom.all._
 
-  protected def content: Modifier
+  protected val content: Element
 
   protected def script: () => Any
 
   final def getTemplate: Modifier =
     div(
       content,
-      button(
+      h3(button(
+        marginTop := 10.px,
         onclick := ((_: Event) => {
           script()
           false
         })
-      )("Run script")
+      )("Run script"))
     )
 }
\ No newline at end of file
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/IndexView.scala b/example/src/main/scala/io/udash/demos/jquery/views/IndexView.scala
index 672b852..0a1e7e2 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/IndexView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/IndexView.scala
@@ -25,6 +25,6 @@ object IndexView {
 
   final val content = div(
     "Take a look at following demos:",
-    demos.map(demo => div(demo.getTemplate)),
+    demos.map(demo => Seq(hr, div(demo.getTemplate))),
   )
 }
\ No newline at end of file
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/functions/AddBackView.scala b/example/src/main/scala/io/udash/demos/jquery/views/functions/AddBackView.scala
index 620c320..3927a6b 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/functions/AddBackView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/functions/AddBackView.scala
@@ -9,25 +9,15 @@ object AddBackView extends FunctionView {
 
   import scalatags.JsDom.all._
 
-  override protected def content = div(cls := "demo")(
+  override protected val content = div(cls := "addback")(
     h3(".addBack() & .addClass()"),
     tags2.style(
-      """.demo p, .demo div {
-        |  margin: 5px;
-        |  padding: 5px;
-        |}
-        |.border {
+      """
+        |.addback .border {
         |  border: 2px solid red;
         |}
-        |.background {
+        |.addback .background {
         |  background: yellow;
-        |}
-        |.left, .right {
-        |  width: 45%;
-        |  float: left;
-        |}
-        |.right {
-        |  margin-left: 3%;
         |}""".stripMargin
     ),
     div(cls := "left")(
@@ -44,15 +34,15 @@ object AddBackView extends FunctionView {
         p("Second Paragraph")
       )
     )
-  )
+  ).render
 
   override protected def script = () => {
-    jQ(".demo div.left, .demo div.right").find("div, div > p").addClass("border")
+    jQ("div.left, div.right", content).find("div, div > p").addClass("border")
 
     // First Example
-    jQ(".demo div.before-addback").find("p").addClass("background")
+    jQ("div.before-addback", content).find("p").addClass("background")
 
     // Second Example
-    jQ(".demo div.after-addback").find("p").addBack().addClass("background")
+    jQ("div.after-addback", content).find("p").addBack().addClass("background")
   }
 }
\ No newline at end of file
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/functions/AddView.scala b/example/src/main/scala/io/udash/demos/jquery/views/functions/AddView.scala
index f97749d..45c65f1 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/functions/AddView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/functions/AddView.scala
@@ -9,16 +9,16 @@ object AddView extends FunctionView {
 
   import scalatags.JsDom.all._
 
-  override protected def content = div(cls := "demo")(
+  override protected val content = div(cls := "addview")(
     h3(".add() & .css()"),
     tags2.style(
-      """.demo div {
+      """.addview div {
         |  width: 60px;
         |  height: 60px;
         |  margin: 10px;
         |  float: left;
         |}
-        |.demo p {
+        |.addview p {
         |  clear: left;
         |  font-weight: bold;
         |  font-size: 16px;
@@ -34,11 +34,11 @@ object AddView extends FunctionView {
     div(),
     div(),
     p("Added this... (notice no border)")
-  )
+  ).render
 
   override protected def script = () => {
-    jQ(".demo div").css("border", "2px solid red")
-      .add(".demo p")
+    jQ("div", content).css("border", "2px solid red")
+      .add("p", content)
       .css("background", "yellow")
   }
 }
\ No newline at end of file
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/functions/AfterBeforeView.scala b/example/src/main/scala/io/udash/demos/jquery/views/functions/AfterBeforeView.scala
index 32acbed..3aaf39d 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/functions/AfterBeforeView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/functions/AfterBeforeView.scala
@@ -8,7 +8,7 @@ object AfterBeforeView extends FunctionView {
 
   import scalatags.JsDom.all._
 
-  override protected def content = div(cls := "demo")(
+  override protected val content = div(
     h3(".after()"),
     div(
       p(cls := "after")("I would like to say: ")
@@ -17,10 +17,10 @@ object AfterBeforeView extends FunctionView {
     div(
       p(cls := "before")("is what I said...")
     )
-  )
+  ).render
 
   override protected def script = () => {
-    jQ(".after").after("<b>Hello</b>")
-    jQ(".before").before("<b>Hello</b>")
+    jQ(".after", content).after("<b>Hello</b>")
+    jQ(".before", content).before("<b>Hello</b>")
   }
 }
\ No newline at end of file
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/functions/AnimateView.scala b/example/src/main/scala/io/udash/demos/jquery/views/functions/AnimateView.scala
index ec14da8..445631d 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/functions/AnimateView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/functions/AnimateView.scala
@@ -10,10 +10,10 @@ object AnimateView extends FunctionView {
 
   import scalatags.JsDom.all._
 
-  override protected def content = div(cls := "demo")(
+  override protected val content = div(cls := "animate")(
     h3(".animate() & .click()"),
     tags2.style(
-      """.demo div {
+      """.animate div {
         |  background-color: #bca;
         |  width: 200px;
         |  height: 1.1em;
@@ -22,7 +22,7 @@ object AnimateView extends FunctionView {
         |  margin: 3px;
         |  font-size: 14px;
         |}
-        |.demo button {
+        |.animate button {
         |  font-size: 14px;
         |}""".stripMargin
     ),
@@ -32,11 +32,11 @@ object AnimateView extends FunctionView {
     button(id := "go4", disabled := "disabled")("» Reset"),
     div(id := "block1")("Block1"),
     div(id := "block2")("Block2")
-  )
+  ).render
 
   override protected def script = () => {
-    jQ("#go1").on(EventName.click, (_: Element, _: JQueryEvent) => {
-      jQ("#block1")
+    jQ("#go1", content).on(EventName.click, (_: Element, _: JQueryEvent) => {
+      jQ("#block1", content)
         .animate(Map(
           "width" -> "90%"
         ), AnimationOptions(
@@ -47,27 +47,27 @@ object AnimateView extends FunctionView {
         .animate(Map("borderRightWidth" -> "15px"), 1500)
     })
 
-    jQ("#go2").on(EventName.click, (_: Element, _: JQueryEvent) => {
-      jQ("#block2")
+    jQ("#go2", content).on(EventName.click, (_: Element, _: JQueryEvent) => {
+      jQ("#block2", content)
         .animate(Map("width" -> "90%"), 1000)
         .animate(Map("fontSize" -> "24px"), 1000)
         .animate(Map("borderLeftWidth" -> "15px"), 1000)
     })
 
-    jQ("#go3").on(EventName.click, (_: Element, _: JQueryEvent) => {
-      jQ("#go1").add("#go2").trigger("click")
+    jQ("#go3", content).on(EventName.click, (_: Element, _: JQueryEvent) => {
+      jQ("#go1", content).add("#go2", content).trigger("click")
     })
 
-    jQ("#go4").on(EventName.click, (_: Element, _: JQueryEvent) => {
+    jQ("#go4", content).on(EventName.click, (_: Element, _: JQueryEvent) => {
       // TODO: It does not work without explicit Map elements type
       import scala.scalajs.js.`|`
-      jQ("div").css(Map[String, String | Int | Double | Boolean](
+      jQ("div", content).css(Map[String, String | Int | Double | Boolean](
         "width" -> "",
         "fontSize" -> "",
         "borderWidth" -> ""
       ))
     })
 
-    jQ(".demo button").prop("disabled", "")
+    jQ("button", content).prop("disabled", "")
   }
 }
\ No newline at end of file
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/functions/AppendPrependView.scala b/example/src/main/scala/io/udash/demos/jquery/views/functions/AppendPrependView.scala
index 90d01e5..b5d2d81 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/functions/AppendPrependView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/functions/AppendPrependView.scala
@@ -8,15 +8,15 @@ object AppendPrependView extends FunctionView {
 
   import scalatags.JsDom.all._
 
-  override protected def content = div(cls := "demo")(
+  override protected val content = div(
     h3(".append()"),
     p(id := "append")("I would like to say: "),
     h3(".prepend()"),
     p(id := "prepend")("amigo!")
-  )
+  ).render
 
   override protected def script = () => {
-    jQ("#append").append("<b>hello</b>")
-    jQ("#prepend").prepend("<i>Hello</i> ")
+    jQ("#append", content).append("<b>hello</b>")
+    jQ("#prepend", content).prepend("<i>Hello</i> ")
   }
 }
\ No newline at end of file
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/functions/AttrView.scala b/example/src/main/scala/io/udash/demos/jquery/views/functions/AttrView.scala
index 3fc4748..0c6f2be 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/functions/AttrView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/functions/AttrView.scala
@@ -2,6 +2,7 @@ package io.udash.demos.jquery.views.functions
 
 import io.udash.demos.jquery.views.FunctionView
 import io.udash.wrappers.jquery._
+import org.scalajs.dom.html.Div
 import org.scalajs.dom.{Element, Event}
 
 /** Based on examples from: <a href="http://api.jquery.com/animate/">jQuery Docs</a>. */
@@ -9,36 +10,36 @@ object AttrView extends FunctionView {
 
   import scalatags.JsDom.all._
 
-  override protected def content = div(cls := "demo")(
+  override protected val content: Div = div(
     h3(".attr() & .prop()"),
     input(id := "check1", tpe := "checkbox", checked := "checked"),
     label(`for` := "check1")("Check me"),
     p(),
     button(onclick := ((_: Event) => {
-      jQ(".demo input").attr("data-checked", "checked").trigger("change")
+      jQ("input", content).attr("data-checked", "checked").trigger("change")
       false
     }))(".attr(\"data-checked\", \"checked\")"),
     button(onclick := ((_: Event) => {
-      jQ(".demo input").attr("data-checked", "").trigger("change")
+      jQ("input", content).attr("data-checked", "").trigger("change")
       false
     }))(".attr(\"data-checked\", \"\")"),
     button(onclick := ((_: Event) => {
-      jQ(".demo input").attr("data-checked", null).trigger("change")
+      jQ("input", content).attr("data-checked", null).trigger("change")
       false
     }))(".attr(\"data-checked\", null)"), br(),
     button(onclick := ((_: Event) => {
-      jQ(".demo input").prop("checked", true).trigger("change")
+      jQ("input", content).prop("checked", true).trigger("change")
       false
     }))(".prop(\"checked\", true)"),
     button(onclick := ((_: Event) => {
-      jQ(".demo input").prop("checked", false).trigger("change")
+      jQ("input", content).prop("checked", false).trigger("change")
       false
     }))(".prop(\"checked\", false)")
-  )
+  ).render
 
   override protected def script = () => {
-    jQ(".demo input").on(EventName.change, (input: Element, _: JQueryEvent) => {
-      jQ(".demo p").html(
+    jQ("input", content).on(EventName.change, (input: Element, _: JQueryEvent) => {
+      jQ("p", content).html(
         s""".attr('data-checked'): ${jQ(input).attr("data-checked")}<br/>
            |.prop('checked'): ${jQ(input).prop("checked")}<br/>
            |.is(':checked'): ${jQ(input).is(":checked")}""".stripMargin
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/functions/CallbacksView.scala b/example/src/main/scala/io/udash/demos/jquery/views/functions/CallbacksView.scala
index 639b700..a7a8243 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/functions/CallbacksView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/functions/CallbacksView.scala
@@ -10,31 +10,31 @@ object CallbacksView extends FunctionView {
 
   import scalatags.JsDom.all._
 
-  override protected def content = div(cls := "demo")(
+  override protected val content = div(
     h3("Callbacks"),
     ul(id := "plus"),
     ul(id := "minus"),
     ul(id := "mul"),
     ul(id := "div")
-  )
+  ).render
 
   override protected def script = () => {
     val callbacks = jQ.callbacks[js.Function1[(Int, Int), js.Any], (Int, Int)]()
     callbacks.add((t: (Int, Int)) => {
       val (a, b) = t
-      jQ("#plus").append(li(s"$a + $b = ${a + b}").render)
+      jQ("#plus", content).append(li(s"$a + $b = ${a + b}").render)
     })
     callbacks.add((t: (Int, Int)) => {
       val (a, b) = t
-      jQ("#minus").append(li(s"$a - $b = ${a - b}").render)
+      jQ("#minus", content).append(li(s"$a - $b = ${a - b}").render)
     })
     callbacks.add((t: (Int, Int)) => {
       val (a, b) = t
-      jQ("#mul").append(li(s"$a * $b = ${a*b}").render)
+      jQ("#mul", content).append(li(s"$a * $b = ${a * b}").render)
     })
     callbacks.add((t: (Int, Int)) => {
       val (a, b) = t
-      jQ("#div").append(li(s"$a / $b = ${a/b}").render)
+      jQ("#div", content).append(li(s"$a / $b = ${a / b}").render)
     })
 
     callbacks.fire((1, 1))
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/functions/ChildrenView.scala b/example/src/main/scala/io/udash/demos/jquery/views/functions/ChildrenView.scala
index a1e492e..7043bc8 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/functions/ChildrenView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/functions/ChildrenView.scala
@@ -8,7 +8,7 @@ object ChildrenView extends FunctionView {
 
   import scalatags.JsDom.all._
 
-  override protected def content = div(cls := "demo")(
+  override protected val content = div(
     h3(".children()"),
     div(
       span("Hello"),
@@ -16,11 +16,11 @@ object ChildrenView extends FunctionView {
       div(cls := "selected")("and again"),
       p("and one last time.")
     )
-  )
+  ).render
 
   override protected def script = () => {
-    jQ(".demo div").children().css("color", "blue")
-    jQ(".demo div").children(".selected").css("border-bottom", "3px double red")
-    jQ(".demo div").children("div.selected").css("border-top", "1px dashed green")
+    jQ("div", content).children().css("color", "blue")
+    jQ("div", content).children(".selected").css("border-bottom", "3px double red")
+    jQ("div", content).children("div.selected").css("border-top", "1px dashed green")
   }
 }
\ No newline at end of file
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/functions/DataView.scala b/example/src/main/scala/io/udash/demos/jquery/views/functions/DataView.scala
index 3f315f6..ad3f660 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/functions/DataView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/functions/DataView.scala
@@ -8,7 +8,7 @@ object DataView extends FunctionView {
 
   import scalatags.JsDom.all._
 
-  override protected def content = div(cls := "demo")(
+  override protected val content = div(
     h3(".data()"),
     div(
       "The values stored were ",
@@ -16,12 +16,12 @@ object DataView extends FunctionView {
       " and ",
       span("_")
     )
-  )
+  ).render
 
   override protected def script = () => {
-    jQ(".demo div").data("test", Map("first" -> 16, "last" -> "pizza!"))
-    val data: Map[String, Any] = jQ(".demo div").data("test").get.asInstanceOf[Map[String, Any]]
-    jQ(".demo div span:first").text(data.get("first").get.toString)
-    jQ(".demo div span:last").text(data.get("last").get.toString)
+    jQ("div", content).data("test", Map("first" -> 16, "last" -> "pizza!"))
+    val data: Map[String, Any] = jQ("div", content).data("test").get.asInstanceOf[Map[String, Any]]
+    jQ("div span:first", content).text(data.get("first").get.toString)
+    jQ("div span:last", content).text(data.get("last").get.toString)
   }
 }
\ No newline at end of file
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/functions/DeferredView.scala b/example/src/main/scala/io/udash/demos/jquery/views/functions/DeferredView.scala
index a4e1cbe..ae31443 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/functions/DeferredView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/functions/DeferredView.scala
@@ -13,7 +13,7 @@ object DeferredView extends FunctionView {
 
   var deferred: JQueryDeferred[js.Function1[Int, js.Any], Int] = null
 
-  override protected def content = div(cls := "demo")(
+  override protected val content = div(
     h3("Deferred"),
     div(
       div(id := "deferred")("???"),
@@ -39,14 +39,14 @@ object DeferredView extends FunctionView {
         })
       )("Notify(1)")
     )
-  )
+  ).render
 
   override protected def script = () => {
-    jQ(".demo button").prop("disabled", "")
+    jQ("button", content).prop("disabled", "")
     deferred = jQ.deferred[js.Function1[Int, js.Any], Int]()
-    jQ("#deferred").text(s"Waiting...")
-    deferred.done((i: Int) => jQ("#deferred").text(s"Done: $i"))
-    deferred.fail((i: Int) => jQ("#deferred").text(s"Fail: $i"))
-    deferred.progress((i: Int) => jQ("#deferred").text(s"Progress: $i"))
+    jQ("#deferred", content).text(s"Waiting...")
+    deferred.done((i: Int) => jQ("#deferred", content).text(s"Done: $i"))
+    deferred.fail((i: Int) => jQ("#deferred", content).text(s"Fail: $i"))
+    deferred.progress((i: Int) => jQ("#deferred", content).text(s"Progress: $i"))
   }
 }
\ No newline at end of file
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/functions/EachView.scala b/example/src/main/scala/io/udash/demos/jquery/views/functions/EachView.scala
index dd64fc7..0f5097a 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/functions/EachView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/functions/EachView.scala
@@ -9,15 +9,15 @@ object EachView extends FunctionView {
 
   import scalatags.JsDom.all._
 
-  override protected def content = div(cls := "demo")(
+  override protected val content = div(
     h3(".each()"),
     div("Click button"),
     div("to iterate through"),
     div("these divs.")
-  )
+  ).render
 
   override protected def script = () => {
-    jQ(".demo div").each((el: Element, idx: Int) => {
+    jQ("div", content).each((el: Element, idx: Int) => {
       jQ(el).replaceWith(span(s"${el.textContent} ").render)
     })
   }
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/functions/HideShowView.scala b/example/src/main/scala/io/udash/demos/jquery/views/functions/HideShowView.scala
index 4227d2c..7a1d137 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/functions/HideShowView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/functions/HideShowView.scala
@@ -8,13 +8,13 @@ object HideShowView extends FunctionView {
 
   import scalatags.JsDom.all._
 
-  override protected def content = div(cls := "demo")(
+  override protected val content = div(
     h3(".hide() & .show()"),
     div("Click button to hide me")
-  )
+  ).render
 
   override protected def script = () => {
-    jQ(".demo div")
+    jQ("div", content)
       .hide(AnimationOptions(
         duration = Some(3000),
         easing = Some(EasingFunction.linear)
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/functions/OffsetPositionView.scala b/example/src/main/scala/io/udash/demos/jquery/views/functions/OffsetPositionView.scala
index 9ad4328..0796b29 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/functions/OffsetPositionView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/functions/OffsetPositionView.scala
@@ -8,18 +8,18 @@ object OffsetPositionView extends FunctionView {
 
   import scalatags.JsDom.all._
 
-  override protected def content = div(cls := "demo")(
+  override protected val content = div(
     h3(".offset() & .position()"),
     div(style := "padding: 12px; border: 1px red solid;")(
       p(style := "margin-left: 10px; border: 1px blue solid;")("Hello world!")
     ),
     p(id := "results")("")
-  )
+  ).render
 
   override protected def script = () => {
-    val div = jQ(".demo div")
-    val p = jQ(".demo div p")
-    jQ("#results").html(
+    val div = jQ("div", content)
+    val p = jQ("div p", content)
+    jQ("#results", content).html(
       s"""Div offset: (${div.offset().top}, ${div.offset().left})<br/>
          |Div position: (${div.position().top}, ${div.position().left})<br/>
          |Paragraph offset: (${p.offset().top}, ${p.offset().left})<br/>
diff --git a/example/src/main/scala/io/udash/demos/jquery/views/functions/OnOneOffView.scala b/example/src/main/scala/io/udash/demos/jquery/views/functions/OnOneOffView.scala
index 1c0de22..368f69f 100644
--- a/example/src/main/scala/io/udash/demos/jquery/views/functions/OnOneOffView.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/views/functions/OnOneOffView.scala
@@ -2,6 +2,7 @@ package io.udash.demos.jquery.views.functions
 
 import io.udash.demos.jquery.views.FunctionView
 import io.udash.wrappers.jquery._
+import org.scalajs.dom.html.Div
 import org.scalajs.dom.{Element, Event}
 
 /** Based on examples from: <a href="http://api.jquery.com/on/">jQuery Docs</a>. */
@@ -10,11 +11,11 @@ object OnOneOffView extends FunctionView {
   import scalatags.JsDom.all._
 
   val onCallback = (_: Element, _: JQueryEvent) =>
-    jQ(".demo ul").append(li("This will be added on every click").render)
+    jQ("ul", content).append(li("This will be added on every click").render)
   val oneCallback = (_: Element, _: JQueryEvent) =>
-    jQ(".demo ul").append(li("This will be added only once").render)
+    jQ("ul", content).append(li("This will be added only once").render)
 
-  override protected def content = div(cls := "demo")(
+  override protected val content: Div = div(
     h3(".on() & .one() & .off()"),
     button(id := "click", disabled := "disabled")("Click me"),
     ul(),
@@ -22,20 +23,20 @@ object OnOneOffView extends FunctionView {
       id := "off",
       disabled := "disabled",
       onclick := ((_: Event) => {
-        jQ(".demo #click")
+        jQ("#click", content)
           .off(EventName.click, onCallback)
           .off(EventName.click, oneCallback)
         false
       })
     )("Off")
-  )
+  ).render
 
   override protected def script = () => {
-    jQ(".demo #click")
+    jQ("#click", content)
       .on(EventName.click, onCallback)
       .one(EventName.click, oneCallback)
 
-    jQ(".demo button")
+    jQ("button", content)
       .prop("disabled", "")
   }
 }
\ No newline at end of file

From 06ca2e3517d76ea94c26d7e198e566c3ba61bae1 Mon Sep 17 00:00:00 2001
From: ddworak <dawid.dworak@gmail.com>
Date: Mon, 30 Mar 2020 10:40:12 +0200
Subject: [PATCH 08/12] Fix global demo

---
 example/global-demo/src/main/assets/index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/example/global-demo/src/main/assets/index.html b/example/global-demo/src/main/assets/index.html
index 90d7641..b746eab 100644
--- a/example/global-demo/src/main/assets/index.html
+++ b/example/global-demo/src/main/assets/index.html
@@ -7,7 +7,7 @@
 <body>
   <div id="application"></div>
 
-  <script src="scripts/frontend-impl.js"></script>
   <script src="scripts/frontend-deps.js"></script>
+  <script src="scripts/frontend-impl.js"></script>
 </body>
 </html>
\ No newline at end of file

From 3800211c7814d6ed6b9a3ff731a0f0f252d6a771 Mon Sep 17 00:00:00 2001
From: ddworak <dawid.dworak@gmail.com>
Date: Mon, 30 Mar 2020 11:07:31 +0200
Subject: [PATCH 09/12] Use locally published snapshot with Scala 2.13 and SJS
 1.0

---
 example/build.sbt                  | 16 +++++++++-------
 example/project/Dependencies.scala |  7 +------
 example/project/plugins.sbt        |  5 +++--
 3 files changed, 13 insertions(+), 15 deletions(-)

diff --git a/example/build.sbt b/example/build.sbt
index 49478f2..58ef253 100644
--- a/example/build.sbt
+++ b/example/build.sbt
@@ -1,13 +1,13 @@
 name := "jquery-demo"
 
 inThisBuild(Seq(
-  version := "3.0.2",
+  version := "3.0.0-SNAPSHOT",
   organization := "io.udash",
 ))
 
 val commonSettings = Seq(
-  scalaVersion := "2.12.10",
-  crossScalaVersions := Seq("2.12.10"), //todo 2.13 & SJS 1.0 with Udash 0.9
+  scalaVersion := "2.12.11",
+  crossScalaVersions := Seq("2.13.1"),
   scalacOptions ++= Seq(
     "-feature",
     "-deprecation",
@@ -34,17 +34,17 @@ val copyAssets = taskKey[Unit]("Copies all assets to the target directory.")
 lazy val root = project.in(file("."))
   .enablePlugins(ScalaJSPlugin)
   .settings(commonSettings)
+  .aggregate(`jquery-bundler-demo`, `jquery-global-demo`)
 
 lazy val `jquery-global-demo` = project.in(file("global-demo"))
-  .enablePlugins(ScalaJSPlugin)
+  .enablePlugins(ScalaJSPlugin, JSDependenciesPlugin)
   .settings(
     commonSettings,
 
-    jsDependencies ++= Dependencies.jsDeps.value,
-
     sourceDirsSettings(_.getParentFile),
 
-    /* move these files out of target/. */
+    cleanFiles += generatedGlobalDir,
+
     Compile / fullOptJS / crossTarget := generatedGlobalDir,
     Compile / fastOptJS / crossTarget := generatedGlobalDir,
     Compile / packageJSDependencies / crossTarget := generatedGlobalDir,
@@ -91,6 +91,8 @@ lazy val `jquery-bundler-demo` = project.in(file("bundler-demo"))
       )
     },
 
+    cleanFiles += generatedBundlerDir,
+
     compileStatics := {
       val sjsFileName = (Compile / fastOptJS).value.data.name.stripSuffix(".js")
       IO.copyFile(
diff --git a/example/project/Dependencies.scala b/example/project/Dependencies.scala
index 7be9655..a21498f 100644
--- a/example/project/Dependencies.scala
+++ b/example/project/Dependencies.scala
@@ -1,17 +1,12 @@
 import org.portablescala.sbtplatformdeps.PlatformDepsPlugin.autoImport._
-import org.scalajs.sbtplugin.ScalaJSPlugin.autoImport._
 import sbt._
 
 object Dependencies {
   val scalatagsVersion = "0.8.6"
-  val udashJQueryVersion = "3.0.2"
+  val udashJQueryVersion = "3.0.0-SNAPSHOT"
 
   val deps = Def.setting(Seq[ModuleID](
     "com.lihaoyi" %%% "scalatags" % scalatagsVersion,
     "io.udash" %%% "udash-jquery" % udashJQueryVersion
   ))
-
-  val jsDeps = Def.setting(Seq[org.scalajs.sbtplugin.JSModuleID](
-    "org.webjars" % "jquery" % "3.3.1" / "3.3.1/jquery.js" minified "3.3.1/jquery.min.js"
-  ))
 }
\ No newline at end of file
diff --git a/example/project/plugins.sbt b/example/project/plugins.sbt
index c0848e6..17a23aa 100644
--- a/example/project/plugins.sbt
+++ b/example/project/plugins.sbt
@@ -1,4 +1,5 @@
 logLevel := Level.Warn
 
-addSbtPlugin("org.scala-js" % "sbt-scalajs" % "0.6.32")
-addSbtPlugin("ch.epfl.scala" % "sbt-scalajs-bundler-sjs06" % "0.17.0")
\ No newline at end of file
+addSbtPlugin("org.scala-js" % "sbt-scalajs" % "1.0.1")
+addSbtPlugin("ch.epfl.scala" % "sbt-scalajs-bundler" % "0.17.0")
+addSbtPlugin("org.scala-js" % "sbt-jsdependencies" % "1.0.0")
\ No newline at end of file

From 1dc8d7e1e12957a069bb336b96ea3150350507f3 Mon Sep 17 00:00:00 2001
From: ddworak <dawid.dworak@gmail.com>
Date: Mon, 30 Mar 2020 11:09:03 +0200
Subject: [PATCH 10/12] Cross-compile in tests

---
 .travis.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.travis.yml b/.travis.yml
index e2322af..8464a62 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -9,7 +9,7 @@ jobs:
     - stage: test
       script:
         - sbt +test +publishLocal
-        - cd example && sbt compileStatics
+        - cd example && sbt +compileStatics
     - stage: release
       if: tag =~ ^v
       script:

From 0c61ec228532584bcc69dabce1b500752e72e557 Mon Sep 17 00:00:00 2001
From: ddworak <dawid.dworak@gmail.com>
Date: Mon, 30 Mar 2020 11:54:07 +0200
Subject: [PATCH 11/12] Docs update

---
 README.md | 20 ++++----------------
 1 file changed, 4 insertions(+), 16 deletions(-)

diff --git a/README.md b/README.md
index 8e775a1..88ff328 100644
--- a/README.md
+++ b/README.md
@@ -10,7 +10,7 @@ Static types for the jQuery API for [Scala.js](http://www.scala-js.org/) program
 Add the following dependency to your SBT build:
 
 ```scala
-libraryDependencies += "io.udash" %%% "udash-jquery" % "3.0.2"
+libraryDependencies += "io.udash" %%% "udash-jquery" % "3.0.4"
 ```
 
 then import the jQuery package: 
@@ -19,21 +19,9 @@ then import the jQuery package:
 import io.udash.wrappers.jquery._
 ```
 
-Since version `3.0.0` the wrapper is published as a CommonJS module with JS dependencies managed 
-by [scalajs-bundler](https://github.com/scalacenter/scalajs-bundler). 
-
-If you do not want to use the bundler, you have to include jQuery sources manually by:
- * explicit link in your `index.html`.
- ```html
- <script src="https://code.jquery.com/jquery-3.3.1.min.js" 
-         integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" 
-         crossorigin="anonymous"></script>
- ```
- * or a [Scala.js dependency](http://www.scala-js.org/doc/project/dependencies.html).
- ```scala
- jsDependencies +=
-   "org.webjars" % "jquery" % "3.3.1" / "3.3.1/jquery.js" minified "3.3.1/jquery.min.js"
- ```
+Since version `3.0.4` the wrapper targets SJS 1.x series and supports JS dependencies managed by
+by [scalajs-bundler](https://github.com/scalacenter/scalajs-bundler) or [sbt-jsdependencies
+](https://github.com/scala-js/jsdependencies)
  
 
 ## Examples

From e48541737cc55884d07f7c522123e7e9ae0c5b51 Mon Sep 17 00:00:00 2001
From: ddworak <dawid.dworak@gmail.com>
Date: Mon, 30 Mar 2020 11:59:38 +0200
Subject: [PATCH 12/12] Simplified init

---
 .../main/scala/io/udash/demos/jquery/Init.scala   | 15 ++-------------
 1 file changed, 2 insertions(+), 13 deletions(-)

diff --git a/example/src/main/scala/io/udash/demos/jquery/Init.scala b/example/src/main/scala/io/udash/demos/jquery/Init.scala
index 40ed49c..a1f296e 100644
--- a/example/src/main/scala/io/udash/demos/jquery/Init.scala
+++ b/example/src/main/scala/io/udash/demos/jquery/Init.scala
@@ -1,24 +1,13 @@
 package io.udash.demos.jquery
 
 import io.udash.demos.jquery.views.IndexView
-import io.udash.wrappers.jquery._
 import org.scalajs.dom
-import org.scalajs.dom.Element
 
 import scala.scalajs.js.annotation.JSExport
 
 object Init {
 
   @JSExport
-  def main(args: Array[String]): Unit = {
-    jQ((_: Element) => {
-      val appRoot = jQ("#application").get(0)
-      if (appRoot.isEmpty) {
-        dom.console.error("Application root element not found! Check you index.html file!")
-      } else {
-        appRoot.get.appendChild(IndexView.content.render)
-        //applicationInstance.run(appRoot.get)
-      }
-    })
-  }
+  def main(args: Array[String]): Unit =
+    dom.document.querySelector("#application").appendChild(IndexView.content.render)
 }
\ No newline at end of file