cmx-timeline-toggle

控制是否显示时间线

您需要先安裝使用者腳本管理器擴展,如 TampermonkeyGreasemonkeyViolentmonkey 之後才能安裝該腳本。

You will need to install an extension such as Tampermonkey to install this script.

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyUserscripts 後才能安裝該腳本。

你需要先安裝一款使用者腳本管理器擴展,比如 Tampermonkey,才能安裝此腳本

您需要先安裝使用者腳本管理器擴充功能後才能安裝該腳本。

(我已經安裝了使用者腳本管理器,讓我安裝!)

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

(我已經安裝了使用者樣式管理器,讓我安裝!)

// ==UserScript==
// @name         cmx-timeline-toggle
// @namespace    https://zhuzi.dev
// @version      0.1
// @description  控制是否显示时间线
// @author       Bambooom
// @match        https://m.cmx.im/web/*
// @icon         https://www.google.com/s2/favicons?domain=m.cmx.im
// @grant        none
// ==/UserScript==

(async function() {
  'use strict';

  var localKey = 'SHOW_TIMELINE';

  // https://gist.github.com/jwilson8767/db379026efcbd932f64382db4b02853e
  function divReady(selector) {
    return new Promise((resolve, reject) => {
      let el = document.querySelector(selector);
      if (el) { resolve(el); }

      new MutationObserver((_, observer) => {
        // Query for elements matching the specified selector
        Array.from(document.querySelectorAll(selector)).forEach((element) => {
          resolve(element);
          //Once we have resolved we don't need the observer anymore.
          observer.disconnect();
        });
      })
        .observe(document.documentElement, {
          childList: true,
          subtree: true
        });
    });
  }

  function toggleCols(cols, show = true) {
    cols.forEach(function(col) {
      if (show) {
        col.style.display = 'flex';
      } else {
        col.style.display = 'none';
      }
    });
  }

  await divReady('.compose-form .compose-form__publish');
  await divReady('div.column');

  var div = document.querySelector('.compose-form .compose-form__publish');
  var button = div.firstElementChild;
  var toggle = document.createElement('div');
  var localValue = localStorage.getItem(localKey) === '1' ? 1 : 0;
  toggle.innerHTML = `<label class="checkbox"><input id="show-timeline" type="checkbox" checked/>显示时间线</label>`;
  div.insertBefore(toggle, button);
  div.style.justifyContent = 'space-between';
  div.style.alignItems = 'center';

  var check = document.getElementById('show-timeline');
  check.checked = !!localValue;
  check.onclick = function (e) {
    var val = e.target.checked ? 1 : 0;
    localStorage.setItem(localKey, val);
    var cols = Array.from(document.getElementsByClassName('column'));
    toggleCols(cols, !!val);
  };

  await divReady('.column .item-list');
  setTimeout(function() {
    if (!localValue) {
      var cols = Array.from(document.getElementsByClassName('column'));
      toggleCols(cols, !!localValue);
    }
  }, 1000);
})();