🐛 Fix go to page interaction in viewer

frontend/src/uxbox/view/data/viewer.cljs

@@ -77,12 +77,24 @@
   ptk/WatchEvent
   (watch [_ state stream]
     (let [token (get-in state [:route :params :token])]
-      (rx/of (rt/navigate :view/viewer {:token token :index index})))))
+      (rx/of (rt/navigate :view/viewer {:token token :index index :id nil})))))
 
 (defn select-page
   [index]
   (SelectPage. index))
 
+;; --- Go to Page
+
+(defrecord GoToPage [id]
+  ptk/WatchEvent
+  (watch [_ state stream]
+    (let [token (get-in state [:route :params :token])]
+      (rx/of (rt/navigate :view/viewer {:token token :index nil :id id})))))
+
+(defn go-to-page
+  [id]
+  (GoToPage id))
+
 ;; --- Toggle Flag
 
 (defrecord ToggleFlag [key]

frontend/src/uxbox/view/ui/viewer.cljs

@@ -46,7 +46,7 @@
   {:mixins [mx/static mx/reactive]
    :will-mount viewer-page-will-mount
    :did-remount viewer-page-did-remount}
-  [token index]
+  [token index id]
   (let [flags (mx/react flags-ref)
         sitemap? (contains? flags :sitemap)
         get-order #(get-in % [:metadata :order])
@@ -55,4 +55,6 @@
      (when sitemap?
        (sitemap pages index))
      (nav flags)
-     (canvas (nth pages index))]))
+     (canvas (if (= id nil)
+               (nth pages index)
+               (some #(= id (:id %)) pages)))]))

frontend/src/uxbox/view/ui/viewer/interactions.cljs

@@ -81,7 +81,6 @@
                      :strokeOpacity "1"
                      :easing (translate-ease easing)
                      :delay delay
-                     :class "itx-displayed"
                      :duration duration}))))
 
 (defn- run-hide-interaction
@@ -94,14 +93,13 @@
                      :strokeOpacity "0"
                      :easing (translate-ease easing)
                      :delay delay
-                     :class "itx-hidden"
                      :duration duration}))))
 
 (defn- run-toggle-interaction
   [{:keys [element easing delay duration
            animation direction] :as itx}]
   (let [dom (dom/get-element (str "shape-" element))]
-    (if (= (:class dom) "itx-hidden")
+    (if (= direction :reverse)
       (run-show-interaction itx)
       (run-hide-interaction itx))))
 
@@ -173,7 +171,7 @@
 
 (defn- run-gotopage-interaction
   [{:keys [page]}]
-  (st/emit! (dv/select-page page)))
+  (st/emit! (dv/go-to-page page)))
 
 (defn- run-color-interaction
   [{:keys [element fill-color stroke-color direction easing delay duration]}]

frontend/src/uxbox/view/ui/viewer/sitemap.cljs

@@ -36,6 +36,7 @@
             :let [selected? (= i selected)]]
         [:li {:class (when selected? "selected")
               :on-click (partial on-click i)
+              :id (str "page-" (:id page))
               :key (str i)}
          [:div.page-icon i/page]
          [:span (:name page)]])]]))