20121213

abvw/bookmark.html

@@ -121,8 +121,8 @@
     
     
         <section class="sectionDeleteConfirm" id="delete_shiori">
         <section class="sectionDeleteConfirm" id="delete_shiori">
             <h1 class="lang" lang="txtDeleteConfirmTitle">しおり削除確認</h1>
             <h1 class="lang" lang="txtDeleteConfirmTitle">しおり削除確認</h1>
-            <p class="message " lang="dspShioriDelConf">設定されているしおりを削除しますか？</p>                       	
-            <p class="deletebtn"><a id="dspConfirmOK" lang="dspOK" class="ok">ＯＫ</a><a id="dspCancel" lang="dspCancel" class="cancel">キャンセル</a></p>
+            <p class="message lang" lang="dspShioriDelConf">設定されているしおりを削除しますか？</p>                       	
+            <p class="deletebtn"><a id="dspConfirmOK" lang="dspOK" class="ok lang">ＯＫ</a><a id="dspCancel" lang="dspCancel" class="cancel lang">キャンセル</a></p>
         </section>
         </section>
     
     
     <!-- Delete panel [end] -->
     <!-- Delete panel [end] -->

abvw/common/js/common.js

@@ -466,18 +466,18 @@ function operateData(args, strKey, returnDefaultData) {
             }
             }
         }
         }
         else {
         else {
-//            if (LocalStorageUtils.existKey(strKey) == true) {
-//                SessionStorageUtils.set(strKey, JSON.stringify(LocalStorageUtils.get(strKey)));
-//                return JSON.parse(SessionStorageUtils.get(strKey));
-//            }
-            SessionStorageUtils.set(strKey, JSON.stringify(LocalStorageUtils.get(strKey)));
-            if (SessionStorageUtils.get(strKey) != 'undefined'
-                && SessionStorageUtils.get(strKey) != undefined
-                && SessionStorageUtils.get(strKey) != ''
-                && SessionStorageUtils.get(strKey) != null
-                && SessionStorageUtils.get(strKey) != 'null') {
+            if (LocalStorageUtils.existKey(strKey) == true) {
+                SessionStorageUtils.set(strKey, JSON.stringify(LocalStorageUtils.get(strKey)));
                 return JSON.parse(SessionStorageUtils.get(strKey));
                 return JSON.parse(SessionStorageUtils.get(strKey));
             }
             }
+//            SessionStorageUtils.set(strKey, JSON.stringify(LocalStorageUtils.get(strKey)));
+//            if (SessionStorageUtils.get(strKey) != 'undefined'
+//                && SessionStorageUtils.get(strKey) != undefined
+//                && SessionStorageUtils.get(strKey) != ''
+//                && SessionStorageUtils.get(strKey) != null
+//                && SessionStorageUtils.get(strKey) != 'null') {
+//                return JSON.parse(SessionStorageUtils.get(strKey));
+//            }
             return returnDefaultData;
             return returnDefaultData;
         }
         }
     }
     }

abvw/common/js/zoomDetector.js

@@ -24,7 +24,6 @@ function calculateZoomLevel() {
         if (zoom_callbackFunction) {
         if (zoom_callbackFunction) {
             zoom_callbackFunction(zoom_ratioPre, zoom_ratio, zoom_oldW, zoom_oldH, window.innerWidth, window.innerHeight);
             zoom_callbackFunction(zoom_ratioPre, zoom_ratio, zoom_oldW, zoom_oldH, window.innerWidth, window.innerHeight);
         }
         }
-        alert(zoom_oldW);
         zoom_ratioPre = zoom_ratio;
         zoom_ratioPre = zoom_ratio;
         zoom_oldW = window.innerWidth;
         zoom_oldW = window.innerWidth;
         zoom_oldH = window.innerHeight;
         zoom_oldH = window.innerHeight;

abvw/common/json/lang/lang-en.json

@@ -64,7 +64,7 @@
 "dspBkCancel":"Logout",
 "dspBkCancel":"Logout",
 "txtSearchResult":"Result",
 "txtSearchResult":"Result",
 "dspHome":"Home",
 "dspHome":"Home",
-"txtLoginUser":"(Ver.20121212-2)User:",
+"txtLoginUser":"(Ver.20121213-1)User:",
 "txtAll":"All",
 "txtAll":"All",
 "txtMkgSize":"Size",
 "txtMkgSize":"Size",
 "txtMkgS":"S",
 "txtMkgS":"S",

abvw/common/json/lang/lang-ja.json

@@ -64,7 +64,7 @@
 "dspBkCancel":"バックアップせずにログアウト",
 "dspBkCancel":"バックアップせずにログアウト",
 "txtSearchResult":"検索結果",
 "txtSearchResult":"検索結果",
 "dspHome":"ホーム",
 "dspHome":"ホーム",
-"txtLoginUser":"(Ver.20121212-2)ログイン中：",
+"txtLoginUser":"(Ver.20121213-1)ログイン中：",
 "txtAll":"すべて",
 "txtAll":"すべて",
 "txtMkgSize":"太さ",
 "txtMkgSize":"太さ",
 "txtMkgS":"小",
 "txtMkgS":"小",

abvw/common/json/lang/lang-ko.json

@@ -64,7 +64,7 @@
 "dspBkCancel":"로그아웃",
 "dspBkCancel":"로그아웃",
 "txtSearchResult":"검색 결과",
 "txtSearchResult":"검색 결과",
 "dspHome":"홈",
 "dspHome":"홈",
-"txtLoginUser":"(Ver.20121212-2)로그인 중:",
+"txtLoginUser":"(Ver.20121213-1)로그인 중:",
 "txtAll":"전체",
 "txtAll":"전체",
 "txtMkgSize":"두께",
 "txtMkgSize":"두께",
 "txtMkgS":"소",
 "txtMkgS":"소",

abvw/contentview.html

@@ -110,9 +110,12 @@
 	var posTxtSearch = [];
 	var posTxtSearch = [];
 	var sx,sy;
 	var sx,sy;
 	var imgDrawingTemp;
 	var imgDrawingTemp;
+	var imgMarkerTemp;
 	var isSizingDrawCanvas = false;
 	var isSizingDrawCanvas = false;
 	var isDisplayBookMarkList = false;	
 	var isDisplayBookMarkList = false;	
 	var avwUserEnvObj = new UserEnvironment();
 	var avwUserEnvObj = new UserEnvironment();
+	var canvas_marker;
+	var context_marker;
 	var canvas_draw;  	    
 	var canvas_draw;  	    
     var context_draw;
     var context_draw;
     var canvas_main;
     var canvas_main;
@@ -137,6 +140,7 @@
 	var py = 0;
 	var py = 0;
 	var isPressLeftMouse = false;
 	var isPressLeftMouse = false;
 	var isMoveOutDrawCanvas = false;
 	var isMoveOutDrawCanvas = false;
+	var typeSelectMemo = 0;
 	
 	
 	/* get Json stored content info */
 	/* get Json stored content info */
 	function getJsonContentInfo(){		
 	function getJsonContentInfo(){		
@@ -443,6 +447,10 @@
 			}else{
 			}else{
 				pageObject['imageUrl'] = null;
 				pageObject['imageUrl'] = null;
 			}
 			}
+			
+			/* action */
+			pageObject['action'] = null;
+			
 		}else if(iValueObj.action.actionType == 4){
 		}else if(iValueObj.action.actionType == 4){
 			/*get mediaInfo */
 			/*get mediaInfo */
 			if(iValueObj.mediaInfo.resourceId){
 			if(iValueObj.mediaInfo.resourceId){
@@ -920,7 +928,7 @@
 	}
 	}
 	
 	
 	/* add memo click */
 	/* add memo click */
-	function handleAddMemo(){						
+	function handleAddMemo(event){						
 		if(ClientData.IsAddingMemo() == true){		
 		if(ClientData.IsAddingMemo() == true){		
 			ClientData.IsAddingMemo(false);
 			ClientData.IsAddingMemo(false);
 			isCopyMemo = false;
 			isCopyMemo = false;
@@ -947,6 +955,16 @@
 	        
 	        
 	        $('#imgaddmemo').removeClass();
 	        $('#imgaddmemo').removeClass();
 	        $('#imgaddmemo').addClass('memoAdd_hover');		
 	        $('#imgaddmemo').addClass('memoAdd_hover');		
+	        
+	        if(ClientData.memo_copyText()){	
+		        $("#overlay").show();
+				$('#boxAddMemo').css('z-index' , '101');
+				$('#boxAddMemo').css('display' , 'block');
+			    $('#boxAddMemo').draggable({ handle: "h1" });
+			    $("#boxAddMemo").offset({left:event.pageX,top:event.pageY});
+	    		$("#divAddMemo").show();    		
+	    		$("#divAddMemo").offset({left:event.pageX,top:(event.pageY + $('#bookmarkBoxHdMemo').height() - 2)});
+	    	}
 		}						
 		}						
 	}
 	}
 	
 	
@@ -1285,6 +1303,9 @@
 		$("#control_screen_2").css('cursor', 'pointer');
 		$("#control_screen_2").css('cursor', 'pointer');
 		$("#slider_page").css('cursor', 'pointer');
 		$("#slider_page").css('cursor', 'pointer');
 		$(".ui-slider-handle").css('cursor', 'pointer');
 		$(".ui-slider-handle").css('cursor', 'pointer');
+		$("#liAddMemo").css('cursor', 'pointer');
+		$("#liCopyMemo").css('cursor', 'pointer');
+		$("#liDeleteMemo").css('cursor', 'pointer');
 		
 		
 		$("#control_screen").removeClass();
 		$("#control_screen").removeClass();
 		$("#control_screen_2").removeClass();
 		$("#control_screen_2").removeClass();
@@ -2577,6 +2598,8 @@
 		tool = new tool_drawing();
 		tool = new tool_drawing();
 		if (isTouchDevice() == true) {
 		if (isTouchDevice() == true) {
         	initializeCanvas(document.getElementById('draw_canvas'));
         	initializeCanvas(document.getElementById('draw_canvas'));
+        	
+        	initializeCanvas(document.getElementById('marker_canvas'));
 	    }
 	    }
 	    else {
 	    else {
 	        // Attach the mousedown, mousemove and mouseup event listeners.
 	        // Attach the mousedown, mousemove and mouseup event listeners.
@@ -2587,10 +2610,298 @@
 	        canvas_draw.addEventListener('touchstart', ev_canvas, false);
 	        canvas_draw.addEventListener('touchstart', ev_canvas, false);
 	        canvas_draw.addEventListener('touchmove', ev_canvas, false);
 	        canvas_draw.addEventListener('touchmove', ev_canvas, false);
 	        canvas_draw.addEventListener('touchend', ev_canvas, false);
 	        canvas_draw.addEventListener('touchend', ev_canvas, false);
+	        
+	        canvas_marker.addEventListener('mousedown', ev_canvas, false);
+	        canvas_marker.addEventListener('mousemove', ev_canvas, false);
+	        canvas_marker.addEventListener('mouseup', ev_canvas, false);
+	        canvas_marker.addEventListener('mouseout', ev_canvas, false);
+
 	    }
 	    }
 	 }
 	 }
 	 
 	 
