re-work the bookmarks table to incorporate the improved frequency input

owrx/controllers/settings/bookmarks.py

@@ -3,6 +3,7 @@ from owrx.controllers.admin import AuthorizationMixin
 from owrx.bookmarks import Bookmark, Bookmarks
 from owrx.modes import Modes
 import json
+import math
 
 import logging
 
@@ -18,16 +19,8 @@ class BookmarksController(AuthorizationMixin, WebpageController):
     def render_table(self):
         bookmarks = Bookmarks.getSharedInstance()
 
-        def render_mode(m):
-            return """
-                <option value={mode}>{name}</option>
-            """.format(
-                mode=m.modulation,
-                name=m.name,
-            )
-
         return """
-            <table class="table">
+            <table class="table bookmarks" data-modes='{modes}'>
                 <tr>
                     <th>Name</th>
                     <th class="frequency">Frequency</th>
@@ -35,25 +28,35 @@ class BookmarksController(AuthorizationMixin, WebpageController):
                     <th>Actions</th>
                 </tr>
                 {bookmarks}
-                <tr class="inputs" style="display:none;">
-                    <td><input class="form-control form-control-sm" type="text" name="name"></td>
-                    <td><input class="form-control form-control-sm" type="number" step="1" name="frequency"></td>
-                    <td><select class="form-control form-control-sm" name="modulation">{options}</select></td>
-                    <td></td>
-                </tr>
             </table>
         """.format(
             bookmarks="".join(self.render_bookmark(b) for b in bookmarks.getBookmarks()),
-            options="".join(render_mode(m) for m in Modes.getAvailableModes()),
+            modes=json.dumps({m.modulation: m.name for m in Modes.getAvailableModes()}),
         )
 
     def render_bookmark(self, bookmark: Bookmark):
+        def render_frequency(freq):
+            suffixes = {
+                0: "",
+                3: "k",
+                6: "M",
+                9: "G",
+                12: "T",
+            }
+            exp = int(math.log10(freq) / 3) * 3
+            num = freq
+            suffix = ""
+            if exp in suffixes:
+                num = freq / 10 ** exp
+                suffix = suffixes[exp]
+            return "{num:g} {suffix}Hz".format(num=num, suffix=suffix)
+
         mode = Modes.findByModulation(bookmark.getModulation())
         return """
             <tr data-id="{id}">
-                <td>{name}</td>
-                <td class="frequency">{frequency}</td>
-                <td data-value="{modulation}">{modulation_name}</td>
+                <td data-editor="name" data-value="{name}">{name}</td>
+                <td data-editor="frequency" data-value="{frequency}" class="frequency">{rendered_frequency}</td>
+                <td data-editor="modulation" data-value="{modulation}">{modulation_name}</td>
                 <td>
                     <button type="button" class="btn btn-sm btn-danger bookmark-delete">delete</button>
                 </td>
@@ -61,7 +64,9 @@ class BookmarksController(AuthorizationMixin, WebpageController):
         """.format(
             id=id(bookmark),
             name=bookmark.getName(),
+            # TODO render frequency in si units
             frequency=bookmark.getFrequency(),
+            rendered_frequency=render_frequency(bookmark.getFrequency()),
             modulation=bookmark.getModulation() if mode is None else mode.modulation,
             modulation_name=bookmark.getModulation() if mode is None else mode.name,
         )