fmt and use HtmlRef to set gesture handlers

scalacenter · Apr 19, 2017 · 06c79a7 · 06c79a7
1 parent 3ccd661
commit 06c79a7
Show file tree

Hide file tree

Showing 11 changed files with 91 additions and 75 deletions.
diff --git a/balancer/src/main/scala/com.olegych.scastie.balancer/SnippetsContainer.scala b/balancer/src/main/scala/com.olegych.scastie.balancer/SnippetsContainer.scala
@@ -81,7 +81,8 @@ class SnippetsContainer(root: Path) {
 
   def amend(snippetId: SnippetId, inputs: Inputs): Boolean = {
     if (delete(snippetId)) {
-      write(inputsFile(snippetId), uwrite(inputs.copy(showInUserProfile = true)))
+      write(inputsFile(snippetId),
+            uwrite(inputs.copy(showInUserProfile = true)))
       true
     } else false
   }

diff --git a/client/src/main/scala/com.olegych.scastie.client/App.scala b/client/src/main/scala/com.olegych.scastie.client/App.scala
@@ -6,10 +6,13 @@ import japgolly.scalajs.react._
 import vdom.all._
 import org.scalajs.dom
 import org.scalajs.dom.window._
-import org.scalajs.dom.raw.HTMLScriptElement
+import org.scalajs.dom.raw.{HTMLScriptElement, HTMLDivElement}
 
 object App {
 
+  private val appElement =
+    Ref[HTMLDivElement]("app-element")
+
   private def setTitle(state: AppState) =
     if (state.inputsHasChanged) {
       Callback(dom.document.title = "Scastie (*)")
@@ -41,12 +44,14 @@ object App {
             else ""
 
           def appStyle: TagMod =
-            if(state.dimensions.forcedDesktop)
+            if (state.dimensions.forcedDesktop)
               Seq(minHeight := "5000px",
-              minWidth := Dimensions.default.minWindowWidth.px)
+                  minWidth := Dimensions.default.minWindowWidth.px)
             else Seq(height := innerHeight.px, width := innerWidth.px)
 
-          div(`id` := "app", `class` := s"$appClass $theme $desktop", appStyle)(
+          div(ref := appElement,
+              `class` := s"$appClass $theme $desktop",
+              appStyle)(
             sideBar,
             MainPanel(state, scope.backend, props),
             Welcome(state, scope.backend),
@@ -59,15 +64,16 @@ object App {
       .componentWillMount { current =>
         current.backend.start(current.props) >> setTitle(current.state)
       }
-      .componentDidMount{ s =>
-
+      .componentDidMount { scope =>
         val detectGesture = Callback(
-          dom.document
-            .getElementById("app")
-            .addEventListener("gesturechange gestureend touchstart touchmove touchend",  s.backend.setDimensions2 _)
+          appElement(scope).get
+            .addEventListener(
+              "gesturechange gestureend touchstart touchmove touchend",
+              scope.backend.setDimensions2 _
+            )
         )
 
-        s.backend.setDimensions() >> detectGesture
+        scope.backend.setDimensions() >> detectGesture
       }
       .componentDidUpdate { v =>
         val state = v.prevState

diff --git a/client/src/main/scala/com.olegych.scastie.client/AppBackend.scala b/client/src/main/scala/com.olegych.scastie.client/AppBackend.scala
@@ -117,11 +117,13 @@ class AppBackend(scope: BackendScope[AppProps, AppState]) {
 
     val snippetId = SnippetId("", None)
 
-    val setData = scope.modState(_.clearOutputs
-      .setInputs(Inputs.default.copy(code = ""))
-      .setSnippetSaved(false)
-      .setSnippetId(snippetId)
-      .setChangedInputs)
+    val setData = scope.modState(
+      _.clearOutputs
+        .setInputs(Inputs.default.copy(code = ""))
+        .setSnippetSaved(false)
+        .setSnippetId(snippetId)
+        .setChangedInputs
+    )
 
     val setPage = scope.props.flatMap(
       props =>
@@ -298,23 +300,24 @@ class AppBackend(scope: BackendScope[AppProps, AppState]) {
     scope.state.flatMap(
       state =>
         if (!state.isSnippetSaved) {
-            Callback.future(
-              ApiClient[AutowireApi]
-                .save(state.inputs)
-                .call()
-                .map(
-                  snippetId =>
-                    scope.modState(
-                      _.setLoadSnippet(false).setCleanInputs.setSnippetSaved(true)
-                    ) >>
+          Callback.future(
+            ApiClient[AutowireApi]
+              .save(state.inputs)
+              .call()
+              .map(
+                snippetId =>
+                  scope.modState(
+                    _.setLoadSnippet(false).setCleanInputs
+                      .setSnippetSaved(true)
+                  ) >>
                     scope.props.flatMap(
                       props =>
                         props.router
                           .map(_.set(Page.fromSnippetId(snippetId)))
                           .getOrElse(Callback(()))
                   )
-                )
-            )
+              )
+          )
         } else Callback(())
     )
   }
@@ -359,12 +362,12 @@ class AppBackend(scope: BackendScope[AppProps, AppState]) {
                 case Some(sId) =>
                   val page = Page.fromSnippetId(sId)
                   scope.modState(_.setSnippetSaved(true)) >>
-                  scope.modState(
-                    _.setLoadSnippet(false).clearOutputs
-                  ) >>
-                  scope.props.flatMap(
-                    _.router.map(_.set(page)).getOrElse(Callback(()))
-                  )
+                    scope.modState(
+                      _.setLoadSnippet(false).clearOutputs
+                    ) >>
+                    scope.props.flatMap(
+                      _.router.map(_.set(page)).getOrElse(Callback(()))
+                    )
                 case None => Callback(window.alert("Failed to fork"))
               }
           )
@@ -386,12 +389,12 @@ class AppBackend(scope: BackendScope[AppProps, AppState]) {
                 case Some(sId) =>
                   val page = Page.fromSnippetId(sId)
                   scope.modState(_.setSnippetSaved(true)) >>
-                  scope.modState(
-                    _.setLoadSnippet(false).clearOutputs
-                  ) >>
-                  scope.props.flatMap(
-                    _.router.map(_.set(page)).getOrElse(Callback(()))
-                  )
+                    scope.modState(
+                      _.setLoadSnippet(false).clearOutputs
+                    ) >>
+                    scope.props.flatMap(
+                      _.router.map(_.set(page)).getOrElse(Callback(()))
+                    )
                 case None => Callback(window.alert("Failed to update"))
               }
           )
@@ -419,7 +422,9 @@ class AppBackend(scope: BackendScope[AppProps, AppState]) {
                 case _ =>
                   scope.modState(_.setCode(s"//snippet not found"))
               }
-          ) >> setView(View.Editor) >> scope.modState(_.clearOutputs.closeModals)
+          ) >> setView(View.Editor) >> scope.modState(
+            _.clearOutputs.closeModals
+          )
         } else {
           scope.modState(_.setLoadSnippet(true))
       }

diff --git a/client/src/main/scala/com.olegych.scastie.client/BuildSettings.scala b/client/src/main/scala/com.olegych.scastie.client/BuildSettings.scala
@@ -226,7 +226,6 @@ object BuildSettings {
   private val component =
     ReactComponentB[(AppState, AppBackend)]("BuildSettings").render_P {
       case (state, backend) =>
-
         import state.dimensions._
 
         val theme = if (state.isDarkTheme) "dark" else "light"
@@ -241,7 +240,7 @@ object BuildSettings {
           } else EmptyTag
 
         def containerStyle: TagMod = Seq(
-          if(forcedDesktop)
+          if (forcedDesktop)
             height := (dom.window.innerHeight - topBarHeight).px
           else EmptyTag
         )

diff --git a/client/src/main/scala/com.olegych.scastie.client/CodeSnippets.scala b/client/src/main/scala/com.olegych.scastie.client/CodeSnippets.scala
@@ -71,9 +71,8 @@ object CodeSnippets {
                "Github user")
           }
 
-
           def containerStyle: TagMod = Seq(
-            if(forcedDesktop)
+            if (forcedDesktop)
               height := (innerHeight - topBarHeight).px
             else EmptyTag
           )

diff --git a/client/src/main/scala/com.olegych.scastie.client/Console.scala b/client/src/main/scala/com.olegych.scastie.client/Console.scala
@@ -25,23 +25,25 @@ object Console {
           val currentWidth = (dom.window.innerWidth - sideBarWidth).px
 
           val minConsoleWidth =
-            ((if(forcedDesktop) Dimensions.default.minWindowWidth
-            else dom.window.innerWidth.toInt) - sideBarWidth).px
+            ((if (forcedDesktop) Dimensions.default.minWindowWidth
+              else dom.window.innerWidth.toInt) - sideBarWidth).px
 
-          def consoleStyle: TagMod = Seq(
-            displayConsole,
-            width := currentWidth,
-            minWidth := minConsoleWidth)
+          def consoleStyle: TagMod =
+            Seq(displayConsole,
+                width := currentWidth,
+                minWidth := minConsoleWidth)
 
-          def switcherStyle: TagMod = Seq(
-            displaySwitcher,
-            width := currentWidth,
-            minWidth := minConsoleWidth)
+          def switcherStyle: TagMod =
+            Seq(displaySwitcher,
+                width := currentWidth,
+                minWidth := minConsoleWidth)
 
           div(`id` := "console-container")(
             div(`id` := "console", consoleStyle)(
               div(`id` := "handler"),
-              div(`id` := "switcher-hide", consoleStyle, onClick ==> backend.toggleConsole)(
+              div(`id` := "switcher-hide",
+                  consoleStyle,
+                  onClick ==> backend.toggleConsole)(
                 i(`class` := "fa fa-terminal"),
                 "Console",
                 i(`class` := "fa fa-caret-down")

diff --git a/client/src/main/scala/com.olegych.scastie.client/EditorTopBar.scala b/client/src/main/scala/com.olegych.scastie.client/EditorTopBar.scala
@@ -16,8 +16,10 @@ object EditorTopBar {
 
         def topBarStyle: TagMod = Seq(
           minWidth :=
-            (if(state.dimensions.forcedDesktop) Dimensions.default.minWindowWidth
-            else dom.window.innerWidth.toInt - state.dimensions.sideBarWidth).px
+            (if (state.dimensions.forcedDesktop)
+               Dimensions.default.minWindowWidth
+             else
+               dom.window.innerWidth.toInt - state.dimensions.sideBarWidth).px
         )
 
         nav(`id` := "editor-topbar", isDisabled, topBarStyle)(

diff --git a/client/src/main/scala/com.olegych.scastie.client/MainPanel.scala b/client/src/main/scala/com.olegych.scastie.client/MainPanel.scala
@@ -56,33 +56,33 @@ object MainPanel {
             innerHeight -
               topBarHeight -
               editorTopBarHeight -
-                (
+              (
                 if (state.consoleState.consoleIsOpen) consoleHeight
                 else consoleBarHeight
-                ) -
+              ) -
               mobileBarHeight
 
           def editorStyle: TagMod = Seq(
             minHeight :=
-              (if(forcedDesktop) Dimensions.default.minWindowHeight
-              else editorHeight.toInt).px,
+              (if (forcedDesktop) Dimensions.default.minWindowHeight
+               else editorHeight.toInt).px,
             minWidth :=
-              ((if(forcedDesktop) Dimensions.default.minWindowWidth
-              else innerWidth.toInt) - sideBarWidth).px
+              ((if (forcedDesktop) Dimensions.default.minWindowWidth
+                else innerWidth.toInt) - sideBarWidth).px
           )
 
           def codeStyle: TagMod = Seq(
             height := editorHeight.px
           )
 
           def containerStyle: TagMod = Seq(
-            if(forcedDesktop)
+            if (forcedDesktop)
               minHeight := Dimensions.default.minWindowHeight.px
             else
               height := (innerHeight - topBarHeight).px,
             minWidth :=
-              ((if(forcedDesktop) Dimensions.default.minWindowWidth
-              else innerWidth.toInt) - sideBarWidth).px
+              ((if (forcedDesktop) Dimensions.default.minWindowWidth
+                else innerWidth.toInt) - sideBarWidth).px
           )
 
           div(`class` := "main-panel")(
@@ -95,7 +95,8 @@ object MainPanel {
                   show(View.Editor),
                   containerStyle)(
                 div(`id` := "code", codeStyle)(
-                  Editor(state, backend), embeddedMenu
+                  Editor(state, backend),
+                  embeddedMenu
                 ),
                 Console(state, backend)
               ),

diff --git a/client/src/main/scala/com.olegych.scastie.client/ModalState.scala b/client/src/main/scala/com.olegych.scastie.client/ModalState.scala
@@ -9,8 +9,7 @@ object ModalState {
   )
 }
 
-case class ModalState(
-  isWelcomeModalClosed: Boolean,
-  isHelpModalClosed: Boolean,
-  isShareModalClosed: Boolean,
-  isResetModalClosed: Boolean)
+case class ModalState(isWelcomeModalClosed: Boolean,
+                      isHelpModalClosed: Boolean,
+                      isShareModalClosed: Boolean,
+                      isResetModalClosed: Boolean)
diff --git a/client/src/main/scala/com.olegych.scastie.client/SideBar.scala b/client/src/main/scala/com.olegych.scastie.client/SideBar.scala
@@ -62,7 +62,8 @@ object SideBar {
 
         def actionsContainerStyle: TagMod =
           TagMod(
-            if(forcedDesktop) minHeight := Dimensions.default.minWindowHeight.px
+            if (forcedDesktop)
+              minHeight := Dimensions.default.minWindowHeight.px
             else height := innerHeight.toInt.px
           )
 

diff --git a/client/src/main/scala/com.olegych.scastie.client/TopBar.scala b/client/src/main/scala/com.olegych.scastie.client/TopBar.scala
@@ -71,8 +71,9 @@ object TopBar {
 
         def topBarStyle: TagMod = Seq(
           minWidth :=
-            (if(state.dimensions.forcedDesktop) Dimensions.default.minWindowWidth
-            else dom.window.innerWidth.toInt).px
+            (if (state.dimensions.forcedDesktop)
+               Dimensions.default.minWindowWidth
+             else dom.window.innerWidth.toInt).px
         )
 
         val userName = state.user.map(_.login).getOrElse("Login")