{{template "header"}}
{{define "gp"}}
<style>
#history tr{
	line-height:25px
}
#history td{
	white-space: nowrap; 
	cursor:pointer;
	padding-left:3px;
}
#history td a{
	color:rgba(172, 197, 181, 0.95);
}
.deltd{
	width:20px;
	color:red;
	padding-left:3px;
	padding-right:3px
}
</style>
<div style="z-index:9999;left:0px;float: left;position: fixed;top: 100px;">
<div style='float:right;width:20px;writing-mode:tb-rl;border:1px solid #000;border-left:0px;background-color: lightgreen;opacity: 0.8 ' id='di1'>历史记录</div>
<div style='overflow-y:scroll;overflow-x:hidden;display:none;float:left;color:black;opacity: 0.5;background-color: #230606;border:1px solid #000;width:300px;height:500px' id='di2'>
<div style='border-bottom:1px solid #000;background-color: #CA9191;font-weight: bold'>历史记录是通过html5的indexeddb存储在浏览器中</div>
<table  id='history' style='width:280px;table-layout:fixed;'>
</table>
</div>
</div>
<script src="/static/js/jsonformart.js" type="text/javascript"></script>
<div style="width:90%;">
<span >
{{if .IsUpVersion}}
{{end}}
</span>
<br/>
接口:<textarea rows="2" class="form-control" name='url' id="url"></textarea>
<span style="color:#ccc;font-size:12px">例：http://abc.com/m?a=xx&b=xx；get参数直接加在url后就行。</span>
<br/>
<div  id='disparms'>
Post参数:<textarea rows="2" class="form-control" name='parms' id="parms"></textarea>
<span style="color:#ccc;font-size:12px">参数例：a=b&c=d&f=e,只针对post,put</span>
</div>
<button type='button' id='highbtn' class="btn btn-success" style="width:20%;height:20px;font-size:10px;padding:0px 0px"  >显示高级功能</button>
<div style='display:none' aid="1" id='highfunc'>
Cookie:<textarea rows="3" class="form-control" name='ck' id="ck"></textarea>
<span style="color:#ccc;font-size:12px">cookie的格式：key=value;key2=value2;key3=value3</span><br/>
Header:<textarea rows="3" class="form-control" name='header' id="header">Content-Type:application/x-www-form-urlencoded</textarea>
<span style="color:#ccc;font-size:12px">header的格式：key:value的格式,一行一条。</span><br/>
代理:<input type='input' class="form-control" name='proxy' id="proxy"></input>
<span style="color:#ccc;font-size:12px">代理格式：10.10.10.10:8080,使用代理访问你提交的接口</span><br/>
Note:<textarea rows="3" class="form-control" name='cookie' id="cookie" ></textarea>
<span style="color:#ccc;font-size:12px">note类似于记事本，可以保存信息100天，保存于cookie中，清除cookie信息失效</span>
<br/>
</div>
<div>
<select name='seltype' id="seltype"  class="form-control" style='margin-top:10px;float:left;width:45%'>
<option value='post'>POST</option>
<option value='get'>GET</option>
<option value='put'>PUT</option>
</select>
<select name='code' id="code"  class="form-control" style='margin-top:10px;margin-left:10px;float:left;width:45%'>
<option value='utf8'>UTF-8编码</option>
<option value='gbk'>GBK编码</option>
</select>
<br/>
</div>
<button type='button' id='btn' style="width:72%;height:40px;margin-top:5px;margin-button:20px"  >提交</button>
<button type='button' id='clearform' style="width:25%;height:40px;margin-top:5px;margin-button:20px"  >清空表单</button>
</div>
<div style="width:90%;min-height:200px;margin-right:20px;margin-top:20px" >
<ul class="nav nav-tabs" role="tablist" >
  <li role="presentation" class="active" id='rspdis'><a href="javascript:void(0);">Response</a></li>
  <li role="presentation" id='headdis'><a href="javascript:void(0);">Headers</a></li>
