2.0

.gitignore

@@ -1,5 +1,6 @@
 *egg-info
 *pyc
+/dist/
 /.coverage
 /.mxmake
 /.vscode

js/src/tokens.js

@@ -13,11 +13,12 @@ export class TokensOverview {
         this.container = container;
         this.tokens_elem = $('#tokens-overview', container);
         this.tokens = $('object.token_qr', this.tokens_elem);
-        this.tokens_title = $('#tokens-overview-title', container);
+        this.filter_options = $('#tokens-filter-options', container);
+        this.create_options = $('#tokens-create-options', container);
         this.token_settings = this.container.data('token-settings');
 
         // add tokens
-        this.add_tokens_container = $('.add-tokens', this.tokens_title);
+        this.add_tokens_container = $('.add-tokens', this.create_options);
         this.add_tokens_input = $(
             'input[name="amount"]',
             this.add_tokens_container
@@ -30,18 +31,18 @@ export class TokensOverview {
         this.add_tokens_btn.on('click', this.add_tokens);
 
         // date filter
-        this.start = $('input[name="start"]', this.tokens_title)
+        this.start = $('input[name="start"]', this.filter_options)
             .addClass('datepicker')
             .data('date-locale', 'de');
-        this.end = $('input[name="end"]', this.tokens_title)
+        this.end = $('input[name="end"]', this.filter_options)
             .addClass('datepicker')
             .data('date-locale', 'de');
-        this.filter = $('button[name="filter"]', this.tokens_title);
+        this.filter = $('button[name="filter"]', this.filter_options);
         this.filter_tokens = this.filter_tokens.bind(this);
         this.filter.on('click', this.filter_tokens);
 
         // delete tokens
-        this.delete_tokens_container = $('.delete-tokens', this.tokens_title);
+        this.delete_tokens_container = $('.delete-tokens', this.create_options);
         this.delete_tokens_btn = $(
             'button[name="delete-tokens"]',
             this.delete_tokens_container
@@ -50,7 +51,7 @@ export class TokensOverview {
         this.delete_tokens_btn.on('click', this.delete_tokens);
 
         this.set_token_size = this.set_token_size.bind(this);
-        this.size_input = $('input[name="token-size"]', this.tokens_title);
+        this.size_input = $('input[name="token-size"]', this.filter_options);
         this.size_input.on('change', this.set_token_size);
         if (this.tokens.length) {
             this.original_size = parseInt($(this.tokens[0]).attr('width'));
@@ -222,13 +223,13 @@ export class TokenScanner {
             let input = this._input = $('<input type="text">');
             wrapper.append(input);
             this.elem.append(wrapper);
-            button.removeClass('inactive').addClass('active');
+            button.removeClass('inactive btn-danger').addClass('active btn-success');
             input[0].focus();
         } else {
             this._input_wrapper.remove();
             this._input_wrapper = null;
             this._input = null;
-            button.removeClass('active').addClass('inactive');
+            button.removeClass('active btn-success').addClass('inactive btn-danger');
         }
     }
 

js/tests/test_tokens.js

@@ -17,35 +17,41 @@ import ts from 'treibstoff';
 
 QUnit.module('TokensOverview', hooks => {
     let elem,
-        tokens_title,
+        tokens_filter,
         tokens_elem,
         add_tokens_input,
+        token_size_input,
         start_input,
         end_input;
     hooks.beforeEach(() => {
         elem = $('<div />')
             .addClass('tokens-overview-container')
             .appendTo('body');
-        tokens_title = $('<div id="tokens-overview-title" />')
-            .appendTo(elem);
         tokens_elem = $('<div id="tokens-overview" />')
             .appendTo(elem);
-        let token_size_input = $('<input name="token-size" />')
-            .appendTo(tokens_title);
+        // filter
+        tokens_filter = $('<div id="tokens-filter-options" />')
+            .appendTo(elem);
+        token_size_input = $('<input name="token-size" />')
+            .appendTo(tokens_filter);
+        start_input = $('<input name="start" />')
+            .appendTo(tokens_filter);
+        end_input = $('<input name="end" />')
+            .appendTo(tokens_filter);
+        // add tokens
+        let add_tokens = $('<div id="tokens-create-options" />')
+            .appendTo(elem);
         let add_tokens_container = $('<div class="add-tokens" />')
-            .appendTo(tokens_title);
+            .appendTo(add_tokens);
         add_tokens_input = $('<input name="amount" />')
             .appendTo(add_tokens_container);
-        start_input = $('<input name="start" />')
-            .appendTo(tokens_title);
-        end_input = $('<input name="end" />')
-            .appendTo(tokens_title);
+
     });
     hooks.afterEach(() => {
         elem.empty().remove();
         elem = null;
         tokens_elem = null;
-        tokens_title = null;
+        tokens_filter = null;
     });
 
     QUnit.test('constructor no tokens', assert => {
@@ -120,6 +126,7 @@ QUnit.module('TokensOverview', hooks => {
 
         // reset ts ajax
         ts.ajax.action = original_ts_action;
+        assert.ok(true)
     });
 
     QUnit.test('add_tokens', assert => {
@@ -331,8 +338,8 @@ QUnit.module('TokenScanner', hooks => {
         assert.verifySteps(['query_token token-1']);
     });
 
-    let force_success = false;
     QUnit.test('query_token', assert => {
+        let force_success = false;
         let force_data_success = false;
         let data_token = false;
 

pyproject.toml

@@ -4,7 +4,7 @@ build-backend = "hatchling.build"
 
 [project]
 name = "cone.tokens"
-version = "1.1.0.dev0"
+version = "2.0.0.dev0"
 description = "cone token api"
 dynamic = ["readme"]
 requires-python = ">=3.10"
@@ -22,7 +22,7 @@ classifiers = [
     "Topic :: Internet :: WWW/HTTP :: Dynamic Content",
 ]
 dependencies = [
-    "cone.app>1.0.99,<2.0.0",
+    "cone.app>1.99",
     "cone.sql>1.0.99",
     "python-dateutil",
     "qrcode[pil]",

scss/styles.scss

@@ -1,69 +1,22 @@
 @media screen {
-    div.token-overview {
-        display: flex;
-        flex-wrap: wrap;
-
-        div.panel.token {
-            flex: 1;
-            min-width: fit-content;
-            border-right: 0;
-            box-shadow: 1px 0px 0px #e5e5e5;
-
-            li.flex-group {
-                display: flex;
-                justify-content: space-between;
-                flex-wrap: wrap;
-            }
-            .token-active {
-                pointer-events: none;
-            }
-        }
-
-        div.QR {
-            display: flex;
-            flex-direction: column;
-            align-items: center;
-            padding: 2px;
-
-            .stream_image {
-                margin:auto;
-            }
-        }
-    }
-    .token-title {
-        border-radius: 4px 4px 0 0;
-    }
-
-    // Tokens Overview
+    // // Tokens Overview
     .tokens-overview-container {
-        #tokens-overview {
-            display: grid;
+        .form-inline {
+            flex: 1 1 20%;
+            flex-wrap: nowrap;
+            white-space: nowrap;
         }
-        #tokens-overview-title {
-            display: flex;
-            align-items: baseline;
-            justify-content: space-between;
-            flex-wrap: wrap;
-            gap: 10px;
 
-            .token-size .token-button {
-                color: #000;
-                margin: 0 10px;
-            }
+        .btn {
+            white-space: nowrap;
 
-            button.datepicker-trigger {
-                transform: translateX(-100%);
+            &.filter {
+                min-width: 100px;
             }
+        }
 
-            input.add-tokens-amount {
-                width: 70px;
-            }
-            input.token-button {
-                width: 70px;
-            }
-            > div > * {
-                display: inline-block;
-            }
+        input {
+            min-width: 100px!important;
         }
     }
 
@@ -74,12 +27,6 @@
             height: 200px;
             font-size: 500%;
         }
-        .scan-token.inactive {
-            background-color: #dd0000;
-        }
-        .scan-token.active {
-            background-color: #00dd00;
-        }
     }
 }
 

src/cone/tokens/browser/__init__.py

@@ -10,7 +10,7 @@
 )
 cone_tokens_resources.add(wr.ScriptResource(
     name='cone-tokens-js',
-    depends='cone-app-protected-js',
+    depends='cone-app-js',
     resource='cone.tokens.js',
     compressed='cone.tokens.min.js'
 ))

src/cone/tokens/browser/settings.py

@@ -14,7 +14,7 @@
 import json
 
 
-_ = TranslationStringFactory('cone.ugm')
+_ = TranslationStringFactory('cone.tokens')
 
 
 @settings_form(TokenSettings)
@@ -60,7 +60,9 @@ def prepare(self):
         form['morning'] = factory(
             '#field:error:*morning:compound',
             props={
-                'label': _('morning', default='Morning')
+                'label': _('morning', default='Morning'),
+                'label.class_add': 'col-12 fw-bold',
+                'class_add': 'd-flex flex-wrap'
             },
             custom = {
                 'morning': {
@@ -77,7 +79,8 @@ def prepare(self):
                 'label': _('start', default='Start'),
                 'timepicker': True,
                 'time': True,
-                'persist': True
+                'persist': True,
+                'class_add': 'col-6 pe-3'
             })
         form['morning']['end'] = factory(
             '#field:time',
@@ -87,12 +90,15 @@ def prepare(self):
                 'label': _('end', default='End'),
                 'timepicker': True,
                 'time': True,
-                'persist': True
+                'persist': True,
+                'class_add': 'col-6'
             })
         form['afternoon'] = factory(
             '#field:error:*afternoon:compound',
             props={
-                'label': _('afternoon', default='Afternoon')
+                'label': _('afternoon', default='Afternoon'),
+                'label.class_add': 'col-12 fw-bold',
+                'class_add': 'd-flex flex-wrap'
             },
             custom = {
                 'afternoon': {
@@ -107,7 +113,8 @@ def prepare(self):
                 'label': _('start', default='Start'),
                 'timepicker': True,
                 'time': True,
-                'persist': True
+                'persist': True,
+                'class_add': 'col-6 pe-3'
             })
         form['afternoon']['end'] = factory(
             '#field:time',
@@ -117,12 +124,15 @@ def prepare(self):
                 'label': _('end', default='End'),
                 'timepicker': True,
                 'time': True,
-                'persist': True
+                'persist': True,
+                'class_add': 'col-6'
             })
         form['today'] = factory(
             '#field:error:*today:compound',
             props={
-                'label': _('today', default='Today')
+                'label': _('today', default='Today'),
+                'label.class_add': 'col-12 fw-bold',
+                'class_add': 'd-flex flex-wrap'
             },
             custom = {
                 'today': {
@@ -137,7 +147,8 @@ def prepare(self):
                 'label': _('start', default='Start'),
                 'timepicker': True,
                 'time': True,
-                'persist': True
+                'persist': True,
+                'class_add': 'col-6 pe-3'
             })
         form['today']['end'] = factory(
             '#field:time',
@@ -147,7 +158,8 @@ def prepare(self):
                 'label': _('end', default='End'),
                 'timepicker': True,
                 'time': True,
-                'persist': True
+                'persist': True,
+                'class_add': 'col-6'
             })
         form['default_locktime'] = factory(
             '#field:number',
@@ -159,7 +171,8 @@ def prepare(self):
                     'default_locktime_required',
                     default='Default Locktime is required.'
                 ),
-                'label': _('default_locktime', default='Default Locktime')
+                'label': _('default_locktime', default='Default Locktime'),
+                'label.class_add': 'fw-bold'
             })
         form['default_usage_count'] = factory(
             '#field:number',
@@ -171,7 +184,8 @@ def prepare(self):
                     'default_usage_count_required',
                     default='Default number of uses required.'
                 ),
-                'label': _('default_usage_count', default='Default Uses')
+                'label': _('default_usage_count', default='Default Uses'),
+                'label.class_add': 'fw-bold'
             })
         form['save'] = factory(
             'submit',
@@ -180,7 +194,8 @@ def prepare(self):
                 'expression': True,
                 'handler': self.save,
                 'next': self.next,
-                'label': 'Save'
+                'label': _('save', default='Save'),
+                'submit.class_add': 'my-3'
             })
 
     def save(self, widget, data):