mirror of
https://github.com/Sliverkiss/QuantumultX.git
synced 2025-12-16 23:09:36 +08:00
Create index.html
This commit is contained in:
Sliverkiss
255
index.html
Normal file
255
index.html
Normal file
@@ -0,0 +1,255 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<title>Sakura.io</title>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="apple-mobile-web-app-capable" content="yes" />
|
||||||
|
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
|
||||||
|
<meta name="viewport"
|
||||||
|
content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, viewport-fit=cover" />
|
||||||
|
<link rel="Bookmark" href="https://fastly.jsdelivr.net/gh/Sliverkiss/QuantumultX@main/icon/flower.png" />
|
||||||
|
<link rel="shortcut icon" href="https://fastly.jsdelivr.net/gh/Sliverkiss/QuantumultX@main/icon/flower.png" />
|
||||||
|
<link rel="apple-touch-icon" href="https://fastly.jsdelivr.net/gh/Sliverkiss/QuantumultX@main/icon/flower.png" />
|
||||||
|
<!-- boostrap5 -->
|
||||||
|
<link href="https://fastly.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||||
|
integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous" />
|
||||||
|
<script src="https://fastly.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"
|
||||||
|
integrity="sha384-/mhDoLbDldZc3qpsJHpLogda//BVZbgYuw6kof4u2FrCedxOtgRZDTHgHUhOCVim" crossorigin="anonymous">
|
||||||
|
</script>
|
||||||
|
<style>
|
||||||
|
body {
|
||||||
|
background: rgb(32 32 41);
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
span {
|
||||||
|
color: rgb(96 165 250);
|
||||||
|
}
|
||||||
|
|
||||||
|
.appx {
|
||||||
|
background: rgb(32 32 41);
|
||||||
|
}
|
||||||
|
|
||||||
|
.box {
|
||||||
|
background-color: rgb(40 42 53);
|
||||||
|
border-radius: 7px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box div,
|
||||||
|
h3 {
|
||||||
|
background-color: rgb(40 42 53);
|
||||||
|
border-radius: 7px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.github_icon {
|
||||||
|
height: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box button {
|
||||||
|
z-index: 1;
|
||||||
|
position: relative;
|
||||||
|
font-size: inherit;
|
||||||
|
font-family: inherit;
|
||||||
|
color: white;
|
||||||
|
padding: 0.5em 1em;
|
||||||
|
outline: none;
|
||||||
|
border: none;
|
||||||
|
border-radius: 7px;
|
||||||
|
background-color: hsl(236, 32%, 26%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.box button::before {
|
||||||
|
content: '';
|
||||||
|
z-index: -1;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
border-radius: 7px;
|
||||||
|
background-color: rgb(96 165 250);
|
||||||
|
transform-origin: center right;
|
||||||
|
transform: scaleX(0);
|
||||||
|
transition: transform 0.25s ease-in-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box button:hover {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.box button:hover::before {
|
||||||
|
transform-origin: center left;
|
||||||
|
transform: scaleX(1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.col div {
|
||||||
|
display: inline;
|
||||||
|
}
|
||||||
|
|
||||||
|
.detail {
|
||||||
|
margin: 0 auto;
|
||||||
|
display: block;
|
||||||
|
border-radius: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.input {
|
||||||
|
font-family: monospace;
|
||||||
|
max-width: 190px;
|
||||||
|
outline: none;
|
||||||
|
border: 1px solid #dadada;
|
||||||
|
padding: 5px;
|
||||||
|
border-radius: 10px;
|
||||||
|
background-color: #f3f7fe;
|
||||||
|
transition: .3s;
|
||||||
|
color: rgb(96 165 250);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div id="app" v-cloak="">
|
||||||
|
<div class="appx">
|
||||||
|
<div class="container text-white p-4">
|
||||||
|
<!-- header -->
|
||||||
|
<div class="mb-3 mt-5 header">
|
||||||
|
<h1>{{ui.name}}</h1>
|
||||||
|
<a>Collection of Scripts written for QuantumultX iOS App
|
||||||
|
<span class="">© Sliverkiss</span></a>
|
||||||
|
<div class="row">
|
||||||
|
<div class="col">
|
||||||
|
<div class="me-2">
|
||||||
|
<a href="https://github.com/sliverkiss">
|
||||||
|
<img class="github_icon" src="https://obf-io.deobfuscate.io/github-logo.png" alt="GitHub Logo" draggable="false">
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<input v-model="ui.search" @input="search()" placeholder="Type here..." class="input" name="text" type="text">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- body -->
|
||||||
|
<div class="p-3 mb-4 box body">
|
||||||
|
<div>
|
||||||
|
<h3 class="text-center">Script</h3>
|
||||||
|
<nav aria-label="breadcrumb" class="text-white">
|
||||||
|
</nav>
|
||||||
|
<div v-show="ui.showStatus">
|
||||||
|
<button class="m-1" v-for="item of ui.module" @click="copyText(item)">{{item.tagName}}</button>
|
||||||
|
</div>
|
||||||
|
<div class="detail" v-show="!ui.showStatus">
|
||||||
|
<iframe ref="iframe" class="detail text-center" height="225px"></iframe>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="https://fastly.jsdelivr.net/npm/vue@2.x/dist/vue.min.js"></script>
|
||||||
|
<script src="https://fastly.jsdelivr.net/npm/axios@0.x/dist/axios.min.js"></script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
new Vue({
|
||||||
|
el: '#app',
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
ui:{
|
||||||
|
name:"Sakura.io",
|
||||||
|
title:"Apps",
|
||||||
|
search:"",
|
||||||
|
showStatus:true,
|
||||||
|
arr:[],
|
||||||
|
module:[],
|
||||||
|
cache:[]
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
},
|
||||||
|
beforeCreate() {
|
||||||
|
// 请求&响应拦截器, 显示&隐藏加载条
|
||||||
|
axios.interceptors.request.use((cfg) => {
|
||||||
|
this.isLoading = true
|
||||||
|
return cfg
|
||||||
|
})
|
||||||
|
axios.interceptors.response.use(
|
||||||
|
(resp) => {
|
||||||
|
this.isLoading = false
|
||||||
|
return resp
|
||||||
|
},
|
||||||
|
(error) => (this.isLoading = false)
|
||||||
|
)
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
//加载app
|
||||||
|
this.loadApp();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
loadApp(){
|
||||||
|
//数据脱敏
|
||||||
|
axios.get("https://gist.githubusercontent.com/Sliverkiss/a7496bd073820942b44a9b36874aaf4c/raw/sliverkiss.gallery.json").then((resp)=>{
|
||||||
|
this.ui.module=extractData(resp.data.task);
|
||||||
|
this.ui.cache=extractData(resp.data.task);
|
||||||
|
})
|
||||||
|
function extractData(arr) {
|
||||||
|
const jsRegex = /https:\/\/[^\s,]+\.js/;
|
||||||
|
const tagRegex = /tag=([^,]+)/;
|
||||||
|
const imgUrlRegex = /img-url=([^,]+)/;
|
||||||
|
|
||||||
|
return arr.flatMap(({ config }) => {
|
||||||
|
const jsLink = jsRegex.exec(config)?.[0];
|
||||||
|
const tagName = tagRegex.exec(config)?.[1];
|
||||||
|
const imgUrl = imgUrlRegex.exec(config)?.[1];
|
||||||
|
|
||||||
|
return jsLink || tagName || imgUrl ? [{ jsLink, tagName, imgUrl }] : [];
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
search(){
|
||||||
|
if(this.ui.search==''){
|
||||||
|
this.ui.module=this.ui.cache;
|
||||||
|
}else{
|
||||||
|
let arr=this.ui.module;
|
||||||
|
let arr2=[];
|
||||||
|
let search=this.ui.search.toLowerCase()
|
||||||
|
arr.map(e=>{
|
||||||
|
let name=e.tagName.toLowerCase();
|
||||||
|
if(name.indexOf(search)!=-1){
|
||||||
|
arr2.push(e)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
this.ui.module=arr2;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
copyText(item) {
|
||||||
|
// 创建一个临时文本输入框
|
||||||
|
const tempInput = document.createElement('input');
|
||||||
|
tempInput.value = item?.jsLink;
|
||||||
|
document.body.appendChild(tempInput);
|
||||||
|
tempInput.select();
|
||||||
|
try {
|
||||||
|
const successful = document.execCommand('copy');
|
||||||
|
alert(successful ? '文本已复制到粘贴板!' : '复制失败。');
|
||||||
|
} catch (err) {
|
||||||
|
alert('浏览器不支持复制命令。');
|
||||||
|
}
|
||||||
|
// 移除临时文本输入框
|
||||||
|
document.body.removeChild(tempInput);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
Reference in New Issue
Block a user