feat: add dropdown in more-options

Author: devvaannsh

src/extensionsIntegrated/TabBar/main.js

@@ -1,3 +1,4 @@
+/* eslint-disable no-invalid-this */
 define(function (require, exports, module) {
     const AppInit = require("utils/AppInit");
     const MainViewManager = require("view/MainViewManager");
@@ -11,6 +12,7 @@ define(function (require, exports, module) {
 
     const Helper = require("./helper");
     const Preference = require("./preference");
+    const MoreOptions = require("./more-options");
     const TabBarHTML = require("text!./html/tabbar-pane.html");
     const TabBarHTML2 = require("text!./html/tabbar-second-pane.html");
 
@@ -306,7 +308,7 @@ define(function (require, exports, module) {
 
 
     /**
-     * handle click events on the tabs to open the file or close the tab
+     * handle click events on the tabs to open the file
      */
     function handleTabClick() {
 
@@ -402,5 +404,7 @@ define(function (require, exports, module) {
 
         // handle when a single tab gets clicked
         handleTabClick();
+
+        MoreOptions.handleMoreOptionsClick();
     });
 });

src/extensionsIntegrated/TabBar/more-options.js

@@ -0,0 +1,36 @@
+define(function (require, exports, module) {
+    const DropdownButton = brackets.getModule("widgets/DropdownButton");
+
+    function showMoreOptionsContextMenu(x, y) {
+        const items = [
+            "close all tabs",
+            "close unmodified tabs"
+        ];
+
+        const dropdown = new DropdownButton.DropdownButton("", items);
+
+        $(".tab-bar-more-options").append(dropdown.$button);
+        dropdown.showDropdown();
+
+        dropdown.$button.on(DropdownButton.EVENT_SELECTED, function (e, item, index) {
+            console.log("Selected item:", item);
+            // TODO: Add the logic here
+            // check for index and then call the items
+        });
+
+        $(document).one("click", function () {
+            dropdown.closeDropdown();
+        });
+    }
+
+    function handleMoreOptionsClick() {
+        $(document).on("click", ".tab-bar-more-options", function (event) {
+            event.stopPropagation();
+            showMoreOptionsContextMenu(event.pageX, event.pageY);
+        });
+    }
+
+    module.exports = {
+        handleMoreOptionsClick
+    };
+});