mirror of
https://github.com/bolucat/Archive.git
synced 2026-04-23 00:17:16 +08:00
github-action[bot]
192 lines
11 KiB
HTML
192 lines
11 KiB
HTML
<!DOCTYPE html>
|
|
<html theme-mode="light">
|
|
|
|
<head>
|
|
<title>Brook Script Gallery</title>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
<link rel="icon" type="image/png" href="images/brook_circle.png" />
|
|
<link rel="stylesheet" href="static/tdesign.min.css" />
|
|
<link rel="stylesheet" href="static/theme.css" />
|
|
<script src="static/vue.min.js"></script>
|
|
<script src="static/vue-composition-api.prod.js"></script>
|
|
<script src="static/tdesign.min.js"></script>
|
|
|
|
<style>
|
|
html,
|
|
body,
|
|
#app {
|
|
margin: 0;
|
|
padding: 0;
|
|
height: 100dvh;
|
|
}
|
|
</style>
|
|
|
|
<script type="module">
|
|
window.addEventListener("DOMContentLoaded", async (e) => {
|
|
Vue.use(TDesign);
|
|
new Vue({
|
|
el: '#app',
|
|
data() {
|
|
return {
|
|
zh: navigator.language.toLowerCase().startsWith("zh-"),
|
|
wx: navigator.userAgent.toLowerCase().indexOf("micromessenger") != -1,
|
|
mob: /iPhone|iPod|Android/i.test(navigator.userAgent),
|
|
ing: false,
|
|
list: [],
|
|
err: false,
|
|
error: '',
|
|
}
|
|
},
|
|
async mounted() {
|
|
this.ing = true;
|
|
try {
|
|
var res = await fetch('https://raw.githubusercontent.com/txthinking/brook/refs/heads/master/programmable/gallery.json')
|
|
if (res.status != 200) throw await res.text()
|
|
this.list = JSON.parse(await res.text())
|
|
} catch (e) {
|
|
this.err = true
|
|
this.error = e.toString()
|
|
}
|
|
this.ing = false;
|
|
},
|
|
methods: {
|
|
async expand(v) {
|
|
this.ing = true;
|
|
try {
|
|
v.expanded = !v.expanded
|
|
if (!v.script && v.expanded) {
|
|
var res = await fetch(v.url)
|
|
if (res.status != 200) throw await res.text()
|
|
v.script = await res.text()
|
|
}
|
|
} catch (e) {
|
|
this.err = true
|
|
this.error = e.toString()
|
|
}
|
|
this.ing = false;
|
|
},
|
|
async copy(s) {
|
|
await navigator.clipboard.writeText(s)
|
|
},
|
|
async confirm(e) {
|
|
this.err = false
|
|
this.error = ''
|
|
},
|
|
async close(e) {
|
|
this.err = false
|
|
this.error = ''
|
|
},
|
|
},
|
|
})
|
|
});
|
|
</script>
|
|
</head>
|
|
|
|
<body>
|
|
<div id="app">
|
|
<t-layout :style="'display: flex;flex-direction: column;height: 100%;'">
|
|
<t-header style="flex-shrink: 0;">
|
|
<t-head-menu value="null">
|
|
<template #logo>
|
|
<h1>Brook Script Gallery</h1>
|
|
</template>
|
|
<t-menu-item v-if="!mob" target="_blank" href="https://www.txthinking.com/brook.html">Docs</t-menu-item>
|
|
<t-menu-item v-if="!mob" target="_blank" href="https://www.txthinking.com/talks/">Talks</t-menu-item>
|
|
<t-menu-item v-if="!mob" target="_blank" href="https://youtube.com/txthinking">YouTube</t-menu-item>
|
|
<template #operations>
|
|
<t-tooltip placement="bottom" content="Talks" v-if="mob">
|
|
<t-button theme="default" shape="square" variant="text" href="https://www.txthinking.com/talks/" target="_blank">
|
|
<t-icon name="book-open"></t-icon>
|
|
</t-button>
|
|
</t-tooltip>
|
|
<t-tooltip placement="bottom" content="YouTube" v-if="mob">
|
|
<t-button theme="default" shape="square" variant="text" href="https://www.youtube.com/txthinking" target="_blank">
|
|
<t-icon name="logo-youtube"></t-icon>
|
|
</t-button>
|
|
</t-tooltip>
|
|
<t-tooltip placement="bottom" content="GitHub" v-if="mob">
|
|
<t-button theme="default" shape="square" variant="text" href="https://github.com/txthinking" target="_blank">
|
|
<t-icon name="logo-github"></t-icon>
|
|
</t-button>
|
|
</t-tooltip>
|
|
<t-divider layout="vertical" v-if="mob"></t-divider>
|
|
<t-tooltip placement="bottom" content="Add">
|
|
<t-button theme="default" shape="square" variant="text" href="https://github.com/txthinking/brook/blob/master/programmable" target="_blank">
|
|
<t-icon name="add-circle"></t-icon>
|
|
</t-button>
|
|
</t-tooltip>
|
|
</template>
|
|
</t-head-menu>
|
|
</t-header>
|
|
<t-content style="flex-grow:1;overflow-y:scroll;" id="top">
|
|
<div style="height:100%;display: flex;flex-direction: column;padding: 15px 15px 0 15px;box-sizing:border-box;">
|
|
<div style="flex-grow:1;">
|
|
<div style="display: flex;flex-wrap: wrap;gap:15px;">
|
|
<t-card :bordered="false" v-for="item in list" :style="item.expanded ? 'width:100%' : 'max-width:100%'">
|
|
<div style="display: flex;flex-direction: column;">
|
|
<t-collapse :borderless="true" @change="expand(item)">
|
|
<t-collapse-panel :header="item.name">
|
|
<div style="display: flex;justify-content: space-between;align-items:center">
|
|
<div style="flex-grow:1;overflow-x:hidden;text-overflow: ellipsis;white-space:nowrap">{{item.url}}</div>
|
|
<t-button style="flex-shrink: 0;" theme="default" shape="square" variant="text" @click="copy(item.url)">
|
|
<t-icon name="copy"></t-icon>
|
|
</t-button>
|
|
</div>
|
|
<pre style="width:100%;padding:1rem;overflow-x:scroll;font-size:85%;line-height: 1.45;color:#1f2328;background-color: #f6f8fa;border-radius:6px;"><code style="display: inline;padding:0px;margin:0px;overflow:visible;word-wrap:normal;background-color:transparent;border:0">{{item.script}}</code></pre>
|
|
</t-collapse-panel>
|
|
</t-collapse>
|
|
<div style="display: flex;justify-content:space-around;align-items:center">
|
|
<div style="display: flex;gap:15px;" v-if="item.kind=='dnsserver'">
|
|
<t-tooltip content="brook dnsserver, dohserver, dnsserveroverbrook">
|
|
<t-tag shape="round" variant="outline">DNS Server</t-tag>
|
|
</t-tooltip>
|
|
</div>
|
|
<div style="display: flex;gap:15px;" v-if="item.kind=='server'">
|
|
<t-tooltip content="brook server, wsserver, wssserver, quicserver">
|
|
<t-tag shape="round" variant="outline">Server</t-tag>
|
|
</t-tooltip>
|
|
</div>
|
|
<div style="display: flex;gap:15px;" v-if="item.kind=='client'">
|
|
<t-tooltip content="ipio">
|
|
<t-tag shape="round" variant="outline">ipio</t-tag>
|
|
</t-tooltip>
|
|
<t-tooltip content="brook.openwrt">
|
|
<t-tag shape="round" variant="outline">brook.openwrt</t-tag>
|
|
</t-tooltip>
|
|
<t-tooltip :content="zh ? '需要安装 CA' : 'Need to install CA'">
|
|
<t-tag shape="round" theme="warning" variant="outline" v-if="item.ca">CA</t-tag>
|
|
</t-tooltip>
|
|
</div>
|
|
<div style="display: flex;gap:15px;" v-if="item.kind=='module'">
|
|
<t-tooltip content="Brook GUI Client">
|
|
<t-tag shape="round" variant="outline">Client</t-tag>
|
|
</t-tooltip>
|
|
<t-tooltip :content="zh ? '需要安装 CA' : 'Need to install CA'">
|
|
<t-tag shape="round" theme="warning" variant="outline" v-if="item.ca">CA</t-tag>
|
|
</t-tooltip>
|
|
</div>
|
|
<t-link v-if="item.expanded" :href="item.author_url" target="_blank">
|
|
<t-tooltip :content="zh ? '作者' : 'Author'">
|
|
<t-tag variant="outline"><template #icon><t-icon name="user-circle"></t-icon></template>{{item.author}}</t-tag>
|
|
</t-tooltip>
|
|
</t-link>
|
|
</div>
|
|
</div>
|
|
</t-card>
|
|
</div>
|
|
</div>
|
|
<div style="display: flex;justify-content:center;padding:15px;">
|
|
<t-link href="https://www.txthinking.com" target="_blank" style="color:grey">TxThinking</t-link>
|
|
</div>
|
|
<t-back-top shape="circle" container="#top" style="position: fixed" :offset="['24px', '80px']"></t-back-top>
|
|
</div>
|
|
</t-content>
|
|
</t-layout>
|
|
<t-loading :loading="ing" :text="zh ? '请求中...' : 'Requesting...'" fullscreen></t-loading>
|
|
<t-dialog theme="danger" header="Error" :body="error" :visible.sync="err" @confirm="confirm" @close="close" :cancel-btn="null" :confirm-btn="zh ? '了解' : 'Got'" :close-on-overlay-click="false" :close-on-esc-keydown="false"></t-dialog>
|
|
</div>
|
|
</body>
|
|
|
|
</html>
|