-	 /* event mouse using for canvas */
+	 function drawMouseMove(contextDraw,ev){
+	 	if (tool.started && isPressLeftMouse == true) {
+			    				    	
+	    	if(isMoveOutDrawCanvas == true){
+	    		 contextDraw.moveTo(ev._x, ev._y);	
+	    		 sx = ev._x;
+	             sy = ev._y;	
+	    		 isMoveOutDrawCanvas = false;
+	    	}
+	    					    				    
+	    	if(markingType == 'eraser') {	    		
+	    		//context.clearRect(ev._x, ev._y, ClientData.erase_size(), ClientData.erase_size());
+	    		contextDraw.globalCompositeOperation = 'destination-out';
+	            contextDraw.lineWidth = eraseSize;
+	            contextDraw.lineJoin = 'round';
+	            contextDraw.lineCap = 'round';
+	            contextDraw.lineTo(sx, sy);
+	            contextDraw.stroke();
+	            contextDraw.globalCompositeOperation = 'source-over'; 		
+	    	}
+	    	else if(markingType == 'pen') {		    					    			   		
+	    		contextDraw.lineCap = "round";
+	    		contextDraw.lineJoin = "bevel";
+	    		contextDraw.lineWidth = penSize;
+				contextDraw.strokeStyle = "#" + penColor;    			
+	    		contextDraw.lineTo(ev._x, ev._y);
+	      		contextDraw.stroke();
+	    	}   	 
+	    	else if(markingType == 'maker') {	
+	    		    		   					      		
+	            contextDraw.beginPath();
+   		
+	      		var halfSize = makerSize / 2;
+				var quotSize = makerSize / 4;
+				
+				var ptStart = [
+							{ x: sx - quotSize, y: sy - halfSize },
+							{ x: sx + quotSize, y: sy - halfSize },
+							{ x: sx + quotSize, y: sy + halfSize },
+							{ x: sx - quotSize, y: sy + halfSize }
+					  ];
+				var ptEnd = [
+									{ x: ev._x - quotSize, y: ev._y - halfSize },
+									{ x: ev._x + quotSize, y: ev._y - halfSize },
+									{ x: ev._x + quotSize, y: ev._y + halfSize },
+									{ x: ev._x - quotSize, y: ev._y + halfSize }
+					];
+				if(sx > ev._x) {
+					if(sy > ev._y) {
+						contextDraw.beginPath();
+						contextDraw.globalCompositeOperation = 'destination-out';
+						contextDraw.moveTo(ptStart[1].x, ptStart[1].y);
+						contextDraw.lineTo(ptStart[2].x, ptStart[2].y);
+						contextDraw.lineTo(ptStart[3].x, ptStart[3].y);
+						contextDraw.lineTo(ptEnd[3].x, ptEnd[3].y);
+						contextDraw.lineTo(ptEnd[0].x, ptEnd[0].y);
+						contextDraw.lineTo(ptEnd[1].x, ptEnd[1].y);
+						contextDraw.lineJoin = 'bevel';
+						contextDraw.lineCap = 'butt';
+						contextDraw.fillStyle = "#" + makerColor;
+			            contextDraw.fill();				
+						contextDraw.globalCompositeOperation = 'lighter';
+						contextDraw.closePath();
+						contextDraw.beginPath();
+						// 蟾ｦ荳翫↓謠冗判縺吶ｋ蝣ｴ蜷・
+						contextDraw.moveTo(ptStart[1].x, ptStart[1].y);
+						contextDraw.lineTo(ptStart[2].x, ptStart[2].y);
+						contextDraw.lineTo(ptStart[3].x, ptStart[3].y);
+						contextDraw.lineTo(ptEnd[3].x, ptEnd[3].y);
+						contextDraw.lineTo(ptEnd[0].x, ptEnd[0].y);
+						contextDraw.lineTo(ptEnd[1].x, ptEnd[1].y);
+						contextDraw.closePath();
+					} else if(sy < ev._y) {
+						contextDraw.beginPath();
+						contextDraw.globalCompositeOperation = 'destination-out';
+						contextDraw.moveTo(ptStart[0].x, ptStart[0].y);
+						contextDraw.lineTo(ptStart[1].x, ptStart[1].y);
+						contextDraw.lineTo(ptStart[2].x, ptStart[2].y);
+						contextDraw.lineTo(ptEnd[2].x, ptEnd[2].y);
+						contextDraw.lineTo(ptEnd[3].x, ptEnd[3].y);
+						contextDraw.lineTo(ptEnd[0].x, ptEnd[0].y);	
+						contextDraw.lineJoin = 'bevel';
+						contextDraw.lineCap = 'butt';
+						contextDraw.fillStyle = "#" + makerColor;
+			            contextDraw.fill();				
+						contextDraw.globalCompositeOperation = 'lighter';
+						contextDraw.closePath();
+						contextDraw.beginPath();
+						
+						// 蟾ｦ荳九↓謠冗判縺吶ｋ蝣ｴ蜷・
+						contextDraw.moveTo(ptStart[0].x, ptStart[0].y);
+						contextDraw.lineTo(ptStart[1].x, ptStart[1].y);
+						contextDraw.lineTo(ptStart[2].x, ptStart[2].y);
+						contextDraw.lineTo(ptEnd[2].x, ptEnd[2].y);
+						contextDraw.lineTo(ptEnd[3].x, ptEnd[3].y);
+						contextDraw.lineTo(ptEnd[0].x, ptEnd[0].y);						
+						contextDraw.closePath();
+					} else {
+						contextDraw.beginPath();
+						contextDraw.globalCompositeOperation = 'destination-out';
+						contextDraw.moveTo(ptStart[1].x, ptStart[1].y);
+						contextDraw.lineTo(ptStart[2].x, ptStart[2].y);
+						contextDraw.lineTo(ptEnd[3].x, ptEnd[3].y);
+						contextDraw.lineTo(ptEnd[0].x, ptEnd[0].y);
+						contextDraw.lineJoin = 'bevel';
+						contextDraw.lineCap = 'butt';
+						contextDraw.fillStyle = "#" + makerColor;
+			            contextDraw.fill();				
+						contextDraw.globalCompositeOperation = 'lighter';
+						contextDraw.closePath();
+						contextDraw.beginPath();
+						
+						// 蟾ｦ縺ｫ謠冗判縺吶ｋ蝣ｴ蜷・
+						contextDraw.moveTo(ptStart[1].x, ptStart[1].y);
+						contextDraw.lineTo(ptStart[2].x, ptStart[2].y);
+						contextDraw.lineTo(ptEnd[3].x, ptEnd[3].y);
+						contextDraw.lineTo(ptEnd[0].x, ptEnd[0].y);
+						contextDraw.closePath();
+					}
+				} else if(sx < ev._x) {
+					if(sy > ev._y) {
+						contextDraw.beginPath();
+						contextDraw.globalCompositeOperation = 'destination-out';
+						contextDraw.moveTo(ptStart[2].x, ptStart[2].y);
+						contextDraw.lineTo(ptStart[3].x, ptStart[3].y);
+						contextDraw.lineTo(ptStart[0].x, ptStart[0].y);
+						contextDraw.lineTo(ptEnd[0].x, ptEnd[0].y);
+						contextDraw.lineTo(ptEnd[1].x, ptEnd[1].y);
+						contextDraw.lineTo(ptEnd[2].x, ptEnd[2].y);
+						contextDraw.lineJoin = 'bevel';
+						contextDraw.lineCap = 'butt';
+						contextDraw.fillStyle = "#" + makerColor;
+			            contextDraw.fill();				
+						contextDraw.globalCompositeOperation = 'lighter';								
+						contextDraw.closePath();
+						contextDraw.beginPath();
+						
+						// 蜿ｳ荳翫↓謠冗判縺吶ｋ蝣ｴ蜷・
+						contextDraw.moveTo(ptStart[2].x, ptStart[2].y);
+						contextDraw.lineTo(ptStart[3].x, ptStart[3].y);
+						contextDraw.lineTo(ptStart[0].x, ptStart[0].y);
+						contextDraw.lineTo(ptEnd[0].x, ptEnd[0].y);
+						contextDraw.lineTo(ptEnd[1].x, ptEnd[1].y);
+						contextDraw.lineTo(ptEnd[2].x, ptEnd[2].y);
+						contextDraw.closePath();
+					} else if(sy < ev._y) {
+						contextDraw.beginPath();
+						contextDraw.globalCompositeOperation = 'destination-out';
+						contextDraw.moveTo(ptStart[3].x, ptStart[3].y);
+						contextDraw.lineTo(ptStart[0].x, ptStart[0].y);
+						contextDraw.lineTo(ptStart[1].x, ptStart[1].y);
+						contextDraw.lineTo(ptEnd[1].x, ptEnd[1].y);
+						contextDraw.lineTo(ptEnd[2].x, ptEnd[2].y);
+						contextDraw.lineTo(ptEnd[3].x, ptEnd[3].y);
+						contextDraw.lineJoin = 'bevel';
+						contextDraw.lineCap = 'butt';
+						contextDraw.fillStyle = "#" + makerColor;
+			            contextDraw.fill();				
+						contextDraw.globalCompositeOperation = 'lighter';
+						contextDraw.closePath();
+						contextDraw.beginPath();
+						
+						// 蜿ｳ荳九↓謠冗判縺吶ｋ蝣ｴ蜷・
+						contextDraw.moveTo(ptStart[3].x, ptStart[3].y);
+						contextDraw.lineTo(ptStart[0].x, ptStart[0].y);
+						contextDraw.lineTo(ptStart[1].x, ptStart[1].y);
+						contextDraw.lineTo(ptEnd[1].x, ptEnd[1].y);
+						contextDraw.lineTo(ptEnd[2].x, ptEnd[2].y);
+						contextDraw.lineTo(ptEnd[3].x, ptEnd[3].y);
+						contextDraw.closePath();
+					} else {
+						contextDraw.beginPath();
+						contextDraw.globalCompositeOperation = 'destination-out';
+						contextDraw.moveTo(ptStart[3].x, ptStart[3].y);
+						contextDraw.lineTo(ptStart[0].x, ptStart[0].y);
+						contextDraw.lineTo(ptEnd[1].x, ptEnd[1].y);
+						contextDraw.lineTo(ptEnd[2].x, ptEnd[2].y);
+						contextDraw.lineJoin = 'bevel';
+						contextDraw.lineCap = 'butt';
+						contextDraw.fillStyle = "#" + makerColor;
+			            contextDraw.fill();				
+						contextDraw.globalCompositeOperation = 'lighter';
+						contextDraw.closePath();
+						contextDraw.beginPath();
+						
+						// 蜿ｳ縺ｫ謠冗判縺吶ｋ蝣ｴ蜷・
+						contextDraw.moveTo(ptStart[3].x, ptStart[3].y);
+						contextDraw.lineTo(ptStart[0].x, ptStart[0].y);
+						contextDraw.lineTo(ptEnd[1].x, ptEnd[1].y);
+						contextDraw.lineTo(ptEnd[2].x, ptEnd[2].y);
+						contextDraw.closePath();
+					}
+				} else {
+					if(sy > ev._y) {
+						contextDraw.beginPath();
+						contextDraw.globalCompositeOperation = 'destination-out';
+						contextDraw.moveTo(ptStart[2].x, ptStart[2].y);
+						contextDraw.lineTo(ptStart[3].x, ptStart[3].y);
+						contextDraw.lineTo(ptEnd[0].x, ptEnd[0].y);
+						contextDraw.lineTo(ptEnd[1].x, ptEnd[1].y);
+						contextDraw.lineJoin = 'bevel';
+						contextDraw.lineCap = 'butt';
+						contextDraw.fillStyle = "#" + makerColor;
+			            contextDraw.fill();				
+						contextDraw.globalCompositeOperation = 'lighter';
+						contextDraw.closePath();
+						contextDraw.beginPath();
+						
+						// 荳翫↓謠冗判縺吶ｋ蝣ｴ蜷・
+						contextDraw.moveTo(ptStart[2].x, ptStart[2].y);
+						contextDraw.lineTo(ptStart[3].x, ptStart[3].y);
+						contextDraw.lineTo(ptEnd[0].x, ptEnd[0].y);
+						contextDraw.lineTo(ptEnd[1].x, ptEnd[1].y);
+						contextDraw.closePath();
+					} else if(sy < ev._y) {
+						contextDraw.beginPath();
+						contextDraw.globalCompositeOperation = 'destination-out';
+						contextDraw.moveTo(ptStart[0].x, ptStart[0].y);
+						contextDraw.lineTo(ptStart[1].x, ptStart[1].y);
+						contextDraw.lineTo(ptEnd[2].x, ptEnd[2].y);
+						contextDraw.lineTo(ptEnd[3].x, ptEnd[3].y);
+						contextDraw.lineJoin = 'bevel';
+						contextDraw.lineCap = 'butt';
+						contextDraw.fillStyle = "#" + makerColor;
+			            contextDraw.fill();				
+						contextDraw.globalCompositeOperation = 'lighter';
+						contextDraw.closePath();
+						contextDraw.beginPath();
+						
+						// 荳九↓謠冗判縺吶ｋ蝣ｴ蜷・
+						contextDraw.moveTo(ptStart[0].x, ptStart[0].y);
+						contextDraw.lineTo(ptStart[1].x, ptStart[1].y);
+						contextDraw.lineTo(ptEnd[2].x, ptEnd[2].y);
+						contextDraw.lineTo(ptEnd[3].x, ptEnd[3].y);
+						contextDraw.closePath();
+					} else {
+						contextDraw.beginPath();
+						contextDraw.globalCompositeOperation = 'destination-out';
+						contextDraw.moveTo(ptStart[0].x, ptStart[0].y);
+						contextDraw.lineTo(ptStart[1].x, ptStart[1].y);
+						contextDraw.lineTo(ptStart[2].x, ptStart[2].y);
+						contextDraw.lineTo(ptStart[3].x, ptStart[3].y);
+						contextDraw.lineJoin = 'bevel';
+						contextDraw.lineCap = 'butt';
+						contextDraw.fillStyle = "#" + makerColor;
+			            contextDraw.fill();				
+						contextDraw.globalCompositeOperation = 'lighter';
+						contextDraw.closePath();
+						contextDraw.beginPath();
+						
+						// 遘ｻ蜍輔↑縺励・蝣ｴ蜷・
+						contextDraw.moveTo(ptStart[0].x, ptStart[0].y);
+						contextDraw.lineTo(ptStart[1].x, ptStart[1].y);
+						contextDraw.lineTo(ptStart[2].x, ptStart[2].y);
+						contextDraw.lineTo(ptStart[3].x, ptStart[3].y);
+						contextDraw.closePath();
+					}
+				}
+			contextDraw.lineJoin = 'bevel';
+			contextDraw.lineCap = 'butt';
+			contextDraw.globalAlpha = 0.4;   // Opacity 20%
+			contextDraw.fillStyle = "#" + makerColor;
+	        contextDraw.fill();					
+			
+			contextDraw.globalAlpha = 1;   // Opacity 100%
+	    	}
+	    	
+	    	
+	    	/*
+	         * 謠冗判繝｢繝ｼ繝峨ｒ謌ｻ縺・
+	         */
+			contextDraw.globalCompositeOperation = 'source-over';
+	    	
+	        // 邨らせ繧剃ｿ晏ｭ・
+	        sx = ev._x;
+	        sy = ev._y;					      
+	
+	
+	    }
+	 }
+
+	 
+	 	 /* event mouse using for canvas */
 	 function tool_drawing () {
 	 function tool_drawing () {
 		  var tool = this;
 		  var tool = this;
 		  this.started = false;	
 		  this.started = false;	
@@ -2601,56 +2912,104 @@
 		  	  /* set value sx,sy */
 		  	  /* set value sx,sy */
 			  sx = ev._x;
 			  sx = ev._x;
 			  sy = ev._y;
 			  sy = ev._y;
-		  				  	   	
-		      context_draw.beginPath();
-		      context_draw.moveTo(ev._x, ev._y);	 
+			  
+		  	  if ($("#marker_canvas").is(":hidden")) {  		  	   	
+			      context_draw.beginPath();
+			      context_draw.moveTo(ev._x, ev._y);	 
+			  }else{
+			  	  context_marker.beginPath();	
+			      context_marker.moveTo(ev._x, ev._y);
+			  }
 		          
 		          
 		      if(isAddingMarking == true){
 		      if(isAddingMarking == true){
 		      	 /* begin draw*/	
 		      	 /* begin draw*/	
 		      	 isClearDrawing = false;
 		      	 isClearDrawing = false;
-      		  		      
-			      if(markingType == 'eraser') {	    		
-		    		context_draw.globalCompositeOperation = 'destination-out';
-		            context_draw.lineWidth = eraseSize;
-		            context_draw.lineJoin = 'round';
-		            context_draw.lineCap = 'round';
-		            context_draw.lineTo(ev._x + 0.001, ev._y + 0.001);
-		            context_draw.stroke();
-		            context_draw.globalCompositeOperation = 'source-over';    		
-		     	  }
-		    	  else if(markingType == 'pen') {
-		    	  	/* set flag */		
-		    	  	isDrawing = true;
-		    	  	    		
-		    		context_draw.lineCap = "round";
-		    		context_draw.lineWidth = penSize;
-	    			context_draw.strokeStyle = "#" + penColor;	 	    			  		
-		    		context_draw.lineTo(ev._x + 0.001, ev._y + 0.001 );
-		      		context_draw.stroke();	      	
-		    	  }   	 
-		    	  else if(markingType == 'maker') {
-		    	  	/* set flag */		   
-		    	  	isDrawing = true;
-		    	  	
-		    	  	/*context_draw.globalCompositeOperation = 'destination-out';
-		    	  	context_draw.lineWidth = makerSize ;
-		    		context_draw.lineHeight = makerSize;
-					context_draw.lineTo(ev._x , ev._y + 0.001);		
-					context_draw.lineCap = 'square';
-					context_draw.strokeStyle = "#" + makerColor;
-		            context_draw.stroke();				
-					context_draw.globalCompositeOperation = 'lighter';*/ 	
-					  	
-		    		context_draw.lineCap = "square";	    		
-		    		context_draw.lineWidth = makerSize ;
-		    		context_draw.lineHeight = makerSize;
-		    		context_draw.globalAlpha = 0.2;
-	    			context_draw.strokeStyle = "#" + makerColor;
-		    		context_draw.lineTo(ev._x , ev._y + 0.001);		    		
-		      		context_draw.stroke();
-		      		context_draw.globalAlpha = 1; 		      	
-		    	  }	      
-			           
+		      	 
+      		  	  if ($("#marker_canvas").is(":hidden")) {      
+				      if(markingType == 'eraser') {	    		
+			    		context_draw.globalCompositeOperation = 'destination-out';
+			            context_draw.lineWidth = eraseSize;
+			            context_draw.lineJoin = 'round';
+			            context_draw.lineCap = 'round';
+			            context_draw.lineTo(ev._x + 0.001, ev._y + 0.001);
+			            context_draw.stroke();
+			            context_draw.globalCompositeOperation = 'source-over';    		
+			     	  }
+			    	  else if(markingType == 'pen') {
+			    	  	/* set flag */		
+			    	  	isDrawing = true;
+			    	  	    		
+			    		context_draw.lineCap = "round";
+			    		context_draw.lineWidth = penSize;
+		    			context_draw.strokeStyle = "#" + penColor;	 	    			  		
+			    		context_draw.lineTo(ev._x + 0.001, ev._y + 0.001 );
+			      		context_draw.stroke();	      	
+			    	  }   	 
+			    	  else if(markingType == 'maker') {
+			    	  	/* set flag */		   
+			    	  	isDrawing = true;
+			    	  	
+			    	  	context_draw.globalCompositeOperation = 'destination-out';
+			    	  	context_draw.lineWidth = makerSize ;
+			    		context_draw.lineHeight = makerSize;
+						context_draw.lineTo(ev._x , ev._y + 0.001);		
+						context_draw.lineCap = 'square';
+						context_draw.strokeStyle = "#" + makerColor;
+			            context_draw.stroke();				
+						context_draw.globalCompositeOperation = 'lighter';
+						  	
+			    		context_draw.lineCap = "square";	    		
+			    		context_draw.lineWidth = makerSize ;
+			    		context_draw.lineHeight = makerSize;
+			    		context_draw.globalAlpha = 0.4;
+		    			context_draw.strokeStyle = "#" + makerColor;
+			    		context_draw.lineTo(ev._x , ev._y + 0.001);		    		
+			      		context_draw.stroke();
+			      		context_draw.globalAlpha = 1; 		      	
+			    	  }	      
+		       }else{
+			       	if(markingType == 'eraser') {	    		
+			    		context_marker.globalCompositeOperation = 'destination-out';
+			            context_marker.lineWidth = eraseSize;
+			            context_marker.lineJoin = 'round';
+			            context_marker.lineCap = 'round';
+			            context_marker.lineTo(ev._x + 0.001, ev._y + 0.001);
+			            context_marker.stroke();
+			            context_marker.globalCompositeOperation = 'source-over';    		
+			     	  }
+			    	  else if(markingType == 'pen') {
+			    	  	/* set flag */		
+			    	  	isDrawing = true;
+			    	  	    		
+			    		context_marker.lineCap = "round";
+			    		context_marker.lineWidth = penSize;
+		    			context_marker.strokeStyle = "#" + penColor;	 	    			  		
+			    		context_marker.lineTo(ev._x + 0.001, ev._y + 0.001 );
+			      		context_marker.stroke();	      	
+			    	  }   	 
+			    	  else if(markingType == 'maker') {
+			    	  	/* set flag */		   
+			    	  	isDrawing = true;
+			    	  	
+			    	  	context_marker.globalCompositeOperation = 'destination-out';
+			    	  	context_marker.lineWidth = makerSize ;
+			    		context_marker.lineHeight = makerSize;
+						context_marker.lineTo(ev._x , ev._y + 0.001);		
+						context_marker.lineCap = 'square';
+						context_marker.strokeStyle = "#" + makerColor;
+			            context_marker.stroke();				
+						context_marker.globalCompositeOperation = 'lighter';
+						  	
+			    		context_marker.lineCap = "square";	    		
+			    		context_marker.lineWidth = makerSize ;
+			    		context_marker.lineHeight = makerSize;
+			    		context_marker.globalAlpha = 0.4;
+		    			context_marker.strokeStyle = "#" + makerColor;
+			    		context_marker.lineTo(ev._x , ev._y + 0.001);		    		
+			      		context_marker.stroke();
+			      		context_marker.globalAlpha = 1; 
+			      	}
+			       }    
 			      tool.started = true;		
 			      tool.started = true;		
 			      
 			      
 			      if(ev.which == 1) {isPressLeftMouse = true;}    
 			      if(ev.which == 1) {isPressLeftMouse = true;}    
@@ -2661,297 +3020,15 @@
 		  
 		  
 		  this.mousemove = function (ev) {		  	
 		  this.mousemove = function (ev) {		  	
 		  	 if(isAddingMarking == true){	
 		  	 if(isAddingMarking == true){	
-    				
-			    if (tool.started && isPressLeftMouse == true) {
-			    				    	
-			    	if(isMoveOutDrawCanvas == true){
-			    		 context_draw.moveTo(ev._x, ev._y);	
-			    		 sx = ev._x;
-		                 sy = ev._y;	
-			    		 isMoveOutDrawCanvas = false;
-			    	}
-			    					    				    
-			    	if(markingType == 'eraser') {	    		
-			    		//context.clearRect(ev._x, ev._y, ClientData.erase_size(), ClientData.erase_size());
-			    		context_draw.globalCompositeOperation = 'destination-out';
-			            context_draw.lineWidth = eraseSize;
-			            context_draw.lineJoin = 'round';
-			            context_draw.lineCap = 'round';
-			            context_draw.lineTo(sx, sy);
-			            context_draw.stroke();
-			            context_draw.globalCompositeOperation = 'source-over'; 		
-			    	}
-			    	else if(markingType == 'pen') {		    					    			   		
-			    		context_draw.lineCap = "round";
-			    		context_draw.lineJoin = "bevel";
-			    		context_draw.lineWidth = penSize;
-		    			context_draw.strokeStyle = "#" + penColor;
-		    			//context_draw.globalAlpha = 1;	    			
-			    		context_draw.lineTo(ev._x, ev._y);
-			      		context_draw.stroke();
-			    	}   	 
-			    	else if(markingType == 'maker') {	
-			    		/*context_draw.clearRect(ev._x , ev._y,makerSize, ev._y - sy);*/	
-			    		/*context_draw.globalCompositeOperation = 'destination-out';
-			            context_draw.lineWidth = makerSize/10;
-			            context_draw.lineHeight = makerSize/10;
-			            context_draw.lineJoin = 'bevel';
-			            context_draw.lineCap = 'butt';
-			            context_draw.lineTo(ev._x, ev._y);
-			            context_draw.stroke();
-			            context_draw.globalCompositeOperation = 'source-over';*/ 		
-			    		//context_draw.globalCompositeOperation = 'destination-out'			    		   					      		
-	                    context_draw.beginPath();
-			      		
-			      		var halfSize = makerSize / 2;
-						var quotSize = makerSize / 4;
-						
-						var ptStart = [
-									{ x: sx - quotSize, y: sy - halfSize },
-									{ x: sx + quotSize, y: sy - halfSize },
-									{ x: sx + quotSize, y: sy + halfSize },
-									{ x: sx - quotSize, y: sy + halfSize }
-							  ];
-						var ptEnd = [
-											{ x: ev._x - quotSize, y: ev._y - halfSize },
-											{ x: ev._x + quotSize, y: ev._y - halfSize },
-											{ x: ev._x + quotSize, y: ev._y + halfSize },
-											{ x: ev._x - quotSize, y: ev._y + halfSize }
-							];
-						if(sx > ev._x) {
-							if(sy > ev._y) {
-								/*context_draw.beginPath();
-								context_draw.globalCompositeOperation = 'destination-out';
-								context_draw.moveTo(ptStart[1].x, ptStart[1].y);
-								context_draw.lineTo(ptStart[2].x, ptStart[2].y);
-								context_draw.lineTo(ptStart[3].x, ptStart[3].y);
-								context_draw.lineTo(ptEnd[3].x, ptEnd[3].y);
-								context_draw.lineTo(ptEnd[0].x, ptEnd[0].y);
-								context_draw.lineTo(ptEnd[1].x, ptEnd[1].y);
-								context_draw.lineJoin = 'bevel';
-								context_draw.lineCap = 'butt';
-								context_draw.fillStyle = "#" + makerColor;
-					            context_draw.fill();				
-								context_draw.globalCompositeOperation = 'lighter';
-								context_draw.closePath();
-								context_draw.beginPath();*/
-								// 左上に描画する場合
-								context_draw.moveTo(ptStart[1].x, ptStart[1].y);
-								context_draw.lineTo(ptStart[2].x, ptStart[2].y);
-								context_draw.lineTo(ptStart[3].x, ptStart[3].y);
-								context_draw.lineTo(ptEnd[3].x, ptEnd[3].y);
-								context_draw.lineTo(ptEnd[0].x, ptEnd[0].y);
-								context_draw.lineTo(ptEnd[1].x, ptEnd[1].y);
-								context_draw.closePath();
-							} else if(sy < ev._y) {
-								/*context_draw.beginPath();
-								context_draw.globalCompositeOperation = 'destination-out';
-								context_draw.moveTo(ptStart[0].x, ptStart[0].y);
-								context_draw.lineTo(ptStart[1].x, ptStart[1].y);
-								context_draw.lineTo(ptStart[2].x, ptStart[2].y);
-								context_draw.lineTo(ptEnd[2].x, ptEnd[2].y);
-								context_draw.lineTo(ptEnd[3].x, ptEnd[3].y);
-								context_draw.lineTo(ptEnd[0].x, ptEnd[0].y);	
-								context_draw.lineJoin = 'bevel';
-								context_draw.lineCap = 'butt';
-								context_draw.fillStyle = "#" + makerColor;
-					            context_draw.fill();				
-								context_draw.globalCompositeOperation = 'lighter';
-								context_draw.closePath();
-								context_draw.beginPath();*/
-								
-								// 左下に描画する場合
-								context_draw.moveTo(ptStart[0].x, ptStart[0].y);
-								context_draw.lineTo(ptStart[1].x, ptStart[1].y);
-								context_draw.lineTo(ptStart[2].x, ptStart[2].y);
-								context_draw.lineTo(ptEnd[2].x, ptEnd[2].y);
-								context_draw.lineTo(ptEnd[3].x, ptEnd[3].y);
-								context_draw.lineTo(ptEnd[0].x, ptEnd[0].y);						
-								context_draw.closePath();
-							} else {
-								/*context_draw.beginPath();
-								context_draw.globalCompositeOperation = 'destination-out';
-								context_draw.moveTo(ptStart[1].x, ptStart[1].y);
-								context_draw.lineTo(ptStart[2].x, ptStart[2].y);
-								context_draw.lineTo(ptEnd[3].x, ptEnd[3].y);
-								context_draw.lineTo(ptEnd[0].x, ptEnd[0].y);
-								context_draw.lineJoin = 'bevel';
-								context_draw.lineCap = 'butt';
-								context_draw.fillStyle = "#" + makerColor;
-					            context_draw.fill();				
-								context_draw.globalCompositeOperation = 'lighter';
-								context_draw.closePath();
-								context_draw.beginPath();*/
-								
-								// 左に描画する場合
-								context_draw.moveTo(ptStart[1].x, ptStart[1].y);
-								context_draw.lineTo(ptStart[2].x, ptStart[2].y);
-								context_draw.lineTo(ptEnd[3].x, ptEnd[3].y);
-								context_draw.lineTo(ptEnd[0].x, ptEnd[0].y);
-								context_draw.closePath();
-							}
-						} else if(sx < ev._x) {
-							if(sy > ev._y) {
-								/*context_draw.beginPath();
-								context_draw.globalCompositeOperation = 'destination-out';
-								context_draw.moveTo(ptStart[2].x, ptStart[2].y);
-								context_draw.lineTo(ptStart[3].x, ptStart[3].y);
-								context_draw.lineTo(ptStart[0].x, ptStart[0].y);
-								context_draw.lineTo(ptEnd[0].x, ptEnd[0].y);
-								context_draw.lineTo(ptEnd[1].x, ptEnd[1].y);
-								context_draw.lineTo(ptEnd[2].x, ptEnd[2].y);
-								context_draw.lineJoin = 'bevel';
-								context_draw.lineCap = 'butt';
-								context_draw.fillStyle = "#" + makerColor;
-					            context_draw.fill();				
-								context_draw.globalCompositeOperation = 'lighter';								
-								context_draw.closePath();
-								context_draw.beginPath();*/
-								
-								// 右上に描画する場合
-								context_draw.moveTo(ptStart[2].x, ptStart[2].y);
-								context_draw.lineTo(ptStart[3].x, ptStart[3].y);
-								context_draw.lineTo(ptStart[0].x, ptStart[0].y);
-								context_draw.lineTo(ptEnd[0].x, ptEnd[0].y);
-								context_draw.lineTo(ptEnd[1].x, ptEnd[1].y);
-								context_draw.lineTo(ptEnd[2].x, ptEnd[2].y);
-								context_draw.closePath();
-							} else if(sy < ev._y) {
-								/*context_draw.beginPath();
-								context_draw.globalCompositeOperation = 'destination-out';
-								context_draw.moveTo(ptStart[3].x, ptStart[3].y);
-								context_draw.lineTo(ptStart[0].x, ptStart[0].y);
-								context_draw.lineTo(ptStart[1].x, ptStart[1].y);
-								context_draw.lineTo(ptEnd[1].x, ptEnd[1].y);
-								context_draw.lineTo(ptEnd[2].x, ptEnd[2].y);
-								context_draw.lineTo(ptEnd[3].x, ptEnd[3].y);
-								context_draw.lineJoin = 'bevel';
-								context_draw.lineCap = 'butt';
-								context_draw.fillStyle = "#" + makerColor;
-					            context_draw.fill();				
-								context_draw.globalCompositeOperation = 'lighter';
-								context_draw.closePath();
-								context_draw.beginPath();*/
-								
-								// 右下に描画する場合
-								context_draw.moveTo(ptStart[3].x, ptStart[3].y);
-								context_draw.lineTo(ptStart[0].x, ptStart[0].y);
-								context_draw.lineTo(ptStart[1].x, ptStart[1].y);
-								context_draw.lineTo(ptEnd[1].x, ptEnd[1].y);
-								context_draw.lineTo(ptEnd[2].x, ptEnd[2].y);
-								context_draw.lineTo(ptEnd[3].x, ptEnd[3].y);
-								context_draw.closePath();
-							} else {
-								/*context_draw.beginPath();
-								context_draw.globalCompositeOperation = 'destination-out';
-								context_draw.moveTo(ptStart[3].x, ptStart[3].y);
-								context_draw.lineTo(ptStart[0].x, ptStart[0].y);
-								context_draw.lineTo(ptEnd[1].x, ptEnd[1].y);
-								context_draw.lineTo(ptEnd[2].x, ptEnd[2].y);
-								context_draw.lineJoin = 'bevel';
-								context_draw.lineCap = 'butt';
-								context_draw.fillStyle = "#" + makerColor;
-					            context_draw.fill();				
-								context_draw.globalCompositeOperation = 'lighter';
-								context_draw.closePath();
-								context_draw.beginPath();*/
-								
-								// 右に描画する場合
-								context_draw.moveTo(ptStart[3].x, ptStart[3].y);
-								context_draw.lineTo(ptStart[0].x, ptStart[0].y);
-								context_draw.lineTo(ptEnd[1].x, ptEnd[1].y);
-								context_draw.lineTo(ptEnd[2].x, ptEnd[2].y);
-								context_draw.closePath();
-							}
-						} else {
-							if(sy > ev._y) {
-								/*context_draw.beginPath();
-								context_draw.globalCompositeOperation = 'destination-out';
-								context_draw.moveTo(ptStart[2].x, ptStart[2].y);
-								context_draw.lineTo(ptStart[3].x, ptStart[3].y);
-								context_draw.lineTo(ptEnd[0].x, ptEnd[0].y);
-								context_draw.lineTo(ptEnd[1].x, ptEnd[1].y);
-								context_draw.lineJoin = 'bevel';
-								context_draw.lineCap = 'butt';
-								context_draw.fillStyle = "#" + makerColor;
-					            context_draw.fill();				
-								context_draw.globalCompositeOperation = 'lighter';
-								context_draw.closePath();
-								context_draw.beginPath();*/
-								
-								// 上に描画する場合
-								context_draw.moveTo(ptStart[2].x, ptStart[2].y);
-								context_draw.lineTo(ptStart[3].x, ptStart[3].y);
-								context_draw.lineTo(ptEnd[0].x, ptEnd[0].y);
-								context_draw.lineTo(ptEnd[1].x, ptEnd[1].y);
-								context_draw.closePath();
-							} else if(sy < ev._y) {
-								/*context_draw.beginPath();
-								context_draw.globalCompositeOperation = 'destination-out';
-								context_draw.moveTo(ptStart[0].x, ptStart[0].y);
-								context_draw.lineTo(ptStart[1].x, ptStart[1].y);
-								context_draw.lineTo(ptEnd[2].x, ptEnd[2].y);
-								context_draw.lineTo(ptEnd[3].x, ptEnd[3].y);
-								context_draw.lineJoin = 'bevel';
-								context_draw.lineCap = 'butt';
-								context_draw.fillStyle = "#" + makerColor;
-					            context_draw.fill();				
-								context_draw.globalCompositeOperation = 'lighter';
-								context_draw.closePath();
-								context_draw.beginPath();*/
-								
-								// 下に描画する場合
-								context_draw.moveTo(ptStart[0].x, ptStart[0].y);
-								context_draw.lineTo(ptStart[1].x, ptStart[1].y);
-								context_draw.lineTo(ptEnd[2].x, ptEnd[2].y);
-								context_draw.lineTo(ptEnd[3].x, ptEnd[3].y);
-								context_draw.closePath();
-							} else {
-								/*context_draw.beginPath();
-								context_draw.globalCompositeOperation = 'destination-out';
-								context_draw.moveTo(ptStart[0].x, ptStart[0].y);
-								context_draw.lineTo(ptStart[1].x, ptStart[1].y);
-								context_draw.lineTo(ptStart[2].x, ptStart[2].y);
-								context_draw.lineTo(ptStart[3].x, ptStart[3].y);
-								context_draw.lineJoin = 'bevel';
-								context_draw.lineCap = 'butt';
-								context_draw.fillStyle = "#" + makerColor;
-					            context_draw.fill();				
-								context_draw.globalCompositeOperation = 'lighter';
-								context_draw.closePath();
-								context_draw.beginPath();*/
-								
-								// 移動なしの場合
-								context_draw.moveTo(ptStart[0].x, ptStart[0].y);
-								context_draw.lineTo(ptStart[1].x, ptStart[1].y);
-								context_draw.lineTo(ptStart[2].x, ptStart[2].y);
-								context_draw.lineTo(ptStart[3].x, ptStart[3].y);
-								context_draw.closePath();
-							}
-						}
-					context_draw.lineJoin = 'bevel';
-					context_draw.lineCap = 'butt';
-					context_draw.globalAlpha = 0.2;   // Opacity 20%
-					context_draw.fillStyle = "#" + makerColor;
-		            context_draw.fill();					
-					
-					context_draw.globalAlpha = 1;   // Opacity 100%
-			    	}
-			    	
-			    	
-			    	/*
-		             * 描画モードを戻す
-		             */
-					context_draw.globalCompositeOperation = 'source-over';
-			    	
-		            // 終点を保存
-		            sx = ev._x;
-		            sy = ev._y;					      
-
-
-			    }
-		   }
+				if ($("#marker_canvas").is(":hidden")) {
+					drawMouseMove(context_draw,ev);
+				}else{
+					drawMouseMove(context_marker,ev);
+				}      
+			    
+		     }
 		  };
 		  };
+
 	  
 	  
 	     this.mouseup = function (ev) {	     	
 	     this.mouseup = function (ev) {	     	
 	      if (tool.started) {	      	
 	      if (tool.started) {	      	
@@ -3121,7 +3198,8 @@ function oldContent_Back(){
 			var context = canvas.getContext('2d');
 			var context = canvas.getContext('2d');
 			
 			
 			if(ClientData.IsAddingMarking() == true){			
 			if(ClientData.IsAddingMarking() == true){			
-				imgDrawingTemp = canvas.toDataURL("image/png");			
+				imgDrawingTemp = canvas.toDataURL("image/png");	
+				imgMarkerTemp = canvas_marker.toDataURL("image/png;")		
 			}
 			}
 			
 			
 			var w = $("#wrapper").width();
 			var w = $("#wrapper").width();
@@ -3156,6 +3234,13 @@ function oldContent_Back(){
 					context.drawImage(img,0,0,canvas.width,canvas.height);
 					context.drawImage(img,0,0,canvas.width,canvas.height);
 				}
 				}
 				img.src = imgDrawingTemp;	
 				img.src = imgDrawingTemp;	
+				
+				var imgMarker = new Image();
+				imgMarker.onload = function(){
+					context_marker.drawImage(imgMarker,0,0,canvas_marker.width,canvas_marker.height);
+				}
+				img.src = imgMarkerTemp;
+
 			}
 			}
 		}		
 		}		
 	}	
 	}	
@@ -3168,11 +3253,22 @@ function oldContent_Back(){
 				  .attr('width', destRect.right - destRect.left)
 				  .attr('width', destRect.right - destRect.left)
 				   .css('top', destRect.top)
 				   .css('top', destRect.top)
 				   .css('left',destRect.left + marginX - 1);
 				   .css('left',destRect.left + marginX - 1);
+				   
+   			$("#marker_canvas").attr('height', destRect.bottom - destRect.top)
+				  .attr('width', destRect.right - destRect.left)
+				   .css('top', destRect.top)
+				   .css('left',destRect.left + marginX - 1);
+
 		}else{
 		}else{
 			$("#draw_canvas").attr('height', destRect.bottom - destRect.top)
 			$("#draw_canvas").attr('height', destRect.bottom - destRect.top)
 				  .attr('width', destRect.right - destRect.left)
 				  .attr('width', destRect.right - destRect.left)
 				   .css('top', destRect.top + marginY - 1)
 				   .css('top', destRect.top + marginY - 1)
 				   .css('left',destRect.left + marginX - 1);
 				   .css('left',destRect.left + marginX - 1);
+			$("#marker_canvas").attr('height', destRect.bottom - destRect.top)
+				  .attr('width', destRect.right - destRect.left)
+				   .css('top', destRect.top + marginY - 1)
+				   .css('left',destRect.left + marginX - 1);
+
 		}		
 		}		
 	}
 	}
 	
 	
