Bring m.attrs.bidi in as a util

We previously used the tobscure/m.attrs.bidi github repo, but that repo was recently taken offline. We decided to integrate it as a util instead of publishing it as a separate package since we seem to be the only project using it, and adopting it into a new project requires barneycarroll/mattr, which does not seem to be used anywhere.

The code added here was taken from https://github.com/askvortsov1/m.attrs.bidi, a fork (without changes) of the tobscure repo. Support for alternative module systems and ways of registering bidi were removed, and the file was formatted in compliance with our prettier config.

js/package.json

@@ -13,7 +13,6 @@
     "jquery": "^3.5.1",
     "jquery.hotkeys": "^0.1.0",
     "lodash-es": "^4.17.14",
-    "m.attrs.bidi": "github:tobscure/m.attrs.bidi",
     "mithril": "^2.0.4",
     "punycode": "^2.1.1",
     "spin.js": "^3.1.0",

js/src/common/index.js

@@ -1,7 +1,6 @@
 import 'expose-loader?$!expose-loader?jQuery!jquery';
 import 'expose-loader?m!mithril';
 import 'expose-loader?dayjs!dayjs';
-import 'expose-loader?m.bidi!m.attrs.bidi';
 import 'bootstrap/js/affix';
 import 'bootstrap/js/dropdown';
 import 'bootstrap/js/modal';

js/src/common/utils/bidi.js

@@ -0,0 +1,48 @@
+function bidi(node, prop) {
+  var type = node.tag === 'select' ? (node.attrs.multi ? 'multi' : 'select') : node.attrs.type;
+
+  // Setup: bind listeners
+  if (type === 'multi') {
+    node.attrs.onchange = function () {
+      prop(
+        [].slice.call(this.selectedOptions, function (x) {
+          return x.value;
+        })
+      );
+    };
+  } else if (type === 'select') {
+    node.attrs.onchange = function (e) {
+      prop(this.selectedOptions[0].value);
+    };
+  } else if (type === 'checkbox') {
+    node.attrs.onchange = function (e) {
+      prop(this.checked);
+    };
+  } else {
+    node.attrs.onchange = node.attrs.oninput = function (e) {
+      prop(this.value);
+    };
+  }
+
+  if (node.tag === 'select') {
+    node.children.forEach(function (option) {
+      if (option.attrs.value === prop() || option.children[0] === prop()) {
+        option.attrs.selected = true;
+      }
+    });
+  } else if (type === 'checkbox') {
+    node.attrs.checked = prop();
+  } else if (type === 'radio') {
+    node.attrs.checked = prop() === node.attrs.value;
+  } else {
+    node.attrs.value = prop();
+  }
+
+  return node;
+}
+
+bidi.view = function (ctrl, node, prop) {
+  return bidi(node, node.attrs.bidi);
+};
+
+export default bidi;

js/src/common/utils/patchMithril.js

@@ -1,3 +1,5 @@
+import bidi from './bidi';
+
 export default function patchMithril(global) {
   const defaultMithril = global.m;
 
@@ -8,7 +10,7 @@ export default function patchMithril(global) {
 
     // Allows the use of the bidi attr.
     if (node.attrs.bidi) {
-      modifiedMithril.bidi(node, node.attrs.bidi);
+      bidi(node, node.attrs.bidi);
     }
 
     return node;