extension for axure

try to take over the world!

当前为 2019-05-13 提交的版本,查看 最新版本

您需要先安装一个扩展,例如 篡改猴Greasemonkey暴力猴,之后才能安装此脚本。

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

您需要先安装一个扩展,例如 篡改猴暴力猴,之后才能安装此脚本。

您需要先安装一个扩展,例如 篡改猴Userscripts ,之后才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey,才能安装此脚本。

您需要先安装用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

// ==UserScript==
// @name         extension for axure
// @namespace    http://tampermonkey.net/
// @version      1.0
// @description  try to take over the world!
// @author       You
// @match        http://192.168.1.5:30032/*
// @require      https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js
// @grant        none
// ==/UserScript==

var $ = jQuery;
var isScriptAlreadyExcuted = false;

$.noConflict();
(function() {
    'use strict';

    if(isScriptAlreadyExcuted) return
    isScriptAlreadyExcuted = true

    var $headerBtnMenu = $("#sitemapToolbar > div.pageButtonHeader")
    // 添加一个 折叠 功能按钮
    var a_foldMenuBtn = document.createElement("a")
    a_foldMenuBtn.title = "折叠菜单"
    a_foldMenuBtn.classList.add("sitemapToolbarButton")
    a_foldMenuBtn.style.background = "url(/SuiBaoTrd/plugins/sitemap/styles/images/sitemap_off.svg) no-repeat center center, linear-gradient(transparent,transparent)"
    a_foldMenuBtn.onclick = function(){
        var userRes = prompt("折叠到几级菜单?(最小为1级)",2);
        var level = Math.floor(Number(userRes));
        if(isNaN(level)|| level < 0) return alert("必须输入正整数")

        foldLeftMenu(level)
    }

    $headerBtnMenu.prepend(a_foldMenuBtn);
})();

/*************************************************************************************

1. 菜单折叠
TODO:优化按钮显示,目前是随便选的svg

**************************************************************************************/

// 根据层级折叠菜单
function foldLeftMenu(level){
    var $leftMenuTree = $("#sitemapTreeContainer > ul.sitemapTree")
    var levelFlag = {
        lvMax:level || 1,
        lv:1,
        isExceed:function(){ return levelFlag.lv > levelFlag.lvMax },
        completeFold:function(){ levelFlag.lv ++ }
    };

    // 一级 Node
    var $nodeList = $leftMenuTree.find("> .sitemapNode")
    foldAllNodeByNodeList($nodeList,levelFlag);

}
// 折叠当前 node 的所有 sub node
function foldAllNodeByNodeList($nodeList,flag){
    if(flag.isExceed()) return; // 是否超过需要折叠的层级

    var nextFoldNodeList = []; // 收集下一层级所有node
    for(var i = 0; i < $nodeList.length; i++){
        var $curNode = $nodeList.eq(i);
        if(!canFold($curNode)) continue;
        // 即使 父node 已折叠也 进行折叠 子node
        nextFoldNodeList = nextFoldNodeList.concat(findSubNodes($curNode));
//         if(isFolded($curNode)) continue;
        foldNode($curNode)
    }
    flag.completeFold(); // 标志 折叠当前层级动作 已完成

    var $nextFoldNodeList = $(nextFoldNodeList);
    if(!nextFoldNodeList.length) return;
    foldAllNodeByNodeList($nextFoldNodeList,flag)
}
// 获取当前 node 的所有 sub node
function findSubNodes($nodeContainer){return $nodeContainer.find("> ul > .sitemapNode").toArray()}
// 判断Node是否已折叠
function isFolded($node){ return !$node.find("> ul").is(':visible') }
// 判断Node是否可折叠
function canFold($node){ return !$node.is(".sitemapLeafNode") }
// 折叠当前 Node
function foldNode($node){
    var btn_fold = $node.find(">div > div.sitemapPageLinkContainer .sitemapPlusMinusLink").get(0);
    collapse_click.apply(btn_fold)
    // TODO:改成原生click事件触发, 从最内层触发到最外层(防止出现 折叠后点击俩次的bug)
}

// 从 axure 中抽出来的点击事件
var SHOW_HIDE_ANIMATION_DURATION = 0;
function collapse_click(event) {
        $(this)
            .children('.sitemapMinus').removeClass('sitemapMinus').addClass('sitemapPlus').end()
            .closest('li').children('ul').hide(SHOW_HIDE_ANIMATION_DURATION);
    }

    function expand_click(event) {
        $(this)
            .children('.sitemapPlus').removeClass('sitemapPlus').addClass('sitemapMinus').end()
            .closest('li').children('ul').show(SHOW_HIDE_ANIMATION_DURATION);
    }