@@ -3329,6 +3425,14 @@ function oldContent_Back(){
     	removeObject();
     	removeObject();
     	getPageObjectsByPageIndex(pageObjectsData,getPageIndex());		     		
     	getPageObjectsByPageIndex(pageObjectsData,getPageIndex());		     		
 		getContent().setPageImages(totalPage, pageImages).setPageObjects(pageObjects).setUpPage(getPageIndex);	
 		getContent().setPageImages(totalPage, pageImages).setPageObjects(pageObjects).setUpPage(getPageIndex);	
+		
+		/* handle play BGM of content jump */
+		for(var nIndex = 0; nIndex < pageObjects.length; nIndex++){
+			if(pageObjects[nIndex]. mediaType == '3' && pageObjects[nIndex]. playType == '1'){
+				
+				createAudio(pageObjects[nIndex].audioFile, pageObjects[nIndex].playType);
+			}
+		}	
     }
     }
     
     
     function StartTimerUpdateLog() {
     function StartTimerUpdateLog() {
@@ -3361,7 +3465,8 @@ function oldContent_Back(){
 		var context = canvas.getContext('2d');
 		var context = canvas.getContext('2d');
 		
 		
 		if(ClientData.IsAddingMarking() == true){			
 		if(ClientData.IsAddingMarking() == true){			
-			imgDrawingTemp = canvas.toDataURL("image/png");			
+			imgDrawingTemp = canvas.toDataURL("image/png");
+			imgMarkerTemp = canvas_marker.toDataURL("image/png");;					
 		}	
 		}	
 																									
 																									
 		sizingScreen();
 		sizingScreen();
@@ -3374,6 +3479,13 @@ function oldContent_Back(){
 				context.drawImage(img,0,0,canvas.width,canvas.height);
 				context.drawImage(img,0,0,canvas.width,canvas.height);
 			}
 			}
 			img.src = imgDrawingTemp;	
 			img.src = imgDrawingTemp;	
+			
+			var imgMarker = new Image();
+			imgMarker.onload = function(){
+				context_marker.drawImage(imgMarker,0,0,canvas_marker.width,canvas_marker.height);
+			}
+			imgMarker.src = imgMarkerTemp;
+
 		}
 		}
    }        
    }        
     
     
