Skip to content

Commit

Permalink
feat: improve mobile support
Browse files Browse the repository at this point in the history
  • Loading branch information
josStorer committed Mar 16, 2023
1 parent 6c3fd11 commit 68f8f00
Show file tree
Hide file tree
Showing 3 changed files with 43 additions and 2 deletions.
40 changes: 40 additions & 0 deletions src/content-script/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -138,6 +138,45 @@ async function prepareForSelectionTools() {
})
}

async function prepareForSelectionToolsTouch() {
document.addEventListener('touchend', (e) => {
if (toolbarContainer && toolbarContainer.contains(e.target)) return
if (
toolbarContainer &&
window.getSelection()?.rangeCount > 0 &&
toolbarContainer.contains(window.getSelection()?.getRangeAt(0).endContainer.parentElement)
)
return

if (toolbarContainer) toolbarContainer.remove()
setTimeout(() => {
const selection = window.getSelection()?.toString()
if (selection) {
const position = {
x: e.changedTouches[0].clientX + 15,
y: e.changedTouches[0].clientY - 15,
}
toolbarContainer = createElementAtPosition(position.x, position.y)
toolbarContainer.className = 'toolbar-container'
render(
<FloatingToolbar
session={initSession()}
selection={selection}
position={position}
container={toolbarContainer}
/>,
toolbarContainer,
)
}
})
})
document.addEventListener('touchstart', (e) => {
if (toolbarContainer && toolbarContainer.contains(e.target)) return

document.querySelectorAll('.toolbar-container').forEach((e) => e.remove())
})
}

let menuX, menuY

async function prepareForRightClickMenu() {
Expand Down Expand Up @@ -220,6 +259,7 @@ async function run() {
userConfig = await getUserConfig()
if (isSafari()) await prepareForSafari()
prepareForSelectionTools()
prepareForSelectionToolsTouch()
prepareForStaticCard()
prepareForRightClickMenu()
}
Expand Down
4 changes: 2 additions & 2 deletions src/content-script/site-adapters/index.mjs
Original file line number Diff line number Diff line change
Expand Up @@ -144,9 +144,9 @@ export const config = {
},
zhihu: {
inputQuery: zhihu.inputQuery,
sidebarContainerQuery: ['.Question-sideColumn', '.Post-Header'],
sidebarContainerQuery: ['.Question-sideColumn', '.Post-Header', '.Question-main'],
appendContainerQuery: [],
resultsContainerQuery: ['.Question-sideColumn', '.Post-Header'],
resultsContainerQuery: ['.Question-sideColumn', '.Post-Header', '.Question-main'],
},
reddit: {
inputQuery: reddit.inputQuery,
Expand Down
1 change: 1 addition & 0 deletions src/utils/is-mobile.mjs
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
// https://stackoverflow.com/questions/11381673/detecting-a-mobile-browser

export async function isMobile() {
if (navigator.userAgentData) return navigator.userAgentData.mobile
let check = false
;(function (a) {
if (
Expand Down

0 comments on commit 68f8f00

Please sign in to comment.