不用pagingtoolbar的store分页

/**
 * 首页图片展现页面
* @author tanglihong
* @date 2014-7-9
*/
Ext.define('Sunwave.view.homepage.PictureGrid',{
extend:'Ext.grid.Panel',
alias : 'widget.pictureGrid',
title:'图片a',
iconCls:'sy-call_start',
hideHeaders :true,
loadnum:false,//是否第一次加载
initComponent:function(){
this.store=Ext.create('Sunwave.store.media.HomePictureStore',{
pageSize:2,
autoLoad:false
});

this.store.on('beforeload',this.onstoreLoad,this);
this.store.on('load',this.onstoreLoad2,this);
this.columns={
items:[
{
dataIndex:'uploadNameShow',
width:65, 
   renderer:renderCall
},{
dataIndex:'uploadNameShow',
width:150,
   renderer:renderCall2
}
]
};

function renderCall(value,p, record,xx,xxx,store) { 
var id=record.get('id');
//图片名称
var imgName=record.get('currentName') ;
var imgSrc=null;
if(imgName!=null)imgSrc="ftpdownload/"+imgName+"";
var html ='   <table > ' +
'<tr>' +
'  <td>' +
' <a href="javascript:HomePicWin.showPicture(\''+id+'\');">' +
'<img height=60  width=60 src='+imgSrc+'>' +
'</a>' +
'  </td> </tr>' +
'  </table> ';
    return html;
    };
    function renderCall2(value,p, record) {
var html ='   <table > ' +
'<tr>  <td><b>'+value+'</b></td>  </tr>' +
'<tr>  <td><font color="#c0c0c0">'+record.get('phone')+'</font></td></tr> ' +
'<tr>  <td><font color="#c0c0c0">'+record.get('time')+'</font></td></tr>' +
'    </table> ';
    return html;
    };
    
this.dockedItems=[{
       xtype: 'pagingtoolbar',
       store: this.store,
       dock: 'bottom',
       inputItemWidth:15
}];


this.callParent(arguments);
},
onstoreLoad:function(){
if(!this.loadnum){
// HomePicWin.picBatchDownLoad();
this.loadnum=true;
}

},
onstoreLoad2:function(){
console.log("-------------------");
console.dir(this.store);
}
});




Ext.define('Sunwave.view.homepage.PictureWin',{
extend:'Ext.Window',
alias : 'widget.pictureWin',
title:'图片轮播',
width : 800,
height : 500,
layout:"fit",
currIndex:0,
initComponent:function(){
this.store=Ext.create('Sunwave.store.media.PictureStore',{
// pageSize:10,
autoLoad:false
});

this.store.on('load',this.onwinstoreLoad,this);

this.store.load({start:this.gridStart,limit:this.gridLimit});

// console.dir(this.store);

// alert(this.currImgId);

/*
if(!this.imgItems){
this.imgItems=[];
}
var currUrl="";
for(var i=0;i<this.imgItems.length;i++){
if(this.imgItems[i].curr){
currUrl=this.imgItems[i].url;
this.currIndex=i;
}
}


var html="  <div  style='position:absolute;'>" +
   "<div style='position:absolute;top:200px;right:10px' id='"+this.id+"_next' > >>> </div>" +
   "<div style='position:absolute;top:200px;left:10px' id='"+this.id+"_pre' > <<<< </div>" +
   "<img src='"+currUrl+"' style='width:800px;height:500px' id='"+this.id+"_img'/>  " +
  "</div>";
this.items=[ {   
       xtype: 'panel',   
       region: 'center',   
       layout:'fit',   
       bodyStyle : 'background-color:#E5E3DF;',   
       frame:false,   
       border:false,       
       html :html
   }];*/

this.callParent(arguments);
},
onRender:function(){
this.callParent(arguments);
// Ext.get(this.id+"_next").on("click",this.next,this);
// Ext.get(this.id+"_pre").on("click",this.pre,this);



},next:function(){
if(this.currIndex==this.imgItems.length-1){
this.store.load({start:this.gridStart+this.gridLimit,limit:this.gridLimit});
this.gridStart+=this.gridLimit;
this.isPre=false;
return;
}

this.currIndex++;
if(this.currIndex==this.imgItems.length){
this.currIndex=0;
}
Ext.get(this.id+"_img").dom.src=this.imgItems[this.currIndex].url;


},
pre:function(){

if(this.currIndex==0){
if(this.gridStart==0){
alert('diyizhang');
return;
}
this.store.load({start:this.gridStart-this.gridLimit,limit:this.gridLimit});
this.gridStart-=this.gridLimit;
this.isPre=true;
return;
}

this.currIndex--;
if(this.currIndex<0){
this.currIndex=this.imgItems.length-1;
}
Ext.get(this.id+"_img").dom.src=this.imgItems[this.currIndex].url;
},
isCreateHTML:false,//判断是否初次生成的html

onwinstoreLoad:function(){

this.createArray();

if(!this.isCreateHTML){
this.isCreateHTML=true;

var html="  <div  style='position:absolute;'>" +
   "<div style='position:absolute;top:200px;right:10px' id='"+this.id+"_next' > <img src='img/homepage/big/right.png'> </div>" +
   "<div style='position:absolute;top:200px;left:10px' id='"+this.id+"_pre' > <img src='img/homepage/big/left.png'> </div>" +
   "<img src='"+this.currUrl+"' style='width:800px;height:500px' id='"+this.id+"_img'/>  " +
  "</div>";
this.add({
html:html
});

Ext.get(this.id+"_next").on("click",this.next,this);
Ext.get(this.id+"_pre").on("click",this.pre,this);
}else{
if(this.isPre){
this.currIndex=this.imgItems.length-1;
}else{
this.currIndex=0;
}
Ext.get(this.id+"_img").dom.src=this.imgItems[this.currIndex].url;
}
},
createArray:function(){
this.currUrl="";
this.imgItems=[] ;

var gridItems = this.store.data.items;
for(var i=0;i<gridItems.length;i++){
var tempItem={
//url: gridItems[i].data.storagePath+gridItems[i].data.currentName,//linux
url: 'ftpdownload/'+gridItems[i].data.currentName,//window
curr: gridItems[i].data.id==this.currImgId
}
this.imgItems.push(tempItem);
if(tempItem.curr){
this.currUrl=tempItem.url;
}
}
}

});








