make the bookmarks table editable

This commit is contained in:
Jakob Ketterl 2021-02-13 23:53:16 +01:00
parent 48f26d00d6
commit 8ea4d11e9c
5 changed files with 71 additions and 3 deletions

View File

@ -58,3 +58,9 @@ h1 {
table.bookmarks .frequency {
text-align: right;
}
table.bookmarks input, table.bookmarks select {
width: initial;
text-align: inherit;
display: initial;
}

View File

@ -0,0 +1,41 @@
$.fn.bookmarktable = function() {
$.each(this, function(){
var $table = $(this);
var inputs = $table.find('tr.inputs td').map(function(){
var candidates = $(this).find('input, select')
return candidates.length ? candidates.first() : false;
}).toArray();
$table.find('tr.inputs').remove();
$table.on('dblclick', 'td', function(e) {
var $cell = $(e.target);
var html = $cell.html();
var index = $cell.parent('tr').find('td').index($cell);
var $input = inputs[index];
if (!$input) return;
$input.val($cell.data('value') || html);
$cell.html($input);
$input.focus();
var submit = function() {
var $option = $input.find('option:selected')
if ($option.length) {
$cell.html($option.html());
} else {
$cell.html($input.val());
}
};
$input.on('blur', submit).on('change', submit).on('keyup', function(e){
if (e.keyCode == 13) return submit();
if (e.keyCode == 27) {
$cell.html(html);
}
});
});
});
};

View File

@ -23,4 +23,5 @@ $(function(){
$(".sdrdevice").sdrdevice();
$(".imageupload").imageUpload();
$("table.bookmarks").bookmarktable();
});

View File

@ -148,6 +148,7 @@ class CompiledAssetsController(GzipMixin, ModificationAwareController):
"lib/settings/Input.js",
"lib/settings/SdrDevice.js",
"lib/settings/ImageUpload.js",
"lib/settings/BookmarkTable.js",
"settings.js",
],
}

View File

@ -1,6 +1,7 @@
from owrx.controllers.template import WebpageController
from owrx.controllers.admin import AuthorizationMixin
from owrx.bookmarks import Bookmark, Bookmarks
from owrx.modes import Modes
class BookmarksController(AuthorizationMixin, WebpageController):
@ -16,6 +17,15 @@ 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 bookmarks">
<tr>
@ -25,17 +35,25 @@ 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(idx, b) for idx, b in enumerate(bookmarks.getBookmarks()))
bookmarks="".join(self.render_bookmark(idx, b) for idx, b in enumerate(bookmarks.getBookmarks())),
options="".join(render_mode(m) for m in Modes.getAvailableModes()),
)
def render_bookmark(self, idx: int, bookmark: Bookmark):
mode = Modes.findByModulation(bookmark.getModulation())
return """
<tr data-index="{index}" data-id="{id}">
<td>{name}</td>
<td class="frequency">{frequency}</td>
<td>{modulation}</td>
<td data-value="{modulation}">{modulation_name}</td>
<td>
<div class="btn btn-sm btn-danger bookmark-delete">delete</div>
</td>
@ -45,7 +63,8 @@ class BookmarksController(AuthorizationMixin, WebpageController):
id=id(bookmark),
name=bookmark.getName(),
frequency=bookmark.getFrequency(),
modulation=bookmark.getModulation(),
modulation=bookmark.getModulation() if mode is None else mode.modulation,
modulation_name=bookmark.getModulation() if mode is None else mode.name,
)
def indexAction(self):