Initial commit，修正
This commit is contained in:
@@ -0,0 +1,89 @@
|
||||
function fullAvatarEditor() {
|
||||
var id = 'fullAvatarEditor' //flash文件的ID
|
||||
var file = 'plugins/fullavatareditor/fullAvatarEditor.swf'; //flash文件的路径
|
||||
var version = "10.1.0"; //播放该flash所需的最低版本
|
||||
var expressInstall = 'expressInstall.swf'; //expressInstall.swf的路径
|
||||
var width = 600; //flash文件的宽度
|
||||
var height = 430; //flash文件的高度
|
||||
var container = id; //装载flash文件的容器(如div)的id
|
||||
var flashvars = {};
|
||||
var callback = function(){};
|
||||
var heightChanged = false;
|
||||
//智能获取参数，字符类型为装载flash文件的容器(如div)的id，第一个数字类型的为高度，第二个为宽度，第一个object类型的为参数对象，如此4个参数的顺序可随意。
|
||||
for(var i = 0; i < arguments.length; i++)
|
||||
{
|
||||
if(typeof arguments[i] == 'string')
|
||||
{
|
||||
container = arguments[i];
|
||||
}
|
||||
else if(typeof arguments[i] == 'number')
|
||||
{
|
||||
if(heightChanged)
|
||||
{
|
||||
width = arguments[i];
|
||||
}
|
||||
else
|
||||
{
|
||||
height = arguments[i];
|
||||
heightChanged = true;
|
||||
}
|
||||
}
|
||||
else if(typeof arguments[i] == 'function')
|
||||
{
|
||||
callback = arguments[i];
|
||||
}
|
||||
else
|
||||
{
|
||||
flashvars = arguments[i];
|
||||
}
|
||||
}
|
||||
var vars = {
|
||||
id : id
|
||||
};
|
||||
//合并参数
|
||||
for (var name in flashvars)
|
||||
{
|
||||
if(flashvars[name] != null)
|
||||
{
|
||||
if(name == 'upload_url' || name == 'src_url')
|
||||
{
|
||||
vars[name] = encodeURIComponent(flashvars[name]);
|
||||
}
|
||||
else
|
||||
{
|
||||
vars[name] = flashvars[name];
|
||||
}
|
||||
}
|
||||
}
|
||||
var params = {
|
||||
menu : 'true',
|
||||
scale : 'noScale',
|
||||
allowFullscreen : 'true',
|
||||
allowScriptAccess : 'always',
|
||||
wmode : 'transparent'
|
||||
};
|
||||
var attributes = {
|
||||
id : vars.id,
|
||||
name: vars.id
|
||||
};
|
||||
var swf = null;
|
||||
var callbackFn = function (e) {
|
||||
swf = e.ref;
|
||||
swf.eventHandler = function(json){
|
||||
callback.call(swf, json);
|
||||
};
|
||||
};
|
||||
swfobject.embedSWF(
|
||||
file,
|
||||
container,
|
||||
width,
|
||||
height,
|
||||
version,
|
||||
expressInstall,
|
||||
vars,
|
||||
params,
|
||||
attributes,
|
||||
callbackFn
|
||||
);
|
||||
return swf;
|
||||
}
|
||||
@@ -0,0 +1,96 @@
|
||||
/**
|
||||
* Cookie plugin
|
||||
*
|
||||
* Copyright (c) 2006 Klaus Hartl (stilbuero.de)
|
||||
* Dual licensed under the MIT and GPL licenses:
|
||||
* http://www.opensource.org/licenses/mit-license.php
|
||||
* http://www.gnu.org/licenses/gpl.html
|
||||
*
|
||||
*/
|
||||
|
||||
/**
|
||||
* Create a Cookie with the given name and value and other optional parameters.
|
||||
*
|
||||
* @example $.Cookie('the_cookie', 'the_value');
|
||||
* @desc Set the value of a Cookie.
|
||||
* @example $.Cookie('the_cookie', 'the_value', { expires: 7, path: '/', domain: 'jquery.com', secure: true });
|
||||
* @desc Create a Cookie with all available options.
|
||||
* @example $.Cookie('the_cookie', 'the_value');
|
||||
* @desc Create a session Cookie.
|
||||
* @example $.Cookie('the_cookie', null);
|
||||
* @desc Delete a Cookie by passing null as value. Keep in mind that you have to use the same path and domain
|
||||
* used when the Cookie was set.
|
||||
*
|
||||
* @param String name The name of the Cookie.
|
||||
* @param String value The value of the Cookie.
|
||||
* @param Object options An object literal containing key/value pairs to provide optional Cookie attributes.
|
||||
* @option Number|Date expires Either an integer specifying the expiration date from now on in days or a Date object.
|
||||
* If a negative value is specified (e.g. a date in the past), the Cookie will be deleted.
|
||||
* If set to null or omitted, the Cookie will be a session Cookie and will not be retained
|
||||
* when the the browser exits.
|
||||
* @option String path The value of the path atribute of the Cookie (default: path of page that created the Cookie).
|
||||
* @option String domain The value of the domain attribute of the Cookie (default: domain of page that created the Cookie).
|
||||
* @option Boolean secure If true, the secure attribute of the Cookie will be set and the Cookie transmission will
|
||||
* require a secure protocol (like HTTPS).
|
||||
* @type undefined
|
||||
*
|
||||
* @name $.Cookie
|
||||
* @cat Plugins/Cookie
|
||||
* @author Klaus Hartl/klaus.hartl@stilbuero.de
|
||||
*/
|
||||
|
||||
/**
|
||||
* Get the value of a Cookie with the given name.
|
||||
*
|
||||
* @example $.Cookie('the_cookie');
|
||||
* @desc Get the value of a Cookie.
|
||||
*
|
||||
* @param String name The name of the Cookie.
|
||||
* @return The value of the Cookie.
|
||||
* @type String
|
||||
*
|
||||
* @name $.Cookie
|
||||
* @cat Plugins/Cookie
|
||||
* @author Klaus Hartl/klaus.hartl@stilbuero.de
|
||||
*/
|
||||
$.Cookie = function(name, value, options) {
|
||||
if (typeof value != 'undefined') { // name and value given, set Cookie
|
||||
options = options || {};
|
||||
if (value === null) {
|
||||
value = '';
|
||||
options.expires = -1;
|
||||
}
|
||||
var expires = '';
|
||||
if (options.expires && (typeof options.expires == 'number' || options.expires.toUTCString)) {
|
||||
var date;
|
||||
if (typeof options.expires == 'number') {
|
||||
date = new Date();
|
||||
date.setTime(date.getTime() + (options.expires * 24 * 60 * 60 * 1000));
|
||||
} else {
|
||||
date = options.expires;
|
||||
}
|
||||
expires = '; expires=' + date.toUTCString(); // use expires attribute, max-age is not supported by IE
|
||||
}
|
||||
// CAUTION: Needed to parenthesize options.path and options.domain
|
||||
// in the following expressions, otherwise they evaluate to undefined
|
||||
// in the packed version for some reason...
|
||||
var path = options.path ? '; path=' + (options.path) : '';
|
||||
var domain = options.domain ? '; domain=' + (options.domain) : '';
|
||||
var secure = options.secure ? '; secure' : '';
|
||||
document.cookie = [name, '=', encodeURIComponent(value), expires, path, domain, secure].join('');
|
||||
} else { // only name given, get Cookie
|
||||
var cookieValue = null;
|
||||
if (document.cookie && document.cookie != '') {
|
||||
var cookies = document.cookie.split(';');
|
||||
for (var i = 0; i < cookies.length; i++) {
|
||||
var cookie = jQuery.trim(cookies[i]);
|
||||
// Does this cookie string begin with the name we want?
|
||||
if (cookie.substring(0, name.length + 1) == (name + '=')) {
|
||||
cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
return cookieValue;
|
||||
}
|
||||
};
|
||||
File diff suppressed because one or more lines are too long
+231
@@ -0,0 +1,231 @@
|
||||
swfobject.addDomLoadEvent(function () {
|
||||
//------------------------------------------------------------------------------示例一
|
||||
var webcamAvailable = false;
|
||||
var currentTab = 'upload';
|
||||
var sourcePic1Url = $.Cookie('swf1');
|
||||
var sourcePic2Url = $.Cookie('swf2');
|
||||
if(sourcePic2Url == null)
|
||||
{
|
||||
sourcePic2Url = "http://www.baidu.com/img/bdlogo.png";
|
||||
}
|
||||
var callback = function (json) {
|
||||
var id = this.id;
|
||||
switch (json.code) {
|
||||
case 2:
|
||||
//如果加载原图成功，说明进入了编辑面板，显示保存和取消按钮，隐藏拍照按钮
|
||||
if (json.type == 0) {
|
||||
if(id == "swf1")
|
||||
{
|
||||
$('#webcamPanelButton').hide();
|
||||
$('#editorPanelButtons').show();
|
||||
}
|
||||
}
|
||||
//否则会转到上传面板
|
||||
else {
|
||||
//隐藏所有按钮
|
||||
if(id == "swf1")$('#editorPanelButtons,#webcamPanelButton').hide();
|
||||
}
|
||||
break;
|
||||
case 3:
|
||||
//如果摄像头已准备就绪且用户已允许使用，显示拍照按钮。
|
||||
if (json.type == 0) {
|
||||
if(id == "swf1")
|
||||
{
|
||||
$('.button_shutter').removeClass('Disabled');
|
||||
$('#webcamPanelButton').show();
|
||||
webcamAvailable = true;
|
||||
}
|
||||
}
|
||||
else {
|
||||
if(id == "swf1")
|
||||
{
|
||||
webcamAvailable = false;
|
||||
$('#webcamPanelButton').hide();
|
||||
}
|
||||
//如果摄像头已准备就绪但用户已拒绝使用。
|
||||
if (json.type == 1) {
|
||||
alert('用户拒绝使用摄像头!');
|
||||
}
|
||||
//如果摄像头已准备就绪但摄像头被占用。
|
||||
else {
|
||||
alert('摄像头被占用!');
|
||||
}
|
||||
}
|
||||
break;
|
||||
case 4:
|
||||
alert("您选择的原图片文件大小（" + json.content + "）超出了指定的值(2MB)。");
|
||||
break;
|
||||
case 5:
|
||||
//如果上传成功
|
||||
if (json.type == 0) {
|
||||
var e = this;
|
||||
var html = $('<div class="imgList"/>');
|
||||
for(var i = 0; i < json.content.avatarUrls.length; i++)
|
||||
{
|
||||
html.append('<dl><dt>头像图片'+(i+1)+'</dt><dd><img src="' + json.content.avatarUrls[i] + '" /></dd></dl>');
|
||||
}
|
||||
var button = [];
|
||||
//如果上传了原图，给个修改按钮，感受视图初始化带来的用户体验度提升
|
||||
if(json.content.sourceUrl)
|
||||
{
|
||||
button.push({text : '修改头像', callback:function(){
|
||||
this.close();
|
||||
$.Cookie(id, json.content.sourceUrl);
|
||||
location.reload();
|
||||
//e.call('loadPic', json.content.sourceUrl);
|
||||
}});
|
||||
}
|
||||
else
|
||||
{
|
||||
$.Cookie(id, null);
|
||||
}
|
||||
button.push({text : '关闭窗口'});
|
||||
$.dialog({
|
||||
title:'图片已成功保存至服务器',
|
||||
content:html,
|
||||
button:button,
|
||||
mask:true,
|
||||
draggable:false
|
||||
});
|
||||
}
|
||||
else {
|
||||
alert(json.type);
|
||||
}
|
||||
break;
|
||||
}
|
||||
};
|
||||
var swf1 = new fullAvatarEditor('swf1', 335, {
|
||||
id : 'swf1',
|
||||
upload_url : 'upload.php',
|
||||
src_url : sourcePic1Url, //默认加载的原图片的url
|
||||
tab_visible : false, //不显示选项卡，外部自定义
|
||||
button_visible : false, //不显示按钮，外部自定义
|
||||
src_upload : 2, //是否上传原图片的选项：2-显示复选框由用户选择，0-不上传，1-上传
|
||||
checkbox_visible : false, //不显示复选框，外部自定义
|
||||
browse_box_align : 38, //图片选择框的水平对齐方式。left：左对齐；center：居中对齐；right：右对齐；数值：相对于舞台的x坐标
|
||||
webcam_box_align : 38, //摄像头拍照框的水平对齐方式，如上。
|
||||
avatar_sizes : '258*200', //定义单个头像
|
||||
avatar_sizes_desc :'258*200像素', //头像尺寸的提示文本。
|
||||
browse_box_align:'left', //头像选择框对齐方式
|
||||
webcam_box_align:'left', //头像拍照框对齐方式
|
||||
//头像简介
|
||||
avatar_intro : ' 最终会生成下面这个尺寸的头像',
|
||||
avatar_tools_visible:true //是否显示颜色调整工具
|
||||
}, callback);
|
||||
//选项卡点击事件
|
||||
$('#avatar-tab li').click(function () {
|
||||
if (currentTab != this.id) {
|
||||
currentTab = this.id;
|
||||
$(this).addClass('active');
|
||||
$(this).siblings().removeClass('active');
|
||||
//如果是点击“相册选取”
|
||||
if (this.id === 'albums') {
|
||||
//隐藏flash
|
||||
hideSWF();
|
||||
showAlbums();
|
||||
}
|
||||
else {
|
||||
hideAlbums();
|
||||
showSWF();
|
||||
if (this.id === 'webcam') {
|
||||
$('#editorPanelButtons').hide();
|
||||
if (webcamAvailable) {
|
||||
$('.button_shutter').removeClass('Disabled');
|
||||
$('#webcamPanelButton').show();
|
||||
}
|
||||
}
|
||||
else {
|
||||
//隐藏所有按钮
|
||||
$('#editorPanelButtons,#webcamPanelButton').hide();
|
||||
}
|
||||
}
|
||||
swf1.call('changepanel', this.id);
|
||||
}
|
||||
});
|
||||
//复选框事件
|
||||
$('#src_upload').change(function () {
|
||||
swf1.call('srcUpload', this.checked);
|
||||
});
|
||||
//点击上传按钮的事件
|
||||
$('.button_upload').click(function () {
|
||||
swf1.call('upload');
|
||||
});
|
||||
//点击取消按钮的事件
|
||||
$('.button_cancel').click(function () {
|
||||
var activedTab = $('#avatar-tab li.active')[0].id;
|
||||
if (activedTab === 'albums') {
|
||||
hideSWF();
|
||||
showAlbums();
|
||||
}
|
||||
else {
|
||||
swf1.call('changepanel', activedTab);
|
||||
if (activedTab === 'webcam') {
|
||||
$('#editorPanelButtons').hide();
|
||||
if (webcamAvailable) {
|
||||
$('.button_shutter').removeClass('Disabled');
|
||||
$('#webcamPanelButton').show();
|
||||
}
|
||||
}
|
||||
else {
|
||||
//隐藏所有按钮
|
||||
$('#editorPanelButtons,#webcamPanelButton').hide();
|
||||
}
|
||||
}
|
||||
});
|
||||
//点击拍照按钮的事件
|
||||
$('.button_shutter').click(function () {
|
||||
if (!$(this).hasClass('Disabled')) {
|
||||
$(this).addClass('Disabled');
|
||||
swf1.call('pressShutter');
|
||||
}
|
||||
});
|
||||
//从相册中选取
|
||||
$('#userAlbums a').click(function () {
|
||||
var sourcePic = this.href;
|
||||
swf1.call('loadPic', sourcePic);
|
||||
//隐藏相册
|
||||
hideAlbums();
|
||||
//显示flash
|
||||
showSWF();
|
||||
return false;
|
||||
});
|
||||
//隐藏flash的函数
|
||||
function hideSWF() {
|
||||
//将宽高设置为0的方式来隐藏flash，而不能使用将其display样式设置为none的方式来隐藏，否则flash将不会被加载，隐藏时储存其宽高，以便后期恢复
|
||||
$('#flash1').data({
|
||||
w: $('#flash1').width(),
|
||||
h: $('#flash1').height()
|
||||
})
|
||||
.css({
|
||||
width: '0px',
|
||||
height: '0px',
|
||||
overflow: 'hidden'
|
||||
});
|
||||
//隐藏所有按钮
|
||||
$('#editorPanelButtons,#webcamPanelButton').hide();
|
||||
}
|
||||
function showSWF() {
|
||||
$('#flash1').css({
|
||||
width: $('#flash1').data('w'),
|
||||
height: $('#flash1').data('h')
|
||||
});
|
||||
}
|
||||
//显示相册的函数
|
||||
function showAlbums() {
|
||||
$('#userAlbums').show();
|
||||
}
|
||||
//隐藏相册的函数
|
||||
function hideAlbums() {
|
||||
$('#userAlbums').hide();
|
||||
}
|
||||
//------------------------------------------------------------------------------示例二
|
||||
var swf2 = new fullAvatarEditor('swf2', {
|
||||
id: 'swf2',
|
||||
upload_url: 'upload.php', //上传图片的接口地址
|
||||
src_url: sourcePic2Url, //默认加载的原图片的url
|
||||
src_upload: 2, //是否上传原图片的选项：2-显示复选框由用户选择，0-不上传，1-上传
|
||||
avatar_scale:2, //头像保存时的缩放系数
|
||||
avatar_intro:'最终头像的尺寸为以下尺寸 * 2(设置的缩放系数)', //头像尺寸的提示文本。其间用"|"号分隔，
|
||||
avatar_sizes_desc:'100*100像素，缩放系数为2，保存后的大小为200*200像素。|50*50像素，缩放系数为2，保存后的大小为100*100像素。|32*32像素，缩放系数为2，保存后的大小为64*64像素。'
|
||||
}, callback);
|
||||
});
|
||||
Reference in New Issue
Block a user