/// コンテンツ閲覧画面_マーキングツールバーオーバーレイ /// =============================================================================================== /// Marking group [start] /// =============================================================================================== //名前空間用のオブジェクトを用意する var CONTENTVIEW_MARKING = {}; // Set default value for easer. CONTENTVIEW_MARKING.Marking_SetDefaultValue = function() { }; /* ---------------------------------------------------------------------------- Event groups [start] ---------------------------------------------------------------------------- */ CONTENTVIEW_MARKING.dlgMarking_dspSave_click = function() { CONTENTVIEW_GENERAL.imgMarkerTemp = CONTENTVIEW_GENERAL.canvas_marker.toDataURL("image/png;"); var img = new Image(); img.onload = function () { //TRB00098 CONTENTVIEW_GENERAL.context_draw.drawImage(img, 0, 0, CONTENTVIEW_GENERAL.canvas_draw.width, CONTENTVIEW_GENERAL.canvas_draw.height); //TRB00098 //START TRB00098 var saveImg = new Image(); var saveImgUrl = CONTENTVIEW_GENERAL.canvas_draw.toDataURL("image/png"); saveImg.onload = function(){ /*create new entity marking */ var marking = new MarkingEntity(); marking.contentid = CONTENTVIEW_GENERAL.contentID; if(CONTENTVIEW_GENERAL.contentType == COMMON.ContentTypeKeys.Type_Image){ marking.pageNo = 1; }else{ marking.pageNo = CONTENTVIEW.changePageIndex(CONTENTVIEW_GETDATA.getPageIndex()); } var saveCanvas = document.createElement('canvas'); //#11478 //saveCanvas.width = CONTENTVIEW_GENERAL.canvas_offscreen.width; //saveCanvas.height = CONTENTVIEW_GENERAL.canvas_offscreen.height; saveCanvas.width = CONTENTVIEW_GENERAL.widthEachPageApi; saveCanvas.height = CONTENTVIEW_GENERAL.heightEachPageApi; var saveContext = saveCanvas.getContext('2d'); saveContext.drawImage(saveImg, 0, 0, saveCanvas.width, saveCanvas.height); marking.content = saveCanvas.toDataURL("image/png"); //END TRB00098 //=== Start Function : No.17 Editor : Long Date: 07/30/2013 Summary : Set UTC time and UUID when create new marking/maker. marking.markingid = COMMON.getUUID(); marking.registerDate = new Date(); //=== End Function : No.17 Editor : Long Date: 07/30/2013 Summary : Set UTC time and UUID when create new marking/maker. /* insert marking */ var arr = ClientData.MarkingData(); var nIndexMarking = -1; for (var nIndex = 0; nIndex < arr.length; nIndex++) { if (arr[nIndex].contentid == CONTENTVIEW_GENERAL.contentID && arr[nIndex].pageNo == CONTENTVIEW.changePageIndex(CONTENTVIEW_GETDATA.getPageIndex())) { nIndexMarking = nIndex; break; } } if (CONTENTVIEW_GENERAL.isDrawing == true) {/* if has draw image */ if (CONTENTVIEW_GENERAL.isClearDrawing == true) { arr.splice(nIndexMarking, 1); } else { /* case not exist marking */ if (nIndexMarking == -1) { arr.push(marking); } else { /* case exist marking */ //=== Start Function : No.17 Editor : Long Date: 07/30/2013 Summary : Set UTC time when edit marking/maker. var editedMarkingEntity = arr[nIndexMarking]; //#11478 //editedMarkingEntity.content = CONTENTVIEW_GENERAL.canvas_draw.toDataURL("image/png"); editedMarkingEntity.content = marking.content; editedMarkingEntity.registerDate = new Date(); arr[nIndexMarking] = editedMarkingEntity; //arr[nIndexMarking] = marking; //=== End Function : No.17 Editor : Long Date: 07/30/2013 Summary : Set UTC time when edit marking/maker. } } } /*add marking to local storage */ ClientData.MarkingData(arr); // Close dialog //$("#dlgMarking").dialog('close'); $("#dlgMarking").hide(); ClientData.IsAddingMarking(false); $('#draw_canvas').css('display', 'none'); /*set flag change marking */ ClientData.isChangedMarkingData(true); ClientData.IsHideToolbar(false); /* draw again*/ //CONTENTVIEW.drawCanvas(); //CONTENTVIEW_GENERAL.disableAllControl(); CONTENTVIEW.handleDisplayToolbar(); /* visible button fullscreen */ //$('#control_screen_2').show(); /* init clear drawing canvas */ CONTENTVIEW_GENERAL.isClearDrawing = false; }; saveImg.src = saveImgUrl; }; img.src = CONTENTVIEW_GENERAL.imgMarkerTemp; CONTENTVIEW_GENERAL.context_marker.clearRect(0, 0, CONTENTVIEW_GENERAL.canvas_marker.width, CONTENTVIEW_GENERAL.canvas_marker.height); $('#marker_canvas').css('display','none'); }; CONTENTVIEW_MARKING.dlgMarking_dspCancel_click = function() { // Close dialog $("#dlgMarking").hide(); /* init clear drawing canvas */ CONTENTVIEW_GENERAL.isClearDrawing = false; ClientData.IsAddingMarking(false); $('#draw_canvas').css('display','none'); /*$('#imgmarkingtoolbar').removeClass('markingToolbar'); $('#imgmarkingtoolbar').addClass('markingToolbar_off'); $("#imgmarkingtoolbar").removeAttr("style")*/ ClientData.IsHideToolbar(false); CONTENTVIEW_GENERAL.context_draw.clearRect(0, 0, CONTENTVIEW_GENERAL.canvas_draw.width, CONTENTVIEW_GENERAL.canvas_draw.height); /* draw again*/ //CONTENTVIEW.drawCanvas(); //CONTENTVIEW_GENERAL.disableAllControl(); CONTENTVIEW.handleDisplayToolbar(); /* visible button fullscreen */ //$('#control_screen_2').show(); $('#marker_canvas').css('display','none'); }; CONTENTVIEW_MARKING.dlgMarking_dspPgClear_click = function() { // Close dialog CONTENTVIEW_GENERAL.context_draw.clearRect(0, 0, CONTENTVIEW_GENERAL.canvas_draw.width, CONTENTVIEW_GENERAL.canvas_draw.height); CONTENTVIEW_GENERAL.context_marker.clearRect(0, 0, CONTENTVIEW_GENERAL.canvas_marker.width, CONTENTVIEW_GENERAL.canvas_marker.height); CONTENTVIEW_GENERAL.isClearDrawing = true; /* clear on local */ var arr = ClientData.MarkingData(); }; /* draw marker canvas to draw canvas */ CONTENTVIEW_MARKING.canvasMarkerToCanvasDraw = function(){ CONTENTVIEW_GENERAL.imgMarkerTemp = CONTENTVIEW_GENERAL.canvas_marker.toDataURL("image/png;"); var img = new Image(); img.onload = function () { CONTENTVIEW_GENERAL.context_draw.drawImage(img, 0, 0, CONTENTVIEW_GENERAL.canvas_draw.width, CONTENTVIEW_GENERAL.canvas_draw.height); }; img.src = CONTENTVIEW_GENERAL.imgMarkerTemp; CONTENTVIEW_GENERAL.context_marker.clearRect(0, 0, CONTENTVIEW_GENERAL.canvas_marker.width, CONTENTVIEW_GENERAL.canvas_marker.height); $('#marker_canvas').css('display','none'); }; CONTENTVIEW_MARKING.dlgMarking_imgPen_click = function() { // Choose pen $("#dlgMarking_imgMaker").removeClass(); $("#dlgMarking_imgPen").addClass('toolbar_icon_on'); $("#dlgMarking_imgEraser").removeClass(); ClientData.MarkingType("pen"); CONTENTVIEW_GENERAL.markingType = "pen"; CONTENTVIEW_MARKING.canvasMarkerToCanvasDraw(); CONTENTVIEW_MARKING.setDefaultImageForMarking(); }; CONTENTVIEW_MARKING.dlgMarking_imgPenOption_click = function() { /*disable button */ CONTENTVIEW_MARKING.disableButtonMarking(); //ClientData.IsAddingMarking(false); /* display dialog overlay */ $("#overlay").show(); CONTENTVIEW_GENERAL.isAddingMarking = ClientData.IsAddingMarking(); // Show option of pen CONTENTVIEW_PEN.ShowPen($('#dlgPen')); /* draw maker canvas */ if(CONTENTVIEW_GENERAL.markingType == "maker"){ CONTENTVIEW_MARKING.canvasMarkerToCanvasDraw(); } ClientData.MarkingType("pen"); CONTENTVIEW_GENERAL.markingType = "pen"; $('#dlgMarking_imgPenOption').removeClass(); $('#dlgMarking_imgPenOption').addClass('pen_option_selected'); CONTENTVIEW_MARKING.setDefaultImageForMarking(); }; CONTENTVIEW_MARKING.dlgMarking_imgMaker_click = function() { // Choose maker $("#dlgMarking_imgMaker").addClass('toolbar_icon_on'); $("#dlgMarking_imgPen").removeClass(); $("#dlgMarking_imgEraser").removeClass(); ClientData.MarkingType("maker"); CONTENTVIEW_GENERAL.markingType = "maker"; $('#marker_canvas').css('display','block'); CONTENTVIEW_MARKING.setDefaultImageForMarking(); }; CONTENTVIEW_MARKING.dlgMarking_imgMakerOption_click = function() { /*disable button */ CONTENTVIEW_MARKING.disableButtonMarking(); //ClientData.IsAddingMarking(false); /* display dialog overlay */ $("#overlay").show(); CONTENTVIEW_GENERAL.isAddingMarking = ClientData.IsAddingMarking(); // Show option of maker CONTENTVIEW_MAKER.ShowMaker($('#dlgMaker')); ClientData.MarkingType("maker"); CONTENTVIEW_GENERAL.markingType = "maker"; $('#marker_canvas').css('display','block'); $('#dlgMarking_imgMakerOption').removeClass(); $('#dlgMarking_imgMakerOption').addClass('maker_option_selected'); CONTENTVIEW_MARKING.setDefaultImageForMarking(); }; CONTENTVIEW_MARKING.dlgMarking_imgEraser_click = function() { // Choose eraser $("#dlgMarking_imgMaker").removeClass(); $("#dlgMarking_imgPen").removeClass(); $("#dlgMarking_imgEraser").addClass('toolbar_icon_on'); ClientData.MarkingType("eraser"); CONTENTVIEW_GENERAL.markingType = "eraser"; CONTENTVIEW_MARKING.canvasMarkerToCanvasDraw(); CONTENTVIEW_MARKING.setDefaultImageForMarking(); }; CONTENTVIEW_MARKING.dlgMarking_imgEraserOption_click = function() { /*disable button */ CONTENTVIEW_MARKING.disableButtonMarking(); //ClientData.IsAddingMarking(false); /* display dialog overlay */ $("#overlay").show(); CONTENTVIEW_GENERAL.isAddingMarking = ClientData.IsAddingMarking(); // Show option of maker CONTENTVIEW_GOMU.ShowEraser(); /* draw maker canvas */ if(CONTENTVIEW_GENERAL.markingType == "maker"){ CONTENTVIEW_MARKING.canvasMarkerToCanvasDraw(); } ClientData.MarkingType("eraser"); CONTENTVIEW_GENERAL.markingType = "eraser"; $('#dlgMarking_imgEraserOption').removeClass(); $('#dlgMarking_imgEraserOption').addClass('eraser_option_selected'); CONTENTVIEW_MARKING.setDefaultImageForMarking(); }; CONTENTVIEW_MARKING.dlgMarking_imgMin_click = function() { //$("#dlgMarking_body").slideToggle('fast'); $("#dlgMarking_imgMin").hide(); $("#dlgMarking_imgMax").show(); $("#dlgMarking_body").removeClass('markingBoxBody_on'); $("#dlgMarking_body").addClass('markingBoxBody_off'); //$('#dlgMarking').dialog({ height: 80}); //$('#dlgMarking').css('height', '29px'); }; CONTENTVIEW_MARKING.dlgMarking_imgMax_click = function() { //$("#dlgMarking_imgMin").slideToggle('fast'); $("#dlgMarking_imgMax").hide(); $("#dlgMarking_imgMin").show(); $("#dlgMarking_body").addClass('markingBoxBody_on'); $("#dlgMarking_body").removeClass('markingBoxBody_off'); //$('#dlgMarking').dialog({height: 350}); //$('#dlgMarking').css('height', '300px'); }; CONTENTVIEW_MARKING.dlgMarking_imgClose_click = function() { $("#dlgMarking").hide(); ClientData.IsHideToolbar(true); CONTENTVIEW_GENERAL.disableAllControl(); }; /* ---------------------------------------------------------------------------- Event groups [ end ] ---------------------------------------------------------------------------- */ CONTENTVIEW_MARKING.setDefaultImageForMarking = function(){ /* pen */ if(CONTENTVIEW_GENERAL.markingType == "pen"){ $('#dlgMarking_imgPen').removeClass(); $('#dlgMarking_imgPen').addClass('pen_selected'); }else{ $('#dlgMarking_imgPen').removeClass(); $('#dlgMarking_imgPen').addClass('pen_hover'); } /* maker */ if(CONTENTVIEW_GENERAL.markingType == "maker"){ $('#dlgMarking_imgMaker').removeClass(); $('#dlgMarking_imgMaker').addClass('maker_selected'); }else{ $('#dlgMarking_imgMaker').removeClass(); $('#dlgMarking_imgMaker').addClass('maker_hover'); } /* maker */ if(CONTENTVIEW_GENERAL.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 */ CONTENTVIEW_MARKING.disableButtonMarking = function(){ $('#dlgMarking_dspSave').unbind('click'); $('#dlgMarking_dspCancel').unbind('click'); $('#dlgMarking_dspPgClear').unbind('click'); $('#dlgMarking_imgMin').unbind('click'); $('#dlgMarking_imgMax').unbind('click'); $('#dlgMarking_imgClose').unbind('click'); $('#dlgMarking_imgPen').unbind('click'); $('#dlgMarking_imgPenOption').unbind('click'); $('#dlgMarking_imgMaker').unbind('click'); $('#dlgMarking_imgMakerOption').unbind('click'); $('#dlgMarking_imgEraser').unbind('click'); $('#dlgMarking_imgEraserOption').unbind('click'); /* set cursor default*/ $("#dlgMarking_dspSave").css('cursor', 'default'); $("#dlgMarking_dspCancel").css('cursor', 'default'); $("#dlgMarking_dspPgClear").css('cursor', 'default'); $("#dlgMarking_imgMin").css('cursor', 'default'); $("#dlgMarking_imgMax").css('cursor', 'default'); $("#dlgMarking_imgClose").css('cursor', 'default'); $("#dlgMarking_imgPen").css('cursor', 'default'); $("#dlgMarking_imgPenOption").css('cursor', 'default'); $("#dlgMarking_imgMaker").css('cursor', 'default'); $("#dlgMarking_imgMakerOption").css('cursor', 'default'); $("#dlgMarking_imgEraser").css('cursor', 'default'); $("#dlgMarking_imgEraserOption").css('cursor', 'default'); }; /* enable all button con dialog marking */ CONTENTVIEW_MARKING.enableButtonMarking = function(){ CONTENTVIEW_MARKING.disableButtonMarking(); $('#dlgMarking_dspSave').bind('click',CONTENTVIEW_MARKING.dlgMarking_dspSave_click); $('#dlgMarking_dspCancel').bind('click',CONTENTVIEW_MARKING.dlgMarking_dspCancel_click); $('#dlgMarking_dspPgClear').bind('click',CONTENTVIEW_MARKING.dlgMarking_dspPgClear_click); $('#dlgMarking_imgMin').bind('click',CONTENTVIEW_MARKING.dlgMarking_imgMin_click); $('#dlgMarking_imgMax').bind('click',CONTENTVIEW_MARKING.dlgMarking_imgMax_click); $('#dlgMarking_imgClose').bind('click',CONTENTVIEW_MARKING.dlgMarking_imgClose_click); $('#dlgMarking_imgPen').bind('click',CONTENTVIEW_MARKING.dlgMarking_imgPen_click); $('#dlgMarking_imgPenOption').bind('click',CONTENTVIEW_MARKING.dlgMarking_imgPenOption_click); $('#dlgMarking_imgMaker').bind('click',CONTENTVIEW_MARKING.dlgMarking_imgMaker_click); $('#dlgMarking_imgMakerOption').bind('click',CONTENTVIEW_MARKING.dlgMarking_imgMakerOption_click); $('#dlgMarking_imgEraser').bind('click',CONTENTVIEW_MARKING.dlgMarking_imgEraser_click); $('#dlgMarking_imgEraserOption').bind('click',CONTENTVIEW_MARKING.dlgMarking_imgEraserOption_click); /* set cursor pointer*/ $("#dlgMarking_dspSave").css('cursor', 'pointer'); $("#dlgMarking_dspCancel").css('cursor', 'pointer'); $("#dlgMarking_dspPgClear").css('cursor', 'pointer'); $("#dlgMarking_imgMin").css('cursor', 'pointer'); $("#dlgMarking_imgMax").css('cursor', 'pointer'); $("#dlgMarking_imgClose").css('cursor', 'pointer'); $("#dlgMarking_imgPen").css('cursor', 'pointer'); $("#dlgMarking_imgPenOption").css('cursor', 'pointer'); $("#dlgMarking_imgMaker").css('cursor', 'pointer'); $("#dlgMarking_imgMakerOption").css('cursor', 'pointer'); $("#dlgMarking_imgEraser").css('cursor', 'pointer'); $("#dlgMarking_imgEraserOption").css('cursor', 'pointer'); }; CONTENTVIEW_MARKING.ShowMarking = function() { //$("#dlgMarking_body").show(); //$("#dlgMarking_body").addClass('markingBoxBody_on'); //$("#dlgMarking_body").removeClass('markingBoxBody_on'); //$('#dlgMarking').dialog({ height: 350 }); //$('#dlgMarking').css('height', '300px'); //$('#dlgMarking').dialog("open"); $('#dlgMarking').css('top', '40px'); $('#dlgMarking').css('left', '10px'); $('#dlgMarking').show(); //$('#dlgMarking').fadeIn('fast'); // $('#dlgMarking').center(); // $('#dlgMarking').top(); // $('#dlgMarking').bottom(); //$(".ui-dialog-titlebar").hide(); CONTENTVIEW_MARKING.Marking_SetDefaultValue(); //$("#dlgMarking_imgMin").show(); // $("#dlgMarking_imgMax").hide(); CONTENTVIEW_MARKING.dlgMarking_imgPen_click(); CONTENTVIEW_MARKING.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 $(function () { //CONTENTVIEW_MARKING.ready(); }); CONTENTVIEW_MARKING.ready = function(){ //$("#dlgMarking_dspSave").click(CONTENTVIEW_MARKING.dlgMarking_dspSave_click); $("#dlgMarking_dspSave").on({ 'click touchend': function(ev){ CONTENTVIEW_MARKING.dlgMarking_dspSave_click(ev); return false; }, 'touchstart touchmove': function(){ //これを入れないと次にダイアログを開くと表示位置が大きくズレる return false; } }); //$("#dlgMarking_dspCancel").click(CONTENTVIEW_MARKING.dlgMarking_dspCancel_click); $("#dlgMarking_dspCancel").on({ 'click touchend': function(ev){ CONTENTVIEW_MARKING.dlgMarking_dspCancel_click(ev); return false; }, 'touchstart touchmove': function(){ //これを入れないと次にダイアログを開くと表示位置が大きくズレる return false; } }); //$("#dlgMarking_dspPgClear").click(CONTENTVIEW_MARKING.dlgMarking_dspPgClear_click); $("#dlgMarking_dspPgClear").on({ 'click touchend': function(ev){ CONTENTVIEW_MARKING.dlgMarking_dspPgClear_click(ev); return false; }, 'touchstart touchmove': function(){ //これを入れないと次にダイアログを開くと表示位置が大きくズレる return false; } }); // Icons //$("#dlgMarking_imgMin").click(CONTENTVIEW_MARKING.dlgMarking_imgMin_click); $("#dlgMarking_imgMin").on({ 'click touchend': function(ev){ CONTENTVIEW_MARKING.dlgMarking_imgMin_click(ev); return false; }, 'touchstart touchmove': function(){ //これを入れないと次にダイアログを開くと表示位置が大きくズレる return false; } }); //$("#dlgMarking_imgMax").click(CONTENTVIEW_MARKING.dlgMarking_imgMax_click); $("#dlgMarking_imgMax").on({ 'click touchend': function(ev){ CONTENTVIEW_MARKING.dlgMarking_imgMax_click(ev); return false; }, 'touchstart touchmove': function(){ //これを入れないと次にダイアログを開くと表示位置が大きくズレる return false; } }); //$("#dlgMarking_imgClose").click(CONTENTVIEW_MARKING.dlgMarking_imgClose_click); $("#dlgMarking_imgClose").on({ 'click touchend': function(ev){ CONTENTVIEW_MARKING.dlgMarking_imgClose_click(ev); return false; }, 'touchstart touchmove': function(){ //これを入れないと次にダイアログを開くと表示位置が大きくズレる return false; } }); //$("#dlgMarking_imgPen").click(CONTENTVIEW_MARKING.dlgMarking_imgPen_click); $("#dlgMarking_imgPen").on({ 'click touchend': function(ev){ CONTENTVIEW_MARKING.dlgMarking_imgPen_click(ev); return false; }, 'touchstart touchmove': function(){ //これを入れないと次にダイアログを開くと表示位置が大きくズレる return false; } }); //$("#dlgMarking_imgPenOption").click(CONTENTVIEW_MARKING.dlgMarking_imgPenOption_click); $("#dlgMarking_imgPenOption").on({ 'click touchend': function(ev){ CONTENTVIEW_MARKING.dlgMarking_imgPenOption_click(ev); return false; }, 'touchstart touchmove': function(){ //これを入れないと次にダイアログを開くと表示位置が大きくズレる return false; } }); //$("#dlgMarking_imgMaker").click(CONTENTVIEW_MARKING.dlgMarking_imgMaker_click); $("#dlgMarking_imgMaker").on({ 'click touchend': function(ev){ CONTENTVIEW_MARKING.dlgMarking_imgMaker_click(ev); return false; }, 'touchstart touchmove': function(){ //これを入れないと次にダイアログを開くと表示位置が大きくズレる return false; } }); //$("#dlgMarking_imgMakerOption").click(CONTENTVIEW_MARKING.dlgMarking_imgMakerOption_click); $("#dlgMarking_imgMakerOption").on({ 'click touchend': function(ev){ CONTENTVIEW_MARKING.dlgMarking_imgMakerOption_click(ev); return false; }, 'touchstart touchmove': function(){ //これを入れないと次にダイアログを開くと表示位置が大きくズレる return false; } }); //$("#dlgMarking_imgEraser").click(CONTENTVIEW_MARKING.dlgMarking_imgEraser_click); $("#dlgMarking_imgEraser").on({ 'click touchend': function(ev){ CONTENTVIEW_MARKING.dlgMarking_imgEraser_click(ev); return false; }, 'touchstart touchmove': function(){ //これを入れないと次にダイアログを開くと表示位置が大きくズレる return false; } }); //$("#dlgMarking_imgEraserOption").click(CONTENTVIEW_MARKING.dlgMarking_imgEraserOption_click); $("#dlgMarking_imgEraserOption").on({ 'click touchend': function(ev){ CONTENTVIEW_MARKING.dlgMarking_imgEraserOption_click(ev); return false; }, 'touchstart touchmove': function(){ //これを入れないと次にダイアログを開くと表示位置が大きくズレる return false; } }); /* $('#dlgMarking').dialog({ autoOpen: false, title: '', modal: false, resizable: false, width: 300, height: 350 }); */ $('#dlgMarking').draggable({ revert: false }); }; /// =============================================================================================== /// Marking group [ end ] /// ===============================================================================================