-
Notifications
You must be signed in to change notification settings - Fork 5
/
popup.html
200 lines (178 loc) · 10 KB
/
popup.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="css/bootstrap.3.3.7.min.css">
<link rel="stylesheet" href="css/font-awesome-4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="css/popup.css">
<link rel="stylesheet" href="js/dialog/skins/opera.css">
<style>
.aui_title {
font-size: 14px !important;
}
.aui_main {
max-width: 250px !important;
font-size: 13px !important;
}
.aui_content {
padding: 15px 19px;
}
</style>
</head>
<body>
<div class="container-fluid">
<div class="content-body">
<div class="_tabs">
<ul class="nav nav-tabs">
<li role="presentation" class="active" data-name="player">
<a href="#"><span class="fa fa-play-circle-o"></span> 播放</a>
</li>
<li role="presentation" data-name="insert">
<a href="#"><span class="fa fa-plus-square-o"></span> 添加</a>
</li>
<li role="presentation" data-name="config">
<a href="#"><span class="fa fa-cog"></span> 设置</a>
</li>
<li role="presentation" data-name="info">
<a href="#"><span class="fa fa-info-circle"></span> 关于</a>
</li>
</ul>
</div>
<div class="tab-container">
<section class="tab-box" data-name="player">
<ul class="playlist" >
</ul>
</section>
<section class="tab-box" data-name="insert" style="display: none;">
<div class="insert-player">
<div class="insert-common">
<div class="form-group">
<label>添加类型</label>
<div>
<label class="radio-inline">
<input class="insert-genre" type="radio" name="genre" value="url" vf-bind="genre" vf-rule="require" vf-msg="请选择添加类型" checked> 文章阅读
</label>
<label class="radio-inline">
<input class="insert-genre" type="radio" name="genre" value="text" > 文本阅读
</label>
</div>
</div>
</div>
<div class="insert-url">
<div class="form-group">
<label>文章url</label>
<input type="text" id="source_url_tips" class="form-control" vf-bind="source_url" vf-rule="require|url" vf-msg="请填写文章url" placeholder="目标文章url地址">
<label class="control-label" for="source_url_tips" style="margin-top: 8px;">
<small class="text-warning">
目前支持<a href="#">微信公众号</a>、
<a href="#" class="_target_url" data-url="http://daily.zhihu.com/">知乎日报</a>、
<a href="#" class="_target_url" data-url="https://36kr.com/information/web_news">36氪</a>、
<a href="#" class="_target_url" data-url="https://www.huxiu.com/article">虎嗅</a> 、
<a href="#" class="_target_url" data-url="https://www.guokr.com/">果壳</a>、
<a href="#" class="_target_url" data-url="https://www.jianshu.com/">简书</a>文章
</small>
</label>
</div>
</div>
<div class="insert-text" style="display:none;">
<div class="form-group">
<label>文本标题</label>
<input type="text" class="form-control" vf-bind="title" vf-rule="require" vf-msg="请填写文本标题" placeholder="文本标题">
</div>
<div class="form-group">
<label>文本内容</label>
<textarea class="form-control" rows="6" vf-bind="source_text" vf-rule="require" vf-msg="请填写文本内容" placeholder="阅读文本内容"></textarea>
</div>
</div>
<div class="_btnbox">
<button type="button" class="btn btn-block btn-success btn-sm btn-confirm">确认添加</button>
</div>
</div>
</section>
<section class="tab-box" data-name="config" style="display: none;">
<div class="insert-config">
<div class="form-group">
<label>发音人</label>
<div>
<ul class="nav nav-tabs voice-header">
<li role="presentation" data-group="通用"><a href="#">通用</a></li>
<li role="presentation" data-group="精品"><a href="#">精品</a></li>
<li role="presentation" data-group="方言"><a href="#">方言</a></li>
<li role="presentation" data-group="英语"><a href="#">英语</a></li>
</ul>
<div class="voice-container" id="voice-container">
</div>
</div>
</div>
<div class="form-group">
<label>朗读速度</label>
<select class="form-control" vf-bind="speed">
<option value="normal" selected>正常</option>
<option value="faster">较快</option>
<option value="slower">较慢</option>
<option value="fast">快</option>
<option value="slow">慢</option>
</select>
</div>
<div class="form-group">
<label>播放前提示音</label>
<div>
<label class="radio-inline">
<input type="radio" name="plays_sound" vf-bind="plays_sound" value="1" checked> 开启
</label>
<label class="radio-inline">
<input type="radio" name="plays_sound" value="2"> 关闭
</label>
</div>
</div>
<!--发音人-->
<input type="hidden" vf-bind="voice_name" value="aixia">
<!--分组-->
<input type="hidden" vf-bind="group" value="通用">
</div>
<div class="_btnbox">
<button type="button" class="btn btn-block btn-success btn-sm btn-confirm-config">保存设置</button>
</div>
</section>
<section class="tab-box" data-name="info" style="display: none;">
<div class="_info" style="padding: 10px 5px;">
<blockquote>
<p style="font-size: 14px;">插件目前仅为测试版。</p>
<p style="font-size: 14px;">插件更新及bug修复会及时发布在<mark>github</mark>、<mark>码云</mark>上，请注意关注。</p>
<p style="font-size: 14px;">如有功能建议或使用过程出现bug，可以通过以下几种方式告知：</p>
<p style="font-size: 14px;">1.通过邮件 <mark>[email protected]</mark> 通知我</p>
<p style="font-size: 14px;">2.在<mark>码云</mark>提交点评或<mark>github</mark>提交Issues</p>
<footer> 您需要知道</footer>
</blockquote>
<blockquote style="padding: 3px 20px;">
<p style="font-size: 14px;"><a href="#" class="_target_url" data-url="https://github.com/wxbool/listen-say-google-extend">https://github.com/wxbool/listen-say-google-extend</a></p>
<footer> github</footer>
</blockquote>
<blockquote style="padding: 3px 20px;">
<p style="font-size: 14px;"><a href="#" class="_target_url" data-url="https://gitee.com/641453620/listen-say-google-extend">https://gitee.com/641453620/listen-say-google-extend</a></p>
<footer> 码云</footer>
</blockquote>
</div>
</section>
</div>
<div class="player-boot">
<div class="info">
pause
</div>
<div class="_operate">
<label class="_waiting"></label>
<span class="_start fa fa-play" title="播放"></span>
<span class="_stop fa fa-pause-circle-o" title="暂停" style="display:none;"></span>
</div>
</div>
</div>
</div>
</body>
<script src="js/jquery/jquery.min.js"></script>
<script src="js/app/databind-1.1.4.min.js"></script>
<script src="js/dialog/jquery.artDialog.js"></script>
<script src="js/dialog/plugins/iframeTools.js"></script>
<script src="js/app/common.js"></script>
<script src="js/app/voicetts.js"></script>
<script src="js/app/storage.js"></script>
<script src="js/popup.js"></script>
</html>