Apq
/
FeHelper
mirror of https://github.com/zxlie/FeHelper.git


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159
							<!DOCTYPE HTML>
<html lang="zh-CN">
<head>
    <title>FeHelper配置项</title>
    <meta charset="utf-8">
    <link rel="stylesheet" href="index.css"/>
    <script type="text/javascript" src="../static/vendor/evalCore.min.js"></script>
    <script type="text/javascript" src="../static/vendor/vue/vue.js"></script>
</head>
<body>

<div class="wrapper" id="pageContainer">

    <div class="panel-low-version" v-if="!es6Support">
        FeHelper无法在<b>此低版本</b>的浏览器上正常工作！建议<b>升级到最新版</b>后再继续使用哦~~~
    </div>

    <div v-cloak v-if="es6Support">
        <div class="panel panel-default mod-header">
            <div class="panel-heading">
                <h3 class="panel-title">
                    <a href="http://www.baidufe.com/fehelper/feedback.html" target="_blank" class="x-a-high">
                        <img src="../static/img/fe-16.png" alt="fehelper"/> FeHelper</a>：配置页
                        <span class="x-donate" ref="donate" @mouseover="donateToggle($event)" @mouseout="donateToggle($event)">(<img
                                src="./coffee.png" width="20" alt="">{{donate.text}})</span>
                    <span class="ui-fl-r x-cur-version"><b>当前版本</b><i>v{{manifest.version}}</i></span>
                </h3>

                <div class="box-donate hide" ref="boxDonate">
                    <img :src="donate.image" alt="donate" style="margin: 15px;width:450px">
                </div>
            </div>
        </div>

        <div class="panel-body mod-content">

        <div class="row">
            <h4># FH快捷键</h4>

            <a href="#" @click="setShortcuts" id="setShortcuts">&gt;&gt; 点击配置FeHelper快捷键（当前快捷键为：{{ defaultKey }}）&gt;&gt;</a> <br>
            <div class="x-tips">
                Tips：按下<b>快捷键</b>，自动打开FeHelper工具！然后用「上/下」方向键选择功能，「回车键」直接打开！
            </div>
        </div>

        <div class="row ui-mt-10">
            <h4># FH基本配置</h4>

            <div class="st-item">
                <input type="checkbox" value="OPT_ITEM_CONTEXTMENUS" id="opt_item_contextMenus" v-model="selectedOpts"/>
                <label for="opt_item_contextMenus">将&nbsp;<b><i>FeHelper工具</i></b>&nbsp;添加到右键菜单<span class="x-tips">（如果你喜欢用右键菜单来使用FeHelper的方式，那可以在这里开启）</span></label> <br/>

                <div class="box-inner row ui-ml-20" :class="{'x-disabled':!selectedOpts.includes('OPT_ITEM_CONTEXTMENUS')}">
                    <div class="row-line">
                        <input type="checkbox" id="MENU_DOWNLOAD_CRX" v-model="menuDownloadCrx" :disabled="!selectedOpts.includes('OPT_ITEM_CONTEXTMENUS')"/>
                        <label for="MENU_DOWNLOAD_CRX">将&nbsp;<b><i>插件分享/下载</i></b>&nbsp;添加到右键菜单</label>
                    </div>
                    <div class="row-line">
                        <input type="checkbox" id="MENU_FEHELPER_SETTING" v-model="menuFeHelperSeting" :disabled="!selectedOpts.includes('OPT_ITEM_CONTEXTMENUS')"/>
                        <label for="MENU_FEHELPER_SETTING">将&nbsp;<b><i>FeHelper设置</i></b>&nbsp;添加到右键菜单</label>
                    </div>
                </div>
            </div>

            <div class="st-item">
                <input type="checkbox" value="FORBID_OPEN_IN_NEW_TAB" id="FORBID_OPEN_IN_NEW_TAB" v-model="selectedOpts"/>
                <label for="FORBID_OPEN_IN_NEW_TAB">禁止在多个 Tab页/窗口 同时打开<span class="x-tips">（如果同一个工具，您只希望保留一个活动窗口，那可以勾选上）</span></label> <br/>
            </div>

            <div class="st-item">
                <input type="checkbox" value="CONTENT_SCRIPT_ALLOW_ALL_FRAMES" id="CONTENT_SCRIPT_ALLOW_ALL_FRAMES" v-model="selectedOpts"/>
                <label for="CONTENT_SCRIPT_ALLOW_ALL_FRAMES">授权FeHelper访问页面所有iframe<span class="x-tips">（默认不对网页内嵌的iframe支持，如果有需要可自行开启）</span></label> <br/>
            </div>

            <div class="st-item">
                <input type="checkbox" value="JSON_PAGE_FORMAT" id="JSON_PAGE_FORMAT" v-model="selectedOpts"/>
                <label for="JSON_PAGE_FORMAT">开启JSON自动美化功能（<span class="x-tips">页面<b><i>自动检测并格式化</i></b>，您可在JSON自动美化页面进行工具<b><i>高级定制</i></b>，包括皮肤自定义等）</span></label> <br/>
            </div>

            <div class="st-item" v-if="!isFirefox">
                <input type="checkbox" value="AUTO_DARK_MODE" id="AUTO_DARK_MODE" v-model="selectedOpts"/>
                <label for="AUTO_DARK_MODE">自动开启夜间模式（<span class="x-tips">眼睛保卫战，晚上<b><i>19:00~06:00</i></b>使用工具的时候自动开启夜间模式）</span></label>
                <a href="#" class="a-btn" @click="turnLight($event)">体验一下夜间模式！</a>
                <span class="x-count-down" v-cloak v-if="countDown>0">本次体验将在<b>{{countDown}}秒</b>后自动结束...</span> <br/>

                <div class="box-inner row ui-ml-20" :class="{'x-disabled':!selectedOpts.includes('AUTO_DARK_MODE')}">
                    <div class="row-line">
                        <input type="checkbox" value="ALWAYS_DARK_MODE" id="ALWAYS_DARK_MODE" v-model="selectedOpts" :disabled="!selectedOpts.includes('AUTO_DARK_MODE')"/>
                        <label for="ALWAYS_DARK_MODE">始终开启夜间模式（<span class="x-tips">忽略时间限制，随时Dark Mode）</span></label>
                    </div>
                </div>
            </div>
        </div>

        <div class="row ui-mt-10">
            <button class="btn btn-success" @click="save()">保存</button>
            <button class="btn btn-danger"  @click="cancel()">放弃</button>
        </div>

        <div class="row ui-mt-10">
            <hr>
            <h4># FH应用市场 <span class="x-tips">（严格遵循Google官方要求的插件<span class="t-hlt">「单一用途原则」</span>，所以就按需安装吧！当然，你也可以<a href="#" @click="openFeOnline()">&nbsp;去官网使用在线免安装版&gt;&gt;</a>）</span></h4>

            <ul class="mod-dynamic-tool">
                <li v-for="(tool,index) in Object.keys(fhTools)" v-if="!fhTools[tool]._devTool && tool !== 'devtools'">
                    <i>{{fhTools[tool].menuConfig && fhTools[tool].menuConfig[0] && fhTools[tool].menuConfig[0].icon || '@'}}</i>
                    <b>{{fhTools[tool].name}}</b>
                    <span class="x-tips">（{{fhTools[tool].tips}}）</span>

                    <span class="ui-fl-r x-btn-box">
                        <button class="btn btn-success btn-xs" @click="install(tool,$event)" v-if="!fhTools[tool].installed">安装<span class="x-progress"></span></button>
                        <button class="btn btn-danger btn-xs" @click="offLoad(tool,$event)" v-if="fhTools[tool].installed">卸载</button>

                        <button class="btn btn-xs" :class="fhTools[tool].menu ? 'btn-warning' : 'btn-info'" @click="menuMgr(tool,$event)" v-if="fhTools[tool].installed">{{fhTools[tool].menu ? '移出' : '加入'}}右键</button>
                    </span>

                    <span class="ui-fl-r x-sort-box" v-if="fhTools[tool].installed">
                        <i title="上移" :class="index === 0 ? 'x-hidden' : ''" @click="sortUp(index)">⇧</i>
                        <i title="下移" :class="index === sortArray.length-1 ? 'x-hidden' : ''" @click="sortDown(index)">⇩</i>
                    </span>
                </li>
            </ul>
        </div>

        <div class="row ui-mt-10">
            <hr>
            <h4># FH开发者板块  <span class="x-tips">（FeHelper开放平台化，你可以在安装<span class="t-hlt">「{{fhTools.devtools && fhTools.devtools.name}}」</span>后，开发属于你自己的FH工具！）</span></h4>

            <ul class="mod-dynamic-tool">
                <li v-for="(tool,index) in Object.keys(fhTools)" v-if="fhTools[tool]._devTool || tool === 'devtools'">
                    <i>{{fhTools[tool].menuConfig && fhTools[tool].menuConfig[0] && fhTools[tool].menuConfig[0].icon || '@'}}</i>
                    <b>{{fhTools[tool].name}}</b>
                    <span class="x-tips">（{{fhTools[tool].tips}}）</span>

                    <span class="ui-fl-r x-btn-box">
                        <template v-if="tool === 'devtools'">
                            <button class="btn btn-danger btn-xs" @click="install(tool,$event)" v-if="!fhTools[tool].installed">安装</button>
                            <button class="btn btn-danger btn-xs" @click="offLoad(tool,$event)" v-if="fhTools[tool].installed && !fhTools[tool].offloadForbid">卸载</button>
                            <button class="btn btn-xs" :class="fhTools[tool].menu ? 'btn-warning' : 'btn-info'" @click="menuMgr(tool,$event)" v-if="fhTools[tool].installed">{{fhTools[tool].menu ? '移出' : '加入'}}右键</button>
                        </template>

                        <template v-if="tool !== 'devtools'">
                            <button class="btn btn-xs" :class="fhTools[tool]._enable ? 'btn-success' : 'btn-default'" style="cursor: default">{{fhTools[tool]._enable ? '启用中' : '已停用'}}</button>
                            <button class="btn btn-xs" :class="fhTools[tool].menu ? 'btn-warning' : 'btn-info'" @click="menuMgr(tool,$event)" v-if="fhTools[tool]._enable">{{fhTools[tool].menu ? '移出' : '加入'}}右键</button>
                        </template>
                    </span>
                </li>
            </ul>
        </div>

    </div>
    </div>
</div>

<script src="../static/js/dark-mode.js"></script>
<script type="module" src="index.js"></script>

</body>
</html>