Widget:网站维护时间线：修订间差异
imported>=海豚= 无编辑摘要 |
imported>=海豚= 无编辑摘要 |
||
| 第12行： | 第12行： | ||
height: 105%; | height: 105%; | ||
left: 0; | left: 0; | ||
top: | top: 43px; | ||
} | } | ||
.timeline figcaption { | .timeline figcaption { | ||
2021年8月14日 (六) 10:47的版本
<style>
- {
margin: 0;
} .timeline {
height: 100%; position: relative;
} .timeline canvas {
position: absolute; width: 100%; height: 105%; left: 0; top: 43px;
} .timeline figcaption {
font-weight: 400; font-size: 24px; text-transform: uppercase; -webkit-text-stroke: .25px;
} .timeline h2 {
font-weight: 400; font-size: 30px; padding-bottom: 20px; color: #b2cde9!important; text-transform: uppercase; line-height: 1.2 !important;
} .timeline h6 {
color: #0090F5!important; font-size: 17px; font-weight: 400;
} .timeline p, .timeline ol {
font-weight: 400; padding: 3px 0 20px 0; color: #575757!important; text-align: justify; width: 70%;
} .timeline ol {
list-style: disc; margin-top: -20px; padding-left: 40px;
} .timeline figure {
float: right; width: 100%;
} .timeline article {
position: relative; width: 38%; overflow: hidden;
} .timeline article:first-of-type {
float: left; text-align: right;
} .timeline article:first-of-type p, .timeline article:first-of-type figure {
float: right;
} .timeline article:last-of-type {
float: right;
} .timeline article:last-of-type h2 {
color: #c6e0aa!important;
} .timeline article:last-of-type h6, .timeline article:last-of-type a {
color: #40aa00!important;
} .timeline article:last-of-type a:hover {
color: #95D40D!important;
} </style> </head> <body>
<section id="timeline">
<canvas id="cvs3"></canvas>
<article>
新增功能
<figure>
<figcaption>全站系统版本更新</figcaption>
2021.6.23
升级至2021年6月23日维基媒体发布的MW1.31.15(c755afe) 补丁版本，此次更新跨越了7个小版本。
</figure>
<figure>
<figcaption>看板娘系统重构</figcaption>
2021.6.26-27
去除冗余代码；新增5个看板娘；加入换装功能（为 pio酱 提供了86套皮肤 / 为 Tia酱 提供了62套皮肤 / 为 22、33 提供了21套皮肤 / 为 22、33 提供了21套皮肤 / 为 海王星 提供了19套皮肤）。
</figure>
<figure>
<figcaption>支持繁简转换</figcaption>
2021.7.12-14
增添繁简转换插件，在左上角显示按钮，可在所有页面使用，支持繁体源代码编辑和繁体字搜索。
</figure>
<figure>
<figcaption>编辑记录页改版</figcaption>
2021.7.15-16
添加图标；引入显示维护组用户的用户组的小工具；并更新最近更改图例。
</figure>
<figure>
<figcaption>左侧显示浮动目录</figcaption>
2021.8.10-12
当条目中的标题超过三个时，条目左侧会出现目录，侧边栏划上去时可以看见，点击可跳转到指定标题。
</figure>
<figure>
<figcaption>用户贡献页改版</figcaption>
2021.8.13
改变顶部用户信息控制栏；维护组用户可分名字空间查看其他用户的编辑数量。
</figure>
</article>
<article>
系统修复
<figure>
<figcaption>全站背景修正</figcaption>
2021.6.23-7.6
修正全站背景《画画的纱雾酱》，重新抠图，减少体积，加快显示效率；加入春天飞鸟的顶部栏背景
</figure>
<figure>
<figcaption>中立性存疑警告改为只为游客展示</figcaption>
2021.7.3
已注册用户在访问含有
</figure>
<figure>
<figcaption>Wikiplus小工具本地化适配</figcaption>
2021.7.4
修复桌面端显示问题，并在移动端加入该工具。
</figure>
<figure>
<figcaption>重写首页及主题导航图片规则</figcaption>
2021.7.28
更正首页和主题导航图片链接，修正失效图片，大大加快访问速度。
</figure>
<figure>
<figcaption>底部导航模板改为默认折叠</figcaption>
2021.8.1
相对较长的导航模板在条目中默认折叠，减少条目空间
</figure>
<figure>
<figcaption>更改验证系统</figcaption>
2021.7.12
改为知识提问型验证系统，不再使用Cloudflare的验证，同时取消其频繁的JS质询
</figure>
<figure>
<figcaption>改变条目中二级标题样式</figcaption>
2021.7.12
为二级标题增加黄底主题色，更符合本站样式
</figure>
</article>
</section> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> <script>
function Timeline(cvs) {
var self = this,
paused = true,
rafid = 0,
mouse = { x: 0, y: 0 },
canvas = cvs,
ctx = null;
self.lines = [];
self.isOK = false;
self.options = {
speed: 0.1,
density: 8,
radius: 600,
};
self.targets = [
[20, 26, 58, 64, 114, 116],
[20, 50, 52, 100 , 106, 110, 116]
];
self.dotColors = [
['#13669b', 'rgba(19, 102, 155, 0.3)', 'rgba(19, 102, 155, 0.08)'],
['#7dd317', 'rgba(113, 222, 15, 0.3)', 'rgba(91, 164, 22, 0.12)'],
];
self.isPaused = function () {
return paused;
};
function InitDots() {
var tl = $('.timeline');
var top = tl.find('h2').outerHeight();
self.lines[0].dots = [];
var y = top;
tl.find('article:first figure').each(function () {
self.lines[0].dots.push([$(this).outerWidth() + 20, y + 20]);
y += $(this).outerHeight();
});
self.lines[1].dots = [];
var y = top;
tl.find('article:last figure').each(function () {
self.lines[1].dots.push([canvas.width - $(this).outerWidth() - 20, y + 20]);
y += $(this).outerHeight();
});
}
function OnResize() {
canvas.width = canvas.offsetWidth;
canvas.height = canvas.offsetHeight;
var wasPaused = paused;
self.toggle(false);
// Init lines
self.lines[0].reset(canvas.offsetWidth / 2 - 15);
self.lines[1].reset(canvas.offsetWidth / 2 + 15);
InitDots();
self.toggle(!wasPaused); }
function init() {
var result = false;
try {
result = !!(canvas.getContext && (ctx = canvas.getContext('2d')));
self.lines[0] = new Line(0, canvas.offsetHeight - 100, '#4789a3', self.options, mouse);
self.lines[1] = new Line(0, canvas.offsetHeight - 100, '#a0d59c', self.options, mouse);
} catch (e) {
return false;
}
$(canvas).mousemove(function (e) {
if (e.offsetX) {
mouse.x = e.offsetX;
mouse.y = e.offsetY;
}
else if (e.layerX) {
mouse.x = e.layerX;
mouse.y = e.layerY;
}
else {
mouse.x = e.pageX - $(canvas).offset().left;
mouse.y = e.pageY - $(canvas).offset().top;
}
});
$(window).resize(OnResize);
OnResize();
return result; }
function Line(y, height, color, options, mouse) {
var self = this;
self.color = color;
self.options = options;
self.mouse = mouse;
self.height = height;
self.dots = [];
self.y = y;
self.points = [];
self.reset = function (x, f) {
self.points = [];
for (var y = self.y; y < self.height; y += self.options.density)
self.points.push(new Point(x, y, self.color));
}
self.update = function () {
for (var i = 0; i < self.points.length; i++)
self.points[i].update(self.mouse, self.options);
}
function Point(x, y) {
this.y = y;
this.x = x;
this.base = { x: x, y: y };
this.update = function (mouse, options) {
var dx = this.x - mouse.x,
dy = this.y - mouse.y,
alpha = Math.atan2(dx, dy),
alpha = (alpha > 0 ? alpha : 2 * Math.PI + alpha),
d = options.radius / Math.sqrt(dx * dx + dy * dy);
this.y += Math.cos(alpha) * d + (this.base.y - this.y) * options.speed;
this.x += Math.sin(alpha) * d + (this.base.x - this.x) * options.speed;
}
}
}
function drawCircle(p, r, color) {
ctx.fillStyle = color;
ctx.beginPath();
ctx.arc(p.x, p.y, r, 0, 2 * Math.PI, true);
ctx.closePath();
ctx.fill();
}
function drawLine(p1, p2) {
ctx.beginPath();
ctx.moveTo(p1.x, p1.y);
ctx.lineTo(p2.x, p2.y);
ctx.stroke();
ctx.closePath();
}
function redraw() {
ctx.clearRect(0, 0, canvas.width, canvas.height);
for (var i = 0; i < 2; i++) {
var points = self.lines[i].points;
ctx.beginPath();
ctx.lineWidth = 2;
ctx.strokeStyle = self.lines[i].color;
ctx.moveTo(points[15].x, points[15].y);
for (var j = 15; j < points.length - 2; j++) {
var point = points[j];
var xc = (points[j + 1].x + point.x) / 2;
var yc = (points[j + 1].y + point.y) / 2;
ctx.quadraticCurveTo(point.x, point.y, xc, yc);
}
ctx.stroke();
ctx.closePath();
// Dots
ctx.lineWidth = 1.2;
ctx.strokeStyle = self.dotColors[i][2];
for (var j = 0; j < self.lines[i].dots.length; j++) {
var dot = self.lines[i].dots[j],
id = self.targets[i][j];
dot2 = [
(self.lines[i].points[id].x + self.lines[i].points[id + 1].x) / 2,
(self.lines[i].points[id].y + self.lines[i].points[id + 1].y) / 2,
];
var p1 = { x: dot[0], y: dot[1] };
var p2 = { x: dot2[0], y: dot2[1] };
drawLine(p1, p2);
drawCircle(p1, 4, self.dotColors[i][0]);
drawCircle(p2, 11, self.dotColors[i][1]);
drawCircle(p2, 5.5, self.dotColors[i][0]);
}
}
}
function animate() {
rafid = requestAnimationFrame(animate);
self.lines[0].update();
self.lines[1].update();
redraw(); }
self.toggle = function (run) {
if (!self.isOK) return false;
if (run === undefined)
self.toggle(!paused);
else if (!!run && paused) {
paused = false;
animate();
}
else if (!!!run) {
paused = true;
cancelAnimationFrame(rafid);
}
return true;
}
self.isOK = init();
} new Timeline($('#cvs3').get(0)).toggle(true); </script>