Merge branch 'edit-rrule'

3 files changed, 56 insertions, 2 deletions

diff --git a/static/binders.js b/static/binders.js
index 15275d28..197fb368 100644
--- a/static/binders.js
+++ b/static/binders.js
@@ -12,6 +12,7 @@ function bind_recur(el, e) {
 
     /* add listeners to bind-rr tags */
     for (let rr of e.querySelectorAll('.bind-rr')) {
+		/* TODO handle byday */
         if (rr.classList.contains('input-list')) {
             rr.addEventListener('input', function () {
                 let name = rr.attributes.name.value;
@@ -23,7 +24,12 @@ function bind_recur(el, e) {
                 el.properties.rrule[rr.name] = this.value;
             });
         } else if (rr.tagName === 'select') {
-            console.log("TODO");
+            rr.addEventListener('change', function () {
+                let opt = this.options[this.selectedIndex];
+                let v = opt.value;
+                // console.log(v);
+                el.properties.rrule[rr.name] = v;
+            });
         }
     }
 
diff --git a/static/popup.js b/static/popup.js
index bc4e766d..e19db6f2 100644
--- a/static/popup.js
+++ b/static/popup.js
@@ -59,3 +59,45 @@ function toggle_popup(popup_id) {
         open_popup(popup);
     }
 }
+
+/* Code for managing "selected" popup */
+/* Makes the popup last hovered over the selected popup, moving it to
+ * the top, and allowing global keyboard bindings to affect it. */
+
+let activePopup;
+
+for (let popup of document.querySelectorAll('.popup-container')) {
+    /* TODO possibly only change "active" element after a fraction of
+     * a second, for example when moving between tabs */
+    popup.addEventListener('mouseover', function () {
+        /* This is ever so slightly inefficient,
+           but it really dosen't mammet */
+        for (let other of
+             document.querySelectorAll('.popup-container'))
+        {
+            /* TODO get this from somewhere */
+            /* Currently it's manually copied from the stylesheet */
+            other.style['z-index'] = 1000;
+        }
+        popup.style['z-index'] += 1;
+        activePopup = popup;
+    });
+}
+
+document.addEventListener('keydown', function (event) {
+    /* Physical key position, names are what that key would
+       be in QWERTY */
+    let i = ({
+            'KeyQ': 0,
+            'KeyW': 1,
+            'KeyE': 2,
+            'KeyR': 3,
+    })[event.code];
+    if (i === undefined) return
+    if (! activePopup) return;
+    let element = activePopup.querySelectorAll(".tab > label")[i];
+    if (! element) return;
+    element.click();
+});
+
+/* END Code for managing "selected" popup */
diff --git a/static/style.scss b/static/style.scss
index 2d6b87b6..202e3a34 100644
--- a/static/style.scss
+++ b/static/style.scss
@@ -819,8 +819,14 @@ along with their colors.
 
         max-height: 5ex;
         min-height: 5ex;
+
         min-width: 5ex;
-        max-width: 5ex;
+        width: 5ex;
+
+        transition: width 0.1s ease-in-out;
+        &:hover {
+            width: 10ex;
+        }
 
         border: 1px solid #ccc;
         border-radius: 0 5px 5px 0;