https://lingyuzhao.top/js/navigation.js

1/**
2 * 构建一个导航栏
3 * @param name 导航栏中的标题
4 * @param hidden 是否隐藏导航栏 默认不隐藏
5 */
6function makeNavigation(name, hidden = false) {
7    document.write(
8        `<div class='navigation_BigDiv' ${hidden ? "style='display: none'" : ""}><div class='logo_title two_pages glass-effect'>` +
9        "    <div class='left navigation_left scrollbar_x' title='点击隐藏/显示左边导航栏!' onclick='swapLeftHiddeMode()'>\n" +
10        "        <img alt='导航' id='logo' src='/image/logo.svg'>\n" +
11        "        <h3 id='web-title'>" + name + "</h3>\n" +
12        "    </div>\n" +
13        "\n" +
14        "    <div class='right navigation scrollbar_x'>\n" +
15        "        <ul style='text-align: end'>\n" +
16        "            <li>\n" +
17        "                <form id='nav_search_input_form' action='/'>" +
18        "                     <input id='nav_search_input' name='search' placeholder='搜索用户与文章' required>" +
19        "                     <button hidden type='submit'></button>" +
20        "                </form>\n" +
21        "            </li>\n" +
22        "            <li>\n" +
23        "                <span id='sum_web_seeCount' title='网站所有文章的总热度(网站公告除外)'></span>\n" +
24        "            </li>\n" +
25        "            <li class='pc_allow'>\n" +
26        "                <a href='/index.html'>主页</a>\n" +
27        "            </li>\n" +
28        "            <li>\n" +
29        "                <a id='click_login_user' class='click_login_button'>点击登录</a>\n" +
30        "                <img class='headSculpture' src='image/logo.svg' alt='头像加载失败' onclick='document.getElementById(\"click_login_user\").click()'>" +
31        "            </li>\n" +
32        "        </ul>\n" +
33        "    </div>\n" +
34        "</div></div>")
35    // 生成网站总热度
36    const sum_web_seeCount = document.getElementById("sum_web_seeCount");
37    sum_web_seeCount.appendChild(getHotSpanElement(0))
38    sum_web_seeCount.style.display = 'none'
39    // 如果是移动端 就直接将导航栏的ul最大高度 以及其中所有文字字体改为 30px
40    if (isMobileDevice()) {
41        const elementNodeListOf = document.querySelectorAll(".navigation > ul");
42        for (let i = 0; i < elementNodeListOf.length; i++) {
43            elementNodeListOf[i].style.maxHeight = '22px';
44        }
45        const elementNodeListOf1 = document.querySelectorAll(".navigation a,.navigation span, #web-title");
46        for (let i = 0; i < elementNodeListOf1.length; i++) {
47            elementNodeListOf1[i].style.fontSize = '22px';
48        }
49    }
50}
51
52/**
53 * 构建一个自定义按钮的导航栏
54 * @param name 导航栏中的标题
55 * @param button_all {
56 *     {
57 *         id, innerText
58 *     }
59 * }导航栏中的所有按钮以及按钮对应的 id
60 */
61function makeNavigation_UDButton(name, button_all) {
62    document.write("<div class='logo_title two_pages'>\n" +
63        "    <div class='left'>\n" +
64        "        <img alt='导航' id='ud_logo' src='/image/logo.svg'>\n" +

65        "        <h3 id='ud_web-title'>" + name + "</h3>\n" +
66        "    </div>\n" +
67        "\n" +
68        "    <div class='right navigation'>\n" +
69        "        <ul>\n");
70
71    for (let buttonAllKey in button_all) {
72        const buttonAllElement = button_all[buttonAllKey];
73        document.write(
74            "            <li>\n" +
75            "                <a id='" + buttonAllElement.id + "'>" + buttonAllElement.innerText + "</a>\n" +
76            "            </li>\n"
77        );
78    }
79
80    document.write(
81        "        </ul>\n" +
82        "    </div>\n" +
83        "</div>"
84    )
85}
86let Sum_web_seeCount_value = 0;
87
88/**
89 *
90 * @param newValue 设置导航栏中热度显示的数值
91 */
92function setSum_web_seeCount(newValue) {
93    document.querySelectorAll("#sum_web_seeCount .hot_value")[0].innerText = convertUnit(newValue)
94    if (newValue === 1) {
95        document.getElementById("sum_web_seeCount").style.display = 'none';
96    } else {
97        document.getElementById("sum_web_seeCount").style.display = 'inline';
98    }
99    Sum_web_seeCount_value = typeof newValue === 'string' ? parseFloat(newValue) : newValue;
100}
101
102/**
103 * 获取到导航栏中热度显示的数值
104 * @return {number} 导航栏中热度显示的数值
105 */
106function getSum_web_seeCount() {
107    return Sum_web_seeCount_value;
108}
109
110let nowLeftIsHidden = false;
111
112/**
113 * 切换左导航栏隐藏状态
114 */
115function swapLeftHiddeMode() {
116    if (nowLeftIsHidden) {
117        nowLeftIsHidden = false;
118        showLeftNavigationBar()
119    } else {
120        nowLeftIsHidden = true;
121        hiddenLeftNavigationBar()
122    }
123}