FazBrowse GitHub Viewer | Trending |
URL:
| Home
Tools: [Download Repo ZIP]   [Original HTTPS Page]

Narrow down the lower right indicator · feicc/Userscript-Plus@8348b9b · GitHub

/ Userscript-Plus Public
forked from jae-jae/Userscript-Plus

Commit 8348b9b

Browse files
jae-jae
committed
Narrow down the lower right indicator
1 parent 62d3038 commit 8348b9b

6 files changed

Lines changed: 219 additions & 67 deletions

File tree

‎dist/show-site-all-userjs.user.js‎

Lines changed: 58 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
// @name:zh Userscript+ : 显示当前网站所有可用的UserJS脚本 Jaeger
44
// @name:zh-CN Userscript+ : 显示当前网站所有可用的UserJS脚本 Jaeger
55
// @namespace https://github.com/jae-jae/Userscript-Plus
6-
// @version 2.0.2
6+
// @version 2.1.0
77
// @description Show current site all UserJS，The easier way to install UserJs for Tampermonkey.
88
// @description:zh 显示当前网站的所有可用UserJS(Tampermonkey)脚本,交流QQ群:104267383
99
// @description:zh-CN 显示当前网站的所有可用UserJS(Tampermonkey)脚本,交流QQ群:104267383
@@ -42,7 +42,55 @@ var inline_src = (<><![CDATA[
4242
this.showTime = 10;
4343
this.quietKey = 'jae_fetch_userjs_quiet';
4444
this.cacheKey = 'jae_fetch_userjs_cache';
45-
this.tplBox = '<div id="jae_fetch_userjs_wrapper"><style> #jae_fetch_userjs { position: fixed; width: 370px; bottom: 10px; right: 20px; z-index: 9999999999; height: 51px;box-shadow: 0px 1px 4px rgba(0,0,0,0.3),\t\t\t\t0px 0px 20px rgba(0,0,0,0.1) inset; }#jae_fetch_userjs::before,#jae_fetch_userjs::after { content:""; position:absolute; z-index:-1;}#jae_fetch_userjs::before,#jae_fetch_userjs::after { content:""; position:absolute; z-index:-1; bottom:15px; left:10px; width:50%; height:20%;}#jae_fetch_userjs::before,#jae_fetch_userjs::after { content:""; position:absolute; z-index:-1; bottom:15px; left:10px; width:50%; height:20%; box-shadow:0 15px 10px rgba(0, 0, 0, 0.7); transform:rotate(-3deg);}#jae_fetch_userjs::after{ right:10px; left:auto; transform:rotate(3deg); }</style><div id="jae_fetch_userjs" class=""></div></div>';
45+
//this.tplBox = '<div id="jae_fetch_userjs_wrapper"><style> #jae_fetch_userjs { position: fixed; width: 370px; bottom: 10px; right: 20px; z-index: 9999999999; height: 56px;box-shadow: 0px 1px 4px rgba(0,0,0,0.3),\t\t\t\t0px 0px 20px rgba(0,0,0,0.1) inset; }#jae_fetch_userjs::before,#jae_fetch_userjs::after { content:""; position:absolute; z-index:-1;}#jae_fetch_userjs::before,#jae_fetch_userjs::after { content:""; position:absolute; z-index:-1; bottom:15px; left:10px; width:50%; height:20%;}#jae_fetch_userjs::before,#jae_fetch_userjs::after { content:""; position:absolute; z-index:-1; bottom:15px; left:10px; width:50%; height:20%; box-shadow:0 15px 10px rgba(0, 0, 0, 0.7); transform:rotate(-3deg);}#jae_fetch_userjs::after{ right:10px; left:auto; transform:rotate(3deg); }</style><div id="jae_fetch_userjs" class=""></div></div>';
46+
this.tplBox = `
47+
<div id="jae_userscript_box">
48+
<style>
49+
.jae-userscript {
50+
position: fixed;
51+
width: 370px;
52+
bottom: 10px;
53+
right: 20px;
54+
z-index: 9999999999;
55+
height: 56px;
56+
}
57+
.jae-userscript-shadow{
58+
box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.3), \\t\\t\\t\\t0px 0px 20px rgba(0, 0, 0, 0.1) inset;
59+
}
60+
.jae-userscript-shadow::before, .jae-userscript-shadow::after {
61+
content:"";
62+
position:absolute;
63+
z-index:-1;
64+
}
65+
.jae-userscript-shadow::before, .jae-userscript-shadow::after {
66+
content:"";
67+
position:absolute;
68+
z-index:-1;
69+
bottom:15px;
70+
left:10px;
71+
width:50%;
72+
height:20%;
73+
}
74+
.jae-userscript-shadow::before, .jae-userscript-shadow::after {
75+
content:"";
76+
position:absolute;
77+
z-index:-1;
78+
bottom:15px;
79+
left:10px;
80+
width:50%;
81+
height:20%;
82+
box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);
83+
transform:rotate(-3deg);
84+
}
85+
.jae-userscript-shadow::after {
86+
right:10px;
87+
left:auto;
88+
transform:rotate(3deg);
89+
}
90+
</style>
91+
<div class="jae-userscript" class=""></div>
92+
</div>
93+
`
4694
}
4795

4896
getJSON(url,callback){
@@ -76,32 +124,34 @@ var inline_src = (<><![CDATA[
76124
}
77125

78126
setSize(w,h){
79-
$('#jae_fetch_userjs').css({width:w,height:h})
127+
$('.jae-userscript').css({width:w,height:h})
80128
}
81129

82130
addEventListener(eventName,handler){
83-
document.getElementById('jae_fetch_userjs').addEventListener(eventName,handler)
131+
document.getElementById('jae_userscript_box').addEventListener(eventName,handler)
84132
}
85133

86134
bindEvent(){
87135
this.timeId = setTimeout(()=>{
88-
$('#jae_fetch_userjs_wrapper').remove();
136+
$('#jae_userscript_box').remove();
89137
},this.showTime*1000);
90138

91139
this.addEventListener('max',()=>{
92140
this.setSize(860,492)
141+
$('.jae-userscript').addClass('jae-userscript-shadow')
93142
clearTimeout(this.timeId);
94143
})
95144

96145
this.addEventListener('min',()=>{
97146
setTimeout(()=>{
98-
this.setSize(370,51)
147+
$('.jae-userscript').removeClass('jae-userscript-shadow')
148+
this.setSize(370,56)
99149
},500)
100150
})
101151

102152
this.addEventListener('close',()=>{
103153
sessionStorage.setItem(this.quietKey,1);
104-
$('#jae_fetch_userjs_wrapper').remove();
154+
$('#jae_userscript_box').remove();
105155
})
106156
}
107157

@@ -124,7 +174,7 @@ var inline_src = (<><![CDATA[
124174
$('body').append(this.tplBox);
125175

126176
let ui = GM_getResourceText('ui');
127-
let dom = document.getElementById('jae_fetch_userjs')
177+
let dom = document.getElementsByClassName('jae-userscript')[0]
128178
var tpl = '<iframe name="jaeFetchUserJSFrame" src="about:blank" style="width:100%;height:100%;border:0px;display: block!important;" allowTransparency="true"></iframe>';
129179
dom.innerHTML = tpl;
130180
var iframeDom = dom.children[0];

‎dist/ui.js‎

Lines changed: 3 additions & 3 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/common/js/tools.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ export default {
1313
link.click()
1414
},
1515
dispatchEvent (eventName) {
16-
parent.document.getElementById('jae_fetch_userjs').dispatchEvent(new Event(eventName))
16+
parent.document.getElementById('jae_userscript_box').dispatchEvent(new Event(eventName))
1717
},
1818
// 获取油猴缓存好的脚本数据
1919
getData () {

‎src/components/Indicator.vue‎

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
<template>
2+
<div>
3+
<Card class="circle">
4+
<Badge place="count" :count="count" class-name="badge"></Badge>
5+
</Card>
6+
</div>
7+
8+
</template>
9+
10+
<script>
11+
export default {
12+
props:['count']
13+
}
14+
</script>
15+
16+
<style>
17+
.circle {
18+
width: 56px;
19+
height: 56px;
20+
line-height: 56px;
21+
border-radius: 28px;
22+
float: right;
23+
right: 40px;
24+
}
25+
26+
.badge{
27+
top:-17px;
28+
left: -6%;
29+
width: 26px;
30+
height: 26px;
31+
line-height: 26px;
32+
border-radius: 13px;
33+
}
34+
</style>

‎src/components/Table.vue‎

Lines changed: 65 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,19 @@
11
<template>
22
<div>
3-
<Card :padding="0">
4-
<div slot="title" @click="bodySwitch" class="card-title">
5-
<Icon :type="titleIcon"></Icon>
6-
<!--<span>发现 <Badge :count="count"></Badge> 个脚本适用于当前页面</span>-->
7-
<i18n path="table.tips" tag="span">
8-
<Badge place="count" :count="count" style="padding:0px 5px;"></Badge>
9-
</i18n>
10-
<span v-show="showBody">
3+
<transition name="custom-classes-transition" enter-active-class="animated lightSpeedIn">
4+
<div v-show="showTitle">
5+
<Card :padding="0">
6+
<div slot="title" @click="bodySwitch" class="card-title">
7+
<Icon :type="titleIcon"></Icon>
8+
<!--<span>发现 <Badge :count="count"></Badge> 个脚本适用于当前页面</span>-->
9+
<i18n path="table.tips" tag="span">
10+
<Badge place="count" :count="count" style="padding:0px 5px;"></Badge>
11+
</i18n>
12+
<span v-show="showBody">
1113
- Userscript+
1214
</span>
13-
</div>
14-
<div slot="extra">
15+
</div>
16+
<div slot="extra">
1517
<span v-show="showBody">
1618
<Tooltip :content="$t('table.feedback')" placement="bottom">
1719
<Button type="dashed" @click="open('https://greasyfork.org/zh-CN/scripts/24508/feedback')">
@@ -38,59 +40,70 @@
3840
</Tooltip>
3941
</span>
4042

41-
<Tooltip :content="$t('table.close')" placement="left">
42-
<Button type="dashed" @click="close">
43-
<Icon type="close-round"></Icon>
44-
</Button>
45-
</Tooltip>
43+
<Tooltip :content="$t('table.close')" placement="left">
44+
<Button type="dashed" @click="close">
45+
<Icon type="close-round"></Icon>
46+
</Button>
47+
</Tooltip>
4648

47-
</div>
48-
<transition name="custom-classes-transition" enter-active-class="animated lightSpeedIn" leave-active-class="animated bounceOutRight">
49-
<div v-show="showBody">
50-
<Table highlight-row :columns="columns" :data="data"></Table>
5149
</div>
52-
</transition>
53-
</Card>
54-
<Modal v-model="showDonate" width="400">
50+
<transition name="custom-classes-transition" enter-active-class="animated lightSpeedIn" leave-active-class="animated bounceOutRight">
51+
<div v-show="showBody">
52+
<Table highlight-row :columns="columns" :data="data"></Table>
53+
</div>
54+
</transition>
55+
</Card>
56+
<Modal v-model="showDonate" width="400">
5557

56-
<Tabs value="wechat">
58+
<Tabs value="wechat">
5759

58-
<Tab-Pane :label="$t('table.wechat')" name="wechat">
59-
<div style="text-align: center;">
60-
<img width="200px" src="https://ww1.sinaimg.cn/large/7de3675bly1fizyy2pivwj2074074js6.jpg">
61-
</div>
62-
</Tab-Pane>
60+
<Tab-Pane :label="$t('table.wechat')" name="wechat">
61+
<div style="text-align: center;">
62+
<img width="200px" src="https://ww1.sinaimg.cn/large/7de3675bly1fizyy2pivwj2074074js6.jpg">
63+
</div>
64+
</Tab-Pane>
6365

64-
<Tab-Pane :label="$t('table.alipay')" name="alipay">
65-
<div style="text-align: center;">
66-
<img width="200px" src="https://ww1.sinaimg.cn/large/7de3675bly1fizyyh7m7yj20ci0ciwfl.jpg">
67-
</div>
68-
</Tab-Pane>
66+
<Tab-Pane :label="$t('table.alipay')" name="alipay">
67+
<div style="text-align: center;">
68+
<img width="200px" src="https://ww1.sinaimg.cn/large/7de3675bly1fizyyh7m7yj20ci0ciwfl.jpg">
69+
</div>
70+
</Tab-Pane>
6971

70-
<Tab-Pane :label="$t('table.paypal')" name="paypal">
71-
<div style="text-align: center;">
72-
<a href="https://paypal.me/jaepay/10" target="_blank">
73-
<img src="https://ww1.sinaimg.cn/large/7de3675bly1fizzsw92owj207s03s748.jpg">
74-
</a>
75-
</div>
76-
</Tab-Pane>
72+
<Tab-Pane :label="$t('table.paypal')" name="paypal">
73+
<div style="text-align: center;">
74+
<a href="https://paypal.me/jaepay/10" target="_blank">
75+
<img src="https://ww1.sinaimg.cn/large/7de3675bly1fizzsw92owj207s03s748.jpg">
76+
</a>
77+
</div>
78+
</Tab-Pane>
7779

78-
</Tabs>
80+
</Tabs>
7981

80-
<div slot="footer">
81-
<Button type="info" size="large" long @click="showDonate=false">{{$t('table.closeDonate')}}</Button>
82-
</div>
82+
<div slot="footer">
83+
<Button type="info" size="large" long @click="showDonate=false">{{$t('table.closeDonate')}}</Button>
84+
</div>
85+
86+
</Modal>
87+
</div>
88+
</transition>
89+
90+
<div v-show="!showTitle" @mouseover='showTitle = true'>
91+
92+
<Indicator :count="count"></Indicator>
8393

84-
</Modal>
94+
</div>
8595
</div>
96+
97+
8698
</template>
8799

88100
<script>
89101
/* global Event */
90102
import Tools from '../common/js/tools'
91103
import Info from './Info.vue'
104+
import Indicator from './Indicator.vue'
92105
export default {
93-
components: { Info },
106+
components: { Info,Indicator },
94107
mounted: function () {
95108
// let host = location.host.split('.').splice(-2).join('.');
96109
/* let host = 'baidu.com'
@@ -104,6 +117,7 @@
104117
},
105118
data: function () {
106119
return {
120+
showTitle:false,
107121
showBody: false,
108122
titleIcon: 'chevron-up',
109123
count: 0,
@@ -229,7 +243,11 @@
229243
Tools.dispatchEvent('close')
230244
},
231245
bodySwitch () {
232-
this.showBody = !this.showBody
246+
this.showBody = !this.showBody
247+
setTimeout(()=>{
248+
this.showTitle = this.showBody
249+
},500)
250+
233251
},
234252
open (url) {
235253
window.open(url)

0 commit comments

Comments
 (0)
Back | FazBrowse Home | New Git URL