@tomiaa/hitokoto/es/index.js

hitokoto 一言的无依赖 JS 库

import './style.css';
var n = Object.defineProperty;
var r = (s, t, e) => t in s ? n(s, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : s[t] = e;
var i = (s, t, e) => (r(s, typeof t != "symbol" ? t + "" : t, e), e);
import { createNamespacs as l } from "@tomiaa/utils";
import "./index.scss.js";
import h from "axios";
const a = h.create({
  baseURL: "https://hitokoto.cn/api"
}), o = l("hitokoto"), d = '<svg width="24" height="24" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" ><rect width="48" height="48" fill="currentColor" fill-opacity="0.01" ></rect><path d="M15 8C8.92487 8 4 12.9249 4 19C4 30 17 40 24 42.3262C31 40 44 30 44 19C44 12.9249 39.0751 8 33 8C29.2797 8 25.9907 9.8469 24 12.6738C22.0093 9.8469 18.7203 8 15 8Z" fill="currentColor" stroke="#ff93a0" stroke-width="4" stroke-linecap="round" stroke-linejoin="round" ></path></svg>';
class k {
  constructor(t) {
    i(this, "data");
    i(this, "options", {
      movingBorderColor: "#42b883",
      interval: 1e4
    });
    i(this, "el");
    // 内容
    i(this, "word", document.createElement("div"));
    // 出处
    i(this, "author", document.createElement("div"));
    // 喜欢
    i(this, "elLike", document.createElement("div"));
    i(this, "timer", 0);
    Object.assign(this.options, t);
    const { el: e } = t;
    typeof e == "string" ? this.el = document.querySelector(e) : this.el = e, this.el.style.setProperty(
      "--moving-border-color",
      this.options.movingBorderColor
    ), this.el.classList.add(o.b()), this.init(), this.getData(), this.el.addEventListener("mouseover", () => {
      clearTimeout(this.timer);
    }), this.el.addEventListener("mouseout", this.autoGet.bind(this));
  }
  init() {
    const t = document.createElement("div");
    t.classList.add(o.e("info")), t.innerHTML = '<div class="left">『</div>', this.word.classList.add("word"), t.innerHTML += '<div class="right">』</div>', t.appendChild(this.word), this.el.appendChild(t), this.author.classList.add(o.e("author")), this.el.appendChild(this.author), this.elLike.classList.add(o.e("like")), this.elLike.onclick = this.like.bind(this), this.elLike.innerHTML = d, this.el.appendChild(this.elLike);
  }
  autoGet() {
    this.options.interval && (this.timer = window.setTimeout(
      this.getData.bind(this),
      this.options.interval
    ));
  }
  async getData() {
    window.clearTimeout(this.timer), this.elLike.style.color = "transparent";
    const { data: t } = await a.get("https://v1.hitokoto.cn?encode=json");
    this.data = t, this.word.innerText = t.hitokoto, this.author.innerText = `——${t.from_who || ""}「${t.from || ""}」`, this.getLikeNum(), this.autoGet();
  }
  // 获取喜欢数量
  async getLikeNum() {
    const { data: t } = await a(
      `/common/v1/like?sentence_uuid=${this.data.uuid}`
    );
    this.elLike.dataset.num = this.data.total = t.data[0].total;
  }
  // 喜欢
  async like() {
    await a(`/restful/v1/like?sentence_uuid=${this.data.uuid}`), this.elLike.style.color = "#f04a83", this.elLike.dataset.num = ++this.data.total + "";
  }
}
export {
  k as Hitokoto,
  k as default
};