/**
 * @fileoverview 二手市场图片上传主题
 * @author 紫英(橘子)<daxingplay@gmail.com>
 **/
KISSY.add('gallery/form/1.3/uploader/themes/ershouUploader/index', function (S, Node, Theme, Message, SetMainPic) {
    var EMPTY = '', 
    	$ = Node.all,
    	LOG_PRE = '[Theme-ershou] ';

    /**
     * @name ErshouUploader
     * @class 二手市场图片上传主题
     * @constructor
     * @extends Theme
     * @requires Theme
     * @requires  ProgressBar
     * @author 紫英（橘子）<daxingplay@gmail.com>
     */
    function ErshouUploader(config) {
        var self = this;
        //调用父类构造函数
        ErshouUploader.superclass.constructor.call(self, config);
    }
    
    S.extend(ErshouUploader, Theme, /** @lends ErshouUploader.prototype*/ {
    	/**
         * 在上传组件运行完毕后执行的方法
         * 本例主要是用来绑定事件，初始化一些附加模块
         * @param {Uploader} uploader
         */
		afterUploaderRender: function(uploader){
			var self = this,
				Plugins = self.get('oPlugin'),
				queue = uploader.get('queue'),
                button = uploader.get('button'),
                auth = uploader.get('auth'),
                queueTarget = self.get('queueTarget');
			
			// 初始化成功后将默认的input隐藏掉。这个默认的input是用来防止uploader无法初始化成功的fallback方案
			var elemButtonTarget = button.get('target'),
				elemTempFileInput = $('.original-file-input', elemButtonTarget);
			$(elemTempFileInput).remove();
			S.log(LOG_PRE + 'old input removed.');
			
			// 取得最大上传数量
			var maxFileAllowed = 5;
			if(auth){
            	maxFileAllowed = auth.getRule('max');
            }else{
            	S.log(LOG_PRE + 'Cannot get auth');
            }
            self.set('maxFileAllowed', maxFileAllowed);
            
            // 初始化插件+附加模块
			var preview = new Plugins.preview(),
				message = new Message({
	            	'msgContainer': self.get('msgContainer'),
	            	'successMsgCls': self.get('successMsgCls'),
	            	'hintMsgCls': self.get('hintMsgCls'),
	            	'errorMsgCls': self.get('errorMsgCls')
	            }),
	            setMainPic = new SetMainPic(self.get('mainPicInput'), self.get('queueTarget'));
            self.set('message', message);
            self.set('preview', preview);
            self.set('setMainPic', setMainPic);
            
            // 如果是ajax上传模式，添加一个class
            if(uploader.get('type') == 'ajax'){
            	S.log(LOG_PRE + 'advance queue');
            	$(self.get('queueTarget')).addClass('advance-queue');
            }
            
            // 设置主图
            $(queueTarget).delegate('click', '.J_SetMainPic', function(e){
            	e.preventDefault();
            	var setMainPicBtn = e.currentTarget,
            		// fileid = $(setMainPicBtn).attr('data-file-id'),
            		// fileIndex = queue.getFileIndex(fileid),
            		// file = queue.getFile(fileIndex),
            		curQueueItem = $(setMainPicBtn).parent('li');
        		setMainPic.setMainPic(curQueueItem);
            });
            
            // 删除图片
            $(queueTarget).delegate('click', '.J_DeleltePic', function(e){
            	e.preventDefault();
            	var delBtn = e.currentTarget,
            		fileid = $(delBtn).attr('data-file-id');
        		queue.remove(fileid);
            });
            
            return true;
            
            queue.on('restore', function(e){
            	var curMainPicUrl = setMainPic.getMainPicUrl(),
            		successFiles = queue.getFiles('success'),
            		queueLength = successFiles ? parseInt(successFiles.length, '10') : 0 + parseInt(e.filesData.length, '10');
            	setMainPic.setMainPic(curMainPicUrl);
            	if(queueLength){
        			message.send(S.substitute(leftMsg, {
	        			'left': maxFileAllowed[0] - queueLength
	        		}), 'hint');
        		}
            });
            
            queue.on('add',function(ev){
            	var elemImg = $('.J_ItemPic', ev.target),
            		successFiles = queue.getFiles('success');
        		preview.preview(ev.file.input, elemImg);
        		S.log(LOG_PRE + 'preview done for file: ' + ev.file.id);
        		if(successFiles.length + 1){
        			message.send(S.substitute(leftMsg, {
	        			'left': maxFileAllowed[0] - successFiles.length - 1
	        		}), 'hint');
        		}
            });
            
            
            
            
            queue.on('remove', function(e){
            	var successFiles = queue.getFiles('success'),
            		msg;
            	setMainPic.setMainPic();
            	if(successFiles.length){
            		msg = S.substitute(leftMsg, {
	        			'left': maxFileAllowed - successFiles.length
	        		});
        			
        		}else{
        			msg = S.substitute(defaultMsg, {
	        			'max': maxFileAllowed
	        		});
        		}
        		message.send(msg, 'hint');
            });
            
            uploader.on('success', function(e){
            	// debugger;
            	// var successFiles = queue.getFiles('success'),
            		// successFilesLength = successFiles ? successFiles.length : 0;
        		var file = e.file,
        			curQueueItem = file.target,
        			serverUrl = file.sUrl;
    			$(curQueueItem).attr('data-url', serverUrl);
            	setMainPic.setMainPic();
            	// message.send();
            });
		},
		/**
		 * 更新文件数目
		 */
		_updateCount: function(){
			var self = this,
				queue = self.get('queue'),
				successFiles = queue.getFiles('success'),
            	maxFileAllowed = self.get('maxFileAllowed')[0],
                message = self.get('message'),
                defaultMsg = self.get('defaultMsg'),
                leftMsg = self.get('leftMsg'),
                msg;
            if(successFiles.length){
        		msg = S.substitute(leftMsg, {
        			'left': maxFileAllowed - successFiles.length
        		});
    		}else{
    			msg = S.substitute(defaultMsg, {
        			'max': maxFileAllowed
        		});
    		}
    		message.send(msg, 'hint');
    		S.log(LOG_PRE + 'file count updated. Message sent.')
            // if(successFiles.length + 1){
            	// var leftNum = maxFileAllowed[0] - successFiles.length - 1;
            	// message.sendLeftMsg(leftNum);
    		// }
		},
		/**
         * 向队列添加完文件后触发的回调函数（在add事件前触发）
         * @param {Number} index 文件索引值
         * @param {Object} file 文件数据
         * @return {Object} file
         */
		_addCallback: function(index, file){
			var self = this,
                queue = self.get('queue'),
                queueItem = self._appendFileDom(file);
            //将状态层容器写入到file数据
            queue.updateFile(index, {
                target: queueItem
            });
            //更换文件状态为等待
            queue.fileStatus(index, 'waiting');
            self.displayFile(true, queueItem);
            
            // 更新剩余文件数量
            self._updateCount();
            return queue.getFile(index);
		},
		/**
         * 文件处于等待上传状态时触发
         * 进行图片预览
         */
        _waitingHandler:function (ev) {
            var self = this,
            	preview = self.get('preview'),
            	file = ev.file,
            	queueItem = file.target,
                elemImg = $('.J_ItemPic', queueItem);
    		preview && preview.preview(file.input, elemImg);
    		S.log(LOG_PRE + 'preview done for file: ' + ev.file.id);
    		// 添加waiting状态
    		$(queueItem).addClass('upload-waiting');
        },
        /**
         * 在完成文件dom插入后执行的方法
         * @param {Object} ev 类似{index:0,file:{},target:$target}
         */
        _addHandler: function(ev){
        	S.log(LOG_PRE + 'add done.');
        },
        /**
         * 文件处于开始上传状态时触发
         */
        _startHandler: function(ev){
        	var self = this,
        		file = ev.file,
        		queueItem = file.target;
    		$(queueItem).replaceClass('upload-waiting', 'uploading');
        	S.log(LOG_PRE + 'start upload');
        },
        /**
         * 文件处于上传成功状态时触发
         */
        _successHandler: function(ev){
        	var self = this,
        		file = ev.file,
        		queueItem = file.target,
        		setMainPic = self.get('setMainPic');
    		$(queueItem).replaceClass('uploading', 'upload-done').attr('data-url', file.result.data.url);
    		setMainPic.setMainPic();
    		// 更新剩余文件数量
            self._updateCount();
        },
        /**
         * 删除图片后触发
         */
        _removeFileHandler: function(ev){
        	var self = this,
        		file = ev.file,
        		queueItem = file.target;
        	// 更新剩余文件数量
            self._updateCount();
            $(queueItem).remove();
            S.log(LOG_PRE + 'file deleted.');
        }
    }, {
    	ATTRS: /** @lends ErshouUploader.prototype*/ {
    		/**
	         *  主题名
	         * @type String
	         * @default "ershouUploader"
	         */
	        name: {
	        	value: 'ershouUploader'
        	},
	        /**
	         * css模块路径
	         * @type String
	         * @default "gallery/form/1.3/uploader/themes/ershouUploader/style.css"
	         */
	        cssUrl: { 
	        	value: 'gallery/form/1.3/uploader/themes/ershouUploader/style.css'
			},
	        /**
	         * 队列使用的模板
	         * @type String
	         */
	        fileTpl:{
	        	value: ['<li id="J_LineQueue-{id}" data-file-id="{id}" data-url="{sUrl}" data-name="{name}" data-size="{textSize}">',
							'<div class="J_Wrapper wrapper">',
								'<div class="tb-pic120">',
									'<a href="javascript:void(0);"><img class="J_ItemPic" src="{sUrl}" /></a>',
								'</div>',
								'<div class="pic-mask"></div>',
								'<div class="tips-uploading"><div class="progress-bar J_ProgressBar"><span class="progress-mask J_UploadingProgress"></span></div><p class="tips-text">上传中，请稍候</p></div>',
								'<div class="tips-upload-success"><span class="progress-bar"></span><p class="tips-text">上传成功！</p></div>',
								'<div class="tips-upload-error"><span class="progress-bar"></span><p>上传失败</p><p>请重新尝试！</p></div>',
								'<div class="tips-upload-waiting">等待上传，请稍候</div>',
								'<div class="upload-op-mask"></div>',
								'<div class="upload-operations">',
									'<a class="J_SetMainPic set-as-main" data-file-id="{id}" href="#">设为主图</a>',
									'<a class="J_DeleltePic del-pic" data-file-id="{id}" href="#">删除</a>',
								'</div>',
							'</div>',
						'</li>'].join('')
	        },
	        /**
	         * 需要加载的插件，需要手动实例化
	         * @type Array
	         */
			plugins: { 
				value: [
					'preview', 
					'progressBar'
				]
			},
			
			/**
			 * 显示错误消息的容器id
			 * @type String
			 */
			'msgContainer': {
				value: '#J_MsgBoxUpload'
			},
			/**
			 * 默认的提示消息
			 * @type String
			 */
			'defaultMsg': {
				value: '最多上传{max}张照片，每张图片小于5M'
			},
			/**
			 * 剩余多少张的消息
			 * @type String
			 */
			'leftMsg': {
				value: '还可以上传{left}张图片，每张小于5M。主图将在搜索结果中展示，请认真设置。'
			},
			/**
			 * 成功消息的class
			 * @type String
			 */
			'successMsgCls': {
				value: 'msg-success'
			},
			/**
			 * 提示消息的class
			 * @type String
			 */
			'hintMsgCls': {
				value: 'msg-hint'
			},
			/**
			 * 错误消息的class
			 * @type String
			 */
			'errorMsgCls': {
				value: 'msg-error'
			},
			/**
			 * 设置主图的input，如果不存在，则不初始化设置主图功能
			 * @type String
			 */
			'mainPicInput': {
				value: '#J_MainPicUrl'
			}
    	}
    });

    return ErshouUploader;
}, {
	requires:[
		'node', 
		'../../theme',
		'./message',
		'./setMainPic'
	]
});