selfhosted
/
zer0bin
mirror of https://github.com/zer0bin-dev/zer0bin
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

feat: ✨ Share button

This commit is contained in:
ThatOneCalculator 2022-04-04 11:49:03 -07:00
parent 4f62e7f4ee
commit fff67c1a43
4 changed files with 37 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
frontend/index.pug
View File

@ -52,6 +52,7 @@ html(lang='en')
span.viewcounter.noselect#viewcounter-count(style='visibility: hidden; display: none')
.bottom-button-wrapper
button#share-button.btn(aria-label='Share' style='visibility: hidden')
button#hide-button.btn(aria-label='Hide')
.scrollbar-container

12
frontend/src/icons.ts
View File

@ -10,6 +10,7 @@ import {
EyeInvisibleOutlined,
FireOutlined,
FileMarkdownOutlined,
ShareAltOutlined,
} from "@ant-design/icons-svg"
import { renderIconDefinitionToSVGElement } from "@ant-design/icons-svg/es/helpers"
import tippy from "tippy.js"
@ -22,9 +23,11 @@ const newButton = <HTMLButtonElement>document.getElementById("new-button")
const copyButton = <HTMLButtonElement>document.getElementById("copy-button")
const hideButton = <HTMLButtonElement>document.getElementById("hide-button")
const githubButton = <HTMLButtonElement>document.getElementById("github-button")
const shareButton = <HTMLButtonElement>document.getElementById("share-button")
const markdownButton = <HTMLButtonElement>(
document.getElementById("markdown-button")
)
const singleViewButton = <HTMLButtonElement>(
document.getElementById("single-view-button")
)
@ -47,6 +50,7 @@ renderIcon(githubButton, GithubOutlined)
renderIcon(hideButton, EyeInvisibleOutlined)
renderIcon(markdownButton, FileMarkdownOutlined)
renderIcon(singleViewButton, FireOutlined)
renderIcon(shareButton, ShareAltOutlined)
tippy("#save-button", {
content: "Save paste<br><span class='keybind'>Ctrl + S</span>",
@ -112,6 +116,14 @@ tippy("#hide-button", {
allowHTML: true,
})
tippy("#share-button", {
content: "Share paste",
placement: "top",
animation: "scale",
theme: "rosepine",
allowHTML: true,
})
const observer = new MutationObserver(callback)
function callback() {

13
frontend/src/index.ts
View File

@ -35,6 +35,7 @@ const saveButton = <HTMLButtonElement>document.getElementById("save-button")
const newButton = <HTMLButtonElement>document.getElementById("new-button")
const copyButton = <HTMLButtonElement>document.getElementById("copy-button")
const hideButton = <HTMLButtonElement>document.getElementById("hide-button")
const shareButton = <HTMLButtonElement>document.getElementById("share-button")
const markdownButton = <HTMLButtonElement>(
document.getElementById("markdown-button")
)
@ -127,6 +128,7 @@ function newPaste() {
hide(codeViewPre)
hide(viewCounterLabel)
hide(viewCounter)
hide(shareButton)
viewCounterLabel.style.display = "none"
viewCounter.style.display = "none"
}
@ -165,6 +167,17 @@ function viewPaste(content: string, views: string, singleView: boolean) {
addMessage("This is a single-view paste!")
}
if (navigator.canShare) {
show(shareButton)
shareButton.addEventListener("click", function () {
navigator.share({
title: "zer0bin paste",
url: window.location.toString(),
})
})
}
disable(saveButton)
disable(markdownButton)
enable(newButton)

11
frontend/style/style.scss
View File

@ -192,6 +192,17 @@ a {
}
}
}
// #share-button {
// position: fixed !important;
// bottom: 0;
// left: 0;
// z-index: 10;
// color: $muted;
// &:hover {
// color: $rose;
// }
// padding: 10px;
// }
.keybind {
color: $subtle;
font-size: 11px;