<!DOCTYPE html>
<html lang="zh-Hans">
<head>
<title>Interface testing</title>
<meta charset="utf-8">
<link href="${base}/resource/plugins/json-formatter/code-formatter.css" rel="stylesheet" />
<style>
#rawJson{width:100%;height:50px;}
#interfaes{overflow:hidden;}
#interfaes a{padding:0 5px;}
</style>
</head>
<body>
    <fieldset data-diy="page">
        <legend>Interface testing</legend>
        <p>
            <label>URL:</label>
            <textarea cols="100" rows="2" id="sendData"></textarea>
            <label>appToken:<input name="appToken" type="text" /></label>
        </p>
        <p>
            <input type="button" value="Send" onclick="invoke()"/>
            <label><input name="showParameters" type="checkbox" checked="checked"/>Show Parameters</label>
            <label>authToken:<input name="authToken" type="text" /></label>
            <label>authUserId:<input name="authUserId" type="text" /></label>
        </p>
        <p>
            <label>Site switch
            <select id="siteList">
                <@sys.siteList pageSize=500>
                    <#list page.list as a>
                    <option value="${a.dynamicPath!}"<#if site.id=a.id>selected="selected"</#if>>
                        ${a.name!} <#if site.id=a.id>[Current site]</#if>
                    </option>
                    </#list>
                </@sys.siteList>
            </select>
            </label>
            <label><input type="radio" name="api" value="0" />指令接口Directive interface</label>
            <label><input type="radio" name="api" value="1" />函数接口Function interface</label>
            <label><input type="radio" name="api" value="2" />自定义接口Custom interface</label>
            <a href="javascript:;" onclick="$(this).hide().next().show();$('#interfaes').css('height','20px');return false;">↑↑↑↑</a>
            <a href="javascript:;" style="display: none;" onclick="$(this).hide().prev().show();$('#interfaes').css('height','auto');return false;">↓↓↓↓</a>
        </p>
        <p id="interfaes"></p>
    </fieldset>
    <fieldset>
        <legend>Result</legend>
        <textarea id="rawJson"></textarea>
        <p>
            <input type="button" value="Format"
                onclick="process($('#rawJson').val(),$('.code-canvas'))" />
        </p>
        <div class="code-canvas"></div>
        <div class="doc">
        </div>
        <p class="description">
            <em>红色字体接口需要使用AppToken才能访问，后台添加应用然后用appKey和appSecret通过自定义接口appToken获取appToken，绿色框体接口需要登录信息authToken，authUserId才能访问,通过普通接口login获取</em>
        </p>
        <p class="description">
            <em>The red font interface needs to use the AppToken to
                access, add the application in the management, and then
                use the appKey and appSecret to obtain the appToken
                through the custom interface appToken. The green frame
                interface requires the login information authToken and
                authUserId to access, and the common interface login.</em>
        </p>
    </fieldset>
    <script src="${base}/resource/plugins/json-formatter/code-formatter.js"></script>
    <script src="${base}/resource/plugins/json-formatter/json2.js"></script>
    <script src="${base}/resource/plugins/jquery/jquery.min.js"></script>
    <script>
    var i=0;
    var sitePath = '${site.dynamicPath}';
    var apiArray=['api/directive/','api/method/','api/']
    var apisArray=['api/namespaces','api/methods','api/apis'];
    var apiDoc=new Map();
    var supportShowParametersArray=[true,false,true];

    function invoke(){
        $('#rawJson').val('loading...');
        $.ajax({
            url: $('#sendData').val(),
            type: 'GET',
            contentType:'application/json; charset=UTF-8',
            success: function (data) {
                $('#rawJson').val(JSON.stringify(data));
                process(JSON.stringify(data),$('.code-canvas'));
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                console.log(XMLHttpRequest);
                console.log(errorThrown);
                $('#rawJson').val('http code:'+XMLHttpRequest.status+',error:'+textStatus);
            }
        });
    }
    function getSymbol(value){
        if(value.charAt(value.length-1)=='&'||value.charAt(value.length-1)=='?'){
            return '';
        }else{
            if(value&&value.indexOf('?')>0){
                return '&';
            }else{
                return '?';
            }
        }
    }
    function use(action,needAppToken,needUserToken,minParameters){
        $('#sendData').val(sitePath+apiArray[i]+action);
        if('true'==needAppToken){
            $('#sendData').val($('#sendData').val()+getSymbol($('#sendData').val())+'appToken='+$('input[name=appToken]').val());
        }
        if('true'==needUserToken){
            $('#sendData').val($('#sendData').val()+getSymbol($('#sendData').val())+'authToken='+$('input[name=authToken]').val()+'&authUserId='+$('input[name=authUserId]').val());
        }
        if(minParameters != 'undefined'){
            for (var j = 1; j <= minParameters; j++) {
                $('#sendData').val($('#sendData').val() + getSymbol($('#sendData').val()) + 'parameters=_value' + j+'_');
            }
        }else if($('input[name=showParameters]').is(':checked')&&$('input[name=showParameters]').is(':visible')){
            $('#sendData').val($('#sendData').val()+getSymbol($('#sendData').val())+'showParameters=true');
        }
        if(apiDoc.get(action)){
            $(".doc").html(apiDoc.get(action));
        }
        return false;
    }
    function init(){
        i=$('input:radio[name=api]:checked').val();
        if(supportShowParametersArray[i]){
            $('input[name=showParameters]').parent().show();
        }else{
            $('input[name=showParameters]').parent().hide();
        }
        $('#interfaes').empty();
        $.ajax({
            url:apisArray[i],type: 'GET',
            contentType:'application/json; charset=UTF-8',
            dataType: 'json',
            success: function (dataList) {
                if(dataList instanceof Array) {
                    if(i==1){
                        $('#interfaes').append('<label><a style="color:#f0f" href="https://www.publiccms.com/upload/api/com/publiccms/views/method/cms/package-summary.html" target="_blank">getAttributes文档</a><a style="color:#f0f" href="https://www.publiccms.com/upload/api/com/publiccms/views/method/tools/package-summary.html" target="_blank">其他函数文档</a></label>:');
                    }else{
                        $('#interfaes').append('<label><a style="color:#f0f" href="https://www.publiccms.com/upload/api/com/publiccms/views/directive/api/package-summary.html" target="_blank">帮助文档</a></label>:');
                    }
                    $(dataList).each(function(index,data){
                        var style='';
                        if('true'==data.needAppToken){
                            style+='color:#f00;';
                        }
                        if('true'==data.needUserToken){
                            style+='border:1px solid #0f0;';
                        }
                        apiDoc.set(data.name,data.doc);
                        $('#interfaes').append(' <a href="javascript:;" style="'+style+'" onclick="return use(\''+data.name+'\',\''+data.needAppToken+'\',\''+data.needUserToken+'\',\''+data.minParameters+'\');">'+data.name+'</a> ');
                    });
                } else {
                    $.each(dataList,function(key,data){
                        $('#interfaes').append('<label>'+key+'<a style="color:#f0f" href="https://www.publiccms.com/upload/api/com/publiccms/views/directive/'+key+'/package-summary.html" target="_blank">帮助文档</a></label>:');
                        $(data).each(function(index,directive){
                            var style='';
                            if(directive.needAppToken){
                                style+='color:#f00;';
                            }
                            if(directive.needUserToken){
                                style+='border:1px solid #0f0;';
                            }
                            apiDoc.set(directive.namespace+'/'+directive.name,directive.doc);
                            $('#interfaes').append(' <a href="javascript:;" style="'+style+'" onclick="return use(\''+directive.namespace+'/'+directive.name+'\',\''+directive.needAppToken+'\',\''+directive.needUserToken+'\',\''+data.minParameters+'\');">'+directive.name+'</a> ');
                        });
                        $('#interfaes').append('<br/>');
                    });
                }
            }
        });
    }
    $(function(){
        $('input[name=showParameters]').on("click", function(){
            if($(this).is(':checked')){
                $('#sendData').val($('#sendData').val()+getSymbol($('#sendData').val())+'showParameters=true');
            }else{
                $('#sendData').val($('#sendData').val().replace('&showParameters=true','').replace('?showParameters=true&','?').replace('?showParameters=true',''));
            }
        });
        $('input:radio[name=api]').eq(0).trigger("click");
        $('input[name=api]').on("click", function(){
            init();
        });
        init();
        $('#siteList').on('change',function(){
            $('#sendData').val($('#sendData').val().replace(sitePath,$(this).val()));
            sitePath=$(this).val();
        });
    });
    </script>
    <script>
    var templatePath='${.current_template_name?keep_after('/')}';
    </script>
    <script src="${base}/resource/js/cms.support.js"></script>
    <script>
        var ca = cmsAnalytics();
        var url='${base}/api/visit/record';
        if("string" ==typeof itemString){
            url=url+"?"+itemString;
        }
        ca.setDomain("${(domain.name)!site.sitePath?keep_after('//')?keep_before('/')?keep_before(':')}");
        ca.setPath('/');
        ca.report(url);
    </script>
</body>
</html>