🚑 fix bug with duplicating example dropdown after saving changes

Author: nguyenank

js/details/modal/dropdown-page.js

@@ -6,7 +6,6 @@ import {
 } from "../details-functions.js";
 import { createTextField, createDropdown } from "../widgets/widgets-base.js";
 import { createMainPage } from "./main-page.js";
-import { select2Dropdown } from "../widgets/widgets-special.js";
 
 function createDropdownPage(id, data) {
     d3.select(id)

js/details/modal/main-page.js

@@ -13,6 +13,7 @@ import { createTextFieldPage } from "./text-field-page.js";
 import { createRadioButtonsPage } from "./radio-buttons-page.js";
 import { createDropdownPage } from "./dropdown-page.js";
 import { createTimeWidgetPage } from "./time-widget-page.js";
+import { createWidgetTypePage } from "./widget-type-page.js";
 
 function createMainPage(id) {
     d3.select(id)
@@ -275,6 +276,7 @@ function saveChanges(e) {
     var visibleDetails = titles.map(x =>
         _.find(getDetails(), { title: x.title })
     );
+    createWidgetTypePage();
     createDetailsPanel(visibleDetails);
     shotTypeLegend();
     teamLegend();

js/details/modal/widget-type-page.js

@@ -1,6 +1,9 @@
 import { changePage } from "../details-functions.js";
 import { createTimeWidget } from "../widgets/widgets-base.js";
 function createWidgetTypePage(id = "#widget-type-page") {
+    d3.select(id)
+        .selectAll("*")
+        .remove();
     var mb = d3
         .select(id)
         .append("div")

js/details/widgets/widgets-special.js

@@ -83,12 +83,6 @@ function teamRadioButtons(id, data) {
 function select2Dropdown() {
     $(".select2").select2({});
 
-    $("#example-select").select2({
-        dropdownParent: $(".cards"),
-        width: "100%",
-        dropdownCssClass: "small-text",
-    });
-
     $("#sample-dropdown-select").select2({
         dropdownParent: $("#sample-dropdown"),
         width: "100%",
@@ -109,6 +103,11 @@ function select2Dropdown() {
                 .find("option")
                 .removeAttr("data-select2-tag");
         });
+    $("#example-select").select2({
+        dropdownParent: $(".cards"),
+        width: "100%",
+        dropdownCssClass: "small-text",
+    });
 }
 
 export { createTooltip, teamRadioButtons, select2Dropdown };