$Image={};

$Image.canvas=function(id,url)
{
    return new Promise
    (
        function(reslove,reject)
        {
            if(!url)url=''
            if(typeof url !='string' )url=window.URL.createObjectURL(url)
            var c=$M.find(id);
            var width= $M.style(c).width.replace('px','')
            var ctx=c.getContext("2d");
            var img=new Image()
            img.src=url
            img.onload=function()
            {
                var sc=img.width/width
                c.width=width
                c.height=(img.height/sc) 
                ctx.drawImage(img,0,0,img.width,img.height,0,0,c.width,c.height);
                reslove(ctx)
            }
            ctx.source=c
        }
    )
}

$Image.photoCompress=async function (obj,fun)
{
    /*开始读取指定的Blob对象或File对象中的内容. 
    当读取操作完成时,readyState属性的值会成为DONE,如果设置了onloadend事件处理程序,则调用之.
    同时,result属性中将包含一个data: URL格式的字符串以表示所读取文件的内容.*/
    var re = await $Data.readFile(obj.url)
    var newObj=
    {
        url:re,
        quality:obj.quality,
        width:obj.width,
        height:obj.height,
    }
    let base64=await $Image.canvasDataURL(newObj)
    if(obj.form)
    {
        obj.type=obj.type?obj.type:{}
        return new File([$Image.Base64ToBlob(base64)],obj.form)
    } 
    else return $Image.Base64ToBlob(base64)
}

$Image.canvasDataURL=function (obj)
{
    return new Promise
    (
        (res,rej)=>
        {
            var img = new Image();
            img.src = obj.url;
            img.onload = function()
            {
                // 默认按比例压缩
                var w = this.width,
                    h = this.height,
                    scale = w / h;
                w = obj.width || w;
                h = obj.height || (w / scale);
                // 默认图片质量为0.7
                var quality = 0.7;  
                //生成canvas
                var canvas = document.createElement('canvas');
                var ctx = canvas.getContext('2d');
                // 创建属性节点
                var anw = document.createAttribute("width");
                anw.nodeValue = w;
                var anh = document.createAttribute("height");
                anh.nodeValue = h;
                canvas.setAttributeNode(anw);
                canvas.setAttributeNode(anh);
                ctx.drawImage(this, 0, 0, w, h);
                obj.quality=Number(obj.quality);
                // 图像质量
                if(obj.quality && obj.quality <= 1 && obj.quality > 0){
                    quality = obj.quality;
                }
                // quality值越小，所绘制出的图像越模糊
                var base64 = canvas.toDataURL('image/jpeg', quality);
                // 回调函数返回base64的值
                res(base64);
            }
            img.onerror=function(error)
            {
                rej(error)
            }
        }
    )
}

$Image.Base64ToBlob=function (urlData)
{
    var arr = urlData.split(','), mime = arr[0].match(/:(.*?);/)[1],
        bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
    while(n--)
    {
        u8arr[n] = bstr.charCodeAt(n);
    }
    return new Blob([u8arr], {type:mime});
}

$Image.clip=function({canvas,x=0,y=0,width,height,obj})
{
    canvas=$M.find(canvas)
    if(!obj)obj={}
    obj.quality= obj.quality? obj.quality:1
    var canvasBack = document.createElement('canvas');
    var ctx = canvasBack.getContext('2d');
    canvas=canvas.getContext('2d');
    ctx.canvas.width=width;
    ctx.canvas.height=height;
    var ct=canvas.getImageData(x,y,width,height);
    ctx.putImageData(ct,0,0,0,0,width,height);
    var blobBack=$Image.Base64ToBlob(canvas.toDataURL('image/jpeg', obj.quality))
    if(obj.form)return (new File([blobBack],obj.form,obj.type)) 
    else return blobBack
}

$Image.xy=function(_width,x,y,len) 
{
    len=len?len:4;
    return len*(_width*y+x);
}

$Image.line=function(_width,index,len) 
{
    len=len?len:4;
    index=Math.floor(index/len)
    return [index%_width,Math.floor(index/_width)];
}