/**
 * 
 begin
 */
(function(){

Ext.ns('HomePicWin');
//重新打开窗口->功能：轮播所有图片
HomePicWin.showPicture=function(id){
var gridStore = Ext.getCmp('pictureGridConfig').getStore();
var start = gridStore.lastOptions.start;
var limit = gridStore.lastOptions.limit;
// var newAarry=[] ;

// var gridItems = gridStore.data.items;
// var newAarry=[] ;
// for(var i=0;i<gridItems.length;i++){
// newAarry.push({
url: gridItems[i].data.storagePath+gridItems[i].data.currentName,//linux
// url: 'ftpdownload/'+gridItems[i].data.currentName,//window
// curr: gridItems[i].data.id==id
// });
// }


var showWin = Ext.create('Sunwave.view.homepage.PictureWin', {
width : 800,
height : 500,
currImgId:id,
gridStart:start,
gridLimit:limit
// ,imgItems:newAarry
//imgStore:gridStore
});
showWin.show();
};
/**
* 批量下载一周内的图片
*/
HomePicWin.picBatchDownLoad=function(){
//获取时间范围数据
var arry = getDateForDay(-7);
var sd = arry[0];
var ed = arry[1];

ajaxRequest({
url : 'gpsPictureVideoAction!batchDownFtpFiles.action',
params :({
fileType:'DATA_TYPE_PHOTO',
beginTime:sd,
endTime:ed
}),
async : false,
callBack:function(result){
}
});
};












//
// //重新打开窗口->功能： 上下左右移动 左右旋转 放大缩小图标
// HomePicWin.fileName=null;
// HomePicWin.viewPicture=function(id,filePath,fileName){
// createPicWin(fileName);
// pageInit();
// };
// /**
// * 创建图片 windows 
// */
// function createPicWin(fileName){
// var htmlA = '<div id="mapPic">'+
// '<div class="pnav">'+
// '<div class="pup" id="up"></div>'+
// '<div class="pright" id="right"></div>'+
// '<div class="pdown" id="down"></div>'+
// '<div class="pleft" id="left"></div>'+
// '<div class="pzoom" id="zoom"></div>'+
// '<div class="pin" id="in"></div>'+
// '<div class="pout" id="out"></div>'+
// '<div class="whirlLeft" id="whirlLeft"></div>'+
// '<div class="whirlRight" id="whirlRight"></div>'+
// '</div>'+
// '<div  > ' ;
// var htmlD = ' </div>'+
// '</div>'  ;
// var htmlB = '<img id="view-image" src="ftpdownload/' + fileName+'" border="0" >' ;
//
// HomePicWin.picwin = Ext.create('Ext.Window', {
// title : '图片预览-'+fileName,
// width : 800,
// height : 600,
// resizable:false,
// modal:true,
// closeAction:'hide',
// layout:'border',      
//    items:[{   
//        xtype: 'panel',   
//        region: 'center',   
//        layout:'fit',   
//        bodyStyle : 'background-color:#E5E3DF;',   
//        frame:false,   
//        border:false,       
//        html :htmlA+htmlB+htmlD  
//    }]
// });
// HomePicWin.picwin.show();
// }
// /**
// * 显示本地图片窗体
// */
// function showPicWin(fileName){
// Ext.get('view-image').dom.src = 'ftpdownload/' + fileName;
// PictureController.picwin.setTitle('图片预览-'+fileName);
// PictureController.picwin.show();
// }
// /**  
// * 初始化  
// */  
// function pageInit(){
//    var image = Ext.get('view-image');     
//    var win = HomePicWin.picwin;    
//    if(image!=null){
//        image.on({   
//            'mousedown':{fn:function(e){imageMouseDown(e);}},           
//            'mouseup':{fn:function(e){imageMouseup(e);}},   
//            'mousemove':{fn:function(e){imgMouseMove(e);}},   
//            'dblclick':{fn:function(){   
//                zoomPic(win,image,true,1.2);   
//            }   
//        }});
//         
//        new Ext.dd.DD(image, 'pic');
//       
//        Ext.get('up').on('click',function(){imageMove('up',image);});       //向上移动   
//        Ext.get('down').on('click',function(){imageMove('down',image);});   //向下移动   
//        Ext.get('left').on('click',function(){imageMove('left',image);});   //左移   
//        Ext.get('right').on('click',function(){imageMove('right',image);}); //右移动   
//        Ext.get('in').on('click',function(){zoomPic(win,image,true,1.5);});        //放大   
//        Ext.get('out').on('click',function(){zoomPic(win,image,false,1.5);});      //缩小   
//        Ext.get('zoom').on('click',function(){clearRotation();restore(image);});            //还原  
//        Ext.get('whirlLeft').on('click',function(){rotation(-1);});//向左旋转
//        Ext.get('whirlRight').on('click',function(){rotation(1);});//向右旋转
//    }   
// };
//
// function imageMouseDown(e){ 
// var image = Ext.get('view-image');  
// PictureController.downX = e.getX();
// PictureController.downY=e.getY();
// PictureController.localX = image.getLocalX();
// PictureController.localY = image.getLocalY();
// }
//
// function imgMouseMove(e){
// e.stopEvent( );
// }
//
// function imageMouseup(e){ 
// var win = HomePicWin.picwin;
// var offset = 100*image.getWidth()/win.getWidth();
// offset = offset <50?50:offset;
//
// var upX =  e.getX();
// var upY =e.getY();
// if(upX !=PictureController.downX || upY != PictureController.downY){
// var x =upX - PictureController.downX;
// var y = upY - PictureController.downY;
// if( Math.abs(x) >=  Math.abs(y) && x > 0){
// image.move('right',offset, true);
// }else if(Math.abs(x) >=  Math.abs(y) && x < 0){
// image.move('left', offset, true);
// }else if(Math.abs(x) <=  Math.abs(y) && y > 0){
// image.move('down', offset, true);
// }else if(Math.abs(x) <=  Math.abs(y) && y < 0){
// image.move('up',  offset, true);
// }
// }
// }
// /**  
// * 图片移动  
// */  
// function imageMove(direction, el) {   
//   el.move(direction, 50, true);   
// }   
// /**
// * 
// * @param el 图片对象
// * @param type true放大,false缩小
// * @param offset 量
// */
// function zoomPic(win,el,type,offset){ 
// var width = el.getWidth();
// var height = el.getHeight();
// var winWidth = win.getWidth();
// var winHeight = win.getHeight();
// var nwidth = type ? (width * offset) : (width / offset);
// var nheight = type ? (height * offset) : (height / offset);
// var left = winWidth/2 - nwidth/2;
// var top =  winHeight/2 - nheight/2; 
// el.animate(
// {
// opacity:1,
//        height: nheight,
//        width: nwidth,
//        left: left,
//        top: top
//        },
//        null,      
//    null,     
//    'backBoth',
//    'motion'
// );
// }  
// /**  
// * 图片还原  
// */  
// function restore(el) {  
//    var size = el.osize;   
//       
//    //自定义回调函数   
//    function center(el,callback){   
//        el.center();   
//        callback(el);   
//    }   
//    
//    el.fadeOut({callback:function(){   
//        el.setSize(size.width, size.height, {callback:function(){   
//            center(el,function(ee){//调用回调   
//                ee.fadeIn();   
//            });   
//        }});   
//    }   
//    });   
// }
// /**
// * 初始化图片大小
// */
// function getImgOriginalSize(fileName){
// if(!HomePicWin.hiddenwin){
// HomePicWin.hiddenwin = Ext.create('Ext.Window', {
// width : 800,
// height : 600,
// resizable:false,
// modal:true,
// closeAction:'hide',
// layout:'border',   
//    items:[{   
//        xtype: 'panel',   
//        region: 'center',   
//        layout:'fit',   
//        bodyStyle : 'background-color:#E5E3DF;',   
//        frame:false,   
//        border:false,       
//        html :'<div id="mapPichidden">'+
// '<img id="view-image-hidden" src="ftpdownload/' + fileName+'" border="0" style="" onLoad="PictureController.initImg();">'+
// '</div>'
//    }]
// });
// HomePicWin.hiddenwin.show();
// HomePicWin.hiddenwin.hide();
// }else{
// Ext.get('view-image-hidden').dom.src = 'ftpdownload/' + fileName; 
// }
//
// }
// /**
// * 初始化图片
// */
// HomePicWin.initImg= function(){
// var image = Ext.get('view-image');
// var imageHidden = Ext.get('view-image-hidden');
// //获得原始尺寸  
//    var osWidth = 800;
//    var osHeight = 600;
//    if(imageHidden.getWidth() >= imageHidden.getHeight()){
//     osWidth = 800;
//     osHeight=800/imageHidden.getWidth()*imageHidden.getHeight();
//    }else if(imageHidden.getWidth() <= imageHidden.getHeight()){
//     osWidth = 600/imageHidden.getHeight()*imageHidden.getWidth();
//     osHeight=600;
//    }
//    image.osize = {   
//            width:osWidth,   
//            height:osHeight  
//        };
//    image.setSize(osWidth,osHeight);
//    image.center();//图片居中  
// };
// /**
// * 判断ie版本
// */
// function IeVesion(){
// var userAgent = window.navigator.userAgent.toLowerCase();
// var b_version=navigator.appVersion;
//
// var version=b_version.split(";");
// var trim_Version=version[1].replace(/[ ]/g,"");
//  
// var isIE10 = /MSIE\s+10.0/i.test(navigator.userAgent)&& (function() {"use strict";return this === undefined;}());
// if(isIE10){
//  trim_Version = "IE10";
// }
// else if(navigator.appName == "Microsoft Internet Explorer" && b_version.match(/9./i)=="9.")
// { 
// trim_Version = "IE9";
// }
// else if(navigator.appName == "Microsoft Internet Explorer" && b_version.match(/8./i)=="8.")
// { 
// trim_Version = "IE8";
// }
// return trim_Version;
// };
// /*在系统框架上搞了一个 都是ie9
//<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9" /> 
//按照我们之前的写法  ie8 和ie10都可以实现效果的了，现在 就是ie9 的浏览器上 有问题， 如果用js判断版本的方法，怎么判断都是ie9弹出来 ，让我先想想 怎么做好*/
// /**
// * 左右旋转
// * step -1左旋转1右旋转
// */
// function rotation(step){ 
// rotation(step);
// };
//
// /**
// * 左右旋转
// * step=-1左旋转右旋转
// */
// var rotationIndex=0;
// function rotation(step){
// rotationIndex+=step;
// if(rotationIndex < 0){
// rotationIndex=3;
// }
// var jaodu=rotationIndex%4;
// var img = document.getElementById("view-image");
// cssRotation(img,jaodu);
// }
//
// /**
// * 旋转回正
// */
// function clearRotation(){
// rotationIndex=0;
// var img = document.getElementById("view-image");
// if(IeVesion()=="IE9" ){
// clearRotation=function(){
// img.style.msTransform="rotate(0deg)";
// img.style.transform="rotate(0deg)";
// };
// }
// else{
// clearRotation=function(){
// img.style.filter="progid:DXImageTransform.Microsoft.BasicImage(rotation=0);";
// };
// };
// clearRotation();
//
// };
//
// function cssRotation(el,p){
// if(IeVesion()=="IE9"){
// cssRotation=function(el,p){
// el.style.msTransform="rotate("+(p*90)+"deg)";//ie9
// el.style.transform="rotate("+(p*90)+"deg)";//ie10
// };
// }
// else{
// cssRotation=function(el,p){
// el.style.filter="progid:DXImageTransform.Microsoft.BasicImage(rotation="+p+");";
// };
// };
// cssRotation(el,p);
// };
//
//



})();