Skip to content

Commit c7903f4

Browse files
committed
feat: 优化统一样式体验
feat: 移除多余log导致的卡顿 feat: 支持网站公告
1 parent 40ad37a commit c7903f4

File tree

8 files changed

+351
-151
lines changed

8 files changed

+351
-151
lines changed

res/css/index.css

Lines changed: 12 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
html {
22
box-sizing: border-box;
3-
--bgColorMenu : #1d1d27;
3+
--bgColorMenu : #ffffff12;
44
--duration: 1s;
55
}
66
html *,
@@ -128,6 +128,7 @@ body{
128128
border-radius: 10px;
129129
width: 70%;
130130
margin-left: 15%;
131+
font-weight: bold;
131132
height: 54px;
132133
padding: 0 10px;
133134
font-size: 16px;
@@ -218,7 +219,7 @@ body{
218219
position: relative;
219220
top: 2px;
220221
display: block;
221-
color: #666;
222+
color: #e4d8d8;
222223
text-overflow: ellipsis;
223224
overflow: hidden;
224225
white-space: nowrap;
@@ -437,10 +438,12 @@ body{
437438
padding-left: 15px !important;
438439
width: 80%;
439440
margin-left: 10% !important;
440-
height: 120px;
441+
height: 130px;
441442
display: inline-flex;
442443
}
443444
.userBlock{
445+
text-align: center;
446+
font-weight: bold;
444447
cursor: pointer !important;
445448
margin: 0 0 15px !important;
446449
display: grid !important;
@@ -490,13 +493,12 @@ video{
490493
transition: all 1s;
491494
}
492495
.remoteId{
493-
width: 63px;
494-
margin-top: -20px;
495-
white-space: nowrap;
496-
overflow: hidden;
497-
text-overflow: ellipsis;
496+
margin-top: 0;
498497
position: relative;
498+
top: 0;
499499
right: 0;
500+
word-break: break-all;
501+
height: auto;
500502
}
501503

502504
.sendFilePannel{
@@ -631,7 +633,7 @@ video{
631633
}
632634

633635
.toolList {
634-
transition: all 0.5s ease-in-out;
636+
transition: all 0.3s ease-in-out;
635637
position: relative;
636638
right: 0;
637639
width: 40px;
@@ -646,7 +648,7 @@ video{
646648
color: #d8c9c9;
647649
background-color: rgb(244 129 80 / 0%);
648650
cursor: pointer;
649-
transition: transform 0.8s ease-in-out;
651+
transition: transform 0.5s ease-in-out;
650652
}
651653

652654
.toolList a:hover {

res/index.html

Lines changed: 88 additions & 60 deletions
Large diffs are not rendered by default.

res/js/comm.js

Lines changed: 113 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
11
window.tlrtcfile = {
2-
containChinese: function(str){
2+
containChinese: function (str) {
33
return /[\u4E00-\u9FA5\uF900-\uFA2D]/.test(str);
44
},
5-
containNumber : function(str){
5+
containNumber: function (str) {
66
return /^[0-9]+.?[0-9]*$/.test(str);
77
},
8-
containSymbol : function(str){
8+
containSymbol: function (str) {
99
return new RegExp("[`~!@#$^&*()=|{}':;',\\[\\].<>《》/?~!@#¥……&*()——|{}【】‘;:”“'。,、?]").test(str)
1010
},
11-
genNickName: function () {
11+
genNickNameRandom: function () {
1212
// 获取指定范围内的随机数
1313
function randomAccess(min, max) {
1414
return Math.floor(Math.random() * (min - max) + max)
@@ -84,9 +84,9 @@ window.tlrtcfile = {
8484
let ua = navigator.userAgent;
8585
let networkStr = ua.match(/NetType\/\w+/) ? ua.match(/NetType\/\w+/)[0] : 'NetType/other';
8686
networkStr = networkStr.toLowerCase().replace('nettype/', '');
87-
if(!['wifi','5g','3g','4g','2g','3gnet','slow-2g'].includes(networkStr)){
88-
if(navigator.connection){
89-
networkStr = navigator.connection.effectiveType
87+
if (!['wifi', '5g', '3g', '4g', '2g', '3gnet', 'slow-2g'].includes(networkStr)) {
88+
if (navigator.connection) {
89+
networkStr = navigator.connection.effectiveType
9090
}
9191
}
9292
switch (networkStr) {
@@ -137,56 +137,56 @@ window.tlrtcfile = {
137137
/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i
138138
);
139139
},
140-
closeFullVideo : function(node, type){
140+
closeFullVideo: function (node, type) {
141141
let stream = node.srcObject;
142142
let nodeId = node.id.substr(0, node.id.length - 5);
143-
if(window.layer){
143+
if (window.layer) {
144144
layer.closeAll()
145145
}
146146
$("#mediaShareRoomList").append(`
147147
<div class="swiper-slide mediaShareBlock">
148148
<video id="${nodeId}" autoplay playsinline onclick="tlrtcfile.openFullVideo(this,'${type}')"></video>
149149
</div>
150150
`);
151-
var video = document.querySelector("#"+nodeId);
151+
var video = document.querySelector("#" + nodeId);
152152
video.srcObject = stream
153153
// ios 微信浏览器兼容问题
154154
video.play();
155-
document.addEventListener('WeixinJSBridgeReady',function(){
155+
document.addEventListener('WeixinJSBridgeReady', function () {
156156
video.play();
157-
},false);
157+
}, false);
158158
},
159-
openFullVideo : function(node, type){
159+
openFullVideo: function (node, type) {
160160
let stream = node.srcObject;
161161
let nodeId = node.id + "_full";
162-
if(window.layer){
162+
if (window.layer) {
163163
layer.open({
164164
type: 1,
165165
title: false,
166166
area: [`80%`],
167167
shade: 0.3,
168168
content: `<video id="${nodeId}" autoplay playsinline onclick="tlrtcfile.closeFullVideo(this, '${type}')"></video>`,
169169
success: function (layero) {
170-
document.querySelector("#"+nodeId).parentElement.style.height = "auto"
170+
document.querySelector("#" + nodeId).parentElement.style.height = "auto"
171171

172-
let video = document.querySelector("#"+nodeId);
172+
let video = document.querySelector("#" + nodeId);
173173
video.srcObject = stream;
174174
// ios 微信浏览器兼容问题
175175
video.play();
176-
document.addEventListener('WeixinJSBridgeReady',function(){
176+
document.addEventListener('WeixinJSBridgeReady', function () {
177177
video.play();
178-
},false);
178+
}, false);
179179

180180
//并且需要移除父节点
181-
document.querySelector("#"+node.id).parentElement.remove();
181+
document.querySelector("#" + node.id).parentElement.remove();
182182
},
183-
cancel: function(){
184-
tlrtcfile.closeFullVideo(document.querySelector("#"+nodeId), type);
183+
cancel: function () {
184+
tlrtcfile.closeFullVideo(document.querySelector("#" + nodeId), type);
185185
}
186186
});
187187
}
188188
},
189-
supposeWebrtc: function(rtcConfig){
189+
supposeWebrtc: function (rtcConfig) {
190190
try {
191191
let testRTCPeerConnection = window.RTCPeerConnection || window.webkitRTCPeerConnection || window.mozRTCPeerConnection || window.RTCIceGatherer;
192192
if (testRTCPeerConnection) {
@@ -199,5 +199,96 @@ window.tlrtcfile = {
199199
console.error("浏览器不支持webrtc")
200200
return false;
201201
}
202+
},
203+
scrollToBottom: function (dom, duration, timeout) {
204+
let start = dom.scrollTop;
205+
let end = dom.scrollHeight - dom.clientHeight;
206+
let change = end - start;
207+
let currentTime = 0;
208+
let increment = 20;
209+
210+
function easeOutCubic(t) {
211+
return (t = t / 1 - 1) * t * t + 1;
212+
}
213+
214+
function animateScroll() {
215+
currentTime += increment;
216+
let val = easeOutCubic(currentTime / duration) * change + start;
217+
dom.scrollTop = val;
218+
if (currentTime < duration) {
219+
requestAnimationFrame(animateScroll);
220+
}
221+
}
222+
223+
setTimeout(() => {
224+
animateScroll()
225+
}, timeout);
226+
},
227+
genNickName: function () {
228+
let {adjectives, nouns} = this.nameDatabase()
229+
let adjectiveIndex = Math.floor(Math.random() * adjectives.length);
230+
let nounIndex = Math.floor(Math.random() * nouns.length);
231+
let adjective = adjectives[adjectiveIndex];
232+
let noun = nouns[nounIndex];
233+
let randomNum = Math.floor(Math.random() * 1000);
234+
return adjective + noun + randomNum;
235+
},
236+
nameDatabase: function () {
237+
const adjectives = [
238+
"幽默的", "搞笑的", "疯狂的", "奇怪的", "古怪的", "无聊的", "神秘的", "魔幻的", "风趣的", "调皮的",
239+
"聪明的", "美丽的", "可爱的", "迷人的", "酷的", "萌萌的", "潇洒的", "霸气的", "猛烈的", "光芒的",
240+
"伶俐的", "俏皮的", "小巧的", "细腻的", "娇嫩的", "柔软的", "亲切的", "朴实的", "拘谨的", "高傲的",
241+
"自恋的", "浪漫的", "单纯的", "深情的", "执着的", "冷酷的", "刁蛮的", "天真的", "多情的", "成熟的",
242+
"忧郁的", "神经质的", "孤独的", "怀旧的", "清新的", "淡雅的", "冷艳的", "高冷的", "玩世不恭的", "逆天的",
243+
"暴躁的", "暴力的", "妩媚的", "狡猾的", "自信的", "自卑的", "悲观的", "乐观的", "勇敢的", "胆小的", "快乐的",
244+
"痛苦的", "善良的", "邪恶的", "深邃的", "神圣的", "丰满的", "单薄的", "肥胖的", "瘦弱的", "英俊的", "丑陋的",
245+
"芳香的", "臭气熏天的", "热情的", "冷漠的", "朝气蓬勃的", "干净的", "脏兮兮的", "无忧无虑的", "喜怒无常的",
246+
"平凡的", "非凡的", "害羞的", "热心的", "机智的", "敏捷的", "迟钝的", "聪慧的", "无知的", "真诚的", "虚伪的",
247+
"直率的", "谨慎的", "大胆的", "谦虚的", "傲慢的", "严肃的", "轻松的", "紧张的", "勤劳的", "懒惰的", "守时的",
248+
"迟到的", "坚强的", "软弱的", "聪慧的", "愚笨的", "机灵的", "迟钝的", "淘气的", "乖巧的", "活泼的", "沉默的",
249+
"健康的", "不健康的", "高大的", "矮小的", "长的", "短的", "胖的", "瘦的", "美满的", "不幸的", "富有的", "贫穷的",
250+
"快乐的", "不开心的", "甜美的", "苦涩的", "精明的", "愚蠢的", "聪明的", "智商高的", "心灵手巧的", "笨手笨脚的",
251+
"冷静的", "冲动的", "踏实的", "轻浮的", "温柔的", "粗暴的", "好学的", "讨厌学习的", "好吃的", "不好吃的", "耐心的",
252+
"急躁的", "友善的", "冷漠的", "豁达的", "固执的", "谨慎的", "善良的", "狠毒的", "平和的", "狂躁的", "机会主义的",
253+
"悲观的", "乐观的", "心胸开阔的", "偏狭的", "讲义气的", "不守信用的", "有魅力的", "无趣的", "有思想的", "无聊的",
254+
"谋略深的", "目光短浅的", "善解人意的", "自私的", "坦率的", "虚伪的", "好奇的", "不解风情的", "喜欢交友的",
255+
"独来独往的", "健谈的", "静默的", "喜欢思考的", "机智幽默的", "情感丰富的", "心地善良的", "充满自信的", "天真烂漫的",
256+
"追求完美的", "充满活力的", "喜欢冒险的", "充满创造力的", "沉着冷静的", "目标明确的", "性格温和的", "乐于助人的",
257+
"聪明伶俐的", "重情重义的", "思维敏捷的", "慷慨大方的", "婉约多姿的", "时尚前卫的", "豁达开朗的", "气质高雅的",
258+
"优雅大方的", "沉静深沉的", "坚韧不拔的", "独立自主的", "外向开朗的", "内向沉默的", "深情专注的", "精力旺盛的",
259+
"富于幽默的", "心思细腻的", "喜怒形于色的", "忠心耿耿的", "玩世不恭的", "活力四射的", "脚踏实地的", "注重细节的",
260+
"保守谨慎的", "世故圆滑的", "梦想家的", "勇往直前的", "干练果敢的", "待人友善的", "思想开放的", "敢于挑战的",
261+
"感性洒脱的", "洒脱不羁的", "自我牺牲的", "处事果断的", "好奇心强的", "待人热情的", "热情洋溢的", "孤独悲伤的",
262+
"浪漫多情的", "爱笑的", "不羁的", "傻气的", "不拘小节的", "懒散的", "无聊的", "低调的", "敏感的", "冷酷的", "专注的",
263+
"不屑的", "激情的", "忠诚的", "神秘的", "高傲的", "自由的", "文艺的", "时尚的", "落落大方的", "有才华的", "有气质的",
264+
"阳光的", "风趣的", "天真浪漫的", "爽朗开朗的", "内敛沉静的", "刻苦努力的", "性格迥异的", "个性张扬的", "脾气火爆的",
265+
"傲娇的", "爱撒娇的", "心思缜密的", "理智果断的", "懒惰的", "喜欢拖延的", "有责任感的", "追求自由的", "感性的", "理性的",
266+
"缺乏安全感的", "追求安全感的", "情绪化的", "乐观的", "悲观的", "现实主义的", "理想主义的", "平易近人的", "目中无人的",
267+
"重视亲情的", "重视友情的", "重视爱情的", "有爱心的", "有正义感的", "有同情心的", "有童心的", "有自信的", "胆小怕事的",
268+
"爱唠叨的", "话多的", "话少的", "勇于冒险的", "爱挑战的", "善于发现美的", "自我意识强的", "不喜欢被约束的", "慢热型的",
269+
"热情洋溢的", "容易受伤的", "重视感情的", "善于沟通的", "不善于表达的", "有幽默感的", "平易近人的", "有亲和力的", "脸皮厚的",
270+
"喜欢交际的", "宅男/宅女的", "喜欢独处的", "有自知之明的", "喜欢音乐的", "喜欢阅读的", "喜欢旅行的", "喜欢美食的", "喜欢运动的",
271+
"喜欢摄影的", "喜欢收藏的", "喜欢购物的", "不喜欢出门的", "喜欢挑剔的", "喜欢自省的", "不喜欢评价他人的", "喜欢评价他人的",
272+
"有品位的", "不讲卫生的", "讲究卫生的", "喜欢干净的", "喜欢乱的", "喜欢组织的", "喜欢随意的", "喜欢收纳的"
273+
];
274+
const nouns = [
275+
'狗子', '猫咪', '小鹿', '小熊', '小兔', '小羊', '小猪', '小马', '小狮子', '小老虎',
276+
'小猴子', '小鱼儿', '小乌龟', '小鸟儿', '小蚂蚁', '小蜜蜂', '小蝴蝶', '小蜻蜓', '小螃蟹', '小章鱼',
277+
'小海豚', '小鲨鱼', '小鲸鱼', '小鳄鱼', '小鸭子', '小雪人', '小皮球', '小篮球', '小足球', '小排球',
278+
'小棒球', '小滑板', '小冰棍', '小雨伞', '小手套', '小电影', '小蓝天', '小公主', '小王子', '小玩具',
279+
'小糖果', '小巧克力', '小冰淇淋', '小蛋糕', '小披萨', '小汉堡', '小炸鸡', '小烤鸭', '小鱼丸', '小火锅',
280+
'小串串', '小煎饼', '小油条', '小葱油饼', '小米粥', '小酸奶', '小豆腐', '小饺子', '小包子', '小馄饨',
281+
'小面条', '小牛肉面', '小糯米鸡', '小蒸饺', '小炒面', '小蒸包', '小烤肉', '小烤串', '小花生米', '小太阳',
282+
'小月亮', '小星星', '小彩虹', '小风车', '小气球', '小钢琴', '小吉他', '小音响', '小麦克风', '小演员',
283+
'小画家', '小工程师', '小医生', '小警察', '小消防员', '小司机', '小农民', '小潜水员', '小飞行员', '小篮球',
284+
'小游泳健将', '小跑步冠军', '小武术高手', '小芭蕾舞者', '小沙画家', '小书法家', '小拼图专家', '小玩具收藏家',
285+
'小电影制片人', '小太空旅行家', '超级英雄', '无敌大魔王', '终极霸主', '至尊帝王', '天降巨人', '绝世奇才', '神话之门',
286+
'恐怖怪兽', '魔法使者', '神秘剑客', '不朽传说', '宇宙霸主', '地狱火山', '无尽黑暗', '闪耀之星', '璀璨之光', '金色骑士',
287+
'毁天灭地', '战无不胜', '碾压一切', '绝世高手', '超凡脱俗', '万象之王', '黑暗骑士', '霸天战神', '万众瞩目', '震古烁今',
288+
'纵横天下', '永不磨灭', '恒久不变', '帝国之主', '不屈不挠', '狂暴之王', '超越极限', '魔力无边', '星光闪耀', '无尽追求',
289+
'刀锋之舞', '独步天下', '吞噬万物', '永恒之境', '灭世战神', '海量财富', '神话传说', '唯我独尊', '万剑归宗', '嗜血狂魔',
290+
'深海之王', '幻想之城', '天命之子'
291+
]
292+
return {adjectives, nouns}
202293
}
203294
}

0 commit comments

Comments
 (0)