scalatex broken out into separate project which needs to be published separately

2 files changed, 16 insertions, 5 deletions

diff --git a/book/src/main/scala/book/Book.scala b/book/src/main/scala/book/Book.scala
index d023d56..71c0d65 100644
--- a/book/src/main/scala/book/Book.scala
+++ b/book/src/main/scala/book/Book.scala
@@ -25,7 +25,7 @@ object Book {
     "META-INF/resources/webjars/font-awesome/4.2.0/fonts/fontawesome-webfont.woff",
     "css/side-menu.css",
     "example-opt.js",
-    "example-opt.js.map",
+//    "example-opt.js.map",
     "webpage/weather.js",
     "favicon.svg",
     "favicon.png"
@@ -72,6 +72,7 @@ object Book {
         script(raw(googleAnalytics))
       ),
       body(
+        onload:=s"Controller().main($data)",
         div(id:="layout")(
           a(href:="#menu", id:="menuLink", cls:="menu-link")(
             span
@@ -83,8 +84,7 @@ object Book {
           div(id:="main-box")(
             txt
           )
-        ),
-        script(raw(s"Controller().main($data)"))
+        )
       )
     )
   ).render
diff --git a/book/src/main/scalatex/book/handson/ClientServer.scalatex b/book/src/main/scalatex/book/handson/ClientServer.scalatex
index 48d35f2..50afe76 100644
--- a/book/src/main/scalatex/book/handson/ClientServer.scalatex
+++ b/book/src/main/scalatex/book/handson/ClientServer.scalatex
@@ -1,5 +1,12 @@
 @import BookData._
 
+@def lazyload(id: String) = script(raw("""
+  document.addEventListener("load", function(){
+    document.getElementById(id).src = 'https://hands-on-scala-js.herokuapp.com/'
+  })
+"""))
+
+
 @p
   Historically, sharing code across client & server has been a holy-grail for web development. There are many things which have made it hard in the past:
 
@@ -75,7 +82,9 @@
   @p
     Now, if we go to the browser at @code{localhost:8080}, we should see our web-page!
 
-  @iframe(src:="https://hands-on-scala-js.herokuapp.com/", width:="100%", height:="350px", "frameBorder".attr:="0")
+  @iframe(id:="heroku1", width:="100%", height:="350px", "frameBorder".attr:="0")
+  @lazyload("heroku1")
+
 
   @p
     This is a real, live example running on a @lnk("Heroku server", "https://hands-on-scala-js.herokuapp.com/"). Feel free to poke around and explore the filesystem on the server, just to convince yourself that this actually works and is not just a mock up.
@@ -215,7 +224,9 @@
     @p
       Other than that, nothing much has changed. If you've done this correctly, the web application will look and behave exactly as it did earlier!
 
-    @iframe(src:="https://hands-on-scala-js.herokuapp.com/", width:="100%", height:="350px", "frameBorder".attr:="0")
+    @iframe(id:="heroku2", width:="100%", height:="350px", "frameBorder".attr:="0")
+    @lazyload("heroku2")
+
 
     @p
       So why did we do this in the first place?