
//名前空間用のオブジェクトを用意する
var CONTENTVIEW_3D = {};

CONTENTVIEW_3D.createMatrixPoints = function(width, height, _v, _h, imgCurrX, imgCurrY){   
    
    var deltaX =    width/ _h;
    var deltaY =    height/ _v;
    var _arrFrame = [];
    
    for (var countV = 1; countV<= _v; countV++){
        var temp = [];
        for(var countH = 1;countH<=_h; countH++){
            
                var frame = {
                    x1: deltaX*(countH-1), 
                    y1: deltaY*(countV-1),
                    x2: deltaX*countH, 
                    y2: deltaY*countV, 
                    matrixY: countV,
                    matrixX: countH
                };
                temp[countH]=frame;
        }
        
        _arrFrame[countV]=temp;
    }
    
    _arrFrame = CONTENTVIEW_3D.setImageIndexToMatrix(imgCurrX, imgCurrY, _arrFrame, _h, _v);
    
    return _arrFrame;    
};

CONTENTVIEW_3D.setImageIndexToMatrix = function(imgCurrX, imgCurrY, _arrFrame, _h, _v){
    
    var deltaH = (_h - 1)/2;
    var deltaV = (_v - 1)/2;
    
    for(var countY = 1;countY<=_v;countY++){
        var currY = CONTENTVIEW_3D.reCalcMatrixY(imgCurrY - deltaV + (countY - 1), _v);
        
        for(var countX=1;countX<=_h;countX++){     
            var currFrame = _arrFrame[countY][countX];
            currFrame.imgY = currY;
            
            var currX = imgCurrX - deltaH + (countX-1);
            currFrame.imgX = CONTENTVIEW_3D.reCalcMatrixX(currX, _h);
            
            //set value back
            _arrFrame[countY][countX] = currFrame;      
        }
    }
    
    return _arrFrame;
};

CONTENTVIEW_3D.showCurrImg = function(id, x, y, w, h, _currFrameX, _currFrameY){
    var strCountH = CONTENTVIEW_GETDATA.convNumTo2Char(_currFrameX);
    var strCountV = CONTENTVIEW_GETDATA.convNumTo2Char(_currFrameY);
    
    var canvas = document.getElementById('offscreen');
    var context = canvas.getContext('2d');
    
    var imageId = strCountV + "-" + strCountH;
    var imageUrl = "";
    
    for(var i = 0 ; i < CONTENTVIEW_GENERAL._object3DImageArr.length; i++){
        var obj = CONTENTVIEW_GENERAL._object3DImageArr[i];
        
        if(obj.id == id){
            var Obj1 = obj["3dview"];
            imageUrl = Obj1[imageId];
            break;
        }
    }
        
    var imgCurr = new Image();
    
    imgCurr.onload= function() {             
        context.drawImage(imgCurr, x,y,w,h);
        context.save();
        
        if (ClientData.IsAddingMarking() == false && ClientData.IsDisplayMarking() == true) {
        	CONTENTVIEW.drawMarkingOnScreen();
            if(!CONTENTVIEW.isExistDrawing){
            	CONTENTVIEW.flip();
            }
        }
        else{
        	CONTENTVIEW.flip();
        }
    };
    imgCurr.src = imageUrl;
};

CONTENTVIEW_3D.reCalcMatrixX = function(x, _h){
    if(x <= 0)
        x = x + _h;
    
    if(x >_h)
        x = x - _h;
    return x;
};
    
CONTENTVIEW_3D.reCalcMatrixY = function(y, _v){
    if(y <= 0)
        y = y + _v;
    if(y >_v)
        y =  y - _v;
    return y;
};

CONTENTVIEW_3D.getArrFrame = function(id){
    var arrResult = [];

    for(var i = 0; i < CONTENTVIEW_GENERAL._object3DImageArr.length; i++){
        var obj = CONTENTVIEW_GENERAL._object3DImageArr[i];
        if(obj.id == id){
            arrResult = obj.arrFrame;            
            return arrResult;
        }
    }
};

