Browse Source

fix(editor): allow up/down arrows for repeater time selection

Tienson Qin 5 years ago
parent
commit
42967ea782

+ 2 - 2
src/main/frontend/components/datetime.cljs

@@ -141,8 +141,8 @@
                                               (string/lower-case current-command)))
         date (get @*timestamp :date)]
     (when (state/sub :editor/show-date-picker?)
-      [:div.flex.flex-row {:on-click (fn [e]
-                                       (util/stop e))}
+      [:div#date-time-picker.flex.flex-row {:on-click (fn [e]
+                                                        (util/stop e))}
        (ui/datepicker
         date
         {:deadline-or-schedule? deadline-or-schedule?

+ 7 - 1
src/main/frontend/handler/editor.cljs

@@ -1792,7 +1792,8 @@
   (fn [state e]
     (when-let [repo (state/get-current-repo)]
       (let [blocks (seq (state/get-selection-blocks))]
-        (if (seq blocks)
+        (cond
+          (seq blocks)
           (let [ids (map (fn [block] (when-let [id (dom/attr block "blockid")]
                                        (medley/uuid id))) blocks)
                 ids (->> (mapcat #(let [children (vec (db/get-block-children-ids repo %))]
@@ -1847,6 +1848,11 @@
               {:key :block/change
                :data (map (fn [block] (assoc block :block/page page)) blocks)}
               [[file-path new-content]])))
+
+          (gdom/getElement "date-time-picker")
+          nil
+
+          :else
           (cycle-collapse! state e))))))
 
 (defn bulk-make-todos

+ 1 - 1
src/main/frontend/ui.cljs

@@ -381,7 +381,7 @@
   [on? on-click]
   [:a {:on-click on-click}
    [:span.relative.inline-block.flex-shrink-0.h-6.w-11.border-2.border-transparent.rounded-full.cursor-pointer.transition-colors.ease-in-out.duration-200.focus:outline-none.focus:shadow-outline
-    {:aria-checked "false", :tabindex "0", :role "checkbox"
+    {:aria-checked "false", :tab-index "0", :role "checkbox"
      :class (if on? "bg-indigo-600" "bg-gray-200")}
     [:span.inline-block.h-5.w-5.rounded-full.bg-white.shadow.transform.transition.ease-in-out.duration-200
      {:class (if on? "translate-x-5" "translate-x-0")

+ 11 - 8
src/main/frontend/ui/date_picker.cljs

@@ -179,10 +179,10 @@
                         (constantly true))]
     (merge attributes {:selectable-fn selectable-fn})))
 
-(defn- in-time-input?
+(defn- input-or-select?
   []
   (when-let [elem js/document.activeElement]
-    (= "time" (gobj/get elem "id"))))
+    (or (util/input? elem) (util/select? elem))))
 
 (rum/defc date-picker < rum/reactive
   (mixins/event-mixin
@@ -192,28 +192,31 @@
         state
         {;; enter, current day
          13 (fn [state e]
-              (when on-change
+              (when (and on-change
+                         (not (input-or-select?)))
                 (when-not deadline-or-schedule?
                   (on-change e @*internal-model))))
 
         ;; left, previous day
          37 (fn [state e]
-              (when-not (in-time-input?)
+              (when-not (input-or-select?)
                 (swap! *internal-model inc-date -1)))
 
         ;; right, next day
          39 (fn [state e]
-              (when-not (in-time-input?)
+              (when-not (input-or-select?)
                 (swap! *internal-model inc-date 1)))
 
         ;; up, one week ago
          38 (fn [state e]
-              (swap! *internal-model inc-week -1))
+              (when-not (input-or-select?)
+                (swap! *internal-model inc-week -1)))
         ;; down, next week
          40 (fn [state e]
-              (swap! *internal-model inc-week 1))}
+              (when-not (input-or-select?)
+                (swap! *internal-model inc-week 1)))}
         {:all-handler (fn [e key-code]
-                        (when (contains? #{13 38 40} key-code)
+                        (when (contains? #{13} key-code)
                           (util/stop e)))}))))
   {:init (fn [state]
            (reset! *internal-model (first (:rum/args state)))

+ 5 - 0
src/main/frontend/util.cljs

@@ -370,6 +370,11 @@
      #{"INPUT" "TEXTAREA"}
      (gobj/get node "tagName"))))
 
+(defn select?
+  [node]
+  (when node
+    (= "SELECT" (gobj/get node "tagName"))))
+
 (defn details-or-summary?
   [node]
   (when node