scambier/paste
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Compare commits

base: scambier:b700ef73ada6fc3109547cdbfda593f6f4633a74
Branches Tags
scambier:master
..
compare: scambier:a55a5f6b06b07125265379ec0eab7fd298552bab
Branches Tags
scambier:master

No commits in common. "b700ef73ada6fc3109547cdbfda593f6f4633a74" and "a55a5f6b06b07125265379ec0eab7fd298552bab" have entirely different histories.
b700ef73ad ... a55a5f6b06

14 changed files with 78 additions and 145 deletions
Show Stats Expand all files Collapse all files

15
.prettierrc
View File

@ -1,11 +1,10 @@
{
"useTabs": false,
"bracketSameLine": true,
"singleQuote": true,
"trailingComma": "es5",
"printWidth": 100,
"plugins": ["prettier-plugin-svelte"],
"pluginSearchDirs": ["."],
"useTabs": false,
"singleQuote": true,
"trailingComma": "es5",
"printWidth": 100,
"plugins": ["prettier-plugin-svelte"],
"pluginSearchDirs": ["."],
"semi": false,
"overrides": [{ "files": "*.svelte", "options": { "parser": "svelte" } }]
"overrides": [{ "files": "*.svelte", "options": { "parser": "svelte" } }]
}

14
src/app.d.ts vendored
View File

@ -1,12 +1,12 @@
// See https://kit.svelte.dev/docs/types#app
// for information about these interfaces
declare global {
namespace App {
// interface Error {}
// interface Locals {}
// interface PageData {}
// interface Platform {}
}
namespace App {
// interface Error {}
// interface Locals {}
// interface PageData {}
// interface Platform {}
}
}
export {}
export {};

2
src/app.html
View File

@ -23,7 +23,7 @@ npm/codemirror@5.65.16/theme/nord.min.css"
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta property="og:title" content="Paste - No-database paste service" />
<meta property="og:url" content="https://paste.scambier.xyz" />
<meta property="og:type" content="website" />
<meta property="og:type" content="article" />
<meta
name="description"
property="og:description"

22
src/components/CodeView.svelte
View File