CONTENTVIEW_3D.get3dLastSeclectedFrame = function(id){
    var arrResult = Object();

    for(var i = 0; i < CONTENTVIEW_GENERAL._object3DImageArr.length; i++){
        var obj = CONTENTVIEW_GENERAL._object3DImageArr[i];
        if(obj.id == id){
            arrResult = obj._lastSelectedFrame;            
            return arrResult;
        }
    }
};

CONTENTVIEW_3D.set3dLastSeclectedFrame = function(id, lastFrame){

    for(var i = 0; i < CONTENTVIEW_GENERAL._object3DImageArr.length; i++){
        var obj = CONTENTVIEW_GENERAL._object3DImageArr[i];
        if(obj.id == id){
        	CONTENTVIEW_GENERAL._object3DImageArr[i]._lastSelectedFrame = lastFrame;
        }
    }
};

CONTENTVIEW_3D.getMatrixIndexByPosition = function(id, position, left, top, tempRatioWidth2, tempRatioHeight2){
    //compate with matrix to check went to another frame or not
    
    var posX = position.x;
    var posY = position.y;  
    
    //console.log("posX:" + posX + " posY:" + posY + " left:" + left + " top:" + top );
    
    posX = posX - left;
    posY = posY - top;
    
    //座標調整　縮める
    posX = posX * tempRatioWidth2;
    posY = posY * tempRatioHeight2;
    
    var _arrFrame = CONTENTVIEW_3D.getArrFrame(id);
        
    for(var countY=1;countY<_arrFrame.length;countY++){
        for(var countX=1;countX<_arrFrame[countY].length;countX++){
            // get curr frame image object
            var objFrame = _arrFrame[countY][countX];       
            
            if(posX >= objFrame.x1 && posX < objFrame.x2 && posY >= objFrame.y1 && posY < objFrame.y2 ){
                var nRet = objFrame;          
                return nRet;
            }
        }
    }
    return false;       
};

CONTENTVIEW_3D.get3dCurrentFramePos = function(id){
    var currFrame = [];
    
    for(var i = 0; i < CONTENTVIEW_GENERAL._object3DImageArr.length; i++){
        var obj = CONTENTVIEW_GENERAL._object3DImageArr[i];
        if(obj.id == id){
            currFrame['_currFrameX'] = obj['_currFrameX'];
            currFrame['_currFrameY'] = obj['_currFrameY'];
            
            return currFrame;
        }
    }
};

CONTENTVIEW_3D.set3dCurrentFramePos = function(id, currFramePos){
    for(var i = 0; i < CONTENTVIEW_GENERAL._object3DImageArr.length; i++){
        var obj = CONTENTVIEW_GENERAL._object3DImageArr[i];
        if(obj.id == id){
        	CONTENTVIEW_GENERAL._object3DImageArr[i]._currFrameX = currFramePos._currFrameX;
        	CONTENTVIEW_GENERAL._object3DImageArr[i]._currFrameY = currFramePos._currFrameY;
        }
    }
};

CONTENTVIEW_3D.OnMouseDown3D = function(id, position, left, top, tempRatioWidth2, tempRatioHeight2) {
    
    if(!CONTENTVIEW_3D._3dMoveFlag ){
    	CONTENTVIEW_3D._3dMoveFlag = true;  
                
        //compate with matrix to check went to another frame or not
        //and set to last selected frame to compare on move event later
        var _lastSelectedFrame = CONTENTVIEW_3D.getMatrixIndexByPosition(id, position, left, top, tempRatioWidth2, tempRatioHeight2);
        CONTENTVIEW_3D.set3dLastSeclectedFrame(id, _lastSelectedFrame);
    }
    
};

