/**
* 获取图片地址
* varstion 1.0.2
* by Allen-Fei
* tipefi@126.com
* 参数列表:
* success(picUrl, base64)——图片地址获取成功的回调,返回图片地址及base64
* 基于zepto或jq、mui------仅限手机端
*/
(function(window, undefind) {
var layer = '<div id="selectLayer" class="mui-popover mui-popover-bottom mui-popover-action ">'
layer += '<ul class="mui-table-view" id="imgLayer">'
layer += '<li class="mui-table-view-cell">'
layer += '<span>拍照</span>'
layer += '</li>'
layer += '<li class="mui-table-view-cell">'
layer += '<span>从相册选择</span>'
layer += '</li>'
layer += '</ul>'
layer += '<ul class="mui-table-view">'
layer += '<li class="mui-table-view-cell">'
layer += '<a href="#selectLayer" id="cancelos"><b>取消</b></a>'
layer += '</li>'
layer += '</ul>'
layer += '</div>'
$("body").append(layer);
//选择方式事件
$("body").on("tap", "#imgLayer li", function() {
var i = $(this).parent().children().index(this)
if(i == 0) {
getImgURL.getImages();
}else{
getImgURL.getPhoto();
}
mui('#selectLayer').popover('hide');
})
$('body').on('tap', '#cancelos', function(){
evalID('my-proname.html',['closeDis']);
})
var getImgURL = window.getImgURL = {
init: function(option){ // 初始化方法
var that = this;
that.o = option;
mui('#selectLayer').popover('toggle');
},
getImages: function(){ // 拍照方法
var that = this;
var cmr = plus.camera.getCamera(); // 相机对象
cmr.captureImage(function(p) { // 拍照事件
that.rotateImg(p);
}, function(error) {
that.o.error(error);
console.log("---" + "捕获图像失败: " + error.message);
}, {} //建议使用系统匹配路径
);
},
getPhoto: function(){ // 打开相册方法
var that = this;
plus.gallery.pick(function(path) { // 从系统相册选择图片
that.rotateImg(path);
}, function(error) {
that.o.error(error);
console.log("---" + "捕获图像失败: " + error.message);
})
},
rotateImg: function(p) { // 图片处理方法(包括旋转,因在IOS中会有图片读取时会自动旋转,导致读取后的文件不正确)
var that = this;
if(p.indexOf('http') < 0) {
plus.zip.compressImage({
src: p,
dst: p,
overwrite: true,
rotate: 0 // 不管有没有被旋转,统一旋转0度
}, function(e) {
if(mui.os.ios){ // 此处IOS需做路径转换处理,在转换时利用文件对象再去转base64,而安卓则直接可以用路径去加载文件
plus.io.resolveLocalFileSystemURL(e.target, function(entry){
entry.file(function(path){
console.log("P__" + JSON.stringify(path));
that.getBase64(path, e.target);
})
});
} else{
that.getBase64(e.target, e.target);
}
}, function(error) {
that.o.error(error);
console.log("图片旋转时发生错误!");
});
} else {
that.o.success(p); // 如遇http地址,则直接返回该地址;
}
},
getBase64: function(path, url){ // 获取Base64
var that = this;
var reader = new plus.io.FileReader(); // 构建文件对象
reader.readAsDataURL(path); // 添加文件(此处安卓可以直接添加文件路径,而IOS则需要文件对象)
reader.onloadend = function (event) { // 文件加载 完成后的事件回调
//console.log('event'+JSON.stringify(event));
that.o.success(url, event.target.result); // 执行成功函数,统一把路径及base64传过去
};
}
}
})(window)

前端攻城师
- 发布:2017-08-07 10:20
- 更新:2019-01-25 15:47
- 阅读:5887
4 个评论
要回复文章请先登录或注册
l***@qq.com
1***@qq.com
3***@qq.com
7***@qq.com