@@ -3418,6 +3530,20 @@ function oldContent_Back(){
 	    });	     	 	
 	    });	     	 	
 	}
 	}
     
     
+    /* set position model when resize*/
+	function changePosDialog(){
+		$("#divDialogMemo").center();		
+		$("#boxBookMark").center();						
+		$("#boxIndex").center();			
+		$("#boxCopyText").center();		
+		$("#boxSearching").center();		
+		$("#boxAddMemo").center();				
+		$('#dlgPen').center();		
+		$('#dlgMaker').center();
+		$('#dlgGomu').center();		
+		$('#dlgMarking').center();		
+	}
+    
     function initPage(){
     function initPage(){
     	   		
     	   		
     	//$('body,html').animate({ scrollTop: 0 }, 350);
     	//$('body,html').animate({ scrollTop: 0 }, 350);
@@ -3520,28 +3646,7 @@ function oldContent_Back(){
 			sizingScreen();
 			sizingScreen();
 			/* close dialog popuptext */
 			/* close dialog popuptext */
 			closeDialogPopUpText();
 			closeDialogPopUpText();
-		});
-		
-		/* set position model when resize*/
-		function changePosDialog(){
-			$("#divDialogMemo").css('left','30%');
-			$("#divDialogMemo").css('top','30%');
-			
-			$("#boxBookMark").css('left','40%');
-			$("#boxBookMark").css('top','40%');				
-			
-			$("#boxIndex").css('left','30%');
-			$("#boxIndex").css('top','30%');	
-			
-			$("#boxCopyText").css('left','30%');
-			$("#boxCopyText").css('top','30%');
-			
-			$("#boxSearching").css('left','40%');
-			$("#boxSearching").css('top','40%');
-			
-			$("#boxAddMemo").css('left','40%');
-			$("#boxAddMemo").css('top','40%');			
-		}
+		});		
 		
 		
 		$(document).ajaxComplete(function(){			
 		$(document).ajaxComplete(function(){			
 				/*Init Page */		
 				/*Init Page */		
@@ -3799,12 +3904,12 @@ function oldContent_Back(){
              </h1>
              </h1>
                 <div id="dlgMarking_body" class="markingBoxBody_on">
                 <div id="dlgMarking_body" class="markingBoxBody_on">
                  <ul class="fix">
                  <ul class="fix">
-                  <li><a><img src="img/viewer/1.png" id="dlgMarking_imgPen" alt="" /></a></li>
-			      <li><a><img src="img/viewer/2.png" id="dlgMarking_imgPenOption" alt="" /></a></li>
-			      <li><a><img src="img/viewer/3.png" id="dlgMarking_imgMaker" alt="" /></a></li>
-			      <li><a><img src="img/viewer/4.png" id="dlgMarking_imgMakerOption" alt="" /></a></li>
-			      <li><a><img src="img/viewer/5.png" id="dlgMarking_imgEraser" alt="" /></a></li>
-			      <li><a><img src="img/viewer/6.png" id="dlgMarking_imgEraserOption" alt="" /></a></li>
+                  <li><div id="dlgMarking_imgPen" > </div></li>
+			      <li><div id="dlgMarking_imgPenOption"> </div></li>
+			      <li><div id="dlgMarking_imgMaker"> </div></li>
+			      <li><div id="dlgMarking_imgMakerOption"> </div></li>
+			      <li><div id="dlgMarking_imgEraser"> </div></li>
+			      <li><div id="dlgMarking_imgEraserOption"> </div></li>
 			                 </ul>
 			                 </ul>
 			      <a id="dlgMarking_dspPgClear" class="clearbtn lang" lang="dspPgClear" style="cursor: default">このページクリア</a>
 			      <a id="dlgMarking_dspPgClear" class="clearbtn lang" lang="dspPgClear" style="cursor: default">このページクリア</a>
                         <a id="dlgMarking_dspSave" class="savebtn lang" lang="dspSave" style="cursor: default">保存</a>
                         <a id="dlgMarking_dspSave" class="savebtn lang" lang="dspSave" style="cursor: default">保存</a>
@@ -3814,15 +3919,15 @@ function oldContent_Back(){
             <!-- Marking [ end ] -->
             <!-- Marking [ end ] -->
 
 
             <!-- Eraser [start] -->
             <!-- Eraser [start] -->
-            <div class="eraser_paneldialog gomuRayermenu1" id="dlgGomu">
+            <div class="eraser_paneldialog gomuRayermenu1" id="dlgGomu" style="width:275px;height:160px">
                 <!--<div class="paneltitle lang" lang="txtDltOpt">消しゴムオプションの設定</div>-->
                 <!--<div class="paneltitle lang" lang="txtDltOpt">消しゴムオプションの設定</div>-->
                 <div style="float: left; display: block;">
                 <div style="float: left; display: block;">
                 	<ul style="list-style: none;">
                 	<ul style="list-style: none;">
                 		<li><label class="lang" lang="txtMkgSize">太いさ</label></li>
                 		<li><label class="lang" lang="txtMkgSize">太いさ</label></li>
-                		<li><input type="radio" id="dlgGomu_rdo1" name="rdoSize" value="1" checked="checked" /><label for="rdo1" class="lang" lang="txtMkgS">小</label></li>
-                		<li><input type="radio" id="dlgGomu_rdo2" name="rdoSize" value="2" /><label for="rdo2" class="lang" lang="txtMkgM">中</label></li>
-                		<li><input type="radio" id="dlgGomu_rdo3" name="rdoSize" value="3" /><label for="rdo3" class="lang" lang="txtMkgB">大</label></li>
-                		<li><input type="radio" id="dlgGomu_rdo4" name="rdoSize" value="4" /><label for="rdo4" class="lang" lang="txtMkgSB">特大</label></li>
+                		<li><input type="radio" id="dlgGomu_rdo1" name="rdoSize" value="1" checked="checked" /><label for="dlgGomu_rdo1" class="lang" lang="txtMkgS">小</label></li>
+                		<li><input type="radio" id="dlgGomu_rdo2" name="rdoSize" value="2" /><label for="dlgGomu_rdo2" class="lang" lang="txtMkgM">中</label></li>
+                		<li><input type="radio" id="dlgGomu_rdo3" name="rdoSize" value="3" /><label for="dlgGomu_rdo3" class="lang" lang="txtMkgB">大</label></li>
+                		<li><input type="radio" id="dlgGomu_rdo4" name="rdoSize" value="4" /><label for="dlgGomu_rdo4" class="lang" lang="txtMkgSB">特大</label></li>
                 	</ul>                                                                                                
                 	</ul>                                                                                                
                 </div>
                 </div>
                 <div class="panelPreview gomuCanvasArea_s">
                 <div class="panelPreview gomuCanvasArea_s">
@@ -3836,9 +3941,9 @@ function oldContent_Back(){
             <!-- Eraser [ end ] -->
             <!-- Eraser [ end ] -->
 
 
 
 
-            <div id="dlgMaker" style="margin: 0 auto; width: 200px" class="paneldialog"> </div>
+            <div id="dlgMaker" style="margin: 0 auto; width: 390px; height: 265px" class="paneldialog"> </div>
 
 
-            <div id="dlgPen" style="margin: 0 auto; width: 200px" class="paneldialog"> </div>
+            <div id="dlgPen" style="margin: 0 auto; width: 390px; height: 265px" class="paneldialog"> </div>
 
 
             <div id="dlgOverlay"> </div>
             <div id="dlgOverlay"> </div>
             
             

abvw/css/contentview.css

@@ -465,7 +465,6 @@ div .ui-slider-range, .ui-widget-header, .ui-slider-range-max {
 	width:390px;
 	width:390px;
 	height: 265px;
 	height: 265px;
 	background:url('../img/viewer/alpha_w70.png') 0 0 repeat;
 	background:url('../img/viewer/alpha_w70.png') 0 0 repeat;
-	position:absolute;
 	/*top:-63px;*/
 	/*top:-63px;*/
 	/*right:-138px;*/
 	/*right:-138px;*/
 	z-index: 101;
 	z-index: 101;
@@ -687,4 +686,113 @@ aside.MemoIndexBox .indexBoxBody_off{
 	background: -ms-linear-gradient(top,  rgb(45,123,191) 27%,rgb(16,89,163) 77%); /* IE10+ */
 	background: -ms-linear-gradient(top,  rgb(45,123,191) 27%,rgb(16,89,163) 77%); /* IE10+ */
 	background: linear-gradient(to bottom,  rgb(45,123,191) 27%,rgb(16,89,163) 77%); /* W3C */
 	background: linear-gradient(to bottom,  rgb(45,123,191) 27%,rgb(16,89,163) 77%); /* W3C */
 	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2d7bbf', endColorstr='#1059a3',GradientType=0 ); /* IE6-9 */
 	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2d7bbf', endColorstr='#1059a3',GradientType=0 ); /* IE6-9 */
-}
+}
\ No newline at end of file
+
+
+.pen_selected{
+	background:url(../img/viewer/1_hover.png) 0 0 repeat-x;
+	width:60px;
+	height:60px;
+}
+
+.pen_hover{
+	background:url(../img/viewer/1.png) 0 0 repeat-x;
+	width:60px;
+	height:60px;
+}
+
+.pen_hover:hover{
+	background:url(../img/viewer/1_hover.png) 0 0 repeat-x;
+	width:60px;
+	height:60px;
+}
+
+.maker_selected{
+	background:url(../img/viewer/3_hover.png) 0 0 repeat-x;
+	width:60px;
+	height:60px;
+}
+
+.maker_hover{
+	background:url(../img/viewer/3.png) 0 0 repeat-x;
+	width:60px;
+	height:60px;
+}
+
+.maker_hover:hover{
+	background:url(../img/viewer/3_hover.png) 0 0 repeat-x;
+	width:60px;
+	height:60px;
+}
+
+.eraser_selected{
+	background:url(../img/viewer/5_hover.png) 0 0 repeat-x;
+	width:60px;
+	height:60px;
+}
+
+.eraser_hover{
+	background:url(../img/viewer/5.png) 0 0 repeat-x;
+	width:60px;
+	height:60px;
+}
+
+.eraser_hover:hover{
+	background:url(../img/viewer/5_hover.png) 0 0 repeat-x;
+	width:60px;
+	height:60px;
+}
+
+.pen_option_selected{
+	background:url(../img/viewer/2_hover.png) 0 0 repeat-x;
+	width:60px;
+	height:60px;
+}
+
+.pen_option_hover{
+	background:url(../img/viewer/2.png) 0 0 repeat-x;
+	width:60px;
+	height:60px;
+}
+
+.pen_option_hover:hover{
+	background:url(../img/viewer/2_hover.png) 0 0 repeat-x;
+	width:60px;
+	height:60px;
+}
+
+.maker_option_selected{
+	background:url(../img/viewer/4_hover.png) 0 0 repeat-x;
+	width:60px;
+	height:60px;
+}
+
+.maker_option_hover{
+	background:url(../img/viewer/4.png) 0 0 repeat-x;
+	width:60px;
+	height:60px;
+}
+
+.maker_option_hover:hover{
+	background:url(../img/viewer/4_hover.png) 0 0 repeat-x;
+	width:60px;
+	height:60px;
+}
+
+.eraser_option_selected{
+	background:url(../img/viewer/6_hover.png) 0 0 repeat-x;
+	width:60px;
+	height:60px;
+}
+
+.eraser_option_hover{
+	background:url(../img/viewer/6.png) 0 0 repeat-x;
+	width:60px;
+	height:60px;
+}
+
+.eraser_option_hover:hover{
+	background:url(../img/viewer/6_hover.png) 0 0 repeat-x;
+	width:60px;
+	height:60px;
+}

abvw/js/contentview.js

@@ -1070,6 +1070,7 @@ function initializeViewerComponent(viewId) {
 		'<canvas id="main"></canvas>' +
 		'<canvas id="main"></canvas>' +
 		'<canvas id="offscreen"></canvas>' +
 		'<canvas id="offscreen"></canvas>' +
 		'<canvas id="draw_canvas"></canvas>' +
 		'<canvas id="draw_canvas"></canvas>' +
+		'<canvas id="marker_canvas"></canvas>' +
 		'<div id="playvideo"></div>' +
 		'<div id="playvideo"></div>' +
 		'<div id="playaudio" style="width:0px; height:0px;"></div>' +
 		'<div id="playaudio" style="width:0px; height:0px;"></div>' +
 		'<div id="playaudiopage" style="width:0px; height:0px;"></div>' +
 		'<div id="playaudiopage" style="width:0px; height:0px;"></div>' +
@@ -1095,6 +1096,16 @@ function initializeViewerComponent(viewId) {
 			'display' : 'none'
 			'display' : 'none'
 		}
 		}
 	);
 	);
+	
+	$('#marker_canvas').css(
+		{					
+			'display' : 'none',
+			'position' : 'absolute',
+			'cursor': 'default'
+				
+		}
+	);
+
 	$('#draw_canvas').css(
 	$('#draw_canvas').css(
 		{					
 		{					
 			'display' : 'none',
 			'display' : 'none',
@@ -1115,6 +1126,8 @@ function initializeViewerComponent(viewId) {
 	setDefaultEvent();
 	setDefaultEvent();
 	
 	
 	/*init canvas value */
 	/*init canvas value */
+	canvas_marker = document.getElementById('marker_canvas');
+	context_marker = canvas_marker.getContext('2d');
 	canvas_draw = document.getElementById('draw_canvas');
 	canvas_draw = document.getElementById('draw_canvas');
 	context_draw = canvas_draw.getContext('2d');
 	context_draw = canvas_draw.getContext('2d');
 	canvas_main = document.getElementById('main');
 	canvas_main = document.getElementById('main');
@@ -1161,12 +1174,35 @@ function onClick_CanvasMain(event){
 						        $('#imgaddmemo').addClass('memoAdd');
 						        $('#imgaddmemo').addClass('memoAdd');
 							});	
 							});	
 						}else{
 						}else{
-							$("#overlay").show();
-							$('#boxAddMemo').css('z-index' , '101');
							$('#boxAddMemo').css('display' , 'block');
-						    $('#boxAddMemo').draggable({ handle: "h1" });
-						    $("#boxAddMemo").offset({left:event.pageX,top:event.pageY});
-				    		$("#divAddMemo").show();    		
-				    		$("#divAddMemo").offset({left:event.pageX,top:(event.pageY + $('#bookmarkBoxHdMemo').height() - 2)});
+							if(typeSelectMemo == 1){ /* add new */
+								AddMemo(contentID,changePageIndex(getPageIndex()),$('#divDialogMemo'),posXPopupMemo,posYPopupMemo,function(){
+									//set flag change memo 
+									ClientData.isChangedMemo(true);
+									ClientData.IsAddingMemo(false);			
+									
+									/* refresh draw memo */						
+									drawMemoOnScreen();
+												
+									
+									 //change image	             							
+									$('#imgaddmemo').removeClass();
+							        $('#imgaddmemo').addClass('memoAdd');
+								});	
+	
+							}else if(typeSelectMemo == 2){ /* copy */								
+								CopyMemo(ClientData.memo_copyText(),contentID,changePageIndex(getPageIndex()),$('#divDialogMemo'),posXPopupMemo,posYPopupMemo,function(){
+										//set flag change memo 
+										ClientData.isChangedMemo(true);	
+										ClientData.IsAddingMemo(false);	
+										
+										/* refresh draw memo */						
+										drawMemoOnScreen();		
+										
+										 //change image	             							
+										$('#imgaddmemo').removeClass();
+								        $('#imgaddmemo').addClass('memoAdd');								
+									});
+							}
 				    	}
 				    	}
 						
 						
 					}else{		
 					}else{		
@@ -2127,7 +2163,12 @@ function flip() {
 			  .attr('width', destRect.right - destRect.left)
 			  .attr('width', destRect.right - destRect.left)
 			   .css('top', destRect.top + marginY - 1)
 			   .css('top', destRect.top + marginY - 1)
 			   .css('left',destRect.left + marginX - 1);
 			   .css('left',destRect.left + marginX - 1);
- 
+			   
+  		$("#marker_canvas").attr('height', destRect.bottom - destRect.top)
+			  .attr('width', destRect.right - destRect.left)
+			   .css('top', destRect.top + marginY - 1)
+			   .css('left',destRect.left + marginX - 1);
+
 		isFirstLoad = false;
 		isFirstLoad = false;
 	}
 	}
 	
 	
@@ -2239,8 +2280,7 @@ function hideDialog()
 {
 {
 	$("#overlay").hide();
 	$("#overlay").hide();
 	$("#dialog").fadeOut(300);
 	$("#dialog").fadeOut(300);
-	$('#dialog').children().remove();
-	initFlg = true;
+	$('#dialog').children().remove();	
 }
 }
 
 
 function createImagePreview(){
 function createImagePreview(){
@@ -2512,6 +2552,10 @@ var TypeAudio2;
 
 
 /* create audio on page */
 /* create audio on page */
 function createAudio(audio,type){	
 function createAudio(audio,type){	
+	// if(avwUserEnvObj.browser == 'firefox'){
+		// audio =  audio.replace("webResourceDownload/", "webResourceDownload");
+	// }
+	
 	if(audio != ''){
 	if(audio != ''){
 		if(type == "0"){ /* play when click */		
 		if(type == "0"){ /* play when click */		
 			stopAllAudio();		
 			stopAllAudio();		
@@ -2553,44 +2597,33 @@ function createAudio(audio,type){
 			
 			
 			TypeAudio1 = type;
 			TypeAudio1 = type;
 			srcAudioType1 = audio;			
 			srcAudioType1 = audio;			
-
-			 if(document.getElementById("play_audio_1") != undefined){
-				 // document.getElementById("play_audio_1").load();		
-				 // document.getElementById("play_audio_1").play();		 
-			 }else{				 	
-			  	if(ClientData.userOpt_musicMode() == "1"){	
-			  		if(avwUserEnvObj.browser == 'firefox'){
-			  			
-						$('#playaudioallpage').html(
-							'	 <embed id="play_audio_1" src="' + audio + '&key=' + (new Date()).toIdString() + '" autostart="true" loop="true" hidden="true"> </embed>' 						
-						);										
-					}else{			
-						 $('#playaudioallpage').html(
-							 '	<audio  id="play_audio_1" loop="loop" autoplay="autoplay" >' +
-							 '		 <source src="' + audio + '&key=' + (new Date()).toIdString() + '" type="audio/mpeg" />' +
-							 '	</audio>'	
-						 );							
-					}							
+			 	
+		  	if(ClientData.userOpt_musicMode() == "1"){	
+		  		if(avwUserEnvObj.browser == 'firefox'){			  			
+					$('#playaudioallpage').html(
+						'	 <embed id="play_audio_1" src="' + audio + '&key=' + (new Date()).toIdString() + '" autostart="true" loop="true"  hidden="true"> </embed>' 						
+					);									
+					
+				}else{			
+					 $('#playaudioallpage').html(
+						 '	<audio  id="play_audio_1" loop="loop" autoplay="autoplay" >' +
+						 '		 <source src="' + audio + '&key=' + (new Date()).toIdString() + '" type="audio/mpeg" />' +
+						 '	</audio>'	
+					 );							
+				}							
+			}else{
+				if(avwUserEnvObj.browser == 'firefox'){
+					$('#playaudioallpage').html(
+						'	 <embed id="play_audio_1" src="' + audio + '&key=' + (new Date()).toIdString() + '" autostart="true" hidden="true"> </embed>' 						
+					);
 				}else{
 				}else{
-					if(avwUserEnvObj.browser == 'firefox'){
-						$('#playaudioallpage').html(
-							'	 <embed id="play_audio_1" src="' + audio + '&key=' + (new Date()).toIdString() + '" autostart="true" hidden="true"> </embed>' 						
-						);
-					}else{
-						$('#playaudioallpage').html(
-							 '	<audio  id="play_audio_1" autoplay = "autoplay"  >' +
-							 '		 <source src="' + audio + '&key=' + (new Date()).toIdString() + '" type="audio/mpeg" />' +
-							 '	</audio>'	
-						 );		
-					}					
-				}
-				
-				//playAllAudio();
-				// if(document.getElementById("play_audio_1") != undefined){
-					// document.getElementById("play_audio_1").pause();
-					// document.getElementById("play_audio_1").play();
-					// }	
-			 }				
+					$('#playaudioallpage').html(
+						 '	<audio  id="play_audio_1" autoplay = "autoplay"  >' +
+						 '		 <source src="' + audio + '&key=' + (new Date()).toIdString() + '" type="audio/mpeg" />' +
+						 '	</audio>'	
+					 );		
+				}					
+			}	
 		}
 		}
 		else if(type == "2"){ /* play on page */	
 		else if(type == "2"){ /* play on page */	
 			stopAllAudio();			
 			stopAllAudio();			
@@ -2783,7 +2816,8 @@ function sizingNotFull(width, height) {
 	}
 	}
 	
 	
 	$("#draw_canvas").css('cursor', 'default');
 	$("#draw_canvas").css('cursor', 'default');
-		
+	$("#marker_canvas").css('cursor', 'default');
+	
 	if(userScale !=1){
 	if(userScale !=1){
 		changeScale(userScale);
 		changeScale(userScale);
 		flip();
 		flip();
@@ -2810,6 +2844,7 @@ function sizingFullSize(width, height) {
 	//adjust size of canvas using for draw
 	//adjust size of canvas using for draw
 	
 	
 	$("#draw_canvas").css('cursor', 'default');
 	$("#draw_canvas").css('cursor', 'default');
+	$("#marker_canvas").css('cursor', 'default');
 
 
 	if(userScale !=1){
 	if(userScale !=1){
 		changeScale(userScale);
 		changeScale(userScale);
@@ -3355,37 +3390,25 @@ function closePopUpCopyMemo(){
 }
 }
 
 
 function click_liAddMemo(event){  
 function click_liAddMemo(event){  
-	AddMemo(contentID,changePageIndex(getPageIndex()),$('#divDialogMemo'),posXPopupMemo,posYPopupMemo,function(){
-		//set flag change memo 
-		ClientData.isChangedMemo(true);
-		ClientData.IsAddingMemo(false);			
-		
-		/* refresh draw memo */						
-		drawMemoOnScreen();
-					
-		
-		 //change image	             							
-		$('#imgaddmemo').removeClass();
-        $('#imgaddmemo').addClass('memoAdd');
-	});	
+	typeSelectMemo = 1;
 	
 	
 	$('#boxAddMemo').hide();   
 	$('#boxAddMemo').hide();   
+	/* unlock dialog overlay */
+	$("#overlay").hide(); 
+	
 	//ClientData.memo_copyText(null);
 	//ClientData.memo_copyText(null);
-    ClientData.IsAddingMemo(false); 
+    //ClientData.IsAddingMemo(false); 
 }
 }
 
 
-function click_liCopyMemo(){       
-	CopyMemo(ClientData.memo_copyText(),contentID,changePageIndex(getPageIndex()),$('#divDialogMemo'),posXPopupMemo,posYPopupMemo,function(){
-		//set flag change memo 
-		ClientData.isChangedMemo(true);	
-		
-		/* refresh draw memo */						
-		drawMemoOnScreen();										
-	});
+function click_liCopyMemo(){ 
+	typeSelectMemo = 2;      
 	
 	
 	$('#boxAddMemo').hide();
 	$('#boxAddMemo').hide();
+	/* unlock dialog overlay */
+	$("#overlay").hide(); 
+	
 	//ClientData.memo_copyText(null);  
 	//ClientData.memo_copyText(null);  
-    ClientData.IsAddingMemo(false); 
+    //ClientData.IsAddingMemo(false); 
 }
 }
 
 
 function click_liDeleteMemo(){
 function click_liDeleteMemo(){

abvw/js/contentview_Gomu.js

@@ -31,6 +31,7 @@ function ShowEraser(targetDiv) {
     $('#dlgGomu').show();
     $('#dlgGomu').show();
     $('#dlgGomu').draggable();
     $('#dlgGomu').draggable();
     Eraser_SetDefaultValue();
     Eraser_SetDefaultValue();
+     $('#dlgGomu').center();
 }
 }
 // Set default value for easer.
 // Set default value for easer.
 function Eraser_SetDefaultValue() {
 function Eraser_SetDefaultValue() {
@@ -131,6 +132,12 @@ function dlgGomu_dspOK_click() {
 	enableButtonMarking();
 	enableButtonMarking();
 	ClientData.IsAddingMarking(true);
 	ClientData.IsAddingMarking(true);
 	isAddingMarking = ClientData.IsAddingMarking();
 	isAddingMarking = ClientData.IsAddingMarking();
+	
+	/* unlock dialog overlay */
+	$("#overlay").hide();
+	
+	$('#dlgMarking_imgEraserOption').removeClass();
+	$('#dlgMarking_imgEraserOption').addClass('eraser_option_hover');
 }
 }
 // Event of button cancel
 // Event of button cancel
 function dlgGomu_dspCancel_click() {
 function dlgGomu_dspCancel_click() {
@@ -146,6 +153,12 @@ function dlgGomu_dspCancel_click() {
 	enableButtonMarking();
 	enableButtonMarking();
 	ClientData.IsAddingMarking(true);
 	ClientData.IsAddingMarking(true);
 	isAddingMarking = ClientData.IsAddingMarking();
 	isAddingMarking = ClientData.IsAddingMarking();
+	
+	/* unlock dialog overlay */
+	$("#overlay").hide();
+	
+	$('#dlgMarking_imgEraserOption').removeClass();
+	$('#dlgMarking_imgEraserOption').addClass('eraser_option_hover');
 }
 }
 
 
 function dlgGomu_rdo1_text_click(){
 function dlgGomu_rdo1_text_click(){
@@ -199,6 +212,7 @@ function touchStart_BtnOk_Gomu(e){
 	
 	
 	
 	
 	dlgGomu_dspOK_click();
 	dlgGomu_dspOK_click();
+	
 }
 }
 
 
 function touchStart_BtnCancel_Gomu(e){
 function touchStart_BtnCancel_Gomu(e){

abvw/js/contentview_Maker.js

@@ -31,10 +31,10 @@ function ShowMaker(targetId){
 	 '<div id="panel-maker" class="rayermenu1">'
 	 '<div id="panel-maker" class="rayermenu1">'
 	+'	<div id="panel-maker-size">'
 	+'	<div id="panel-maker-size">'
 	+'		<span lang="txtMkgSize" class="lang" >太いさ</span>'
 	+'		<span lang="txtMkgSize" class="lang" >太いさ</span>'
-	+'		<input type="radio" id="maker-size-small" name="maker-size" /><span id="marker-small-text" class="lang" lang="txtMkgS">S</span>'
-	+'		<input type="radio" id="maker-size-medium" name="maker-size" /><span id="marker-medium-text" class="lang" lang="txtMkgM">M</span>'
-	+'		<input type="radio" id="maker-size-large" name="maker-size" /><span id="marker-large-text" class="lang" lang="txtMkgB">L</span>'
-	+'		<input type="radio" id="maker-size-oversize" name="maker-size" /><span id="marker-oversize-text" class="lang" lang="txtMkgSB">XL</span>'
+	+ '		<input type="radio" id="maker-size-small" name="maker-size" /><label for="maker-size-small" id="marker-small-text" class="lang" lang="txtMkgS">S</label>'
+	+ '		<input type="radio" id="maker-size-medium" name="maker-size" /><label for="maker-size-medium" id="marker-medium-text" class="lang" lang="txtMkgM">M</label>'
+	+ '		<input type="radio" id="maker-size-large" name="maker-size" /><label for="maker-size-large" id="marker-large-text" class="lang" lang="txtMkgB">L</label>'
+	+ '		<input type="radio" id="maker-size-oversize" name="maker-size" /><label for="maker-size-oversize" id="marker-oversize-text" class="lang" lang="txtMkgSB">XL</label>'
 	+'	</div>'
 	+'	</div>'
 	+'	<span class="lang" lang="txtColor" style="float:left;margin-right: 10px;">Color</span>'
 	+'	<span class="lang" lang="txtColor" style="float:left;margin-right: 10px;">Color</span>'
 	+'	<div id="makerColorPreview"></div>'
 	+'	<div id="makerColorPreview"></div>'
@@ -58,20 +58,20 @@ function ShowMaker(targetId){
     	// //lockLayout();
     	// //lockLayout();
     	// maker_targetDiv.draggable();
     	// maker_targetDiv.draggable();
     // });
	maker_targetDiv.show();
     // });
	maker_targetDiv.show();
-	maker_targetDiv.draggable({ revert: false});
+	maker_targetDiv.draggable();
     Maker_handleColorPickerEvent();
     Maker_handleColorPickerEvent();
+    
+    $('#dlgMaker').center();
 }
 }
 
 
 function touchStart_BtnOk_Maker(e){
 function touchStart_BtnOk_Maker(e){
 	e.preventDefault();
 	e.preventDefault();
-	maker_targetDiv.draggable("destroy");
 		
 		
 	Maker_dspOK_click();
 	Maker_dspOK_click();
 }
 }
 
 
 function touchStart_BtnCancel_Maker(e){
 function touchStart_BtnCancel_Maker(e){
 	e.preventDefault();
 	e.preventDefault();
-	maker_targetDiv.draggable("destroy");
 	
 	
 	Maker_dspCancel_click();
 	Maker_dspCancel_click();
 }
 }
@@ -285,6 +285,19 @@ function Maker_dspOK_click() {
         typeValue = 50;
         typeValue = 50;
     }
     }
 
 
+	if(ClientData.maker_color() != maker_chooseColor){
+		imgMarkerTemp = canvas_marker.toDataURL("image/png;")
+	
+		var img = new Image();
+		img.onload = function(){
+			context_draw.drawImage(img,0,0,canvas_draw.width,canvas_draw.height);		
+		}
+		img.src = imgMarkerTemp;	
+		
+		context_marker.clearRect(0, 0, canvas_marker.width, canvas_marker.height);
+		
+		ClientData.maker_color();
+	}
     // Set value to local
     // Set value to local
     ClientData.maker_size(typeValue);
     ClientData.maker_size(typeValue);
     ClientData.maker_color(maker_chooseColor);    
     ClientData.maker_color(maker_chooseColor);    
@@ -303,6 +316,12 @@ function Maker_dspOK_click() {
 	isAddingMarking = ClientData.IsAddingMarking();
 	isAddingMarking = ClientData.IsAddingMarking();
 	makerSize = ClientData.maker_size();
 	makerSize = ClientData.maker_size();
 	makerColor = ClientData.maker_color();
 	makerColor = ClientData.maker_color();
+	
+	/* unlock dialog overlay */
+	$("#overlay").hide();
+	
+	$('#dlgMarking_imgMakerOption').removeClass();
+	$('#dlgMarking_imgMakerOption').addClass('maker_option_hover');
 }
 }
 
 
 // Event of button cancel
 // Event of button cancel
@@ -317,6 +336,12 @@ function Maker_dspCancel_click() {
 	enableButtonMarking();
 	enableButtonMarking();
 	ClientData.IsAddingMarking(true);
 	ClientData.IsAddingMarking(true);
 	isAddingMarking = ClientData.IsAddingMarking();
 	isAddingMarking = ClientData.IsAddingMarking();
+	
+	/* unlock dialog overlay */
+	$("#overlay").hide();
+	
+	$('#dlgMarking_imgMakerOption').removeClass();
+	$('#dlgMarking_imgMakerOption').addClass('maker_option_hover');
 }
 }
 
 
 function Maker_colorWrapperMouseLeaveFunction() {
 function Maker_colorWrapperMouseLeaveFunction() {

abvw/js/contentview_Marking.js

@@ -36,69 +36,82 @@ Event groups [start]
 ----------------------------------------------------------------------------
 ----------------------------------------------------------------------------
 */
 */
 function dlgMarking_dspSave_click() {
 function dlgMarking_dspSave_click() {
-	/*create new entity marking */
-	var marking = new MarkingEntity();
-	marking.contentid = contentID;
-	marking.pageNo = changePageIndex(getPageIndex());
-	marking.content = canvas_draw.toDataURL("image/png");	
+	imgMarkerTemp = canvas_marker.toDataURL("image/png;")
 	
 	
-	
-	/* insert marking */
-	var arr = ClientData.MarkingData();
-	var nIndexMarking = -1;
-	
-	for(var nIndex = 0; nIndex < arr.length; nIndex++){
-		if(arr[nIndex].contentid == contentID
-		&& arr[nIndex].pageNo == changePageIndex(getPageIndex())){
-			nIndexMarking = nIndex; 
-			break;
+	var img = new Image();
+	img.onload = function(){
+		context_draw.drawImage(img,0,0,canvas_draw.width,canvas_draw.height);	
+
+		/*create new entity marking */
+		var marking = new MarkingEntity();
+		marking.contentid = contentID;
+		marking.pageNo = changePageIndex(getPageIndex());
+		marking.content = canvas_draw.toDataURL("image/png");	
+		
+		
+		/* insert marking */
+		var arr = ClientData.MarkingData();
+		var nIndexMarking = -1;
+		
+		for(var nIndex = 0; nIndex < arr.length; nIndex++){
+			if(arr[nIndex].contentid == contentID
+			&& arr[nIndex].pageNo == changePageIndex(getPageIndex())){
+				nIndexMarking = nIndex; 
+				break;
+			}
 		}
 		}
-	}
-	
-	if(isDrawing == true){/* if has draw image */
-		if(isClearDrawing == true){
-			arr.splice(nIndexMarking,1);		
-		}else{	
-			/* case not exist marking */
-			if(nIndexMarking == -1){
-				arr.push(marking);	
-			}else{
-				/* case exist marking */
-				arr[nIndexMarking] = marking;
+		
+		if(isDrawing == true){/* if has draw image */
+			if(isClearDrawing == true){
+				arr.splice(nIndexMarking,1);		
+			}else{	
+				/* case not exist marking */
+				if(nIndexMarking == -1){
+					arr.push(marking);	
+				}else{
+					/* case exist marking */
+					arr[nIndexMarking] = marking;
+				}
 			}
 			}
 		}
 		}
+		
+		/*add marking to local storage */
+		ClientData.MarkingData(arr);
+		
+	    // Close dialog
+	    //$("#dlgMarking").dialog('close');
+	    $("#dlgMarking").hide();
+	    ClientData.IsAddingMarking(false);    
+	    $('#draw_canvas').css('display','none');    
+	
+	   /* $('#imgmarkingtoolbar').removeClass('markingToolbar');
+		$('#imgmarkingtoolbar').addClass('markingToolbar_off');
+	    $("#imgmarkingtoolbar").removeAttr("style")
+	    
+	    $('#imgmarking').removeClass('marking_off');
+		$('#imgmarking').addClass('marking');*/
+	
+	    /*set flag change marking */
+	   ClientData.isChangedMemo(true);
+	   
+	   ClientData.IsHideToolbar(false);
+	   
+	   /* draw again*/   
+	   //drawCanvas();
+	   //disableAllControl();	
+	   handleDisplayToolbar()  
+	   /* visible button fullscreen */
+	   $('#control_screen_2').show();
+	   
+	   /* init clear drawing canvas */
+	   isClearDrawing = false;
 	}
 	}
+	img.src = imgMarkerTemp;	
 	
 	
-	/*add marking to local storage */
-	ClientData.MarkingData(arr);
+	context_marker.clearRect(0, 0, canvas_marker.width, canvas_marker.height);
 	
 	
-    // Close dialog
-    //$("#dlgMarking").dialog('close');
-    $("#dlgMarking").hide();
-    ClientData.IsAddingMarking(false);    
-    $('#draw_canvas').css('display','none');    
-
-   /* $('#imgmarkingtoolbar').removeClass('markingToolbar');
-	$('#imgmarkingtoolbar').addClass('markingToolbar_off');
-    $("#imgmarkingtoolbar").removeAttr("style")
-    
-    $('#imgmarking').removeClass('marking_off');
-	$('#imgmarking').addClass('marking');*/
+	$('#marker_canvas').css('display','none');		 
 
 
-    /*set flag change marking */
-   ClientData.isChangedMemo(true);
-   
-   ClientData.IsHideToolbar(false);
-   
-   /* draw again*/   
-   //drawCanvas();
-   //disableAllControl();	
-   handleDisplayToolbar()  
-   /* visible button fullscreen */
-   $('#control_screen_2').show();
-   
-   /* init clear drawing canvas */
-   isClearDrawing = false;
 }
 }
 
 
 function dlgMarking_dspCancel_click() {
 function dlgMarking_dspCancel_click() {
@@ -125,19 +138,37 @@ function dlgMarking_dspCancel_click() {
     /* visible button fullscreen */
     /* visible button fullscreen */
 	$('#control_screen_2').show();   
 	$('#control_screen_2').show();   
 	
 	
+	$('#marker_canvas').css('display','none');	
 }
 }
 
 
 function dlgMarking_dspPgClear_click() {
 function dlgMarking_dspPgClear_click() {
     
     
     // Close dialog
     // Close dialog
      context_draw.clearRect(0, 0, canvas_draw.width, canvas_draw.height);
      context_draw.clearRect(0, 0, canvas_draw.width, canvas_draw.height);
-     
+     context_marker.clearRect(0, 0, canvas_marker.width, canvas_marker.height);
+
      isClearDrawing = true;
      isClearDrawing = true;
      
      
      /* clear on local */
      /* clear on local */
      var arr = ClientData.MarkingData();	
      var arr = ClientData.MarkingData();	
 }
 }
 
 
+/* draw marker canvas to draw canvas */
+function canvasMarkerToCanvasDraw(){	
+	imgMarkerTemp = canvas_marker.toDataURL("image/png;")
+	
+	var img = new Image();
+	img.onload = function(){
+		context_draw.drawImage(img,0,0,canvas_draw.width,canvas_draw.height);		
+	}
+	img.src = imgMarkerTemp;	
+	
+	context_marker.clearRect(0, 0, canvas_marker.width, canvas_marker.height);
+	
+	 $('#marker_canvas').css('display','none');		 
+}
+
+
 function dlgMarking_imgPen_click() {
 function dlgMarking_imgPen_click() {
     // Choose pen
     // Choose pen
     $("#dlgMarking_imgMaker").removeClass();
     $("#dlgMarking_imgMaker").removeClass();
@@ -146,15 +177,35 @@ function dlgMarking_imgPen_click() {
 
 
     ClientData.MarkingType("pen");
     ClientData.MarkingType("pen");
     markingType = "pen";
     markingType = "pen";
+    
+    canvasMarkerToCanvasDraw();
+    
+    setDefaultImageForMarking();
 }
 }
 function dlgMarking_imgPenOption_click() {
 function dlgMarking_imgPenOption_click() {
 	/*disable button */
 	/*disable button */
 	disableButtonMarking();
 	disableButtonMarking();
-	ClientData.IsAddingMarking(false);
+	//ClientData.IsAddingMarking(false);
+	/* display dialog overlay */
+    $("#overlay").show();
 	isAddingMarking = ClientData.IsAddingMarking()
 	isAddingMarking = ClientData.IsAddingMarking()
 	
 	
     // Show option of pen
     // Show option of pen
     ShowPen($('#dlgPen'));
     ShowPen($('#dlgPen'));
+    
+    /* draw maker canvas */
+    if(markingType == "maker"){
+   		canvasMarkerToCanvasDraw();
+    }
+    
+    ClientData.MarkingType("pen");
+    markingType = "pen";
+    
+    $('#dlgMarking_imgPenOption').removeClass();
+	$('#dlgMarking_imgPenOption').addClass('pen_option_selected');
+	
+	setDefaultImageForMarking();
+	
 }
 }
 function dlgMarking_imgMaker_click() {
 function dlgMarking_imgMaker_click() {
     // Choose maker
     // Choose maker
@@ -164,15 +215,29 @@ function dlgMarking_imgMaker_click() {
 
 
     ClientData.MarkingType("maker");
     ClientData.MarkingType("maker");
     markingType = "maker";
     markingType = "maker";
+    $('#marker_canvas').css('display','block');    
+    
+    setDefaultImageForMarking();
 }
 }
 function dlgMarking_imgMakerOption_click() {
 function dlgMarking_imgMakerOption_click() {
 	/*disable button */
 	/*disable button */
 	disableButtonMarking();
 	disableButtonMarking();
-	ClientData.IsAddingMarking(false);
+	//ClientData.IsAddingMarking(false);
+	 /* display dialog overlay */
+    $("#overlay").show();
 	isAddingMarking = ClientData.IsAddingMarking()
 	isAddingMarking = ClientData.IsAddingMarking()
 	
 	
     // Show option of maker
     // Show option of maker
     ShowMaker($('#dlgMaker'));
     ShowMaker($('#dlgMaker'));
+    
+    ClientData.MarkingType("maker");
+    markingType = "maker";
+    $('#marker_canvas').css('display','block');   
+    
+    $('#dlgMarking_imgMakerOption').removeClass();
+	$('#dlgMarking_imgMakerOption').addClass('maker_option_selected');
+	
+	setDefaultImageForMarking();
 }
 }
 function dlgMarking_imgEraser_click() {
 function dlgMarking_imgEraser_click() {
     // Choose eraser
     // Choose eraser
@@ -182,15 +247,33 @@ function dlgMarking_imgEraser_click() {
 
 
     ClientData.MarkingType("eraser");
     ClientData.MarkingType("eraser");
     markingType = "eraser";
     markingType = "eraser";
+    canvasMarkerToCanvasDraw(); 
+    
+    setDefaultImageForMarking(); 
 }
 }
 function dlgMarking_imgEraserOption_click() {
 function dlgMarking_imgEraserOption_click() {
 	/*disable button */
 	/*disable button */
 	disableButtonMarking();
 	disableButtonMarking();
-	ClientData.IsAddingMarking(false);
+	//ClientData.IsAddingMarking(false);
+	/* display dialog overlay */
+    $("#overlay").show();
 	isAddingMarking = ClientData.IsAddingMarking();
 	isAddingMarking = ClientData.IsAddingMarking();
 	
 	
     // Show option of maker
     // Show option of maker
     ShowEraser();
     ShowEraser();
+    
+    /* draw maker canvas */
+    if(markingType == "maker"){
+   		canvasMarkerToCanvasDraw();
+    }
+    
+    ClientData.MarkingType("eraser");
+    markingType = "eraser";
+    
+    $('#dlgMarking_imgEraserOption').removeClass();
+	$('#dlgMarking_imgEraserOption').addClass('eraser_option_selected');
+	
+	setDefaultImageForMarking();
 }
 }
 
 
 function dlgMarking_imgMin_click() {
 function dlgMarking_imgMin_click() {
@@ -223,6 +306,38 @@ Event groups [ end ]
 ----------------------------------------------------------------------------
 ----------------------------------------------------------------------------
 */
 */
 
 
+function setDefaultImageForMarking(){	
+	/* pen */
+	if(markingType == "pen"){
+		$('#dlgMarking_imgPen').removeClass();
+		$('#dlgMarking_imgPen').addClass('pen_selected');
+		
+	}else{
+		$('#dlgMarking_imgPen').removeClass();
+		$('#dlgMarking_imgPen').addClass('pen_hover');
+	}
+	
+	/* maker */
+	if(markingType == "maker"){
+		$('#dlgMarking_imgMaker').removeClass();
+		$('#dlgMarking_imgMaker').addClass('maker_selected');
+		
+	}else{
+		$('#dlgMarking_imgMaker').removeClass();
+		$('#dlgMarking_imgMaker').addClass('maker_hover');
+	}
+	
+	/* maker */
+	if(markingType == "eraser"){
+		$('#dlgMarking_imgEraser').removeClass();
+		$('#dlgMarking_imgEraser').addClass('eraser_selected');
+		
+	}else{
+		$('#dlgMarking_imgEraser').removeClass();
+		$('#dlgMarking_imgEraser').addClass('eraser_hover');
+	}
+}
+
 /* disable all button on dialog marking */
 /* disable all button on dialog marking */
 function disableButtonMarking(){
 function disableButtonMarking(){
 	$('#dlgMarking_dspSave').unbind('click');
 	$('#dlgMarking_dspSave').unbind('click');
@@ -312,15 +427,21 @@ function ShowMarking() {
 
 
     dlgMarking_imgPen_click();
     dlgMarking_imgPen_click();
     
     
+    setDefaultImageForMarking();
+    
+	$('#dlgMarking_imgPenOption').removeClass();
+	$('#dlgMarking_imgPenOption').addClass('pen_option_hover');
+	
+	$('#dlgMarking_imgMakerOption').removeClass();
+	$('#dlgMarking_imgMakerOption').addClass('maker_option_hover');
+	
+	$('#dlgMarking_imgEraserOption').removeClass();
+	$('#dlgMarking_imgEraserOption').addClass('eraser_option_hover');
 }
 }
 
 
 // Setting dialog
 // Setting dialog
 $(function () {
 $(function () {
-    // ---------------------------------
-    // Setup for marking [start]
-    // ---------------------------------
-
-
+	
     $("#dlgMarking_dspSave").click(dlgMarking_dspSave_click);
     $("#dlgMarking_dspSave").click(dlgMarking_dspSave_click);
     $("#dlgMarking_dspCancel").click(dlgMarking_dspCancel_click);
     $("#dlgMarking_dspCancel").click(dlgMarking_dspCancel_click);
     $("#dlgMarking_dspPgClear").click(dlgMarking_dspPgClear_click);
     $("#dlgMarking_dspPgClear").click(dlgMarking_dspPgClear_click);
@@ -348,9 +469,7 @@ $(function () {
     $('#dlgMarking').draggable({
     $('#dlgMarking').draggable({
         revert: false
         revert: false
     });
     });
-    // ---------------------------------
-    // Setup for marking [ end ]
-    // ---------------------------------
+   
 
 
 });
 });
 /// ===============================================================================================
 /// ===============================================================================================

abvw/js/contentview_Memo.js

@@ -68,7 +68,7 @@ function MemoDelFunction(){
 		isCopyMemo = false;
 		isCopyMemo = false;
 	}
 	}
 	else{
 	else{
-		resultArr = ClientData.MemoData();
+		var resultArr = ClientData.MemoData();
 		resultArr.splice(EditIndex, 1);
 		resultArr.splice(EditIndex, 1);
 		
 		
 		ClientData.MemoData(resultArr);
 		ClientData.MemoData(resultArr);

abvw/js/contentview_Paint.js

@@ -178,7 +178,7 @@ function drawMove(coors, context_draw) {
 							];
 							];
                 if (sx > coors.x) {
                 if (sx > coors.x) {
                     if (sy > coors.y) {
                     if (sy > coors.y) {
-                        /*context_draw.globalCompositeOperation = 'destination-out';
+                        context_draw.globalCompositeOperation = 'destination-out';
                         context_draw.moveTo(ptStart[1].x, ptStart[1].y);
                         context_draw.moveTo(ptStart[1].x, ptStart[1].y);
                         context_draw.lineTo(ptStart[2].x, ptStart[2].y);
                         context_draw.lineTo(ptStart[2].x, ptStart[2].y);
                         context_draw.lineTo(ptStart[3].x, ptStart[3].y);
                         context_draw.lineTo(ptStart[3].x, ptStart[3].y);
@@ -191,7 +191,7 @@ function drawMove(coors, context_draw) {
                         context_draw.fill();				
                         context_draw.fill();				
                         context_draw.globalCompositeOperation = 'lighter';
                         context_draw.globalCompositeOperation = 'lighter';
                         context_draw.closePath();
                         context_draw.closePath();
-                        context_draw.beginPath();*/
+                        context_draw.beginPath();
                         // 左上に描画する場合
                         // 左上に描画する場合
                         context_draw.moveTo(ptStart[1].x, ptStart[1].y);
                         context_draw.moveTo(ptStart[1].x, ptStart[1].y);
                         context_draw.lineTo(ptStart[2].x, ptStart[2].y);
                         context_draw.lineTo(ptStart[2].x, ptStart[2].y);
@@ -201,7 +201,7 @@ function drawMove(coors, context_draw) {
                         context_draw.lineTo(ptEnd[1].x, ptEnd[1].y);
                         context_draw.lineTo(ptEnd[1].x, ptEnd[1].y);
                         context_draw.closePath();
                         context_draw.closePath();
                     } else if (sy < coors.y) {
                     } else if (sy < coors.y) {
-                        /*context_draw.globalCompositeOperation = 'destination-out';
+                        context_draw.globalCompositeOperation = 'destination-out';
                         context_draw.moveTo(ptStart[0].x, ptStart[0].y);
                         context_draw.moveTo(ptStart[0].x, ptStart[0].y);
                         context_draw.lineTo(ptStart[1].x, ptStart[1].y);
                         context_draw.lineTo(ptStart[1].x, ptStart[1].y);
                         context_draw.lineTo(ptStart[2].x, ptStart[2].y);
                         context_draw.lineTo(ptStart[2].x, ptStart[2].y);
@@ -214,7 +214,7 @@ function drawMove(coors, context_draw) {
                         context_draw.fill();				
                         context_draw.fill();				
                         context_draw.globalCompositeOperation = 'lighter';
                         context_draw.globalCompositeOperation = 'lighter';
                         context_draw.closePath();
                         context_draw.closePath();
-                        context_draw.beginPath();*/
+                        context_draw.beginPath();
 
 
                         // 左下に描画する場合
                         // 左下に描画する場合
                         context_draw.moveTo(ptStart[0].x, ptStart[0].y);
                         context_draw.moveTo(ptStart[0].x, ptStart[0].y);
@@ -225,7 +225,7 @@ function drawMove(coors, context_draw) {
                         context_draw.lineTo(ptEnd[0].x, ptEnd[0].y);
                         context_draw.lineTo(ptEnd[0].x, ptEnd[0].y);
                         context_draw.closePath();
                         context_draw.closePath();
                     } else {
                     } else {
-                        /*context_draw.globalCompositeOperation = 'destination-out';
+                        context_draw.globalCompositeOperation = 'destination-out';
                         context_draw.moveTo(ptStart[1].x, ptStart[1].y);
                         context_draw.moveTo(ptStart[1].x, ptStart[1].y);
                         context_draw.lineTo(ptStart[2].x, ptStart[2].y);
                         context_draw.lineTo(ptStart[2].x, ptStart[2].y);
                         context_draw.lineTo(ptEnd[3].x, ptEnd[3].y);
                         context_draw.lineTo(ptEnd[3].x, ptEnd[3].y);
@@ -236,7 +236,7 @@ function drawMove(coors, context_draw) {
                         context_draw.fill();				
                         context_draw.fill();				
                         context_draw.globalCompositeOperation = 'lighter';
                         context_draw.globalCompositeOperation = 'lighter';
                         context_draw.closePath();
                         context_draw.closePath();
-                        context_draw.beginPath();*/
+                        context_draw.beginPath();
 
 
                         // 左に描画する場合
                         // 左に描画する場合
                         context_draw.moveTo(ptStart[1].x, ptStart[1].y);
                         context_draw.moveTo(ptStart[1].x, ptStart[1].y);
@@ -247,7 +247,7 @@ function drawMove(coors, context_draw) {
                     }
                     }
                 } else if (sx < coors.x) {
                 } else if (sx < coors.x) {
                     if (sy > coors.y) {
                     if (sy > coors.y) {
-                        /*context_draw.globalCompositeOperation = 'destination-out';
+                        context_draw.globalCompositeOperation = 'destination-out';
                         context_draw.moveTo(ptStart[2].x, ptStart[2].y);
                         context_draw.moveTo(ptStart[2].x, ptStart[2].y);
                         context_draw.lineTo(ptStart[3].x, ptStart[3].y);
                         context_draw.lineTo(ptStart[3].x, ptStart[3].y);
                         context_draw.lineTo(ptStart[0].x, ptStart[0].y);
                         context_draw.lineTo(ptStart[0].x, ptStart[0].y);
@@ -260,7 +260,7 @@ function drawMove(coors, context_draw) {
                         context_draw.fill();				
                         context_draw.fill();				
                         context_draw.globalCompositeOperation = 'lighter';								
                         context_draw.globalCompositeOperation = 'lighter';								
                         context_draw.closePath();
                         context_draw.closePath();
-                        context_draw.beginPath();*/
+                        context_draw.beginPath();
 
 
                         // 右上に描画する場合
                         // 右上に描画する場合
                         context_draw.moveTo(ptStart[2].x, ptStart[2].y);
                         context_draw.moveTo(ptStart[2].x, ptStart[2].y);
@@ -271,7 +271,7 @@ function drawMove(coors, context_draw) {
                         context_draw.lineTo(ptEnd[2].x, ptEnd[2].y);
                         context_draw.lineTo(ptEnd[2].x, ptEnd[2].y);
                         context_draw.closePath();
                         context_draw.closePath();
                     } else if (sy < coors.y) {
                     } else if (sy < coors.y) {
-                        /*context_draw.globalCompositeOperation = 'destination-out';
+                        context_draw.globalCompositeOperation = 'destination-out';
                         context_draw.moveTo(ptStart[3].x, ptStart[3].y);
                         context_draw.moveTo(ptStart[3].x, ptStart[3].y);
                         context_draw.lineTo(ptStart[0].x, ptStart[0].y);
                         context_draw.lineTo(ptStart[0].x, ptStart[0].y);
                         context_draw.lineTo(ptStart[1].x, ptStart[1].y);
                         context_draw.lineTo(ptStart[1].x, ptStart[1].y);
@@ -284,7 +284,7 @@ function drawMove(coors, context_draw) {
                         context_draw.fill();				
                         context_draw.fill();				
                         context_draw.globalCompositeOperation = 'lighter';
                         context_draw.globalCompositeOperation = 'lighter';
                         context_draw.closePath();
                         context_draw.closePath();
-                        context_draw.beginPath();*/
+                        context_draw.beginPath();
 
 
                         // 右下に描画する場合
                         // 右下に描画する場合
                         context_draw.moveTo(ptStart[3].x, ptStart[3].y);
                         context_draw.moveTo(ptStart[3].x, ptStart[3].y);
@@ -295,7 +295,7 @@ function drawMove(coors, context_draw) {
                         context_draw.lineTo(ptEnd[3].x, ptEnd[3].y);
                         context_draw.lineTo(ptEnd[3].x, ptEnd[3].y);
                         context_draw.closePath();
                         context_draw.closePath();
                     } else {
                     } else {
-                        /*context_draw.globalCompositeOperation = 'destination-out';
+                        context_draw.globalCompositeOperation = 'destination-out';
                         context_draw.moveTo(ptStart[3].x, ptStart[3].y);
                         context_draw.moveTo(ptStart[3].x, ptStart[3].y);
                         context_draw.lineTo(ptStart[0].x, ptStart[0].y);
                         context_draw.lineTo(ptStart[0].x, ptStart[0].y);
                         context_draw.lineTo(ptEnd[1].x, ptEnd[1].y);
                         context_draw.lineTo(ptEnd[1].x, ptEnd[1].y);
@@ -306,7 +306,7 @@ function drawMove(coors, context_draw) {
                         context_draw.fill();				
                         context_draw.fill();				
                         context_draw.globalCompositeOperation = 'lighter';
                         context_draw.globalCompositeOperation = 'lighter';
                         context_draw.closePath();
                         context_draw.closePath();
-                        context_draw.beginPath();*/
+                        context_draw.beginPath();
 
 
                         // 右に描画する場合
                         // 右に描画する場合
                         context_draw.moveTo(ptStart[3].x, ptStart[3].y);
                         context_draw.moveTo(ptStart[3].x, ptStart[3].y);
@@ -317,7 +317,7 @@ function drawMove(coors, context_draw) {
                     }
                     }
                 } else {
                 } else {
                     if (sy > coors.y) {
                     if (sy > coors.y) {
-                       /* context_draw.globalCompositeOperation = 'destination-out';
+                        context_draw.globalCompositeOperation = 'destination-out';
                         context_draw.moveTo(ptStart[2].x, ptStart[2].y);
                         context_draw.moveTo(ptStart[2].x, ptStart[2].y);
                         context_draw.lineTo(ptStart[3].x, ptStart[3].y);
                         context_draw.lineTo(ptStart[3].x, ptStart[3].y);
                         context_draw.lineTo(ptEnd[0].x, ptEnd[0].y);
                         context_draw.lineTo(ptEnd[0].x, ptEnd[0].y);
@@ -328,7 +328,7 @@ function drawMove(coors, context_draw) {
                         context_draw.fill();				
                         context_draw.fill();				
                         context_draw.globalCompositeOperation = 'lighter';
                         context_draw.globalCompositeOperation = 'lighter';
                         context_draw.closePath();
                         context_draw.closePath();
-                        context_draw.beginPath();*/
+                        context_draw.beginPath();
 
 
                         // 上に描画する場合
                         // 上に描画する場合
                         context_draw.moveTo(ptStart[2].x, ptStart[2].y);
                         context_draw.moveTo(ptStart[2].x, ptStart[2].y);
@@ -337,7 +337,7 @@ function drawMove(coors, context_draw) {
                         context_draw.lineTo(ptEnd[1].x, ptEnd[1].y);
                         context_draw.lineTo(ptEnd[1].x, ptEnd[1].y);
                         context_draw.closePath();
                         context_draw.closePath();
                     } else if (sy < coors.y) {
                     } else if (sy < coors.y) {
-                        /*context_draw.globalCompositeOperation = 'destination-out';
+                        context_draw.globalCompositeOperation = 'destination-out';
                         context_draw.moveTo(ptStart[0].x, ptStart[0].y);
                         context_draw.moveTo(ptStart[0].x, ptStart[0].y);
                         context_draw.lineTo(ptStart[1].x, ptStart[1].y);
                         context_draw.lineTo(ptStart[1].x, ptStart[1].y);
                         context_draw.lineTo(ptEnd[2].x, ptEnd[2].y);
                         context_draw.lineTo(ptEnd[2].x, ptEnd[2].y);
@@ -348,7 +348,7 @@ function drawMove(coors, context_draw) {
                         context_draw.fill();				
                         context_draw.fill();				
                         context_draw.globalCompositeOperation = 'lighter';
                         context_draw.globalCompositeOperation = 'lighter';
                         context_draw.closePath();
                         context_draw.closePath();
-                        context_draw.beginPath();*/
+                        context_draw.beginPath();
 
 
                         // 下に描画する場合
                         // 下に描画する場合
                         context_draw.moveTo(ptStart[0].x, ptStart[0].y);
                         context_draw.moveTo(ptStart[0].x, ptStart[0].y);
@@ -357,7 +357,7 @@ function drawMove(coors, context_draw) {
                         context_draw.lineTo(ptEnd[3].x, ptEnd[3].y);
                         context_draw.lineTo(ptEnd[3].x, ptEnd[3].y);
                         context_draw.closePath();
                         context_draw.closePath();
                     } else {
                     } else {
-                        /*context_draw.globalCompositeOperation = 'destination-out';
+                        context_draw.globalCompositeOperation = 'destination-out';
                         context_draw.moveTo(ptStart[0].x, ptStart[0].y);
                         context_draw.moveTo(ptStart[0].x, ptStart[0].y);
                         context_draw.lineTo(ptStart[1].x, ptStart[1].y);
                         context_draw.lineTo(ptStart[1].x, ptStart[1].y);
                         context_draw.lineTo(ptStart[2].x, ptStart[2].y);
                         context_draw.lineTo(ptStart[2].x, ptStart[2].y);
@@ -368,7 +368,7 @@ function drawMove(coors, context_draw) {
                         context_draw.fill();				
                         context_draw.fill();				
                         context_draw.globalCompositeOperation = 'lighter';
                         context_draw.globalCompositeOperation = 'lighter';
                         context_draw.closePath();
                         context_draw.closePath();
-                        context_draw.beginPath();*/
+                        context_draw.beginPath();
 
 
                         // 移動なしの場合
                         // 移動なしの場合
                         context_draw.moveTo(ptStart[0].x, ptStart[0].y);
                         context_draw.moveTo(ptStart[0].x, ptStart[0].y);
@@ -380,7 +380,7 @@ function drawMove(coors, context_draw) {
                 }
                 }
                 context_draw.lineJoin = 'bevel';
                 context_draw.lineJoin = 'bevel';
                 context_draw.lineCap = 'butt';
                 context_draw.lineCap = 'butt';
-                context_draw.globalAlpha = 0.2;   // Opacity 20%
+                context_draw.globalAlpha = 0.4;   // Opacity 20%
                 context_draw.fillStyle = "#" + makerColor;
                 context_draw.fillStyle = "#" + makerColor;
                 context_draw.fill();
                 context_draw.fill();
 
 
@@ -434,19 +434,19 @@ function drawPoint(coors, context_draw) {
             /* set flag */
             /* set flag */
             isDrawing = true;
             isDrawing = true;
 
 
-            /*context_draw.globalCompositeOperation = 'destination-out';
+            context_draw.globalCompositeOperation = 'destination-out';
             context_draw.lineWidth = makerSize ;
             context_draw.lineWidth = makerSize ;
             context_draw.lineHeight = makerSize;
             context_draw.lineHeight = makerSize;
             context_draw.lineTo(coors.x , coors.y + 0.001);		
             context_draw.lineTo(coors.x , coors.y + 0.001);		
             context_draw.lineCap = 'square';
             context_draw.lineCap = 'square';
             context_draw.strokeStyle = "#" + makerColor;
             context_draw.strokeStyle = "#" + makerColor;
             context_draw.stroke();				
             context_draw.stroke();				
-            context_draw.globalCompositeOperation = 'lighter';*/
+            context_draw.globalCompositeOperation = 'lighter';
 
 
             context_draw.lineCap = "square";
             context_draw.lineCap = "square";
             context_draw.lineWidth = makerSize;
             context_draw.lineWidth = makerSize;
             context_draw.lineHeight = makerSize;
             context_draw.lineHeight = makerSize;
-            context_draw.globalAlpha = 0.2;
+            context_draw.globalAlpha = 0.4;
             context_draw.strokeStyle = "#" + makerColor;
             context_draw.strokeStyle = "#" + makerColor;
             context_draw.lineTo(coors.x, coors.y + 0.001);
             context_draw.lineTo(coors.x, coors.y + 0.001);
             context_draw.stroke();
             context_draw.stroke();

abvw/js/contentview_Pen.js

@@ -30,10 +30,10 @@ function ShowPen(targetId) {
 	 '<div id="panel-pen" class="rayermenu1">'
 	 '<div id="panel-pen" class="rayermenu1">'
 	+'	<div id="panel-pen-size">'
 	+'	<div id="panel-pen-size">'
 	+'		<span lang="txtMkgSize" class="lang" >太いさ</span>'
 	+'		<span lang="txtMkgSize" class="lang" >太いさ</span>'
-	+'		<input type="radio" id="pen-size-small" name="pen-size" /><span id="pen-small-text" class="lang" lang="txtMkgS">S</span>'
-	+'		<input type="radio" id="pen-size-medium" name="pen-size" /><span id="pen-medium-text" class="lang" lang="txtMkgM">M</span>'
-	+'		<input type="radio" id="pen-size-large" name="pen-size" /><span id="pen-large-text" class="lang" lang="txtMkgB">L</span>'
-	+'		<input type="radio" id="pen-size-oversize" name="pen-size" /><span id="pen-oversize-text" class="lang" lang="txtMkgSB">XL</span>'
+	+ '		<input type="radio" id="pen-size-small" name="pen-size" /><label for="pen-size-small" id="pen-small-text" class="lang" lang="txtMkgS">S</label>'
+	+ '		<input type="radio" id="pen-size-medium" name="pen-size" /><label for="pen-size-medium" id="pen-medium-text" class="lang" lang="txtMkgM">M</label>'
+	+ '		<input type="radio" id="pen-size-large" name="pen-size" /><label for="pen-size-large" id="pen-large-text" class="lang" lang="txtMkgB">L</label>'
+	+ '		<input type="radio" id="pen-size-oversize" name="pen-size" /><label for="pen-size-oversize" id="pen-oversize-text" class="lang" lang="txtMkgSB">XL</label>'
 	+'	</div>'
 	+'	</div>'
 	+'	<span class="lang" lang="txtColor" style="float:left;margin-right: 10px;">Color</span>'
 	+'	<span class="lang" lang="txtColor" style="float:left;margin-right: 10px;">Color</span>'
 	+'	<div id="penColorPreview"></div>'
 	+'	<div id="penColorPreview"></div>'
@@ -64,6 +64,8 @@ function ShowPen(targetId) {
 	//pen_targetDiv.draggable({ containment: "#Pen_btnOk", scroll: false });
 	//pen_targetDiv.draggable({ containment: "#Pen_btnOk", scroll: false });
 	pen_targetDiv.draggable({ revert: false});
 	pen_targetDiv.draggable({ revert: false});
 	Pen_handleColorPickerEvent();
 	Pen_handleColorPickerEvent();
+			
+	$('#dlgPen').center();		
 }
 }
 
 
 function touchStart_BtnOk_Pen(e){
 function touchStart_BtnOk_Pen(e){
@@ -321,6 +323,11 @@ function Pen_dspOK_click() {
 	});*/
 	});*/
 	pen_targetDiv.hide();
 	pen_targetDiv.hide();
 	
 	
+	/* unlock dialog overlay */
+	$("#overlay").hide();
+	
+	$('#dlgMarking_imgPenOption').removeClass();
+	$('#dlgMarking_imgPenOption').addClass('pen_option_hover');
 }
 }
 
 
 // Event of button cancel
 // Event of button cancel
@@ -336,6 +343,12 @@ function Pen_dspCancel_click() {
     });*/
     });*/
    
    
     pen_targetDiv.hide();
     pen_targetDiv.hide();
+    
+    /* unlock dialog overlay */
+	$("#overlay").hide();
+	
+	$('#dlgMarking_imgPenOption').removeClass();
+	$('#dlgMarking_imgPenOption').addClass('pen_option_hover');
   
   
 }
 }
 
 

abvw/js/home.js

@@ -273,7 +273,9 @@ function canvasClickFunction(e) {
 	ClientData.contentInfo_contentId(outputId);
 	ClientData.contentInfo_contentId(outputId);
 
 
 	//Check Display mode to handle action
 	//Check Display mode to handle action
-	if(ClientData.sortOpt_viewMode() == Consts.ConstDisplayMode_List){
+	
+	if (isShowBookShelf != null){
+		if(!isShowBookShelf){
 		
 		
 		//Store Content id that user has read
 		//Store Content id that user has read
 		if(ClientData.ReadingContentIds().length > 0){
 		if(ClientData.ReadingContentIds().length > 0){
@@ -366,10 +368,106 @@ function canvasClickFunction(e) {
 		//Go to Conten view page
 		//Go to Conten view page
 		avwScreenMove(ScreenIds.ContentView);
 		avwScreenMove(ScreenIds.ContentView);
 	}	
 	}	
+	}else{
+		if(ClientData.sortOpt_viewMode() == Consts.ConstDisplayMode_List){
+		
+		//Store Content id that user has read
+		if(ClientData.ReadingContentIds().length > 0){
+			contentIdArray = ClientData.ReadingContentIds();
+			
+			for(var nIndex = 0; nIndex < contentIdArray.length; nIndex++){
+				if(contentIdArray[nIndex].contentid == outputId){
+					checkflag = true;
+					break;
+				}
+				else{
+					checkflag = false;
+				}			
+			}
+			
+			if(!checkflag){
+				contentIdArray.push({contentid: outputId, viewdate: '', originviewdate: ''});
+			}
+		}
+		else{
+			contentIdArray.push({contentid: outputId, viewdate: '', originviewdate: ''});
+		}
+				
+		//Renew ReadingContentID
+		var newArray = [];
+		ClientData.ReadingContentIds(newArray);
+		
+		//Set data for readingcontentid
+		ClientData.ReadingContentIds(contentIdArray);
+		
+		//Set ResouceVersion for content
+		setResourceVersionData(outputId);
+		
+		//Set MetaVersion for content
+		setMetaVersionData(outputId);
+					
+		//Close Submenu
+		$('#dlgSubMenu').hide();
+		
+		//Delete 'new' icon
+		drawEditImage(outputId);
+
+		//Open content Detail
+		openContentDetail();
+	}
+	else{
+		
+		//Store Content id that user has read
+		if(ClientData.ReadingContentIds().length > 0){
+			contentIdArray = ClientData.ReadingContentIds();
+			
+			for(var nIndex = 0; nIndex < contentIdArray.length; nIndex++){
+				if(contentIdArray[nIndex].contentid == outputId){
+					checkflag = true;
+					if(contentIdArray[nIndex].viewdate == null || contentIdArray[nIndex].viewdate == 'undefined' || contentIdArray[nIndex].viewdate == ''){
+						contentIdArray[nIndex].viewdate = outputDate;
+						contentIdArray[nIndex].originviewdate = date;
+					}
+					break;
+				}
+				else{
+					checkflag = false;
+				}			
+			}
+			
+			if(!checkflag){
+				contentIdArray.push({contentid: outputId, viewdate: outputDate, originviewdate: date});
+			}
+		}
+		else{
+			contentIdArray.push({contentid: outputId, viewdate: outputDate, originviewdate: date});
+		}
+		
+		//Renew ReadingContentID
+		var newArray = [];
+		ClientData.ReadingContentIds(newArray);
+		
+		//Set data for readingcontentid
+		ClientData.ReadingContentIds(contentIdArray);
+		
+		//Set ResouceVersion for content
+		setResourceVersionData(outputId);
+		
+		//Set MetaVersion for content
+		setMetaVersionData(outputId);
+
+		//$('body,html').animate({ scrollTop: 0 }, 0);
+		ClientData.IsRefresh(false);
+		
+		//Go to Conten view page
+		avwScreenMove(ScreenIds.ContentView);
+	}	
+	}
+			
 }
 }
 
 
 //function Open SubMenu Dialog
 //function Open SubMenu Dialog
-function openSubMenuDialogFunction(e){
+function openSubMenuDialogFunction(e){	
     if (e) {
     if (e) {
         e.preventDefault();
         e.preventDefault();
     }
     }
@@ -382,7 +480,8 @@ function openSubMenuDialogFunction(e){
 	var array = [e.clientX, e.clientY];
 	var array = [e.clientX, e.clientY];
 	var contentid = $(this).attr('contentid');
 	var contentid = $(this).attr('contentid');
 	
 	
-	if(ClientData.sortOpt_viewMode() == Consts.ConstDisplayMode_List){	
+	if (isShowBookShelf != null){
+		if(!isShowBookShelf){				
 		// Get image of selected image
 		// Get image of selected image
 		var base64String = returnThumbnail(contentid);
 		var base64String = returnThumbnail(contentid);
 		ClientData.contentInfo_contentThumbnail(base64String);
 		ClientData.contentInfo_contentThumbnail(base64String);
@@ -432,7 +531,18 @@ function openSubMenuDialogFunction(e){
 		openContentDetail();
 		openContentDetail();
  
  
 	}
 	}
-	else if(ClientData.sortOpt_viewMode() == Consts.ConstDisplayMode_BookShelf){
+	else if(isShowBookShelf){			
+		$('#dialog-read').attr('contentid',contentid);
+		$('#dialog-detail').attr('contentid',contentid);
+		//$("#dlgSubMenu").dialog({position: array, width: 130, height: 90});
+		$("#dlgSubMenu").show();
+		$("#dlgSubMenu").position({ my: "left bottom",
+		    at: "left-10 top",
+		    of: this,
+		    collision: "fit"
+		});
+	}
+	else{			
 		$('#dialog-read').attr('contentid',contentid);
 		$('#dialog-read').attr('contentid',contentid);
 		$('#dialog-detail').attr('contentid',contentid);
 		$('#dialog-detail').attr('contentid',contentid);
 		//$("#dlgSubMenu").dialog({position: array, width: 130, height: 90});
 		//$("#dlgSubMenu").dialog({position: array, width: 130, height: 90});
@@ -442,8 +552,71 @@ function openSubMenuDialogFunction(e){
 		    of: this,
 		    of: this,
 		    collision: "fit"
 		    collision: "fit"
 		});
 		});
+	}	
 	}
 	}
 	else{
 	else{
+		if(ClientData.sortOpt_viewMode() == Consts.ConstDisplayMode_List){			
+		// Get image of selected image
+		var base64String = returnThumbnail(contentid);
+		ClientData.contentInfo_contentThumbnail(base64String);
+		ClientData.contentInfo_contentId(contentid);
+
+		//Store Content id that user has read
+		if(ClientData.ReadingContentIds().length > 0){
+			contentIdArray = ClientData.ReadingContentIds();
+			
+			for(var nIndex = 0; nIndex < contentIdArray.length; nIndex++){
+				if(contentIdArray[nIndex].contentid == contentid){
+					checkflag = true;
+					break;
+				}
+				else{
+					checkflag = false;
+				}			
+			}
+			
+			if(!checkflag){
+				contentIdArray.push({contentid: contentid, viewdate: '', originviewdate: ''});
+			}
+		}
+		else{
+			contentIdArray.push({contentid: contentid, viewdate: '', originviewdate: ''});
+		}
+				
+		//Renew ReadingContentID
+		var newArray = [];
+		ClientData.ReadingContentIds(newArray);
+		
+		//Set data for readingcontentid
+		ClientData.ReadingContentIds(contentIdArray);
+		
+		//Set ResouceVersion for content
+		setResourceVersionData(contentid);
+		
+		//Set MetaVersion for content
+		setMetaVersionData(contentid);
+					
+		//Close Submenu
+		$('#dlgSubMenu').hide();
+		
+		//Delete 'new' icon
+		drawEditImage(contentid);
+		
+		openContentDetail();
+ 
+	}
+	else if(ClientData.sortOpt_viewMode() == Consts.ConstDisplayMode_BookShelf){				
+		$('#dialog-read').attr('contentid',contentid);
+		$('#dialog-detail').attr('contentid',contentid);
+		//$("#dlgSubMenu").dialog({position: array, width: 130, height: 90});
+		$("#dlgSubMenu").show();
+		$("#dlgSubMenu").position({ my: "left bottom",
+		    at: "left-10 top",
+		    of: this,
+		    collision: "fit"
+		});
+	}
+	else{				
 		$('#dialog-read').attr('contentid',contentid);
 		$('#dialog-read').attr('contentid',contentid);
 		$('#dialog-detail').attr('contentid',contentid);
 		$('#dialog-detail').attr('contentid',contentid);
 		//$("#dlgSubMenu").dialog({position: array, width: 130, height: 90});
 		//$("#dlgSubMenu").dialog({position: array, width: 130, height: 90});
@@ -454,6 +627,7 @@ function openSubMenuDialogFunction(e){
 		    collision: "fit"
 		    collision: "fit"
 		});
 		});
 	}	
 	}	
+	}		
 }
 }
 
 
 //Genre Click Function
 //Genre Click Function

abvw/js/login.js

@@ -79,7 +79,8 @@ function saveLoginInfo() {
 
 
     ClientData.userInfo_lastLoginTime(date.jpDateTimeString());
     ClientData.userInfo_lastLoginTime(date.jpDateTimeString());
 	ClientData.requirePasswordChange(requirePasswordChange);
 	ClientData.requirePasswordChange(requirePasswordChange);
-	ClientData.userInfo_sid(userinfo_sid);
+	//ClientData.userInfo_sid(userinfo_sid);
+	ClientData.userInfo_sid_local(userinfo_sid);
 	saveServiceUserOption();
 	saveServiceUserOption();
 	
 	
 }
 }
@@ -230,9 +231,7 @@ function processLogin() {
             $('#main-error-message').css('display', 'none');
             $('#main-error-message').css('display', 'none');
 
 
             if (data.requirePasswordChange == 0) {
             if (data.requirePasswordChange == 0) {
-                //saveLoginInfo();
-
-                //window.location = "abvw/" + ScreenIds.Home;
+                ClientData.userInfo_sid(ClientData.userInfo_sid_local());
                 avwScreenMove("abvw/" + ScreenIds.Home);
                 avwScreenMove("abvw/" + ScreenIds.Home);
             }
             }
             else if (data.requirePasswordChange == 1) {
             else if (data.requirePasswordChange == 1) {
@@ -259,8 +258,7 @@ function processLogin() {
                         var skpPwdDt = new Date(skipPwdDate);
                         var skpPwdDt = new Date(skipPwdDate);
                         var numDay = date.subtractByDays(skpPwdDt);
                         var numDay = date.subtractByDays(skpPwdDt);
                         if (numDay <= 30) {
                         if (numDay <= 30) {
-                            //saveLoginInfo();
-                            //window.location = "abvw/" + ScreenIds.Home;
+                            ClientData.userInfo_sid(ClientData.userInfo_sid_local());
                             avwScreenMove("abvw/" + ScreenIds.Home);
                             avwScreenMove("abvw/" + ScreenIds.Home);
                         }
                         }
                         else if (numDay > 30) {
                         else if (numDay > 30) {
@@ -271,8 +269,7 @@ function processLogin() {
                     }
                     }
                 }
                 }
                 else {  // no need to change password
                 else {  // no need to change password
-                    //saveLoginInfo();
-                    //window.location = "abvw/" + ScreenIds.Home;
+                    ClientData.userInfo_sid(ClientData.userInfo_sid_local());
                     avwScreenMove("abvw/" + ScreenIds.Home);
                     avwScreenMove("abvw/" + ScreenIds.Home);
                 }
                 }
             }
             }
@@ -293,8 +290,7 @@ function processLogin() {
                         var numDay = date.subtractByDays(skpPwdDt);
                         var numDay = date.subtractByDays(skpPwdDt);
 
 
                         if (numDay <= 30) {
                         if (numDay <= 30) {
-                            //saveLoginInfo();
-                            //window.location = "abvw/" + ScreenIds.Home;
+                            ClientData.userInfo_sid(ClientData.userInfo_sid_local());
                             avwScreenMove("abvw/" + ScreenIds.Home);
                             avwScreenMove("abvw/" + ScreenIds.Home);
                         }
                         }
                         else if (numDay > 30) {
                         else if (numDay > 30) {
@@ -309,8 +305,7 @@ function processLogin() {
                     $("#txtPwdRemind").css('visibility', 'hidden');
                     $("#txtPwdRemind").css('visibility', 'hidden');
                 }
                 }
                 else {  // No need to change password
                 else {  // No need to change password
-                    //saveLoginInfo();
-                    //window.location = "abvw/" + ScreenIds.Home;
+                    ClientData.userInfo_sid(ClientData.userInfo_sid_local());
                     avwScreenMove("abvw/" + ScreenIds.Home);
                     avwScreenMove("abvw/" + ScreenIds.Home);
                 }
                 }
             }
             }
@@ -348,7 +343,8 @@ function processLogin() {
 //Change Password Process
 //Change Password Process
 function changePasswordProcess(){
 function changePasswordProcess(){
 	var accountPath = $('#txtAccPath').val();
 	var accountPath = $('#txtAccPath').val();
-	var sid = ClientData.userInfo_sid();
+	//var sid = ClientData.userInfo_sid();
+	var sid = ClientData.userInfo_sid_local();
 	var loginId = $('#txtAccId').val();
 	var loginId = $('#txtAccId').val();
 	var password = $('#txtCurrentPass').val();
 	var password = $('#txtCurrentPass').val();
 	var confirmPass = $('#txtConfirmNew').val();
 	var confirmPass = $('#txtConfirmNew').val();
@@ -366,8 +362,7 @@ function changePasswordProcess(){
         if (result == 'success') {
         if (result == 'success') {
             $('#dialog-error-message').css('display', 'none');
             $('#dialog-error-message').css('display', 'none');
             CloseChangePasswordDialog();
             CloseChangePasswordDialog();
-            //saveLoginInfo();
-            //window.location = "abvw/" + ScreenIds.Home;
+            ClientData.userInfo_sid(ClientData.userInfo_sid_local());
             avwScreenMove("abvw/" + ScreenIds.Home);
             avwScreenMove("abvw/" + ScreenIds.Home);
         }
         }
         else {
         else {
@@ -415,7 +410,6 @@ function changeLanguageEn(){
 //Login click function
 //Login click function
 function loginFunction(){
 function loginFunction(){
 	if (checkValidation()) {
 	if (checkValidation()) {
-        //saveLoginInfo();
         processLogin();
         processLogin();
     }
     }
 }
 }
@@ -431,10 +425,9 @@ function changePassFunction(){
 function skipPassFunction(){
 function skipPassFunction(){
 	var date = new Date();
 	var date = new Date();
 	
 	
-	//saveLoginInfo();
-
 	ClientData.userInfo_pwdSkipDt(date);
 	ClientData.userInfo_pwdSkipDt(date);
 	//window.location = "abvw/" + ScreenIds.Home;
 	//window.location = "abvw/" + ScreenIds.Home;
+	ClientData.userInfo_sid(ClientData.userInfo_sid_local());
     avwScreenMove("abvw/" + ScreenIds.Home);
     avwScreenMove("abvw/" + ScreenIds.Home);
 	
 	
 }
 }