From d9ff9e89f02959bed4ffd4fdfbd1d93c0ff0fb71 Mon Sep 17 00:00:00 2001 From: Li Haoyi Date: Thu, 12 Mar 2015 20:13:25 +0800 Subject: better scrolling --- book/src/main/resources/css/side-menu.css | 6 ++-- build.sbt | 4 +-- examples/crossBuilds/clientserver/build.sbt | 4 +-- .../crossBuilds/clientserver/project/build.sbt | 2 +- examples/crossBuilds/clientserver2/build.sbt | 6 ++-- .../crossBuilds/clientserver2/project/build.sbt | 2 +- examples/demos/build.sbt | 6 ++-- .../src/main/scala/scrollmenu/Controller.scala | 2 +- .../src/main/scala/scrollmenu/ScrollSpy.scala | 33 ++++++++-------------- project/build.sbt | 2 +- 10 files changed, 28 insertions(+), 39 deletions(-) diff --git a/book/src/main/resources/css/side-menu.css b/book/src/main/resources/css/side-menu.css index ed06b5f..dafa1b5 100755 --- a/book/src/main/resources/css/side-menu.css +++ b/book/src/main/resources/css/side-menu.css @@ -1,10 +1,8 @@ #main{ - position: fixed; max-width: 100%; right: 0px; left: 0px; - height: 100%; overflow-y: scroll } @@ -200,8 +198,8 @@ Hides the menu at `48em`, but modify this based on your app's needs. padding-left: 250px; /* left col width "#menu" */ left: 0; } - #main{ - left: 250px; + #main-box{ + padding-left: 250px; } #menu { left: 250px; diff --git a/build.sbt b/build.sbt index 58c61e8..c8de546 100644 --- a/build.sbt +++ b/build.sbt @@ -19,8 +19,8 @@ lazy val book = Project( base = file("book") ).settings(sharedSettings ++ scalatex.SbtPlugin.projectSettings:_*).settings( libraryDependencies ++= Seq( - "com.lihaoyi" %% "scalatags" % "0.4.5", - "com.lihaoyi" %%% "upickle" % "0.2.6", + "com.lihaoyi" %% "scalatags" % "0.4.6", + "com.lihaoyi" %%% "upickle" % "0.2.7", "com.lihaoyi" %% "scalatex-site" % "0.1.1", "com.lihaoyi" %% "ammonite" % "0.1.0" ), diff --git a/examples/crossBuilds/clientserver/build.sbt b/examples/crossBuilds/clientserver/build.sbt index 85c51fa..4ed5437 100644 --- a/examples/crossBuilds/clientserver/build.sbt +++ b/examples/crossBuilds/clientserver/build.sbt @@ -4,8 +4,8 @@ val app = crossProject.settings( unmanagedSourceDirectories in Compile += baseDirectory.value / "shared" / "main" / "scala", libraryDependencies ++= Seq( - "com.lihaoyi" %%% "scalatags" % "0.4.5", - "com.lihaoyi" %%% "upickle" % "0.2.6" + "com.lihaoyi" %%% "scalatags" % "0.4.6", + "com.lihaoyi" %%% "upickle" % "0.2.7" ), scalaVersion := "2.11.5" ).jsSettings( diff --git a/examples/crossBuilds/clientserver/project/build.sbt b/examples/crossBuilds/clientserver/project/build.sbt index 2e982c3..64e56f2 100644 --- a/examples/crossBuilds/clientserver/project/build.sbt +++ b/examples/crossBuilds/clientserver/project/build.sbt @@ -1,4 +1,4 @@ /*project/build.sbt*/ -addSbtPlugin("org.scala-js" % "sbt-scalajs" % "0.6.0") +addSbtPlugin("org.scala-js" % "sbt-scalajs" % "0.6.1") addSbtPlugin("com.typesafe.sbt" % "sbt-native-packager" % "0.7.4") diff --git a/examples/crossBuilds/clientserver2/build.sbt b/examples/crossBuilds/clientserver2/build.sbt index c01f12b..6198623 100644 --- a/examples/crossBuilds/clientserver2/build.sbt +++ b/examples/crossBuilds/clientserver2/build.sbt @@ -2,9 +2,9 @@ val app = crossProject.settings( unmanagedSourceDirectories in Compile += baseDirectory.value / "shared" / "main" / "scala", libraryDependencies ++= Seq( - "com.lihaoyi" %%% "scalatags" % "0.4.5", - "com.lihaoyi" %%% "upickle" % "0.2.6", - "com.lihaoyi" %%% "autowire" % "0.2.4" + "com.lihaoyi" %%% "scalatags" % "0.4.6", + "com.lihaoyi" %%% "upickle" % "0.2.7", + "com.lihaoyi" %%% "autowire" % "0.2.5" ), scalaVersion := "2.11.5" ).jsSettings( diff --git a/examples/crossBuilds/clientserver2/project/build.sbt b/examples/crossBuilds/clientserver2/project/build.sbt index d523658..d3b6050 100644 --- a/examples/crossBuilds/clientserver2/project/build.sbt +++ b/examples/crossBuilds/clientserver2/project/build.sbt @@ -1,3 +1,3 @@ /*project/build.sbt*/ -addSbtPlugin("org.scala-js" % "sbt-scalajs" % "0.6.0") +addSbtPlugin("org.scala-js" % "sbt-scalajs" % "0.6.1") diff --git a/examples/demos/build.sbt b/examples/demos/build.sbt index 6a7b10c..9190612 100644 --- a/examples/demos/build.sbt +++ b/examples/demos/build.sbt @@ -10,12 +10,12 @@ scalaVersion := "2.11.4" libraryDependencies += "com.lihaoyi" %% "acyclic" % "0.1.2" % "provided" -libraryDependencies += "com.lihaoyi" %%% "upickle" % "0.2.6" +libraryDependencies += "com.lihaoyi" %%% "upickle" % "0.2.7" libraryDependencies += "org.scala-js" %%% "scalajs-dom" % "0.8.0" -libraryDependencies += "com.lihaoyi" %%% "scalatags" % "0.4.5" +libraryDependencies += "com.lihaoyi" %%% "scalatags" % "0.4.6" -libraryDependencies += "com.lihaoyi" %%% "scalarx" % "0.2.7" +libraryDependencies += "com.lihaoyi" %%% "scalarx" % "0.2.8" libraryDependencies += "org.scala-lang.modules" %% "scala-async" % "0.9.2" \ No newline at end of file diff --git a/examples/demos/src/main/scala/scrollmenu/Controller.scala b/examples/demos/src/main/scala/scrollmenu/Controller.scala index 4627837..25af158 100644 --- a/examples/demos/src/main/scala/scrollmenu/Controller.scala +++ b/examples/demos/src/main/scala/scrollmenu/Controller.scala @@ -74,7 +74,7 @@ object Controller{ menuLink.classList.toggle("active") } - main.onscroll = (e: dom.UIEvent) => updateScroll() + dom.document.body.onscroll = (e: dom.UIEvent) => updateScroll() updateScroll() } diff --git a/examples/demos/src/main/scala/scrollmenu/ScrollSpy.scala b/examples/demos/src/main/scala/scrollmenu/ScrollSpy.scala index bd2f194..5c81ba2 100644 --- a/examples/demos/src/main/scala/scrollmenu/ScrollSpy.scala +++ b/examples/demos/src/main/scala/scrollmenu/ScrollSpy.scala @@ -57,10 +57,12 @@ class ScrollSpy(structure: Tree[String], rec(structure).tail } - js.Array( - menuItems.map(name => dom.document.getElementById(Controller.munge(name)).asInstanceOf[html.Element]) - .map((el) => () => offset(el, main)):_* - ) + val offsets = for(name <- menuItems) yield { + val el = dom.document.getElementById(Controller.munge(name)).asInstanceOf[html.Element] + () => offset(el, dom.document.body) + + } + js.Array(offsets:_*) } var open = false @@ -87,21 +89,11 @@ class ScrollSpy(structure: Tree[String], private[this] var scrolling = false private[this] var scrollTop = -1 def apply(): Unit = { - if (!scrolling) { - scrolling = true - scrollTop = main.scrollTop.toInt - dom.setTimeout({() => - scrolling = false - if (scrollTop == main.scrollTop) start() - else apply() - }, - 75 - ) - } + start() } private[this] var previousWin: MenuNode = null private[this] def start(force: Boolean = false) = { - val scrollTop = main.scrollTop + val scrollTop = dom.document.body.scrollTop def walkIndex(tree: Tree[MenuNode]): List[Tree[MenuNode]] = { val t @ Tree(m, children) = tree val win = if(m.start == -1) true @@ -118,6 +110,7 @@ class ScrollSpy(structure: Tree[String], } val winPath = walkIndex(domTrees) + val winItem = winPath.last.value def walkTree(indices: List[Tree[MenuNode]]): Int = indices match { case Nil => 0 @@ -130,8 +123,9 @@ class ScrollSpy(structure: Tree[String], for { child <- children if !indices.headOption.exists(_.value.frag == child.value.frag) - } walkHide(child) - + } { + walkHide(child) + } val size = walkTree(rest) + children.length mn.frag.children(1).asInstanceOf[html.Element].style.maxHeight = if (!open) size * 44 + "px" else "none" @@ -153,10 +147,7 @@ class ScrollSpy(structure: Tree[String], } if (winItem != previousWin || force){ -// scroll(winItem.frag.children(0)) -// dom.history.replaceState(null, null, "#" + winItem.id) previousWin = winItem -// println(winPath.map(_.value.id)) walkTree(winPath) } } diff --git a/project/build.sbt b/project/build.sbt index b1cfc53..a4c9041 100644 --- a/project/build.sbt +++ b/project/build.sbt @@ -1,4 +1,4 @@ -addSbtPlugin("org.scala-js" % "sbt-scalajs" % "0.6.0") +addSbtPlugin("org.scala-js" % "sbt-scalajs" % "0.6.1") addSbtPlugin("com.typesafe.sbt" % "sbt-native-packager" % "0.7.4") -- cgit v1.2.3