Caas-Helper

Caas Helper

Dieses Skript sollte nicht direkt installiert werden. Es handelt sich hier um eine Bibliothek für andere Skripte, welche über folgenden Befehl in den Metadaten eines Skriptes eingebunden wird // @require https://update.greasyfork.org/scripts/476875/1260861/Caas-Helper.js

Du musst eine Erweiterung wie Tampermonkey, Greasemonkey oder Violentmonkey installieren, um dieses Skript zu installieren.

Um dieses Skript zu installieren, müssen Sie eine Erweiterung wie Tampermonkey oder Violentmonkey installieren.

Um dieses Skript zu installieren, müssen Sie eine Erweiterung wie Tampermonkey oder Violentmonkey installieren.

Um dieses Skript zu installieren, müssen Sie eine Erweiterung wie Tampermonkey oder Userscripts installieren.

Um dieses Skript zu installieren, müssen Sie eine Erweiterung wie Tampermonkey installieren.

Sie müssten eine Skript Manager Erweiterung installieren damit sie dieses Skript installieren können

(Ich habe schon ein Skript Manager, Lass mich es installieren!)

Um dieses Design zu installieren, müssen Sie eine Erweiterung wie Stylus installieren.

Um dieses Design zu installieren, müssen Sie eine Erweiterung wie Stylus installieren.

Um dieses Design zu installieren, müssen Sie eine Erweiterung wie Stylus installieren.

Um diesen Stil zu installieren, müssen Sie eine Erweiterung für den Benutzerstil Verwaltung installieren.

Um diesen Stil zu installieren, müssen Sie eine Erweiterung für den Benutzerstil Verwaltung installieren.

Um diesen Stil zu installieren, müssen Sie eine Erweiterung für den Benutzerstil Verwaltung installieren.

(Ich habe bereits einen Benutzerstil Verwaltung, ich möchte ihn installieren!)

