Rename draggable into sortable

This commit is contained in:
Thomas Brouard 2022-05-24 09:19:00 +02:00
parent c6e5b4a385
commit 3dddb2db94
10 changed files with 3499 additions and 19 deletions

View file

@ -6,9 +6,9 @@
</head> </head>
<body style="margin:0"> <body style="margin:0">
<tab-group new-tab-button="true" draggable="true"></tab-group> <tab-group new-tab-button="true" sortable="true"></tab-group>
<script src="../dist/electron-tabs.draggable.js"></script> <script src="../dist/electron-tabs.sortable.js"></script>
<script> <script>
const tabGroup = document.querySelector("tab-group"); const tabGroup = document.querySelector("tab-group");

View file

@ -552,7 +552,7 @@ class TabGroup extends HTMLElement {
title: "New Tab", title: "New Tab",
active: true active: true
}, },
draggable: this.getAttribute("draggable") || false sortable: this.getAttribute("sortable") || false
}; };
// Create custom element // Create custom element
const shadow = this.attachShadow({ const shadow = this.attachShadow({
@ -583,14 +583,14 @@ class TabGroup extends HTMLElement {
this.newTabId = 0; this.newTabId = 0;
TabGroupPrivate.initNewTabButton.bind(this)(); TabGroupPrivate.initNewTabButton.bind(this)();
TabGroupPrivate.initVisibility.bind(this)(); TabGroupPrivate.initVisibility.bind(this)();
// Init draggable tabs // Init sortable tabs
if (this.options.draggable) { if (this.options.sortable) {
const initSortable = ()=>{ const initSortable = ()=>{
const options = Object.assign({ const options = Object.assign({
direction: "horizontal", direction: "horizontal",
animation: 150, animation: 150,
swapThreshold: 0.20 swapThreshold: 0.20
}, this.options.draggableOptions); }, this.options.sortableOptions);
new window.Sortable(this.tabContainer, options); new window.Sortable(this.tabContainer, options);
}; };
if (window.Sortable) initSortable(); if (window.Sortable) initSortable();

File diff suppressed because one or more lines are too long

View file

@ -17,7 +17,7 @@ class $4fa36e821943b400$var$TabGroup extends HTMLElement {
title: "New Tab", title: "New Tab",
active: true active: true
}, },
draggable: this.getAttribute("draggable") || false sortable: this.getAttribute("sortable") || false
}; };
// Create custom element // Create custom element
const shadow = this.attachShadow({ const shadow = this.attachShadow({
@ -48,14 +48,14 @@ class $4fa36e821943b400$var$TabGroup extends HTMLElement {
this.newTabId = 0; this.newTabId = 0;
$4fa36e821943b400$var$TabGroupPrivate.initNewTabButton.bind(this)(); $4fa36e821943b400$var$TabGroupPrivate.initNewTabButton.bind(this)();
$4fa36e821943b400$var$TabGroupPrivate.initVisibility.bind(this)(); $4fa36e821943b400$var$TabGroupPrivate.initVisibility.bind(this)();
// Init draggable tabs // Init sortable tabs
if (this.options.draggable) { if (this.options.sortable) {
const initSortable = ()=>{ const initSortable = ()=>{
const options = Object.assign({ const options = Object.assign({
direction: "horizontal", direction: "horizontal",
animation: 150, animation: 150,
swapThreshold: 0.20 swapThreshold: 0.20
}, this.options.draggableOptions); }, this.options.sortableOptions);
new window.Sortable(this.tabContainer, options); new window.Sortable(this.tabContainer, options);
}; };
if (window.Sortable) initSortable(); if (window.Sortable) initSortable();

File diff suppressed because one or more lines are too long

3479
dist/electron-tabs.sortable.js vendored Normal file

File diff suppressed because it is too large Load diff

1
dist/electron-tabs.sortable.js.map vendored Normal file

File diff suppressed because one or more lines are too long

View file

@ -3,13 +3,13 @@
"version": "1.0.0-dev", "version": "1.0.0-dev",
"description": "Simple tabs for Electron applications", "description": "Simple tabs for Electron applications",
"main": "dist/electron-tabs.js", "main": "dist/electron-tabs.js",
"draggable": "dist/electron-tabs.draggable.js", "sortable": "dist/electron-tabs.sortable.js",
"targets": { "targets": {
"main": { "main": {
"source": "src/index.js" "source": "src/index.js"
}, },
"draggable": { "sortable": {
"source": "src/draggable.js" "source": "src/sortable.js"
} }
}, },
"repository": { "repository": {

View file

@ -17,7 +17,7 @@ class TabGroup extends HTMLElement {
viewClass: this.getAttribute("view-class") || "etabs-view", viewClass: this.getAttribute("view-class") || "etabs-view",
newTabButton: this.getAttribute("new-tab-button") || false, newTabButton: this.getAttribute("new-tab-button") || false,
defaultTab: { title: "New Tab", active: true }, defaultTab: { title: "New Tab", active: true },
draggable: this.getAttribute("draggable") || false sortable: this.getAttribute("sortable") || false
// TODO: replace this callback // TODO: replace this callback
// ready: args.ready // ready: args.ready
}; };
@ -58,14 +58,14 @@ class TabGroup extends HTMLElement {
TabGroupPrivate.initNewTabButton.bind(this)(); TabGroupPrivate.initNewTabButton.bind(this)();
TabGroupPrivate.initVisibility.bind(this)(); TabGroupPrivate.initVisibility.bind(this)();
// Init draggable tabs // Init sortable tabs
if (this.options.draggable) { if (this.options.sortable) {
const initSortable = () => { const initSortable = () => {
const options = Object.assign({ const options = Object.assign({
direction: "horizontal", direction: "horizontal",
animation: 150, animation: 150,
swapThreshold: 0.20 swapThreshold: 0.20
}, this.options.draggableOptions); }, this.options.sortableOptions);
new window.Sortable(this.tabContainer, options); new window.Sortable(this.tabContainer, options);
}; };