H萌娘

Widget:网站维护时间线：修订间差异

imported>=海豚=
无编辑摘要
imported>=海豚=
无编辑摘要
 
（未显示同一用户的2个中间版本）
第82行： 第82行：
<body>
<body>
    <section id="timeline">
    <section id="timeline">
    <div class="timeline">
    <div class="timeline">
      <canvas id="cvs3"></canvas>
      <canvas id="cvs3"></canvas>
第130行： 第129行：
        </figure>
        </figure>
        <figure>
        <figure>
          <figcaption>讨论 页 分功能导航指向</figcaption>
          <figcaption>讨论 版 分功能导航指向</figcaption>
          <h6>2021.8.27</h6>
          <h6>2021.8.27</h6>
          <p>
          <p>
            加入讨论 页 导航，分功能指向不同版面，方便用户按需求反馈 信息 。
            加入讨论 版 导航，分功能指向不同版面，方便用户按需求反馈 问题 。
          </p>
          </p>
        </figure>
        </figure>
第192行： 第191行：
          <h6>2021.8.20</h6>
          <h6>2021.8.20</h6>
          <p>
          <p>
            在条目顶部加入选项工具，更好的方便用户使用 ， 更改部分页面以适配APP。
            在 移动端 条目顶部加入选项工具，更好的方便用户使用 ；同时 更改部分页面以适配APP。
          </p>
          </p>
        </figure>
        </figure>
第198行： 第197行：
      <br style="clear:both" />
      <br style="clear:both" />
    </div>
    </div>