@ -1,22 +0,0 @@
<script lang="ts">
export let isMarkdown: boolean
export let isPlainText: boolean
export let decompressed: string
export let htmlContent: string
let cssClass = ''
export { cssClass as class }
</script>
<div class={cssClass}>
{#if isMarkdown}
<div class="h-full p-2">
{@html htmlContent}
</div>
{:else if isPlainText}
<div class="whitespace-pre-line h-full">
{decompressed}
</div>
{:else}
<pre class="h-full"><code>{@html htmlContent}</code></pre>
{/if}
</div>

9
src/components/ComboBox.svelte
View File

@ -62,10 +62,12 @@
type="text"
bind:value={filter}
bind:this={inputFilter}
class={$$restProps.class ?? ''} />
class={$$restProps.class ?? ''}
/>
<div
class="absolute top-full left-0 w-full bg-gray-700 max-h-[90vh] overflow-y-auto"
bind:this={divContainer}>
bind:this={divContainer}
>
{#each filteredItems as item}
<div class="p-1 hover:bg-gray-600" on:click={() => selectItem(item)}>{item.text}</div>
{/each}
@ -76,7 +78,8 @@
readonly
value={value?.text ?? ''}
class={$$restProps.class ?? ''}
on:click={showOptions} />
on:click={showOptions}
/>
{/if}
</div>

51
src/components/EditForm.svelte
View File

@ -69,25 +69,6 @@
await updateShareUrl()
isUrlInputVisible = true
await tick()
urlInput.value = $shareUrl
urlInput.select()
}
async function showMarkdownLink() {
await updateShareUrl()
isUrlInputVisible = true
await tick()
urlInput.value = `[Paste snippet](${$shareUrl})`
urlInput.select()
}
async function showIframeCode() {
await updateShareUrl()
isUrlInputVisible = true
await tick()
// @ts-ignore
const height = Math.min(editor['doc'].height * 1.1 + 45, 500)
urlInput.value = `<iframe width="100%" height="${height}" frameborder="0" src="${$shareUrl}"></iframe>`
urlInput.select()
}
@ -113,13 +94,11 @@
<input
bind:this={urlInput}
type="text"
class="border border-gray-300 bg-transparent p-1 grow" />
<button class="button" on:click={copyUrl} title="Copy">
<Icon class="text-xl" icon="fluent:copy-16-regular" />
</button>
<button class="button" on:click={closeUrlInput} title="Close">
<Icon class="text-xl" icon="material-symbols:close" />
</button>
class="border border-gray-300 bg-transparent p-1 grow"
value={$shareUrl}
/>
<button class="button" on:click={copyUrl}>Copy</button>
<button class="button" on:click={closeUrlInput}>Close</button>
</div>
{:else}
<div class="flex justify-end gap-2">
@ -127,8 +106,11 @@
<ComboBox
items={languages}
bind:value={selectedLanguage}
class="bg-gray-700 border border-gray-300 p-1" />
class="bg-gray-700 border border-gray-300 p-1"
/>
</div>
<!-- Show link input-->
<button class="button" on:click={showUrlInput}>Get Link</button>
<!-- Toggle text wrap -->
<button class="button" title="Toggle text wrap" on:click={() => (textWrap = !textWrap)}>
@ -139,21 +121,6 @@
{/if}
</button>
<!-- Show link input -->
<button class="button" on:click={showUrlInput} title="Get sharing link">
<Icon class="text-xl" icon="ph:link-bold" />
</button>
<!-- Show markdown link -->
<button class="button" on:click={showMarkdownLink} title="Get markdown link">
<Icon class="text-xl" icon="simple-icons:markdown" />
</button>
<!-- Show HTML iframe -->
<button class="button" on:click={showIframeCode} title="Get iframe code">
<Icon class="text-xl" icon="fluent:code-24-regular" />
</button>
<!-- Switch to readonly view -->
<button class="button" on:click={goToPreview} title="Switch to read-only view">
<Icon class="text-xl" icon="fluent:eye-12-regular" />

5
src/components/TopBar.svelte
View File

@ -2,10 +2,11 @@
</script>
<div
class="flex flex-wrap justify-between items-center px-3 py-1 text-sm w-full z-10 shadow-md gap-2 font-mono bg-gray-700">
class="flex flex-wrap justify-between items-center px-3 py-1 text-sm w-full z-10 shadow-md gap-2 font-mono bg-gray-700"
>
<div class="flex items-center">
<h1 class="text-xl">
<a href="/new" title="Create a new note">Paste</a>
<a href="/create" title="Create a new note">Paste</a>
</h1>
<span class="ml-8 text-xs">
<a href="/about">About</a>

3
src/lib/utils.ts
View File

@ -34,6 +34,3 @@ export function getLangFromUrl() {
export const byId = (id: string) => document.getElementById(id)
export function isInIframe(): boolean {
return window !== window.parent
}

2
src/routes/+layout.svelte
View File

@ -2,4 +2,4 @@
import '../app.postcss'
</script>
<slot />
<slot />

2
src/routes/+layout.ts
View File

@ -1,2 +1,2 @@
export const prerender = true
export const ssr = false
export const ssr = false

60
src/routes/+page.svelte
View File

@ -8,11 +8,9 @@
import rehypeStringify from 'rehype-stringify'
import hljs from 'highlight.js'
import 'highlight.js/styles/nord.min.css'
import { getLangFromUrl, isInIframe } from '$lib/utils'
import TopBar from '../components/TopBar.svelte'
import Icon from '@iconify/svelte'
import CodeView from '../components/CodeView.svelte'
import { goto } from '$app/navigation'
import { getLangFromUrl } from '$lib/utils'
let decompressed: string
let htmlContent: string
@ -53,7 +51,7 @@
}
} else {
// Redirect to editor page
goto('/editor')
window.location.href = '/editor'
}
})
@ -63,42 +61,30 @@
</script>
<div class="overflow-hidden h-screen flex flex-col">
{#if !isInIframe()}
<TopBar>
<a
href={'/editor' + getUrlDataPart()}
class="p-1 hover:bg-gray-600/50"
title="Edit a copy of this note">
<Icon class="text-xl" icon="fluent:document-edit-16-regular" />
</a>
</TopBar>
{/if}
<TopBar>
<a
href={'/editor' + getUrlDataPart()}
class="p-1 hover:bg-gray-600/50"
title="Edit a copy of this note"
>
<Icon class="text-xl" icon="fluent:document-edit-16-regular" />
</a>
</TopBar>
{#if htmlContent || decompressed}
<div class="overflow-y-auto grow pb-4">
{#if isInIframe()}
<CodeView
class="prose dark:prose-invert w-full max-w-full h-full"
{isMarkdown}
{isPlainText}
{decompressed}
{htmlContent} />
{:else}
<CodeView
class="prose dark:prose-invert lg:py-12 p-[0.5em] md:max-w-3xl md:mx-auto lg:max-w-4xl"
{isMarkdown}
{isPlainText}
{decompressed}
{htmlContent} />
{/if}
<div class="overflow-y-auto grow">
<div class="prose dark:prose-invert lg:py-12 p-[0.5em] md:max-w-3xl md:mx-auto lg:max-w-4xl">
{#if isMarkdown}
{@html htmlContent}
{:else if isPlainText}
<div class="whitespace-pre-line">
{decompressed}
</div>
{:else}
<pre><code>{@html htmlContent}</code></pre>
{/if}
</div>
</div>
{/if}
<footer
class="absolute bottom-0 left-0 w-full bg-gray-700 px-4 py-1 font-mono text-xs"
class:hidden={!isInIframe()}>
<a href={window.location.href} target="_blank">Powered by Paste</a>
</footer>
</div>
<style lang="scss">

0
src/routes/new/+page.svelte → src/routes/create/+page.svelte
View File

6
src/routes/editor/+page.svelte
View File

@ -66,10 +66,11 @@
editor.setValue(decompressed)
}
}
}
</script>
<svelte:head>
<svelte:head>
<script
src="https://cdn.jsdelivr.net/combine/
npm/codemirror@5.65.16,
@ -79,7 +80,8 @@ npm/codemirror@5.65.16/addon/mode/multiplex.min.js,
npm/codemirror@5.65.16/addon/mode/simple.min.js,
npm/codemirror@5.65.16/addon/scroll/simplescrollbars.js,
npm/codemirror@5.65.16/mode/meta.min.js"
on:load={initCodeEditor}></script>
on:load={initCodeEditor}
></script>
</svelte:head>
<div class="flex flex-col font-mono h-screen bg-gray-700">

32
tsconfig.json
View File

@ -1,17 +1,17 @@
{
"extends": "./.svelte-kit/tsconfig.json",
"compilerOptions": {
"allowJs": true,
"checkJs": true,
"esModuleInterop": true,
"forceConsistentCasingInFileNames": true,
"resolveJsonModule": true,
"skipLibCheck": true,
"sourceMap": true,
"strict": true
}
// Path aliases are handled by https://kit.svelte.dev/docs/configuration#alias
//
// If you want to overwrite includes/excludes, make sure to copy over the relevant includes/excludes
// from the referenced tsconfig.json - TypeScript does not merge them in
}
"extends": "./.svelte-kit/tsconfig.json",
"compilerOptions": {
"allowJs": true,
"checkJs": true,
"esModuleInterop": true,
"forceConsistentCasingInFileNames": true,
"resolveJsonModule": true,
"skipLibCheck": true,
"sourceMap": true,
"strict": true
}
// Path aliases are handled by https://kit.svelte.dev/docs/configuration#alias
//
// If you want to overwrite includes/excludes, make sure to copy over the relevant includes/excludes
// from the referenced tsconfig.json - TypeScript does not merge them in
}