// ==UserScript==
// @name           MultiRowTabLiteforFx.uc.js
// @namespace      Based on Alice0775's zzzz-MultiRowTab_LiteforFx48.uc.js
// @description    Multi-Row tabs experimental version with embedded CSS, Lite version
// @include        main
// @compatibility  Firefox138+
// @version        2025/04/07 12:00
// ==/UserScript==
"use strict";
MultiRowTabLiteforFx();
function MultiRowTabLiteforFx() {
if (!window.gBrowser) { return; }
   // -- Config --
   // If you write similar CSS, “userChrome.css” will take priority
   const                                                // Multi-Row tab, On/Off Number of tabs in tab bar
   MultiRowTab_OnOff_and_TabBar_Rows =         -1       ,// [-1]  = Multi-Row tab, On Unlimited number of columns
                                                        //  0    = Multi-Row tab Off
                                                        //  1    = Multi-Row tab On Normally, one tier is used and the second and subsequent tiers are displayed up to the specified number of tiers when the tab bar is moused over. *Specify the number of rows with “TabBar_Rows_on_MouseOver”.
                                                        //  2～  = Multi-Row tab On Specify the number of columns
   TabBar_Rows_on_MouseOver =                  3       ,// Specify the number of tiers you want to display when you mouse over the tab bar, usually one tier. Prerequisite: “MultiRowTab_OnOff_and_TabBar_Rows” is set to “1”.
   TabBar_DisplayTime_on_MouseOver =           1       ,// You can set the display time (in seconds) when the second and subsequent rows are displayed on mouse-over. The display will return to the first Row after displaying the set number of seconds.
                                                        // Tab bar position
   TabBar_Position =                           0       ,// [0] = Above Toolbar Default
                                                        //  1  = Under the toolbar
                                                        //  2  = Under Site Content
                                                        // For people who want to swap the position of the tab bar and bookmark toolbar after setting the tab bar position below the toolbar.
                                                        // Prerequisite: “TabBar_Position” is set to “1”.
   Bookmark_Toolbar_Position =                 true    ,// [true] = Menu bar, navigation bar, bookmark bar, tab bar
                                                        //  false = Menu bar, navigation bar, tab bar, bookmark bar
                                                        // Tab Height UI Density
   UI_Density_Compact =                        29       ,// Default 29px, Compact
   UI_Density_Normal =                         36       ,// Default 36px, Normal (set here your own Tab Height)
   UI_Density_Touch =                          41       ,// Default 41px, Touch
                                                        // Tab Width
   Tab_Min_Width =                             212       ,// Default 76px, Min.
   Tab_Max_Width =                             212       ,// Default 225px, Max.
                                                        // If both values are the same, the width will be fixed.
                                                        // Close Tab button
   Tab_Close_Button =                          0       ,// [0] = Default
                                                        //  1  = Hidden
                                                        //  2  = Show in all tabs
                                                        //  3  = Display tabs with mouse over
                                                        //  4  = Active tabs are always visible, inactive tabs are shown on mouse-over *Default for vertical tab mode.
                                                        // Tab Appearance ProtonUI
   Proton_Margins =                            true    ,// [true] = ProtonUI Default
                                                        //  false = Make it look like it did when “browser.proton.enabled” was set to “false” in the Firefox 90 or earlier settings.
                                                        // The space around the tabs is set to 0 and the UI density height is set to 0, so the tabs are 4px wider horizontally and 8px lower in height than the default.
                                                        // Borders next to tabs
   Tab_Separators  =                           false    ,// [false] = Do not show
                                                        //  true   = Show
                                                        // The CSS of the border that could be displayed when “browser.proton.enabled” was set to “false” in Firefox 90 or earlier is extracted and adjusted.
                                                        // Hide the title bar button [－□×] and use the wider width of the tab bar for it.
                                                        // Prerequisite: “TabBar_Position” is set to “0”.
   TitleBar_Button_Autohide =                  false    ,// [false] = Not used
                                                        //  true   = Use Normally, the outer frame of the title bar button [－□×] is made small and transparent; if you want to display it, return the trigger area (36px x 6px) in the upper right corner of the tab bar to its original size with a mouseover to remove transparency.
   TitleBar_Button_DisplayTime =               0.6       ,// You can set the display time (in seconds) after the transparency is released by returning it to its original size on mouse over. The image will be displayed for the set number of seconds before it is hidden.
                                                        // Set the tab bar to the height of the specified number of columns from the beginning.
                                                        // Prerequisite: “MultiRowTab_OnOff_and_TabBar_Rows” is set to “2” or higher.
   Set_the_TabBar_to_the_Specified_Height =    false    ,// [false] = Not used
                                                        //  true   = Use  The tab bar is set to the height of the specified number of columns from the beginning, and tabs are lined up as usual, starting from the upper left corner.
                                                        // Replacement of “.tabDropIndicator” that displays tabs during drag & drop movement
                                                        // Prerequisite: Set “MultiRowTab_OnOff_and_TabBar_Rows” to something other than “0”.
   Tab_Drop_Indicator =                        false    ,// [false] = No Pin icon Default
                                                        //  true   = Red line icon(2px×29px)
                                                        // Pinning tab position
                                                        // Prerequisite: Set “MultiRowTab_OnOff_and_TabBar_Rows” to something other than “0”.
   Separate_Tabs_and_PinnedTabs =              false    ,// [false] = Default
                                                        //  true   = Move pinned tabs to a line that can be separated from and above the row of tabs.
                                                        // Adjust width of pinned tabs
                                                        // Prerequisite: Set “Separate_Tabs_and_PinnedTabs” to “true”.
   PinnedTab_Width =                           false    ,// [false] = Not default
                                                        //  true   = The width of the pinned tabs can be adjusted to match the width of the tabs.
   PinnedTab_Min_Width =                       76       ,// Default 76px Min.
   PinnedTab_Max_Width =                       225       ,// Default 225px Max.
                                                        // If both values are the same, the width will be fixed.
                                                        // Pinned tabs Close tab button
                                                        // Prerequisite: Set “Separate_Tabs_and_PinnedTabs” to “true”.
   PinnedTab_Close_Button =                    0       ,// [0] = Default
                                                        //  1  = Show in all tabs
                                                        //  2  = Show tabs on mouse over
                                                        //  3  = Active tabs are always visible, inactive tabs are shown on mouse-over *Vertical tab mode is the default.
                                                        // Drag area on tab bar
   Left_Drag_Area =                            0       ,// Default 40px left drag area
   Right_Drag_Area =                           0       ,// Default 40px right drag area
   Maximize_Left_Drag_Area =                   false    ,// [false] = Default
                                                        //  true   = When the window is maximized, the left drag area, which is hidden, can be displayed.
   Fullscreen_Drag_Area =                      false    ,// [false] = Default
                                                        //  true   = The left and right drag areas that are hidden when in full-screen mode can be displayed.
                                                        // When the title bar is displayed, “.titlebar-spacer” does not function as a drag area.
   // -- Config End --

    css = `

    #TabsToolbar:not([collapsed="true"]) {

      :root[uidensity="compact"] & {
        --tab-min-height: ${UI_Density_Compact}px;
      }
      :root:not([uidensity]) & {
        --tab-min-height: ${UI_Density_Normal}px;
      }
      :root[uidensity="touch"] & {
        --tab-min-height: ${UI_Density_Touch}px;
      }

      #tabbrowser-tabs {
        min-height: calc(var(--tab-min-height) + ${Proton_Margins ? 8 : 0}px);

        ${MultiRowTab_OnOff_and_TabBar_Rows != 0 ? `
          &[overflow] {
            padding-inline: 0 !important;
            & > #tabbrowser-arrowscrollbox {
              & > .tabbrowser-tab[pinned] {
                display: flex;
                margin-inline-start: 0 !important;
                position: static !important;
              }
              &::part(scrollbox) {
                padding-inline: 0;
              }
            }
            & + #new-tab-button {
              display: none;
            }
          }

          ${Tab_Drop_Indicator ? `
            & > .tab-drop-indicator {
              background: url(
                data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAAdCAIAAAAPVCo9AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAASSURBVBhXY3growJEQ5+SUQEAOb1EM8kwskcAAAAASUVORK5CYII=
              ) no-repeat center;
            }
          ` : ``}

          #tabbrowser-arrowscrollbox {
            &::part(scrollbox) {
              & > slot {
                flex-wrap: wrap;
              }

              ${MultiRowTab_OnOff_and_TabBar_Rows != -1 ? `
                ${MultiRowTab_OnOff_and_TabBar_Rows == 1 ? `
                  ${TabBar_Rows_on_MouseOver == 0 || TabBar_Rows_on_MouseOver == 1 ? `
                    max-height: calc((var(--tab-min-height) + ${Proton_Margins ? 8 : 0}px) * 2);
                  ` : `
                    max-height: calc((var(--tab-min-height) + ${Proton_Margins ? 8 : 0}px) * ${TabBar_Rows_on_MouseOver});
                  `}
                  &:not(:hover) {
                    max-height: calc(var(--tab-min-height) + ${Proton_Margins ? 8 : 0}px) !important;
                    ${Proton_Margins ? `scrollbar-width: none;` : ``}
                    transition: all 0s ease-in-out ${TabBar_DisplayTime_on_MouseOver}s;
                  }
                ` : `
                  ${Set_the_TabBar_to_the_Specified_Height ? `
                    min-height: calc((var(--tab-min-height) + ${Proton_Margins ? 8 : 0}px) * ${MultiRowTab_OnOff_and_TabBar_Rows});
                    & > slot {
                      max-height: calc(var(--tab-min-height) + ${Proton_Margins ? 8 : 0}px);
                    }
                  ` : `
                    max-height: calc((var(--tab-min-height) + ${Proton_Margins ? 8 : 0}px) * ${MultiRowTab_OnOff_and_TabBar_Rows});
                  `}
                `}

                overflow: hidden auto;
                & scrollbar {
                  -moz-window-dragging: no-drag;
                }
              ` : ``}

            }
            &::part(overflow-start-indicator),
            &::part(overflow-end-indicator),
            &::part(scrollbutton-up),
            &::part(scrollbutton-down) {
              display: none;
            }

            ${Separate_Tabs_and_PinnedTabs ? `
              &:has(> .tabbrowser-tab[fadein][pinned]) {
                &::part(scrollbox) {
                  & > slot::after {
                    display: flow-root list-item;
                    content: "";
                    flex-basis: -moz-available;
                    height: 0;
                    overflow: hidden;
                  }
                }
              }
              .tabbrowser-tab[fadein] {
                &:not([pinned]) {
                  #tabbrowser-tabs[haspinnedtabs] & {
                    &, & + :not(#tabs-newtab-button) {
                      order: 1;
                    }
                  }
                }
                &[pinned] {
                  .tab-background:after {
                    content: "📌";
                    font-size: 11px;
                    right: -2px;
                    position: absolute;
                    top: -2px;
                  }

                  ${PinnedTab_Width ? `
                    flex: 100 100;
                    max-width: ${PinnedTab_Max_Width}px;
                    min-width: ${PinnedTab_Min_Width}px;
                    .tab-throbber, .tab-icon-pending, .tab-icon-image, .tab-sharing-icon-overlay, .tab-icon-overlay {
                      margin-inline-end: 5.5px !important;
                    }

                    ${PinnedTab_Close_Button == 1 ? `
                      .tab-close-button {
                        display: flex;
                      }
                    ` : PinnedTab_Close_Button == 2 ? `
                      .tab-close-button {
                        display: none;
                      }
                      &:hover .tab-close-button {
                        display: flex;
                      }
                    ` : PinnedTab_Close_Button == 3 ? `
                      &:not([selected]):hover,
                      &[selected] {
                        .tab-close-button {
                          display: flex;
                        }
                      }
                    ` : ``}

                  ` : ``}

                }
              }
            ` : ``}

            #tabbrowser-tabs[haspinnedtabs]:not([positionpinnedtabs]):not([orient="vertical"]) > & {
              &  > .tabbrowser-tab:nth-child(1 of :not([pinned], [hidden])) {
                margin-inline-start: 0 !important;
              }
            }

          }
        ` : ``}
      }

      .tabbrowser-tab[fadein]:not([pinned]) {
        max-width: ${Tab_Max_Width}px;
        min-width: ${Tab_Min_Width}px;

        ${Tab_Close_Button == 1 ? `
          .tab-close-button {
            display: none;
          }
        ` : Tab_Close_Button == 2 ? `
          .tab-close-button {
            display: flex;
          }
        ` : Tab_Close_Button == 3 ? `
          .tab-close-button {
            display: none;
          }
          &:hover .tab-close-button {
            display: flex;
          }
        ` : Tab_Close_Button == 4 ? `
          &:not([selected]):hover {
            .tab-close-button {
              display: flex;
            }
          }
        ` : ``}

      }

      ${Tab_Separators ? `
        .titlebar-spacer[type="pre-tabs"] {
          border-inline-end: 1px solid color-mix(in srgb, currentColor 20%, transparent);
        }
        .tabbrowser-tab {
          &::after,
          &::before {
            border-left: 1px solid color-mix(in srgb, currentColor 50%, transparent);
            height: calc(var(--tab-min-height) - 15%);
            margin-block: auto;
          }
          &:hover::after,
          &[multiselected]::after,
          #tabbrowser-tabs:not([movingtab]) &:has(+ .tabbrowser-tab:hover)::after,
          #tabbrowser-tabs:not([movingtab]) &:has(+ [multiselected])::after {
            height: 100%;
          }
          &::after,
          #tabbrowser-tabs[movingtab] &[visuallyselected]::before {
            display: flex;
            content: "";
          }
        }
      ` : ``}

      ${Proton_Margins ? `` : `
        .tabbrowser-tab,
        .toolbarbutton-1 {
          padding: 0;
        }
        .tabbrowser-tab,
        #tabs-newtab-button {
          height: var(--tab-min-height);
        }
        .tabbrowser-tab {
          .tab-background {
            box-shadow: none;
            margin-block: 0;
          }
          .tab-label-container {
            height: var(--tab-min-height);
            max-height: 24px;
          }
          .tab-close-button {
            height: 20px !important;
            padding-block: 3px !important;
          }
          &[usercontextid] > .tab-stack > .tab-background > .tab-context-line {
            margin-block-start: 1px !important;
          }
        }
      `}

    ${TabBar_Position == 0 ? `
      .titlebar-buttonbox-container {
        height: calc(var(--tab-min-height) + ${Proton_Margins ? 8 : 0}px);
      }

      ${TitleBar_Button_Autohide ? `
        & > .titlebar-buttonbox-container {
          background-color: color-mix(in srgb, currentColor 20%, transparent);
          position: fixed;
          right: 0;
          &:not(:hover) {
            height: 6px;
            .titlebar-button {
              padding: 0;
            }
            &,& .titlebar-button {
              opacity: 0;
              transition: all 0s ease-in-out ${TitleBar_Button_DisplayTime}s;
            }
          }
        }
      ` : ``}

    }` : `

      ${TabBar_Position == 1 || TabBar_Position == 2 ? `
        & > .titlebar-buttonbox-container {
            display: none;
        }}
        #nav-bar {
          &:not(.browser-titlebar) {
            :root[customtitlebar] #toolbar-menubar[autohide="true"] ~ &,
            :root[inFullscreen] #toolbar-menubar ~ & {
              & > .titlebar-buttonbox-container {
                display: flex;
              }
            }
          }
          .titlebar-button {
            padding-block: 0;
          }
        }
      ` : ``}

      body:has(> #navigator-toolbox:not([tabs-hidden])) {
        ${TabBar_Position == 1 ? `
          script, toolbar:not(#TabsToolbar ${Bookmark_Toolbar_Position ? `` : `, #PersonalToolbar`}) {
            order: -1;
          }
        ` : TabBar_Position == 2 ? `
          & > #fullscr-toggler[hidden] + tabbox,
          :root[inFullscreen] & > tabbox:hover {
            border-top: 0.01px solid var(--chrome-content-separator-color);
          }
          & > tabbox > #navigator-toolbox {
            border-block: none !important;
          }
          :root[inFullscreen] & {
            & > #navigator-toolbox {
              transition: none;
              &:has(~ tabbox:hover) {
                margin-top: 0 !important;
              }
              &:hover ~ tabbox > #navigator-toolbox {
                display: flex;
              }
            }
            & > tabbox:not(:hover) {
              border-top: 0.01px solid transparent;
              & > #navigator-toolbox {
                display: none;
              }
            }
          }
        ` : ``}
      }

    `}

    toolbar[id$="bar"].browser-titlebar {
      .titlebar-spacer {
        &[type="pre-tabs"] {
          width: ${Left_Drag_Area}px;
        }
        &[type="post-tabs"] {
          width: ${Right_Drag_Area}px;
        }
        ${Maximize_Left_Drag_Area ? `
          :root[customtitlebar]:not([sizemode="normal"], [inFullscreen]) &[type="pre-tabs"] {
            display: flex;
          }
        ` : ``}
        ${Fullscreen_Drag_Area ? `
          :root[customtitlebar][inFullscreen] & {
            display: flex;
          }
        ` : ``}
      }
      #navigator-toolbox[tabs-hidden] & {
        #new-tab-button {
          display: none;
        }
      }
    }

    `,
    sss = Cc["@mozilla.org/content/style-sheet-service;1"].getService(Ci.nsIStyleSheetService),
    uri = Services.io.newURI("data:text/css;charset=UTF=8," + encodeURIComponent(css));
    ["0", "2", "dragend", "SSTabRestored", "TabAttrModified"].find(eventType => {
      if(!sss.sheetRegistered(uri, eventType)) sss.loadAndRegisterSheet(uri, eventType);
      if (MultiRowTab_OnOff_and_TabBar_Rows > 0) {
        gBrowser.tabContainer.addEventListener(eventType, (e) => {
          e.target.scrollIntoView({ behavior: "instant", block: "nearest" })
        })
      }
    })

    if (TabBar_Position == 2) {
      document.body.appendChild(
        document.createXULElement("tabbox")
      ).appendChild(
        document.importNode(document.getElementById("navigator-toolbox"))
      ).appendChild(
        document.adoptNode(document.getElementById("TabsToolbar"))
      )
    }

    gBrowser.tabContainer._getDropIndex = function(event) {
        let tabToDropAt = getTabFromEventTarget(event, false);
        const tabPos = gBrowser.tabContainer.getIndexOfItem(tabToDropAt);

        if (window.getComputedStyle(this).direction == "ltr") {
            let rect = tabToDropAt.getBoundingClientRect();
            if (event.clientX < rect.x + rect.width / 2)
                return tabPos;
            else 
                return tabPos + 1;
            
        } else {
            let rect = tabToDropAt.getBoundingClientRect();
            if (event.clientX > rect.x + rect.width / 2)
                return tabPos;
            else
                return tabPos + 1;
        }
    };

    // We set this to check if the listeners were added before
    let listenersActive = false;

    // This sets when to apply the fix (by default a new row starts after the 23th open tab, unless you changed the min-size of tabs)
    gBrowser.tabContainer.addEventListener("dragstart", () => {
        // Multiple tab select fix
        gBrowser.visibleTabs.forEach(t => t.style.transform = "");

        // Event handling
        if (!listenersActive) {
            gBrowser.tabContainer.getDropEffectForTabDrag = function(){};
            gBrowser.tabContainer._getDropEffectForTabDrag = function(){};
            gBrowser.tabContainer.on_dragover = (dragoverEvent) => performTabDragOver(dragoverEvent);
            gBrowser.tabContainer._onDragOver = (dragoverEvent) => performTabDragOver(dragoverEvent);
            gBrowser.tabContainer.ondrop = (dropEvent) => performTabDropEvent(dropEvent);
            listenersActive = true;
        }
    });
}

var lastKnownIndex = null;
var lastGroupStart = null;
var lastGroupEnd = null;

/**
 * Gets the tab from the event target.
 * @param {*} event The event.
 * @returns The tab if it was part of the target or its parents, otherwise null
 */
function getTabFromEventTarget(event, { ignoreTabSides = false } = {}) {
    let { target } = event;
    if (target.nodeType != Node.ELEMENT_NODE) {
        target = target.parentElement;
    }
    let tab = target?.closest("tab") || target?.closest("tab-group");
    const selectedTab = gBrowser.selectedTab;
    if (tab && ignoreTabSides) {
        let { width, height } = tab.getBoundingClientRect();
        if (
            event.screenX < tab.screenX + width * 0.25 ||
            event.screenX > tab.screenX + width * 0.75 ||
            ((event.screenY < tab.screenY + height * 0.25 ||
                event.screenY > tab.screenY + height * 0.75) &&
                gBrowser.tabContainer.verticalMode)
        ) {
            return selectedTab;
        }
    }
    if (!tab) {
        return selectedTab;
    }
    return tab;
}

/**
 * Performs the tab drag over event.
 * @param {*} event The drag over event.
 */
function performTabDragOver(event) {
    event.preventDefault();
    event.stopPropagation();

    let ind = gBrowser.tabContainer._tabDropIndicator;

    let effects = orig_getDropEffectForTabDrag(event);
    let tab;
    if (effects == "link") {
        tab = getTabFromEventTarget(event, true);
        if (tab) {
            if (!gBrowser.tabContainer._dragTime)
                gBrowser.tabContainer._dragTime = Date.now();
            if (!tab.hasAttribute("pendingicon") && // annoying fix
                Date.now() >= gBrowser.tabContainer._dragTime + gBrowser.tabContainer._dragOverDelay)
                gBrowser.tabContainer.selectedItem = tab;
            ind.hidden = true;
            return;
        }
    }

    if (!tab) {
        tab = getTabFromEventTarget(event, false);
    }
    
    let newIndex = gBrowser.tabContainer._getDropIndex(event);
    if (newIndex == null)
        return;

    // Update the last known index and group position
    lastKnownIndex = newIndex;
    
    if (tab.nodeName == "tab-group" && !lastGroupStart) {
        lastGroupStart = tab.querySelector("tab:first-of-type")._tPos;
        lastGroupEnd = tab.querySelector("tab:last-of-type")._tPos;
    }

    let tabs = document.querySelectorAll("tab");
    let ltr = (window.getComputedStyle(gBrowser.tabContainer).direction == "ltr");
    let rect = gBrowser.tabContainer.arrowScrollbox.getBoundingClientRect();
    let newMarginX, newMarginY;
    if (newIndex == tabs.length) {
        let tabRect = tabs[newIndex - 1].getBoundingClientRect();
        if (ltr)
            newMarginX = tabRect.right - rect.left;
        else
            newMarginX = rect.right - tabRect.left;
        newMarginY = tabRect.top + tabRect.height - rect.top - rect.height; // multirow fix

        if (CSS.supports("offset-anchor", "left bottom")) // Compatibility fix for FF72+
            newMarginY += rect.height / 2 - tabRect.height / 2;
        
    } else if (newIndex != null || newIndex != 0) {
        let tabRect = tabs[newIndex].getBoundingClientRect();
        if (ltr)
            newMarginX = tabRect.left - rect.left;
        else
            newMarginX = rect.right - tabRect.right;
        newMarginY = tabRect.top + tabRect.height - rect.top - rect.height; // multirow fix

        if (CSS.supports("offset-anchor", "left bottom")) // Compatibility fix for FF72+
            newMarginY += rect.height / 2 - tabRect.height / 2;
    }

    newMarginX += ind.clientWidth / 2;
    if (!ltr)
        newMarginX *= -1;

    ind.hidden = false;

    ind.style.transform = "translate(" + Math.round(newMarginX) + "px," + Math.round(newMarginY) + "px)"; // multirow fix
    ind.style.marginInlineStart = (-ind.clientWidth) + "px";
}

/**
 * Performs the tab drop event.
 * @param {*} event The drop event.
 */
function performTabDropEvent(event) {
    let newIndex;
    let dt = event.dataTransfer;
    let dropEffect = dt.dropEffect;
    let draggedTab;
    if (dt.mozTypesAt(0)[0] == TAB_DROP_TYPE) {
        draggedTab = dt.mozGetDataAt(TAB_DROP_TYPE, 0);
        if (!draggedTab) {
            return;
        }
    }

    if (draggedTab && dropEffect != "copy" && draggedTab.container == gBrowser.tabContainer) {
        newIndex = gBrowser.tabContainer._getDropIndex(event);

        /* fix for moving multiple selected tabs and tab groups */
        let selectedTabs = gBrowser.selectedTabs;
        if (lastGroupStart) {
            selectedTabs = [draggedTab?.closest("tab-group")];
            if (lastKnownIndex >= lastGroupStart && lastKnownIndex <= lastGroupEnd) {
                newIndex = lastGroupStart;
            } else if (lastKnownIndex == lastGroupEnd + 1) {
                newIndex = lastGroupStart + 1;
            }
        }

        if (selectedTabs[selectedTabs.length - 1] == null){
            newIndex = lastKnownIndex;
        } else if (newIndex > selectedTabs[selectedTabs.length - 1]._tPos + 1)
            newIndex--;
        else if (newIndex >= selectedTabs[0]._tPos)
            newIndex = -1;

        if (newIndex == -1) {
            newIndex = lastKnownIndex;
        }
        
        const tabToMoveAt = gBrowser.tabContainer.getItemAtIndex(newIndex);
        console.log("tabToMoveAt", tabToMoveAt);
        console.log("newIndex", newIndex);
        selectedTabs.forEach(t => gBrowser.moveTabBefore(t, tabToMoveAt));

        // Restart global vars
        lastKnownIndex = null;
        lastGroupStart = null;
        lastGroupEnd = null;
    }
}

// copy of the original and overrided _getDropEffectForTabDrag method
function orig_getDropEffectForTabDrag(event) {
    let dt = event.dataTransfer;

    let isMovingTabs = dt.mozItemCount > 0;
    for (let i = 0; i < dt.mozItemCount; i++) {
        // tabs are always added as the first type
        let types = dt.mozTypesAt(0);
        if (types[0] != TAB_DROP_TYPE) {
            isMovingTabs = false;
            break;
        }
    }

    if (isMovingTabs) {
        let sourceNode = dt.mozGetDataAt(TAB_DROP_TYPE, 0);
        if (XULElement.isInstance(sourceNode) &&
            sourceNode.localName == "tab" &&
            sourceNode.ownerGlobal.isChromeWindow &&
            sourceNode.ownerDocument.documentElement.getAttribute("windowtype") ==
            "navigator:browser" &&
            sourceNode.ownerGlobal.gBrowser.tabContainer == sourceNode.container) {
            // Do not allow transfering a private tab to a non-private window
            // and vice versa.
            if (PrivateBrowsingUtils.isWindowPrivate(window) !=
                PrivateBrowsingUtils.isWindowPrivate(sourceNode.ownerGlobal))
                return "none";
        

            if (window.gMultiProcessBrowser !=
                sourceNode.ownerGlobal.gMultiProcessBrowser)
                return "none";
        

            if (window.gFissionBrowser != sourceNode.ownerGlobal.gFissionBrowser)
                return "none";
        

            return dt.dropEffect == "copy" ? "copy" : "move";
        }
    }

    if (Services.droppedLinkHandler.canDropLink(event, true)) 
        return "link";

    return "none";
}