/************************************** 内容阅读组件 ***************************************/
Ext.ns('Ext.gzj');
Ext.gzj.Reader = Ext.extend(Ext.util.Observable, {
    transitionDuration: 1,        //特效持续时间
    transitionEasing: 'easeOut',  //运动特效类型
	offset: 60,                   //单步的偏移量
	direct: true,                 //是否垂直阅读
	itemSelector : false,         //项目选择符
	isinit: true,
	maxHeight: false,
	//组件的构造方法
    constructor: function(elId, config) {
        config = config || {};
        Ext.apply(this, config);
        Ext.gzj.Reader.superclass.constructor.call(this, config);
		this.component = Ext.get(elId);    //获取组件对象
        this.initMarkup();                 //初始化组件
		if(this.maxHeight && this.viewHeight<this.component.getHeight()){
			this.wrap.setHeight(this.maxHeight);
			this.viewHeight=this.maxHeight;
		}else if(this.maxHeight && this.viewHeight>=this.component.getHeight()){	
			Ext.get(this.previd).setDisplayed(false);
			Ext.get(this.nextid).setDisplayed(false);
		}
		if(this.direct && this.viewHeight<this.component.getHeight()){
			this.initEvents();                 //初始化事件
		}else if(!this.direct && this.viewWidth<this.component.getWidth()){
			this.initEvents();                 //初始化事件
		}
    },
	//方法：初始化组件
    initMarkup: function() {
		//获取组件的宽度和高度
		this.viewWidth = this.component.getWidth();
		this.viewHeight = this.component.getHeight();
		//给组件添加外包,用来作为视图窗口
        this.wrap = this.component.wrap();
		this.wrap.setStyle({
			position: 'relative',
            width: this.viewWidth + 'px',
            height: this.viewHeight + 'px',
			overflow: 'hidden'
        });
		if(!this.direct){
			this.wrap.setStyle({
				float: 'left',
				display: 'inline'
			});
		}
		//重新设置组件的大小
		if(this.direct) {
			this.component.setStyle({				
				height: 'auto'
			});
		}else {
			this.component.setStyle({
				width: 'auto'
			});
			if(this.itemSelector){
				var sumWidth=0;
				this.component.select(this.itemSelector).each(function(item) {
					sumWidth = sumWidth + item.getWidth();
				}, this);
				this.component.setWidth(sumWidth);
			}
		}		
    },
	//方法：初始化事件
    initEvents: function() {
		this.preving = false;
		this.nexting = true;
		if(this.direct) {
			this.maxY = this.component.getY();
			this.minY = this.maxY - this.component.getHeight() + this.viewHeight;
			this.offsetY = this.maxY;
		}else {
			this.maxX = this.component.getX();
			this.minX = this.maxX - this.component.getWidth() + this.viewWidth;
			this.offsetX = this.maxX;
		}
		//向前按钮事件
		if(this.previd){
			this.prevbtn = Ext.get(this.previd);
			this.prevbtn.on('click', function(ev){
				var target = Ext.get(ev.getTarget());
				target.blur();
				if(this.preving){
					this.prev();
				}
			}, this);
		}
		//向后按钮事件
		if(this.nextid){
			this.nextbtn = Ext.get(this.nextid);
			this.nextbtn.addClass('on');
			this.nextbtn.on('click', function(ev){
				var target = Ext.get(ev.getTarget());
				target.blur();
				if(this.nexting){
					this.next();
				}
			}, this);
		}
    },
	//方法：向前滚动内容
    prev: function() {
		if(this.direct){
			this.offsetY = this.offsetY + this.offset;
			if(this.offsetY >= this.maxY) {
				this.offsetY = this.maxY;
				this.preving = false;
				this.prevbtn.removeClass('on');
			}
		}else {
			this.offsetX = this.offsetX + this.offset;
			if(this.offsetX >= this.maxX) {
				this.offsetX = this.maxX;
				this.preving = false;
				this.prevbtn.removeClass('on');
			}
		}
		this.component.syncFx().shift({
			x: this.offsetX,
			y: this.offsetY,
			easing: this.transitionEasing,
			duration: this.transitionDuration
		});
		if(!this.nexting){
			this.nexting = true;
			this.nextbtn.addClass('on');
		}
	},
	//方法：向后滚动内容
    next: function() {
		if(this.direct){
			if(this.isinit){
				this.maxY = this.component.getY();
				this.minY = this.maxY - this.component.getHeight() + this.viewHeight;
				this.offsetY = this.maxY;
			}
			this.isinit = false;
			this.offsetY = this.offsetY - this.offset;
			if(this.offsetY <= this.minY) {
				this.offsetY = this.minY;
				this.nexting = false;
				this.nextbtn.removeClass('on');
			}
		}else {
			this.offsetX = this.offsetX - this.offset;
			if(this.offsetX <= this.minX) {
				this.offsetX = this.minX;
				this.nexting = false;
				this.nextbtn.removeClass('on');
			}
		}
		this.component.syncFx().shift({
			x: this.offsetX,
			y: this.offsetY,
			easing: this.transitionEasing,
			duration: this.transitionDuration
		}, this);
		if(!this.preving){
			this.preving = true;
			this.prevbtn.addClass('on');
		}
	}
});