</section>
</section>
</body>
</body>
第204行： 第202行：
<script>
<script>
    function Timeline(cvs) {
    function Timeline(cvs) {
    var self = this,
    var self = this,
      paused = true,
      paused = true,
第211行： 第208行：
      canvas = cvs,
      canvas = cvs,
      ctx = null;
      ctx = null;
    self.lines = [];
    self.lines = [];
    self.isOK = false;
    self.isOK = false;
    self.options = {
    self.options = {
第228行： 第223行：
      ['#7dd317', 'rgba(113, 222, 15, 0.3)', 'rgba(91, 164, 22, 0.12)'],
      ['#7dd317', 'rgba(113, 222, 15, 0.3)', 'rgba(91, 164, 22, 0.12)'],
    ];
    ];
    self.isPaused = function () {
    self.isPaused = function () {
      return paused;
      return paused;
    };
    };
    function InitDots() {
    function InitDots() {
      var tl = $('.timeline');
      var tl = $('.timeline');
      var top = tl.find('h2').outerHeight();
      var top = tl.find('h2').outerHeight();
      self.lines[0].dots = [];
      self.lines[0].dots = [];
      var y = top;
      var y = top;
      tl.find('article:first figure').each(function () {
      tl.find('article:first figure').each(function () {
        self.lines[0].dots.push([$(this).outerWidth() + 20, y + 20]);
        self.lines[0].dots.push([$(this).outerWidth() + 20, y + 20]);
        y += $(this).outerHeight();
        y += $(this).outerHeight();
      });
      });
      self.lines[1].dots = [];
      self.lines[1].dots = [];
      var y = top;
      var y = top;
      tl.find('article:last figure').each(function () {
      tl.find('article:last figure').each(function () {
        self.lines[1].dots.push([canvas.width - $(this).outerWidth() - 20, y + 20]);
        self.lines[1].dots.push([canvas.width - $(this).outerWidth() - 20, y + 20]);
        y += $(this).outerHeight();
        y += $(this).outerHeight();
      });
      });
    }
    }
    function OnResize() {
    function OnResize() {
      canvas.width = canvas.offsetWidth;
      canvas.width = canvas.offsetWidth;
      canvas.height = canvas.offsetHeight;
      canvas.height = canvas.offsetHeight;
      var wasPaused = paused;
      var wasPaused = paused;
      self.toggle(false);
      self.toggle(false);
第265行： 第250行：
      self.lines[0].reset(canvas.offsetWidth / 2 - 15);
      self.lines[0].reset(canvas.offsetWidth / 2 - 15);
      self.lines[1].reset(canvas.offsetWidth / 2 + 15);
      self.lines[1].reset(canvas.offsetWidth / 2 + 15);
      InitDots();
      InitDots();
      self.toggle(!wasPaused);
      self.toggle(!wasPaused);
    }
    }
    function init() {
    function init() {
      var result = false;
      var result = false;
      try {
      try {
        result = !!(canvas.getContext && (ctx = canvas.getContext('2d')));
        result = !!(canvas.getContext && (ctx = canvas.getContext('2d')));
        self.lines[0] = new Line(0, canvas.offsetHeight - 100, '#4789a3', self.options, mouse);
        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);
        self.lines[1] = new Line(0, canvas.offsetHeight - 100, '#a0d59c', self.options, mouse);
      } catch (e) {
      } catch (e) {
        return false;
        return false;
      }
      }
      $(canvas).mousemove(function (e) {
      $(canvas).mousemove(function (e) {
        if (e.offsetX) {
        if (e.offsetX) {
          mouse.x = e.offsetX;
          mouse.x = e.offsetX;
第298行： 第276行：
        }
        }
      });
      });
      $(window).resize(OnResize);
      $(window).resize(OnResize);
      OnResize();
      OnResize();
      return result;
      return result;
    }
    }
    function Line(y, height, color, options, mouse) {
    function Line(y, height, color, options, mouse) {
      var self = this;
      var self = this;
      self.color = color;
      self.color = color;
      self.options = options;
      self.options = options;
第315行： 第288行：
      self.dots = [];
      self.dots = [];
      self.y = y;
      self.y = y;
      self.points = [];
      self.points = [];
      self.reset = function (x, f) {
      self.reset = function (x, f) {
        self.points = [];
        self.points = [];
第323行： 第294行：
          self.points.push(new Point(x, y, self.color));
          self.points.push(new Point(x, y, self.color));
      }
      }
      self.update = function () {
      self.update = function () {
        for (var i = 0; i < self.points.length; i++)
        for (var i = 0; i < self.points.length; i++)
          self.points[i].update(self.mouse, self.options);
          self.points[i].update(self.mouse, self.options);
      }
      }
      function Point(x, y) {
      function Point(x, y) {
        this.y = y;
        this.y = y;
        this.x = x;
        this.x = x;
        this.base = { x: x, y: y };
        this.base = { x: x, y: y };
        this.update = function (mouse, options) {
        this.update = function (mouse, options) {
          var dx = this.x - mouse.x,
          var dx = this.x - mouse.x,
第340行： 第308行：
            alpha = (alpha > 0 ? alpha : 2 * Math.PI + alpha),
            alpha = (alpha > 0 ? alpha : 2 * Math.PI + alpha),
            d = options.radius / Math.sqrt(dx * dx + dy * dy);
            d = options.radius / Math.sqrt(dx * dx + dy * dy);
          this.y += Math.cos(alpha) * d + (this.base.y - this.y) * options.speed;
          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;
          this.x += Math.sin(alpha) * d + (this.base.x - this.x) * options.speed;
第346行： 第313行：
      }
      }
    }
    }
    function drawCircle(p, r, color) {
    function drawCircle(p, r, color) {
      ctx.fillStyle = color;
      ctx.fillStyle = color;
第354行： 第320行：
      ctx.fill();
      ctx.fill();
    }
    }
    function drawLine(p1, p2) {
    function drawLine(p1, p2) {
      ctx.beginPath();
      ctx.beginPath();
第362行： 第327行：
      ctx.closePath();
      ctx.closePath();
    }
    }
    function redraw() {
    function redraw() {
      ctx.clearRect(0, 0, canvas.width, canvas.height);
      ctx.clearRect(0, 0, canvas.width, canvas.height);
      for (var i = 0; i < 2; i++) {
      for (var i = 0; i < 2; i++) {
        var points = self.lines[i].points;
        var points = self.lines[i].points;
        ctx.beginPath();
        ctx.beginPath();
        ctx.lineWidth = 2;
        ctx.lineWidth = 2;
        ctx.strokeStyle = self.lines[i].color;
        ctx.strokeStyle = self.lines[i].color;
        ctx.moveTo(points[15].x, points[15].y);
        ctx.moveTo(points[15].x, points[15].y);
        for (var j = 15; j < points.length - 2; j++) {
        for (var j = 15; j < points.length - 2; j++) {
          var point = points[j];
          var point = points[j];
          var xc = (points[j + 1].x + point.x) / 2;
          var xc = (points[j + 1].x + point.x) / 2;
          var yc = (points[j + 1].y + point.y) / 2;
          var yc = (points[j + 1].y + point.y) / 2;
          ctx.quadraticCurveTo(point.x, point.y, xc, yc);
          ctx.quadraticCurveTo(point.x, point.y, xc, yc);
        }
        }
        ctx.stroke();
        ctx.stroke();
        ctx.closePath();
        ctx.closePath();
        // Dots
        // Dots
        ctx.lineWidth = 1.2;
        ctx.lineWidth = 1.2;
第397行： 第353行：
              (self.lines[i].points[id].y + self.lines[i].points[id + 1].y) / 2,
              (self.lines[i].points[id].y + self.lines[i].points[id + 1].y) / 2,
            ];
            ];
          var p1 = { x: dot[0], y: dot[1] };
          var p1 = { x: dot[0], y: dot[1] };
          var p2 = { x: dot2[0], y: dot2[1] };
          var p2 = { x: dot2[0], y: dot2[1] };
          drawLine(p1, p2);
          drawLine(p1, p2);
          drawCircle(p1, 4, self.dotColors[i][0]);
          drawCircle(p1, 4, self.dotColors[i][0]);
          drawCircle(p2, 11, self.dotColors[i][1]);
          drawCircle(p2, 11, self.dotColors[i][1]);
          drawCircle(p2, 5.5, self.dotColors[i][0]);
          drawCircle(p2, 5.5, self.dotColors[i][0]);
第410行： 第362行：
      }
      }
    }
    }
    function animate() {
    function animate() {
      rafid = requestAnimationFrame(animate);
      rafid = requestAnimationFrame(animate);
      self.lines[0].update();
      self.lines[0].update();
      self.lines[1].update();
      self.lines[1].update();
      redraw();
      redraw();
    }
    }
    self.toggle = function (run) {
    self.toggle = function (run) {
      if (!self.isOK) return false;
      if (!self.isOK) return false;
      if (run === undefined)
      if (run === undefined)
        self.toggle(!paused);
        self.toggle(!paused);
      else if (!!run && paused) {
      else if (!!run && paused) {
        paused = false;
        paused = false;
第436行： 第382行：
      return true;
      return true;
    }
    }
    self.isOK = init();
    self.isOK = init();
}
}

2021年8月27日 (五) 20:37的最新版本

Only for H萌娘:维护日志

取自“https://hmoegirl.com/index.php?title=Widget:网站维护时间线&oldid=59419”