CONTENTVIEW_3D.OnMouseMove3D = function(id, position, left, top, width, height, _h, _v, tempRatioWidth2, tempRatioHeight2) {
	
    if(!CONTENTVIEW_3D._3dMoveFlag){
        return;
    }
	
    //compate with matrix to check went to another frame or not
    var selectedFrame = CONTENTVIEW_3D.getMatrixIndexByPosition(id, position, left, top, tempRatioWidth2, tempRatioHeight2);
//console.log("selectedFrameX:" + selectedFrame.matrixX + "," + selectedFrame.matrixY );
    
    var _lastSeclectedFrame = CONTENTVIEW_3D.get3dLastSeclectedFrame(id);
    var _currFramePos = CONTENTVIEW_3D.get3dCurrentFramePos(id);
    var _currFrameX = _currFramePos._currFrameX;
    var _currFrameY = _currFramePos._currFrameY; 
    
        
    var strCountH = CONTENTVIEW_GETDATA.convNumTo2Char(selectedFrame.matrixX);
    var strCountV = CONTENTVIEW_GETDATA.convNumTo2Char(selectedFrame.matrixY);

    //get what action did occur
    var action = CONTENTVIEW_3D.get3DAction(_lastSeclectedFrame, selectedFrame);

    $('#test').html(action);

    if(action!=0){
        if(action==1)
            //_currFrameX--;
            _currFrameX++;
        else if(action==2)
            //_currFrameX++;
            _currFrameX--;            
        else if(action==3)
            //_currFrameY--;
            _currFrameY++;
        else if(action==4)
            //_currFrameY++;
            _currFrameY--;
                   
        _currFrameX = CONTENTVIEW_3D.reCalcMatrixX(_currFrameX, _h);
        _currFrameY = CONTENTVIEW_3D.reCalcMatrixY(_currFrameY, _v);
               
         // show current img 
        CONTENTVIEW_3D.showCurrImg(id, left, top, width, height, _currFrameX, _currFrameY);
        _lastSeclectedFrame = selectedFrame;
        
        //recalculate X, Y value
        _currFramePos._currFrameX = _currFrameX; 
        _currFramePos._currFrameY = _currFrameY;
        
        CONTENTVIEW_3D.set3dCurrentFramePos(id, _currFramePos);                                  
        CONTENTVIEW_3D.set3dLastSeclectedFrame(id, _lastSeclectedFrame);
    }
};

CONTENTVIEW_3D.OnMouseEnd3D = function(id, _h, _v) {
	
    if(CONTENTVIEW_3D._3dMoveFlag) {
    	CONTENTVIEW_3D._3dMoveFlag = false;
        
        var currFramePos = CONTENTVIEW_3D.get3dCurrentFramePos(id);
        var _currFrameX = currFramePos._currFrameX;
        var _currFrameY = currFramePos._currFrameY;
        var _arrFrame = CONTENTVIEW_3D.getArrFrame(id);
        
        //CONTENTVIEW_3D.setImageIndexToMatrix(_currFrameX, _currFrameY, _arrFrame, _h, _v);
        CONTENTVIEW_3D.setArrFrame(id, _h, _v, _currFrameX, _currFrameY, _arrFrame);
    }   
};

CONTENTVIEW_3D.setArrFrame = function(id, _h, _v, _currX, _currY, _arrFrame){
    
    for(var i = 0; i < CONTENTVIEW_GENERAL._object3DImageArr.length; i++){
        var obj = CONTENTVIEW_GENERAL._object3DImageArr[i];
        if(obj.id == id){
            obj.arrFrame = CONTENTVIEW_3D.setImageIndexToMatrix(_currX, _currY, _arrFrame, _h, _v);
        }
    }   
};

//compare 2 frame to get action
CONTENTVIEW_3D.get3DAction = function(lastFrame, currFrame){
    var nRet = 0;

    if(lastFrame.x1<currFrame.x1)
        nRet=1; // move right
    else if(lastFrame.x1>currFrame.x1)
        nRet=2; // move left
    else if(lastFrame.y1<currFrame.y1)
        nRet=3; // move down
    else if(lastFrame.y1>currFrame.y1)
        nRet=4; // move up
    
    return nRet;    
};

$(function () {
	//CONTENTVIEW_3D.ready();
});

CONTENTVIEW_3D.ready = function(){
	
	CONTENTVIEW_3D._3dMoveFlag = false;
	CONTENTVIEW_3D._3dAction = '';
	CONTENTVIEW_3D._curr3dObject = undefined;
	CONTENTVIEW_3D._3dActionType = {
	    'TouchStart_MouseDown' : 0,
	    'TouchMove_MouseMove' : 1,
	    'TouchEnd_MouseUp' : 2
	};
	
};

