$Draw={};

$Draw.getPage=async function({url,select,param,cache,$content,$callParam,now})
{   
    //url为链接地址
    //select为被插入元素选择器
    //tag为真时，会替换当前标签。否则插入当前标签
    if($content)
    {
        return $Draw._after({str:$content,select,param,url,$callParam,now});
    }
    if($M.online)
    {
        url=url.replace(/\.html/,'.html'+'.online')
    }
    
    var str=await $Ajax.get({url:url,cacheCheck:cache}).catch((err)=>{
        $M.info('【draw】请求错误',err)
    })

    if(str || str==='')
    {
        str = await $Draw._eval({str,cache,url,select,now})
        return $Draw._after({str,select,param,url,$callParam,now});
    } 
    else
    {
        if($M.online)
        {
            $M.info('[绘制页面][dev]获取远程文件失败：',url)
        }
        else
        {
            $M.info('[绘制页面][online]获取远程文件失败：',url)
        }
    }
}

$Draw.bool=function({select,now})
{
    if($Route.$stop)return false
    if($Route.$select[select]!=now)
    {
        return true
    }
}



$Draw._eval=async function({str,cache,url,now,select})
{
    //str为原始的字串
    if((typeof str) != 'string')
    {
        $M.info('[绘制页面]解析脚本，必须为字符串',str,url);
        return '';
    }       
    var preg=/{{(.*?)=(.*?)}}/g
    var resu,_str
    var __str=str;
    try 
    {
        //用于循环js,css,不可以引用外网
        while(resu=preg.exec(__str))
        {
            switch (resu[1]) 
            {
                case 'css':
                    _str=await $Ajax.get({url:$Route.$map.$root+resu[2],cacheCheck:cache}).catch((err)=>{
                        $M.info('【draw】请求错误',err)
                    })
                    if(!_str)_str=''
                    str=str.replace(resu[0],'<style>'+_str+'<\/style>\r\n')
                break;
                case 'js':
                    _str=await $Ajax.get({url:$Route.$map.$root+resu[2],cacheCheck:cache}).catch((err)=>{
                        $M.info('【draw】请求错误',err)
                    })
                    if(!_str)_str=''
                    str=str.replace(resu[0],'<script>'+_str+'<\/script>\r\n')
                break;
            }
            if($Draw.bool({now,select}))throw Error('新加入一个渲染，中断之前的渲染')
        }
        str=$Draw.css(str)
        str=$Draw.select(str)
        preg.lastIndex=0;
        //用于异步循环页面,不可以引用外网
        while(resu=preg.exec(__str))
        {
            switch (resu[1]) 
            {
                case 'page':
                    _str=await $Ajax.get({cacheCheck:cache,url:$Route.$map.$root+resu[2]}).catch((err)=>{
                        $M.info('【draw】请求错误',err)
                    })
                    if(!_str)_str=''
                    str=str.replace(resu[0],await $Draw._eval({str:_str,cache,url,select,now}));
                break;
            }
            if($Draw.bool({now,select}))throw Error('新加入一个渲染，中断之前的渲染')
        }
        return str; 
    } 
    catch (error)     
    {
        if(error.message=='新加入一个渲染，中断之前的渲染')throw Error('新加入一个渲染，中断之前的渲染')
        $M.info('[绘制页面]执行文件编译出错',error)
    }
}

$Draw._after=function({str,select,param,url,$callParam,now})
{
    //str为要模块化的字串
    //select为被插入元素选择器

    if($M.find(select))
    {
        return new Promise
        (
            (reslove)=>
            {
                requestAnimationFrame
                (
                    async function()
                    {
                        if($Draw.bool({now,select}))throw Error('新加入一个渲染，中断之前的渲染')
                        let dom=$M.find(select)
                        
                        if(dom.hasAttribute('_style'))
                        {
                            dom.style.display='none'
                        }
                        else
                        {
                            $M.fade(dom)
                        }
                        
                        dom.innerHTML=str;
                        var preg1=/<script.*?>([\s|\S]*?)<\/script>/ig
                        var resu1
                        while(resu1=preg1.exec(str))
                        {
                            let str=resu1[1];
                            if($callParam)
                            {
                                str=`var $callParam=${$callParam};`+str;
                            }
                            str=$M.removeComment(str)
                            await $M.eval(str,param)
                        }
                        str=null;
                        reslove(true);
                    }
                ) 
            }
        )
    }
    else
    {
        $M.info('[绘制页面]元素未发现select',[select,url])
        return;
    }
}

