cross-window draggable tabs

This commit is contained in:
dragonwocky 2020-10-19 09:33:08 +11:00
parent cf4d8e63ee
commit 1d1503c826
Signed by: dragonwocky
GPG Key ID: C7A48B7846AA706D

View File

@ -87,11 +87,22 @@ module.exports = (store, __exports) => {
document.addEventListener('dragstart', (event) => { document.addEventListener('dragstart', (event) => {
if (!this.$titlebar) return; if (!this.$titlebar) return;
this.$dragging = getTab(event.target)[0]; this.$dragging = getTab(event.target)[0];
event.dataTransfer.setData(
'text',
document.getElementById(getTab(event.target)[0]).src
);
event.target.style.opacity = 0.5; event.target.style.opacity = 0.5;
}); });
document.addEventListener('dragend', (event) => { document.addEventListener('dragend', (event) => {
if (!this.$titlebar) return; if (!this.$titlebar) return;
event.target.style.opacity = ''; event.target.style.opacity = '';
document
.querySelectorAll('.dragged-over')
.forEach((el) => el.classList.remove('dragged-over'));
if (this.$dragging !== null) {
this.closeTab(this.$dragging);
this.$dragging = null;
}
}); });
document.addEventListener('dragover', (event) => { document.addEventListener('dragover', (event) => {
if (!this.$titlebar) return; if (!this.$titlebar) return;
@ -103,36 +114,40 @@ module.exports = (store, __exports) => {
if (tab[1]) tab[1].classList.add('dragged-over'); if (tab[1]) tab[1].classList.add('dragged-over');
}); });
document.addEventListener('drop', (event) => { document.addEventListener('drop', (event) => {
if (!this.$titlebar || this.$dragging === null) return;
event.preventDefault(); event.preventDefault();
document if (this.$dragging === null) {
.querySelectorAll('.dragged-over') console.log(event.dataTransfer.getData('text'));
.forEach((el) => el.classList.remove('dragged-over')); if (event.dataTransfer.getData('text').startsWith('notion://'))
const from = getTab(this.views.tabs[+this.$dragging]), this.newTab(event.dataTransfer.getData('text'));
to = getTab(event.target); } else {
if (from[0] !== to[0]) { if (this.$titlebar) {
if (to[1].classList.contains('new')) { const from = getTab(this.views.tabs[+this.$dragging]),
const list = new Map(this.state.tabs); to = getTab(event.target);
list.delete(from[0]); if (from[0] !== to[0]) {
list.set(from[0], this.state.tabs.get(from[0])); if (to[1].classList.contains('new')) {
this.setState({ tabs: list }); const list = new Map(this.state.tabs);
} else { list.delete(from[0]);
const list = [...this.state.tabs], list.set(from[0], this.state.tabs.get(from[0]));
fromIndex = list.findIndex( this.setState({ tabs: list });
([id, { title, open }]) => id === from[0] } else {
), const list = [...this.state.tabs],
toIndex = list.findIndex( fromIndex = list.findIndex(
([id, { title, open }]) => id === to[0] ([id, { title, open }]) => id === from[0]
); ),
list.splice( toIndex = list.findIndex(
toIndex > fromIndex ? toIndex - 1 : toIndex, ([id, { title, open }]) => id === to[0]
0, );
list.splice(fromIndex, 1)[0] list.splice(
); toIndex > fromIndex ? toIndex - 1 : toIndex,
this.setState({ tabs: new Map(list) }); 0,
list.splice(fromIndex, 1)[0]
);
this.setState({ tabs: new Map(list) });
}
}
} }
this.$dragging = null;
} }
this.$dragging = null;
}); });
document.addEventListener('keyup', (event) => { document.addEventListener('keyup', (event) => {
if (!electron.remote.getCurrentWindow().isFocused()) return; if (!electron.remote.getCurrentWindow().isFocused()) return;