Try to fix the dropdown

chaosdorf · Aug 13, 2024 · 5f6438a · 5f6438a
1 parent 03e2e4d
commit 5f6438a
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 7 deletions.
diff --git a/src/static/talks.js b/src/static/talks.js
@@ -1,5 +1,8 @@
 "use strict";
 
+var BDropdown = window["bootstrap-vue-next"].Components.BDropdown;
+var BDropdownItem = window["bootstrap-vue-next"].Components.BDropdownItem;
+
 var talksApp = Vue.createApp({
     data() {
         return {
@@ -38,6 +41,7 @@ var talksApp = Vue.createApp({
             }
         }
     },
+    components: {BDropdown, BDropdownItem},
     methods: {
         handleNetworkError: function(error) {
             this.errors.add("network");

diff --git a/src/templates/base.html.j2 b/src/templates/base.html.j2
@@ -17,6 +17,7 @@
         </script>
         {% endif %}
         <script type="text/javascript" src="{{ url_for('static', filename='vue.min.js') }}"></script>
+        <script type="text/javascript" src="{{ url_for('static', filename='bootstrap-vue.js') }}"></script>
         <svg xmlns="http://www.w3.org/2000/svg" style="display: none;">
             <symbol id="check-circle-fill" fill="currentColor" viewBox="0 0 16 16">
                 <path
@@ -53,7 +54,6 @@
                 <span class="text-muted">freitagsfoo-web <a href="https://github.com/chaosdorf/freitagsfoo-web/tree/{{ REVISION }}" rel="noopener noreferrer" target="_blank">{{ REVISION }}</a></span>
             </div>
         </footer>
-        <script type="text/javascript" src="{{ url_for('static', filename='bootstrap-vue.js') }}"></script>
         <script type="text/javascript" src="{{ url_for('static', filename='vue-sse.min.js') }}"></script>
         <script type="text/javascript" src="{{ url_for('static', filename='main.js') }}"></script>
     </body>

diff --git a/src/templates/macros_talks.html.j2 b/src/templates/macros_talks.html.j2
@@ -47,14 +47,14 @@
                 </td>
                 <td v-if="is_host">
                     <div>
-                        <b-dropdown text="Switch to" class="m-md-2" variant="success" v-if="state.talks.current.index == null">
-                            <b-dropdown-item-button v-for="(input, input_index) in state.extron.available_inputs" v-bind:active="input.active" v-bind:key="index + input" v-on:click="doBeginTalk(index, input_index + 1)" v-bind:disabled="running.has('beginTalk')">
+                        <BDropdown text="Switch to" class="m-md-2" variant="success" v-if="state.talks.current.index == null">
+                            <BDropdownItem v-for="(input, input_index) in state.extron.available_inputs" v-bind:active="input.active" v-bind:key="index + input" v-on:click="doBeginTalk(index, input_index + 1)" v-bind:disabled="running.has('beginTalk')">
                                 {{ input.name }}
-                            </b-dropdown-item-button>
-                            <b-dropdown-item-button v-bind:key="index + 'no_input'" v-on:click="doBeginTalk(index, null)" v-bind:disabled="running.has('beginTalk')">
+                            </BDropdownItem>
+                            <BDropdownItem v-bind:key="index + 'no_input'" v-on:click="doBeginTalk(index, null)" v-bind:disabled="running.has('beginTalk')">
                                 (no input)
-                            </b-dropdown-item-button>
-                        </b-dropdown>
+                            </BDropdownItem>
+                        </BDropdown>
                         <button type="button" class="btn btn-danger btn-block" v-on:click="doEndTalk(index)" v-bind:disabled="running.has('endTalk')" v-if="index == state.talks.current.index">
                             End ({{ Math.trunc(talkRunningForMinutes) }} minutes)
                         </button>