<span style='float:right;margin:20px 10px 0px 0px'>{{.t}}  {{.d}}</span>
</ul>
<pre id="getresult" style='min-height:360px'></pre>
<p id="getresultheader" style='display:none;min-height:360px'></p>
</div>
<script src="/static/js/tool.js"></script>
<script src="/static/js/md5.min.js"></script>
<script>
var db;  
const DB_TABLE='post5';
window.indexedDB = window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB || window.msIndexedDB;
if(window.indexedDB)
{ 
try{
	          var request = window.indexedDB.open('MyDb',5);  
                
                request.onupgradeneeded = function(event){  
                    db = event.target.result;  
                    var objectStore = db.createObjectStore(DB_TABLE,{keyPath:"id",autoIncrement:true});  
                    objectStore.createIndex("md5", "md5", {unique: true});  
					objectStore.createIndex("t", "t", {unique: false}); 
                }  
                request.onsuccess = function(event){  
                    db = event.target.result;  
                };  
				
	}catch (e) 
{ }
  var disnew=0;
$("#di2").hover(function(){
	 if (disnew==0){
		disnew=disnew+1;
	    var transaction = db.transaction([DB_TABLE],'readonly'); 
		var objectStore = transaction.objectStore(DB_TABLE);
		var index = objectStore.index("t");
		tt=(new Date().getTime())-86400*10*1000
        //var range = IDBKeyRange.lowerBound(tt);
		di = 0;
		index.openCursor(null,"prev").onsuccess = function(event) 
                {  
				 if (di<200){
			        var cursor = event.target.result;  
                    var flag=0;
			        if (cursor) 
                    {  
						addHistory("append",cursor.value.ck,cursor.value.code,cursor.value.header,cursor.value.parms,cursor.value.proxy,cursor.value.seltype,cursor.value.url,cursor.value.id)
                        cursor.continue();  
			        }  
					}else{
						return;
					} 
					di++;
			    };
			}  
},function(){});
			
$("#di1,#di2").hover(function(){
	$("#di2").show();
},function(){
	$("#di2").hide();
});
}else{
	$("#di1").hide();
}

function chong(obj){
	$("#url").val($(obj).attr("url"));
    $("#seltype").val($(obj).attr("seltype"));
    $("#ck").val($(obj).attr("ck"));
    $("#header").val($(obj).attr("header"));
    $("#parms").val($(obj).attr("parms"));
    $("#proxy").val($(obj).attr("proxy"));
    $("#code").val($(obj).attr("code"));	
}

function delhis(obj){
	var aid=$(obj).attr("aid");
	aid=parseInt(aid);
	var ret=db.transaction([DB_TABLE],"readwrite").objectStore(DB_TABLE).delete(aid);
	ret.onerror=function(event){
	}
	ret.onsuccess=function(event){
	}
	$(obj).parents("tr").hide();
}