; (function () {

    window.caasHelper = {
        inited: false,
        init: function () {
            let _this = this
            if (_this.inited) return
            _this.inited = true

            _this.load();

            window.addEventListener('popstate', function (event) {
                _this.load();
            });
        },
        url: '',
        urlInfo: null,
        load: function () {
            if (this.url === window.location.href) return;

            this.url = window.location.href
            this.urlInfo = sinHelper.Url.info(this.url)

            let _callback = this.mapper[this.urlInfo.pathname] || null
            if (!_callback) {
                this.removeNode()
                return;
            }

            this.render(true)

            let _obj = _callback()

            if (typeof _obj === "object" && _obj !== null) {
                if (!_obj.hasOwnProperty('no_xhr') || !_obj['no_xhr']) {
                    sinHelper.Xhr.init()
                }

                if (_obj.hasOwnProperty('init')) {
                    _obj.init()
                }
            }
        },
        mapper: {},
        push: function (_key, _callback) {
            this.mapper[_key] = _callback;
        },

        rendered: false,
        nodeId: '',
        headerClass: '',
        contentClass: '',
        buttonClass: '',
        randStr: function () {
            let _r = '';
            while (_r.length <= 0) { _r = Math.random().toString(36).slice(-8); }
            return _r;
        },
        initNodeSelector: function () {
            this.nodeId = 'caas_helper_container_1uFoY';
            if (!this.contentClass) {
                this.contentClass = 'caas_helper_content_' + this.randStr()
            }
            if (!this.headerClass) {
                this.headerClass = 'caas_helper_header_' + this.randStr()
            }
            if (!this.buttonClass) {
                this.buttonClass = 'caas_helper_button' + this.randStr()
            }
        },
        render: function (_force) {
            let _this = this
            if (_force) {
                this.rendered = false;
                this.removeNode()
            }

            if (this.rendered) return
            this.rendered = true;
            this.initNodeSelector()

            let style = `#${_this.nodeId}{position:fixed;right:16px;top:250px;display:inline-block;background:green;color:#fff;font-size:14px;line-height:30px;text-align:center;min-width:74px;min-height:30px;border-radius:16px;z-index:999999;}` +
                `#${_this.nodeId} .${_this.headerClass}{font-size:18px;font-weight:bold;cursor:pointer;user-select:none;padding:5px 16px;}` +
                `#${_this.nodeId} .${_this.contentClass}{text-align:left;max-height:501px;overflow-y:scroll;padding:0px 16px;scrollbar-width: none;-ms-overflow-style: none;}` +
                `#${_this.nodeId} .${_this.contentClass}::-webkit-scrollbar{display: none;}` +
                `#${_this.nodeId} .${_this.buttonClass}{cursor:pointer;user-select:none;width:100%; padding:5px 0px;text-align:center}` +
                '';

            var _stylenode = document.createElement('style');
            _stylenode.setAttribute("type", "text/css");
            if (_stylenode.styleSheet) {// IE
                _stylenode.styleSheet.cssText = style;
            } else {// w3c
                var cssText = document.createTextNode(style);
                _stylenode.appendChild(cssText);
            }
            _stylenode.id = _this.nodeId + '_style'

            var html = '' +
                '    <div class="' + _this.headerClass + '">\n' + '卡思助手' + '    </div>\n' +
                '    <div class="' + _this.contentClass + '">\n' + '' + '</div>\n' +
                '';

            let _boxnode = document.createElement("div")
            _boxnode.id = _this.nodeId;
            _boxnode.innerHTML = html;

            document.getElementsByTagName("body")[0].appendChild(_boxnode);
            document.body.appendChild(_stylenode);

            this.getNodeHeader().onclick = function () {
                let _c = _this.getNodeContent()
                if (_c.style.display == 'none') {
                    _this.showContent();
                } else {
                    _this.hideContent();
                }
            }
            this.clearContent()
        },
        getNode: function () {
            return document.getElementById(this.nodeId)
        },
        getNodeHeader: function () {
            return this.getNode().getElementsByClassName(this.headerClass)[0];
        },
        getNodeContent: function () {
            return this.getNode().getElementsByClassName(this.contentClass)[0];
        },
        removeNode: function () {
            try {
                document.getElementById(this.nodeId).remove()
            } catch (e) { }
            try {
                document.getElementById(this.nodeId + '_style').remove()
            } catch (e) { }
        },
        clearContent: function () {
            this.setContent('')
        },
        hideContent: function () {
            this.getNodeContent().style.display = 'none';
        },
        showContent: function () {
            this.getNodeContent().style.display = '';
        },
        setContent: function (_src) {
            let _object = {};
            if (typeof _src === "object" && _src !== null) {
                _object = this.buildContent(_src)
            } else {
                _object = { 'html': _src }
            }
            if (!_object['html'] || _object['html'].length <= 0) this.hideContent()

            this.getNodeContent().innerHTML = _object['html'];

            (_object['callback'] || []).forEach(_func => {
                _func()
            })

            this.showContent()
        },
        /* {"aaa": {title:'', html: '', callback: func, options:{}}, 'bbb': {}} */
        buildContent: function (_object) {
            let _html = "", _funcs = []
            for (let _k in _object) {
                let _obj = _object[_k]
                if (!_obj['html']) continue;

                let _boxClass = `${this.contentClass}_item_box`, _titleClass = `${this.contentClass}_item_title`,
                    _htmlClass = `${this.contentClass}_item_html`
                let _boxId = `${_boxClass}_${_k}`, _titleId = `${_titleClass}_${_k}`, _htmlId = `${_htmlClass}_${_k}`

                _html += `<div class="${_boxClass}" id="${_boxId}">\n`
                if (_obj['title']) _html += `<div class="${_titleClass}" id="${_titleId}">${_obj['title']}</div>\n`
                _html += `<div class="${_htmlClass}" id="${_htmlId}">\n`
                _html += _obj['html'] + '\n'
                _html += `</div>\n</div>\n`

                if (_obj['callback']) {
                    if (typeof (_obj['callback']) == 'function') {
                        _funcs.push(_obj['callback'])
                    }
                    if (Object.prototype.toString.call(_obj['callback']) === '[object Array]') {
                        _obj['callback'].forEach(_call => {
                            if (typeof (_call) == 'function') {
                                _funcs.push(_call)
                            }
                        })
                    }
                }
                if (_obj['options'] && _obj['options']['hide_item']) {
                    _funcs.push(function () {
                        let _domTitle = document.getElementById(_titleId), _domHtml = document.getElementById(_htmlId)
                        _domTitle.innerHTML = '点击查看 - ' + _obj['title']
                        _domTitle.style.cursor = 'pointer'
                        _domHtml.style.display = 'none'
                        _domTitle.onclick = function (_e) {
                            if (_domHtml.style.display == 'none') {
                                _domHtml.style.display = ''
                                _domTitle.innerHTML = '点击收起 - ' + _obj['title']
                            } else {
                                _domHtml.style.display = 'none'
                                _domTitle.innerHTML = '点击查看 - ' + _obj['title']
                            }
                        }
                    })
                }
            }
            return {
                'html': _html,
                'callback': _funcs,
            }
        },
        buildButton: function (_text) {
            let btnId = this.nodeId + '_btn_' + new Date().getTime() + (function () { let _r = ''; while (_r.length <= 0) { _r = Math.random().toString(36).slice(-8); } return _r; }());
            let btnHtml = '<div id="' + btnId + '" class="' + this.buttonClass + '">' + _text + '</div>'
            return { btnId, btnHtml }
        },
        bindButtonEvent: function (_id, _function, _event) {
            if (!_event) _event = 'click'
            if (_event === 'click') {
                document.getElementById(_id).onclick = _function
            }
        },
    };

})();