render scheduler profile inputs

htdocs/css/admin.css

@@ -106,4 +106,18 @@ table.bookmarks .frequency {
 
 .option-add-button, .option-remove-button {
     width: 70px;
+}
+
+.scheduler-static-time-inputs  {
+    display: flex;
+    flex-direction: row;
+}
+
+.scheduler-static-time-inputs > * {
+    flex: 0 0 auto;
+    width: unset;
+}
+
+.scheduler-static-time-inputs > select {
+    flex: 1 0 auto;
 }

owrx/form/device.py

@@ -176,18 +176,19 @@ class SchedulerInput(Input):
         return super().render(config)
 
     def render_input(self, value):
-        def render_profiles_select(stage):
+        def render_profiles_select(config_key, stage, extra_classes=""):
             stage_value = ""
-            if value and "schedule" in value and stage in value["schedule"]:
+            if value and "schedule" in value and config_key in value["schedule"]:
-                stage_value = value["schedule"][stage]
+                stage_value = value["schedule"][config_key]
 
             return """
-                <select class="col-9 {classes}" id="{id}" name="{id}" {disabled}>
+                <select class="{extra_classes} {classes}" id="{id}" name="{id}" {disabled}>
                     {options}
                 </select> 
             """.format(
                 id="{}-{}".format(self.id, stage),
                 classes=self.input_classes(),
+                extra_classes=extra_classes,
                 disabled="disabled" if self.disabled else "",
                 options="".join(
                     """
@@ -201,6 +202,20 @@ class SchedulerInput(Input):
                 ),
             )
 
+        def render_time_inputs(v):
+            values = ["{}:{}".format(v[0:2], v[2:4]) for x in [v[0:4], v[5:9]]]
+            return '<div class="p-1">-</div>'.join(
+                """
+                    <input type="time" class="{classes}" id="{id}" name="{id}" {disabled} value="{value}">
+                """.format(
+                    id="{}-{}-{}".format(self.id, "time", "start" if i == 0 else "end"),
+                    classes=self.input_classes(),
+                    disabled="disabled" if self.disabled else "",
+                    value=v,
+                )
+                for i, v in enumerate(values)
+            )
+
         return """
             <div id="{id}">
                 <select class="{classes} mode" id="{id}-select" name="{id}-select" {disabled}>
@@ -220,13 +235,13 @@ class SchedulerInput(Input):
             options=self.render_options(value),
             entries="".join(
                 """
-                    <div class="row">
+                    <div class="row scheduler-static-time-inputs">
-                        <label class="col-form-label col-form-label-sm col-3">{slot}</label>
+                        {time_inputs}
                         {select}
                     </div>
                 """.format(
-                    slot=slot,
+                    time_inputs=render_time_inputs(slot),
-                    select=render_profiles_select(slot),
+                    select=render_profiles_select(slot, "profile"),
                 )
                 for slot, entry in value["schedule"].items()
             ),
@@ -238,7 +253,7 @@ class SchedulerInput(Input):
                     </div>
                 """.format(
                     name=name,
-                    select=render_profiles_select(stage),
+                    select=render_profiles_select(stage, stage, extra_classes="col-9"),
                 )
                 for stage, name in [("day", "Day"), ("night", "Night"), ("greyline", "Greyline")]
             ),