$Draw.select=function(str)
{
    if(!str)
    {
        str='';
    }
    var rega=/(<.*?\sid=)([\"|\'])(.*?)(\2.*?>)/g;
    var resa;
    var _rand=$M.rand();
    var _str=str;
    var _rando=''
    //找出数据中的select
    while (resa=rega.exec(_str)) 
    {
        if(resa[3] && resa[3].indexOf('_hash_')==-1)
        {
            _rando=resa[3]+'_hash_'+_rand;
            str=str.replace((new RegExp('([\\"|\\\'|\\s|\\,]{1}#)'+resa[3]+'\\b','g')),'$1'+_rando);//更改其他地方的此id
            str=str.replace((new RegExp('for=([\\"|\\\'])'+resa[3]+'(\\1)','g')),'for=$1'+_rando+'$2');//更改其他地方的此id
            str=str.replace((new RegExp('data\\-route\\-id=([\\"|\\\'])#'+resa[3]+'(\\1)','g')),'data-route-id=$1#'+_rando+'$2');//更改其他地方的此id
            str=str.replace(resa[0],resa[1]+resa[2]+_rando+resa[4]);//更改标签里的id
        }
    }
    return str;
}

//css名最好不要与标签名，重名
$Draw.css=function(str,css)
{
    if(!css)
    {
        css='';
    }
    var rega=/<style.*?>([\s|\S]*?)<\/style>/g;
    var resa;
    css+='\r\n\r\n';

    //找出数据中的style样式
    while (resa=rega.exec(str)) 
    {
        css+=(resa[1]+'\r\n\r\n');
    }

    var rand=$M.rand()
    var reg=/\.([^\d]*?)([,|\)|\[|\s|\{|\:|\b]{1})/g
    var res=''
    var _res=''
    
    //解析css样式
    while (res=reg.exec(css)) 
    {
        if(res[1] && res[1].indexOf('_hash_')==-1 && res[1].indexOf(';')==-1 && res[1].indexOf(':')==-1)
        {
            _res=res[1]+'_hash_'+rand;
            str=str.replace((new RegExp('class=([\\"|\\\'])([^=]*?\\b)'+res[1]+'(\\b.*?\\1)','g')),'class=$1$2'+_res+'$3');//更改其他地方样式
            str=str.replace(res[0],'.'+_res+res[2]);//更改style
        }
    }
    return str;
}


$Draw.activeChilds=function(elea,dom,...value)
{
	var ele=$M.find(elea);
	if(!ele)
	{
		$M.info('[操作元素子元素]未找到元素',elea);
		return '';
	};
	try 
	{
		var childList=ele.children;
		for(var i=0,len=childList.length;i<len;i++)
		{
			let cur=childList[i]
			cur.classList.remove(...value)
        }
        dom.classList.add(...value)
	} 
	catch (error) 
	{
		$M.info('[操作元素子元素]未找到元素',elea);
	}
}



$Draw.swap=function(elea,one,two,funOne,funTwo)
{
	var ele=$M.find(elea);
	if(!ele)
	{
		$M.info('[操作元素子元素]未找到元素',elea);
		return '';
	};
    let tag=ele.innerHTML
    if(tag==one)
    {
        ele.innerHTML=two
        if(funOne)funOne()
        return one
    }
    else
    {
        ele.innerHTML=one
        if(funTwo)funTwo()
        return two
    }
}