function addHistory(addr,ck,code,header,parms,proxy,seltype,url,id) {
	if (addr=="append"){
	   $("#history").append("<tr><td style='overflow:hidden'><a onclick='chong(this);' aid='"+id+"' ck='"+ck+"' code='"+code+"' header='"+header+"' parms='"+parms+"' proxy='"+proxy+"' url='"+url+"'  seltype='"+seltype+"'  title='url:"+url+"&#10;post:"+parms+"'>"+url+"</a></td><td class='deltd' onclick='delhis(this);' aid='"+id+"' title='删除'>X</td></tr>");
    }else{
		$("#history").prepend("<tr><td style='overflow:hidden'><a onclick='chong(this);'aid='"+id+"' ck='"+ck+"' code='"+code+"' header='"+header+"' parms='"+parms+"' proxy='"+proxy+"' url='"+url+"'  seltype='"+seltype+"'  title='url:"+url+"&#10;post:"+parms+"'>"+url+"</a></td><td class='deltd' onclick='delhis(this);' aid='"+id+"' title='删除'>X</td></tr>");
	}
}

 $("#btn").click(function(){
  var url=$("#url").val();
  var seltype=$("#seltype").val();
  var ck=$("#ck").val();
  var header=$("#header").val();
  var parms=$("#parms").val();
  var proxy=$("#proxy").val();
  var code=$("#code").val();
  if(url==''){
	alert("地址必须填写");
	$("#url").focus();
	return;
}
md=md5(url+seltype+ck+header+parms+proxy+code);
try 
{               
                var transaction = db.transaction([DB_TABLE],'readwrite'); 
                var  objectStore=transaction.objectStore(DB_TABLE);
                var index=objectStore.index("md5");
				index.get(md).onsuccess = function(event) {
				//var t= new Date().getTime();
                employee = event.target.result;
				//console.log(employee);
				if (typeof(employee) != "undefined") {
				employee.t= new Date().getTime();
				db.transaction([DB_TABLE],"readwrite").objectStore(DB_TABLE).put(employee);
                 }
				}
             
} 
catch (e) 
{ }
try 
{               t= new Date().getTime();
                var transaction = db.transaction([DB_TABLE],'readwrite'); 
                var  objectStore=transaction.objectStore(DB_TABLE); 
                var addRec = objectStore.add({t:t,md5:md,url:url,seltype:seltype,ck:ck,header:header,parms:parms,proxy:proxy,code:code});  
                addRec.onsuccess=function(event){
					id = event.target.result;
					addHistory("prepend",ck,code,header,parms,proxy,seltype,url,id)
				}
				addRec.onerror=function(event){
					//console.log(event)
				}
} 
catch (e) 
{ }
$("#getresult").html("正在提交，获取中.....");
  $.ajax({
	  url:"/tool/ajaxgp",
	  type:"POST",
	  dataType:"json",
	  data:"url="+encodeURIComponent(url)+"&seltype="+seltype+"&ck="+encodeURIComponent(ck)+"&header="+encodeURIComponent(header)+"&parms="+encodeURIComponent(parms)+"&proxy="+encodeURIComponent(proxy)+"&code="+code,
	  success:function(data){
		if (data.code==1) {
			ss = data.data.response;
			if (ss.match('^\{(\".+\":.+,*){1,}\}$')){
				//var ss1 = eval("("+data.data.response+")");
				try{
					var ss1 =JSON.parse(data.data.response);
				    //ss1=jsl.format.formatJson(obj2str(ss1));
				    ss1=jsl.format.formatJson(JSON.stringify(ss1));
				}catch(e){
					ss1="";
				}
				if (ss1!=""){
				  ss=ss1+"\r\n\r\n\r\n\r\n-----------------以下格式化前原串-----------------------\r\n\r\n\r\n"+ss
				}
			}
			$("#getresult").text(ss);
			$("#getresultheader").html(data.data.header);
		}else{
			$("#getresult").html(data.msg);
			$("#getresultheader").html('');
		}
	  }
     });
 });
$("#clearform").click(function(){
	$("#url").val("");
    $("#ck").val("");
    $("#header").val("Content-Type:application/x-www-form-urlencoded");
    $("#parms").val("");
    $("#proxy").val("");
});
$("#rspdis").click(function(){
   $("#rspdis").addClass("active");
   $("#headdis").removeClass("active");
   $("#getresult").show();
   $("#getresultheader").hide();
});
$("#headdis").click(function(){
   $("#headdis").addClass("active");
   $("#rspdis").removeClass("active");
   $("#getresultheader").show();
   $("#getresult").hide();
});
//判断是否显示高级功能
$("#highbtn").click(function(){
    $func =$("#highfunc").attr("aid");
    if ($func==1){
		$("#highbtn").html("隐藏高级功能");
		$("#highfunc").show();
		$("#highfunc").attr("aid",2);
		addCookie("func_dis",2,86400*100);
	}
	if ($func==2){
		$("#highbtn").html("显示高级功能");
		$("#highfunc").hide();
		$("#highfunc").attr("aid",1);
		addCookie("func_dis",1,86400*100);
	}
});
  $.ajax({
	  url:"/tool/ajaxip",
	  type:"GET",
	  dataType:"json",
	  data:"ip="+encodeURIComponent($("#getip").html()),
	  success:function(data){
		if (data.code==1) {
			var jsonobj=eval('('+data.data+')');  
			if (jsonobj.errNum==0) {
				area=jsonobj.retData;
				$("#disarea").html(area.country+" "+area.province+" "+area.city+" "+area.district+" "+area.carrier);
			}
		}
	  }
     });
</script>
<script language=javascript> 

function geshijson(){
	$html=$("#getresult").html();
	$newjson=jsl.format.formatJson($html);
	$("#getresult").html($newjson.toString());
	alert(decodeURIComponent($newjson.toString()));
}
//获得cookie 的值
 $("#cookie").val(getCookie("urladd"));
 window.setInterval(showalert, 3000); 
  function showalert(){
	var cook=$("#cookie").val();
	addCookie("urladd",cook,100);
   }
</script>
{{end}}
{{template "footer"}}