Commit 44cadc823b88f3085c4ef27664e008ee2443a535

Authored by unknown
1 parent 90e94162

Commit Changes For Erase Functionality and Canvas Opacity

400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js
@@ -5494,8 +5494,9 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo @@ -5494,8 +5494,9 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
5494 $scope.$on('annotationToolEvent', function (event, data) { 5494 $scope.$on('annotationToolEvent', function (event, data) {
5495 $("#canvas").css("display", "block"); 5495 $("#canvas").css("display", "block");
5496 $("#canvasPaint").css("display", "block"); 5496 $("#canvasPaint").css("display", "block");
5497 - // $rootScope.FreeStylePaint(); 5497 +
5498 $scope.doClick(); 5498 $scope.doClick();
  5499 + $rootScope.FreeStylePaint();
5499 }); 5500 });
5500 $scope.mousePs; 5501 $scope.mousePs;
5501 function OnPaintCanvasClick(event) { 5502 function OnPaintCanvasClick(event) {
@@ -5572,7 +5573,10 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo @@ -5572,7 +5573,10 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
5572 5573
5573 var canvasElement = document.getElementById("canvas"); 5574 var canvasElement = document.getElementById("canvas");
5574 var ctx = canvasElement.getContext("2d"); 5575 var ctx = canvasElement.getContext("2d");
5575 - if ($rootScope.shapeType == "FreeStylePaint") { 5576 +
  5577 +
  5578 +
  5579 + /* if ($rootScope.shapeType == "FreeStylePaint") {
5576 var canvasPaint_zIndex = $('#canvasPaint').css("z-index"); 5580 var canvasPaint_zIndex = $('#canvasPaint').css("z-index");
5577 var canvas_zIndex = $('#canvas').css("z-index"); 5581 var canvas_zIndex = $('#canvas').css("z-index");
5578 if (canvas_zIndex > canvasPaint_zIndex) { 5582 if (canvas_zIndex > canvasPaint_zIndex) {
@@ -5585,12 +5589,13 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo @@ -5585,12 +5589,13 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
5585 $('#canvasPaint').css("z-index", canvasPaint_zIndex); 5589 $('#canvasPaint').css("z-index", canvasPaint_zIndex);
5586 $('#canvasPaint').sketch({ defaultColor: "#000", defaultSize: 1 }); 5590 $('#canvasPaint').sketch({ defaultColor: "#000", defaultSize: 1 });
5587 } 5591 }
5588 - else { 5592 + else {*/
5589 switch ($rootScope.shapeType) { 5593 switch ($rootScope.shapeType) {
5590 5594
5591 case "cursor": 5595 case "cursor":
5592 - ctx.clearRect(0, 0, 2277, 3248); 5596 + // ctx.clearRect(0, 0, 2277, 3248);
5593 ctx.beginPath(); 5597 ctx.beginPath();
  5598 +
5594 5599
5595 break; 5600 break;
5596 5601
@@ -5668,6 +5673,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo @@ -5668,6 +5673,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
5668 type: 'rectangle', 5673 type: 'rectangle',
5669 draggable: true, 5674 draggable: true,
5670 strokeStyle: 'black', 5675 strokeStyle: 'black',
  5676 + opacity: $rootScope.shapestyleOpacity,
5671 strokeWidth: 2, 5677 strokeWidth: 2,
5672 x: $scope.offsetX1, y: $scope.offsetY1, 5678 x: $scope.offsetX1, y: $scope.offsetY1,
5673 width: $scope.x - $scope.offsetX1, 5679 width: $scope.x - $scope.offsetX1,
@@ -5738,6 +5744,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo @@ -5738,6 +5744,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
5738 layer: true, 5744 layer: true,
5739 name: 'Circle_' + $rootScope.resetCircle, 5745 name: 'Circle_' + $rootScope.resetCircle,
5740 type: 'ellipse', 5746 type: 'ellipse',
  5747 + opacity: $rootScope.shapestyleOpacity,
5741 draggable: true, 5748 draggable: true,
5742 strokeStyle: '#000', 5749 strokeStyle: '#000',
5743 strokeWidth: 2, 5750 strokeWidth: 2,
@@ -5987,6 +5994,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo @@ -5987,6 +5994,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
5987 $('#canvas').drawText({ 5994 $('#canvas').drawText({
5988 layer: true, 5995 layer: true,
5989 draggable: true, 5996 draggable: true,
  5997 + // opacity: $rootScope.shapestyleOpacity,
5990 name: 'TextArea_' + $rootScope.resetText, 5998 name: 'TextArea_' + $rootScope.resetText,
5991 groups: ['TextArea_' + $rootScope.resetText], 5999 groups: ['TextArea_' + $rootScope.resetText],
5992 dragGroups: ['TextArea_' + $rootScope.resetText], 6000 dragGroups: ['TextArea_' + $rootScope.resetText],
@@ -6006,6 +6014,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo @@ -6006,6 +6014,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
6006 layer: true, 6014 layer: true,
6007 name: "TextRect_" + $rootScope.resetTextRect, 6015 name: "TextRect_" + $rootScope.resetTextRect,
6008 dragGroups: ['shapes'], 6016 dragGroups: ['shapes'],
  6017 + opacity: $rootScope.shapestyleOpacity,
6009 strokeStyle: 'black', 6018 strokeStyle: 'black',
6010 strokeWidth: 2, 6019 strokeWidth: 2,
6011 x: $scope.offsetX1, y: $scope.offsetY1, 6020 x: $scope.offsetX1, y: $scope.offsetY1,
@@ -6070,7 +6079,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo @@ -6070,7 +6079,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
6070 break; 6079 break;
6071 6080
6072 } 6081 }
6073 - } 6082 + //}
6074 6083
6075 } 6084 }
6076 6085
@@ -6131,6 +6140,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo @@ -6131,6 +6140,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
6131 draggable: true, 6140 draggable: true,
6132 groups: ['TextArea_' + $rootScope.resetText], 6141 groups: ['TextArea_' + $rootScope.resetText],
6133 dragGroups: ['TextArea_' + $rootScope.resetText], 6142 dragGroups: ['TextArea_' + $rootScope.resetText],
  6143 + opacity: $rootScope.shapestyleOpacity,
6134 strokeStyle: 'black', 6144 strokeStyle: 'black',
6135 strokeWidth: 2, 6145 strokeWidth: 2,
6136 x: $scope.offsetX1, y: $scope.offsetY1, 6146 x: $scope.offsetX1, y: $scope.offsetY1,
@@ -6212,11 +6222,34 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo @@ -6212,11 +6222,34 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
6212 $rootScope.FreeStylePaint = function (e) { 6222 $rootScope.FreeStylePaint = function (e) {
6213 // debugger; 6223 // debugger;
6214 6224
6215 - // alert("asasssas");  
6216 - $rootScope.shapeType = "FreeStylePaint";  
6217 - canvas.addEventListener('mouseup', $scope.OnPaintCanvasMouseUp, false); 6225 +
  6226 + // $rootScope.shapeType = "FreeStylePaint";
  6227 + canvasPaint.addEventListener('mouseup', $scope.OnPaintBrushCanvasMouseUp, false);
  6228 + canvasPaint.addEventListener('mousedown', $scope.OnPaintBrushCanvasMouseDown, false);
  6229 +
6218 6230
6219 } 6231 }
  6232 + $scope.OnPaintBrushCanvasMouseDown = function (event) {
  6233 +
  6234 + }
  6235 + $scope.OnPaintBrushCanvasMouseUp = function (event) {
  6236 +
  6237 +
  6238 + // var canvasElement1 = document.getElementById("canvasPaint");
  6239 + // var ctx1 = canvasElement1.getContext("2d");
  6240 +
  6241 + switch($rootScope.shapeType)
  6242 + {
  6243 + case "FreeStylePaint":
  6244 +
  6245 + $('#canvasPaint').sketch({ defaultSize: 1 });
  6246 +
  6247 + break;
  6248 +
  6249 +
  6250 + }
  6251 +
  6252 + }
6220 6253
6221 $(document).keydown(function (event) { 6254 $(document).keydown(function (event) {
6222 6255
400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js
@@ -72,7 +72,7 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location", @@ -72,7 +72,7 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
72 if (alreadyOpenThisView != null) { 72 if (alreadyOpenThisView != null) {
73 for (var i = 0; i < $rootScope.openViews.length; i++) { 73 for (var i = 0; i < $rootScope.openViews.length; i++) {
74 k++; 74 k++;
75 - if ($rootScope.openViews[i].body-views == title) { 75 + if ($rootScope.openViews[i].body - views == title) {
76 $rootScope.openViews.splice((k - 1), 1); 76 $rootScope.openViews.splice((k - 1), 1);
77 77
78 $rootScope.openViews.push( 78 $rootScope.openViews.push(
@@ -94,7 +94,7 @@ AIA.controller(&quot;HomeController&quot;, [&quot;$rootScope&quot;, &quot;Modules&quot;, &quot;$log&quot;, &quot;$location&quot;, @@ -94,7 +94,7 @@ AIA.controller(&quot;HomeController&quot;, [&quot;$rootScope&quot;, &quot;Modules&quot;, &quot;$log&quot;, &quot;$location&quot;,
94 //$rootScope.isDrawingToolSelected = true; 94 //$rootScope.isDrawingToolSelected = true;
95 //$rootScope.isLineDrawSelecyed = true; 95 //$rootScope.isLineDrawSelecyed = true;
96 $rootScope.shapeType = "Line"; 96 $rootScope.shapeType = "Line";
97 - // alert($rootScope.shapeType); 97 + // alert($rootScope.shapeType);
98 98
99 99
100 } 100 }
@@ -133,9 +133,9 @@ AIA.controller(&quot;HomeController&quot;, [&quot;$rootScope&quot;, &quot;Modules&quot;, &quot;$log&quot;, &quot;$location&quot;, @@ -133,9 +133,9 @@ AIA.controller(&quot;HomeController&quot;, [&quot;$rootScope&quot;, &quot;Modules&quot;, &quot;$log&quot;, &quot;$location&quot;,
133 $rootScope.isIdetifyClicked = true; 133 $rootScope.isIdetifyClicked = true;
134 $rootScope.isDrawingToolSelected = false; 134 $rootScope.isDrawingToolSelected = false;
135 } 135 }
136 - 136 +
137 //----Annotation Toolbar: Jcanvas----- 137 //----Annotation Toolbar: Jcanvas-----
138 - 138 +
139 $rootScope.DrawLine = function (e) { 139 $rootScope.DrawLine = function (e) {
140 $rootScope.switchCanvas(); 140 $rootScope.switchCanvas();
141 $rootScope.shapeType = "Line"; 141 $rootScope.shapeType = "Line";
@@ -175,9 +175,24 @@ AIA.controller(&quot;HomeController&quot;, [&quot;$rootScope&quot;, &quot;Modules&quot;, &quot;$log&quot;, &quot;$location&quot;, @@ -175,9 +175,24 @@ AIA.controller(&quot;HomeController&quot;, [&quot;$rootScope&quot;, &quot;Modules&quot;, &quot;$log&quot;, &quot;$location&quot;,
175 $(".btn-annotation-rectangle").addClass("activebtncolor"); 175 $(".btn-annotation-rectangle").addClass("activebtncolor");
176 } 176 }
177 $rootScope.paintBrush = function () { 177 $rootScope.paintBrush = function () {
178 - $rootScope.switchCanvas();  
179 - $rootScope.shapeType = "brush";  
180 - 178 + $rootScope.switchCanvasToPaintCanvas();
  179 +
  180 + $rootScope.shapeType = "FreeStylePaint";
  181 + //alert($rootScope.shapeType);
  182 +
  183 + }
  184 +
  185 + $rootScope.switchCanvasToPaintCanvas = function (e) {
  186 + var canvasPaint_zIndex = $('#canvasPaint').css("z-index");
  187 + var canvas_zIndex = $('#canvas').css("z-index");
  188 + if (canvas_zIndex > canvasPaint_zIndex) {
  189 + canvasPaint_zIndex = parseInt(canvas_zIndex) + 1;
  190 +
  191 + }
  192 + else {
  193 + canvasPaint_zIndex = parseInt(canvasPaint_zIndex) + 1;
  194 + }
  195 + $('#canvasPaint').css("z-index", canvasPaint_zIndex);
181 } 196 }
182 197
183 $rootScope.DrawCircle = function (e) { 198 $rootScope.DrawCircle = function (e) {
@@ -197,28 +212,23 @@ AIA.controller(&quot;HomeController&quot;, [&quot;$rootScope&quot;, &quot;Modules&quot;, &quot;$log&quot;, &quot;$location&quot;, @@ -197,28 +212,23 @@ AIA.controller(&quot;HomeController&quot;, [&quot;$rootScope&quot;, &quot;Modules&quot;, &quot;$log&quot;, &quot;$location&quot;,
197 } 212 }
198 $rootScope.DrawText = function () { 213 $rootScope.DrawText = function () {
199 $rootScope.switchCanvas(); 214 $rootScope.switchCanvas();
200 -  
201 - $rootScope.shapeType = "TextArea";  
202 - $('.btnCursor').removeClass('activebtncolor');  
203 - $(".btn-annotation").removeClass("activebtncolor");  
204 - $(".btn-annotation-Text").addClass("activebtncolor");  
205 - // $('.btnCursor').removeClass('activebtncolor');  
206 - // $(".btn-annotation").removeClass("activebtncolor");  
207 - // $(".btn-annotation-Text").addClass("activebtncolor");  
208 - //$('.btnCursor').removeClass('activebtncolor');  
209 - //$(".btn-annotation").removeClass("activebtncolor");  
210 - //$("#" + e.currentTarget.id).addClass("activebtncolor"); 215 +
  216 + $rootScope.shapeType = "TextArea";
  217 + $('.btnCursor').removeClass('activebtncolor');
  218 + $(".btn-annotation").removeClass("activebtncolor");
  219 + $(".btn-annotation-Text").addClass("activebtncolor");
  220 +
211 } 221 }
212 222
213 $rootScope.DrawPolygon = function () { 223 $rootScope.DrawPolygon = function () {
214 $rootScope.shapeType = "DrawPolygon"; 224 $rootScope.shapeType = "DrawPolygon";
215 - 225 +
216 } 226 }
217 227
218 228
219 $rootScope.OpacityModal = function () { 229 $rootScope.OpacityModal = function () {
220 -  
221 - 230 +
  231 +
222 } 232 }
223 $rootScope.switchCanvas = function () { 233 $rootScope.switchCanvas = function () {
224 var x = $('#canvasPaint').css("z-index"); 234 var x = $('#canvasPaint').css("z-index");
@@ -232,13 +242,30 @@ AIA.controller(&quot;HomeController&quot;, [&quot;$rootScope&quot;, &quot;Modules&quot;, &quot;$log&quot;, &quot;$location&quot;, @@ -232,13 +242,30 @@ AIA.controller(&quot;HomeController&quot;, [&quot;$rootScope&quot;, &quot;Modules&quot;, &quot;$log&quot;, &quot;$location&quot;,
232 $('#canvas').css("z-index", y); 242 $('#canvas').css("z-index", y);
233 } 243 }
234 $rootScope.EraseDrawing = function () { 244 $rootScope.EraseDrawing = function () {
235 - document.getElementById('paintCanvas').getContext('2d').setTransform(1, 0, 0, 1, 0, 0);  
236 - document.getElementById('paintCanvas').getContext('2d').clearRect(0, 0, document.getElementById('paintCanvas').getContext('2d').canvas.width, document.getElementById('paintCanvas').getContext('2d').canvas.height); 245 + $rootScope.switchCanvasToPaintCanvas();
  246 + // $('#canvasPaint').sketch({ defaultColor: "yellow", defaultSize: 1 });
  247 + var sktch = $('#canvasPaint').sketch();
  248 + $('#canvasPaint').sketch().actions = []; // this line empties the actions.
  249 + var myCanvas = document.getElementById("canvasPaint");
  250 + var ctx = myCanvas.getContext('2d');
  251 + ctx.clearRect(0, 0, myCanvas.width, myCanvas.height);
  252 + $rootScope.switchCanvas();
  253 +
  254 + }
237 255
  256 + //opacity code
  257 + $rootScope.shapestyleOpacity = 1;
  258 + $rootScope.shapestyle = function (id) {
  259 +
  260 + $rootScope.shapestyleOpacity = $("#" + id).css('opacity');
  261 + $('#editshapestyle').modal('hide');
238 } 262 }
  263 +
  264 +
  265 +
239 //----End------------- 266 //----End-------------
240 267
241 - $rootScope.AddClick=function (x, y, dragging) { 268 + $rootScope.AddClick = function (x, y, dragging) {
242 $rootScope.clickX.push(x); 269 $rootScope.clickX.push(x);
243 $rootScope.clickY.push(y); 270 $rootScope.clickY.push(y);
244 $rootScope.clickDrag.push(dragging); 271 $rootScope.clickDrag.push(dragging);
@@ -253,7 +280,7 @@ AIA.controller(&quot;HomeController&quot;, [&quot;$rootScope&quot;, &quot;Modules&quot;, &quot;$log&quot;, &quot;$location&quot;, @@ -253,7 +280,7 @@ AIA.controller(&quot;HomeController&quot;, [&quot;$rootScope&quot;, &quot;Modules&quot;, &quot;$log&quot;, &quot;$location&quot;,
253 context.lineJoin = "round"; 280 context.lineJoin = "round";
254 context.lineWidth = 5; 281 context.lineWidth = 5;
255 282
256 - 283 +
257 for (var i = 0; i < $rootScope.clickX.length; i++) { 284 for (var i = 0; i < $rootScope.clickX.length; i++) {
258 context.beginPath(); 285 context.beginPath();
259 if ($rootScope.clickDrag[i] && i) { 286 if ($rootScope.clickDrag[i] && i) {
@@ -267,7 +294,7 @@ AIA.controller(&quot;HomeController&quot;, [&quot;$rootScope&quot;, &quot;Modules&quot;, &quot;$log&quot;, &quot;$location&quot;, @@ -267,7 +294,7 @@ AIA.controller(&quot;HomeController&quot;, [&quot;$rootScope&quot;, &quot;Modules&quot;, &quot;$log&quot;, &quot;$location&quot;,
267 } 294 }
268 } 295 }
269 296
270 - $rootScope.PaintCanvasMousedownListener = function (canvasContext,x,y) { 297 + $rootScope.PaintCanvasMousedownListener = function (canvasContext, x, y) {
271 if ($rootScope.isLineDrawSelecyed == true) { 298 if ($rootScope.isLineDrawSelecyed == true) {
272 299
273 canvasContext.lineWidth = 0.1; 300 canvasContext.lineWidth = 0.1;
@@ -285,14 +312,14 @@ AIA.controller(&quot;HomeController&quot;, [&quot;$rootScope&quot;, &quot;Modules&quot;, &quot;$log&quot;, &quot;$location&quot;, @@ -285,14 +312,14 @@ AIA.controller(&quot;HomeController&quot;, [&quot;$rootScope&quot;, &quot;Modules&quot;, &quot;$log&quot;, &quot;$location&quot;,
285 } 312 }
286 313
287 } 314 }
288 - 315 +
289 $rootScope.PaintCanvasMouseupListener = function (canvasContext) { 316 $rootScope.PaintCanvasMouseupListener = function (canvasContext) {
290 if ($scope.isLineDrawSelecyed == true) { 317 if ($scope.isLineDrawSelecyed == true) {
291 318
292 } 319 }
293 } 320 }
294 321
295 - $rootScope.PaintCanvasMousemoveListener = function (canvasContext,x,y) { 322 + $rootScope.PaintCanvasMousemoveListener = function (canvasContext, x, y) {
296 if ($rootScope.isLineDrawSelecyed == true) { 323 if ($rootScope.isLineDrawSelecyed == true) {
297 console.log('hm moving') 324 console.log('hm moving')
298 canvasContext.lineTo(x, y); 325 canvasContext.lineTo(x, y);
@@ -300,7 +327,7 @@ AIA.controller(&quot;HomeController&quot;, [&quot;$rootScope&quot;, &quot;Modules&quot;, &quot;$log&quot;, &quot;$location&quot;, @@ -300,7 +327,7 @@ AIA.controller(&quot;HomeController&quot;, [&quot;$rootScope&quot;, &quot;Modules&quot;, &quot;$log&quot;, &quot;$location&quot;,
300 } 327 }
301 } 328 }
302 329
303 - $rootScope.Draw = function (x, y, isDown,context) { 330 + $rootScope.Draw = function (x, y, isDown, context) {
304 if (isDown) { 331 if (isDown) {
305 context.beginPath(); 332 context.beginPath();
306 context.strokeStyle = '#000000'; 333 context.strokeStyle = '#000000';
@@ -314,7 +341,7 @@ AIA.controller(&quot;HomeController&quot;, [&quot;$rootScope&quot;, &quot;Modules&quot;, &quot;$log&quot;, &quot;$location&quot;, @@ -314,7 +341,7 @@ AIA.controller(&quot;HomeController&quot;, [&quot;$rootScope&quot;, &quot;Modules&quot;, &quot;$log&quot;, &quot;$location&quot;,
314 $rootScope.lastX = x; $rootScope.lastY = y; 341 $rootScope.lastX = x; $rootScope.lastY = y;
315 } 342 }
316 343
317 - 344 +
318 345
319 346
320 //list manager function 347 //list manager function
@@ -331,7 +358,7 @@ AIA.controller(&quot;HomeController&quot;, [&quot;$rootScope&quot;, &quot;Modules&quot;, &quot;$log&quot;, &quot;$location&quot;, @@ -331,7 +358,7 @@ AIA.controller(&quot;HomeController&quot;, [&quot;$rootScope&quot;, &quot;Modules&quot;, &quot;$log&quot;, &quot;$location&quot;,
331 $("#listManager").css("visibility", "visible"); 358 $("#listManager").css("visibility", "visible");
332 $('#listManager').draggable(); 359 $('#listManager').draggable();
333 360
334 - 361 +
335 $rootScope.islistManagerEventAlredayDispachted = true; 362 $rootScope.islistManagerEventAlredayDispachted = true;
336 363
337 $rootScope.$broadcast('listManagerEvent', true); 364 $rootScope.$broadcast('listManagerEvent', true);
@@ -522,7 +549,7 @@ AIA.controller(&quot;HomeController&quot;, [&quot;$rootScope&quot;, &quot;Modules&quot;, &quot;$log&quot;, &quot;$location&quot;, @@ -522,7 +549,7 @@ AIA.controller(&quot;HomeController&quot;, [&quot;$rootScope&quot;, &quot;Modules&quot;, &quot;$log&quot;, &quot;$location&quot;,
522 } 549 }
523 } 550 }
524 }; 551 };
525 - 552 +
526 553
527 }] 554 }]
528 ); 555 );
529 \ No newline at end of file 556 \ No newline at end of file
400-SOURCECODE/AIAHTML5.Web/content/images/common/annotation-tool-bar/pattern-2burn.jpg 0 โ†’ 100644

15.3 KB

400-SOURCECODE/AIAHTML5.Web/content/images/common/annotation-tool-bar/pattern-3burn.jpg 0 โ†’ 100644

13.3 KB

400-SOURCECODE/AIAHTML5.Web/content/images/common/annotation-tool-bar/pattern-burn.jpg 0 โ†’ 100644

7.95 KB

400-SOURCECODE/AIAHTML5.Web/content/images/common/annotation-tool-bar/pattern-cot.jpg 0 โ†’ 100644

16 KB

400-SOURCECODE/AIAHTML5.Web/content/images/common/annotation-tool-bar/pattern-fat.jpg 0 โ†’ 100644

20.2 KB

400-SOURCECODE/AIAHTML5.Web/content/images/common/annotation-tool-bar/pattern-gauze.jpg 0 โ†’ 100644

12.8 KB

400-SOURCECODE/AIAHTML5.Web/content/images/common/annotation-tool-bar/pattern-picker.png 0 โ†’ 100644

1.87 KB

400-SOURCECODE/AIAHTML5.Web/content/images/common/annotation-tool-bar/pattern-scrape.jpg 0 โ†’ 100644

19.3 KB

400-SOURCECODE/AIAHTML5.Web/content/images/common/annotation-tool-bar/pattern-skingraft.jpg 0 โ†’ 100644

15.3 KB

400-SOURCECODE/AIAHTML5.Web/content/images/common/annotation-tool-bar/pattern-tumor.jpg 0 โ†’ 100644

13 KB

400-SOURCECODE/AIAHTML5.Web/index.html
@@ -423,12 +423,12 @@ @@ -423,12 +423,12 @@
423 </div> 423 </div>
424 </div> 424 </div>
425 <div class="well-popup well"> 425 <div class="well-popup well">
426 - <img src="content/images/blank-shape.jpg" alt="..." class="img-rounded img-responsive"/> 426 + <img src="content/images/blank-shape.jpg" alt="..." class="img-rounded img-responsive" data-toggle="modal" data-target="#editshapestyle">
427 </div> 427 </div>
428 <div class="well well-popup"> 428 <div class="well well-popup">
429 <div class="" role="group" aria-label="..."> 429 <div class="" role="group" aria-label="...">
430 <div> 430 <div>
431 - <button type="button" class="btn btn-primary btn-xs pull-left btn-annotation" data-toggle="tooltip" data-placement="top" title="Paint" style="margin-right:1%;" ng-click="FreeStylePaint()"><i class="fa fa-paint-brush"></i></button> 431 + <button type="button" class="btn btn-primary btn-xs pull-left btn-annotation" data-toggle="tooltip" data-placement="top" title="Paint" style="margin-right:1%;" ng-click="paintBrush()"><i class="fa fa-paint-brush"></i></button>
432 <button type="button" class="btn btn-primary btn-xs pull-left btn-annotation" data-toggle="tooltip" data-placement="top" title="Erase" ng-click="EraseDrawing()"><i class="fa fa-eraser"></i></button>&nbsp; 432 <button type="button" class="btn btn-primary btn-xs pull-left btn-annotation" data-toggle="tooltip" data-placement="top" title="Erase" ng-click="EraseDrawing()"><i class="fa fa-eraser"></i></button>&nbsp;
433 <div class="marginL2 pull-left"><input type="number" id="amount-2" value="25" step="1" style="width:60px;"></div>&nbsp; 433 <div class="marginL2 pull-left"><input type="number" id="amount-2" value="25" step="1" style="width:60px;"></div>&nbsp;
434 <div class="pull-left" style="width:45%; margin-left:2%;"> 434 <div class="pull-left" style="width:45%; margin-left:2%;">
@@ -660,6 +660,140 @@ @@ -660,6 +660,140 @@
660 660
661 661
662 662
  663 + <!--Edit Shape Modal-->
  664 + <div class="modal fade" id="editshapestyle" tabindex="-1" role="dialog" aria-labelledby="myModalLabel33" style="z-index:1000000000;width:302px;margin-left:auto;margin-right:auto;overflow:hidden;height:503px;">
  665 + <div class="modal-dialog modal-sm" role="document">
  666 + <div class="modal-content">
  667 + <div class="modal-header annotation-modal-header">
  668 + <h4 class="modal-title" id="myModalLabel33">Edit Shape Style</h4>
  669 + </div>
  670 + <div class="modal-body">
  671 + <div class="marginTopBtm10">
  672 + <div class="well well-sm no-margin-btm">
  673 + <div class="row">
  674 + <div class="col-sm-12">
  675 + <div class="checkbox no-margin">
  676 + <label>
  677 + <input type="checkbox" checked> Fill Option
  678 + </label>
  679 + </div>
  680 + </div>
  681 + <div class="col-sm-6">
  682 + <div class="radio">
  683 + <label>
  684 + <input type="radio" name="filloption" id="filloption1" value="filloption1">
  685 + <span class="">Texture</span>
  686 + <img src="~/../content/images/common/annotation-tool-bar/pattern-picker.png" alt="" class="pattern-picker" data-toggle="modal" data-target="#pattern">
  687 + </label>
  688 + </div>
  689 + <div class="radio">
  690 + <label>
  691 + <input type="radio" name="filloption" id="filloption2" value="filloption2" checked style="margin-top:8px;">
  692 +
  693 +
  694 + <div class="form-group" style="display:inline-flex;vertical-align:top;cursor:pointer;margin-right:36px;">
  695 + <span style="font-weight: normal; float: left; padding-top: 5px; padding-right: 5px;">Color</span>
  696 + <input type="text" class="form-control demo2" data-control="saturation" style="display:none;" value="#0088cc">
  697 + </div>
  698 +
  699 +
  700 + <!--<span class="">Color</span> <img src="img/color-picker.png" alt="" class="color-picker">-->
  701 + <!--<span class="demo2" data-control="hue" style="font-weight:normal;">Color</span>-->
  702 + <!--<img src="img/color-picker.png" alt="" class="color-picker">-->
  703 + </label>
  704 + </div>
  705 + </div>
  706 + <div class="col-sm-6 no-padding marginTop10">
  707 + <div class="row">
  708 + <label class="pull-left" style="font-weight:normal;">Scale</label>
  709 + <div class="pull-left" style="width:62%; margin-left:3%; margin-top:2%;">
  710 + <div id="slider-range-min-3"></div>
  711 + <!--<p>Your slider has a value of <span id="slider-value"></span></p>-->
  712 + </div>
  713 + </div>
  714 +
  715 + <div class="row">
  716 + <label class="pull-left" style="font-weight:normal;">Opacity</label>
  717 + <div class="pull-left" style="width:53%; margin-left:3%; margin-top:2%;">
  718 + <div id="slider-range-min-4"></div>
  719 + </div>
  720 + </div>
  721 +
  722 + <div class="clearfix"></div>
  723 +
  724 +
  725 + </div>
  726 + </div>
  727 +
  728 + </div>
  729 + </div>
  730 + <div class="marginTopBtm10">
  731 + <div class="well well-sm no-margin-btm">
  732 + <div class="row">
  733 + <div class="col-sm-12">
  734 + <div class="checkbox no-margin">
  735 + <label>
  736 + <input type="checkbox" checked> Outline Option
  737 + </label>
  738 + </div>
  739 + </div>
  740 + <div class="col-sm-6">
  741 + <label class="marginTop5">
  742 + <span style="font-weight: normal; float: left; padding-top: 5px; padding-right: 5px;">Color</span>
  743 + <!--<span class="demo " data-control="hue" style="float:left;">&nbsp;</span>-->
  744 +
  745 +
  746 + <div class="form-group" style="display:inline-flex;vertical-align:top;cursor:pointer;margin-right:36px;">
  747 +
  748 + <input type="text" class="form-control demo1" data-control="saturation" style="display:none;" value="#0088cc">
  749 + </div>
  750 +
  751 +
  752 + <!--<img src="img/color-picker.png" alt="" class="color-picker">-->
  753 + </label>
  754 + </div>
  755 +
  756 + <div class="col-sm-6">
  757 + <div class="form-horizontal">
  758 + <div class="form-group">
  759 + <label for="inputPassword" class="col-sm-3 control-label" style=" font-weight:normal; padding-top:9px;">Size</label>
  760 + <div class="col-sm-9 marginTop5">
  761 + <select class="form-control input-sm">
  762 + <option value="1" selected>1</option>
  763 + <option value="2">2</option>
  764 + <option value="3">3</option>
  765 + <option value="4">4</option>
  766 + <option value="5">5</option>
  767 + </select>
  768 + </div>
  769 + </div>
  770 + </div>
  771 + </div>
  772 +
  773 + </div>
  774 + </div>
  775 + </div>
  776 +
  777 + <div class="marginTopBtm10">
  778 + <div class="well well-sm no-margin-btm">
  779 + <img id="imgOpacity" class="img-rounded img-responsive imgopacity" alt="..." src="content/images/blank-shape.jpg">
  780 + </div>
  781 + </div>
  782 + </div>
  783 + <div class="modal-footer">
  784 + <button type="button" class="btn btn-primary btn-sm" ng-click="shapestyle('imgOpacity')">
  785 + OK
  786 + </button>
  787 + <button type="button" class="btn btn-primary btn-sm" data-dismiss="modal">Cancel</button>
  788 + </div>
  789 + </div>
  790 + </div>
  791 + </div>
  792 +
  793 +
  794 +
  795 +
  796 +
663 797
664 <script> 798 <script>
665 function mytoggle() { 799 function mytoggle() {
@@ -872,5 +1006,117 @@ @@ -872,5 +1006,117 @@
872 1006
873 </script> 1007 </script>
874 1008
  1009 +
  1010 + <script>
  1011 + $(document).ready(function () {
  1012 +
  1013 + $('.demo1').each(function () {
  1014 +
  1015 + $(this).minicolors({
  1016 + control: $(this).attr('data-control') || 'hue',
  1017 + defaultValue: $(this).attr('data-defaultValue') || '',
  1018 + format: $(this).attr('data-format') || 'hex',
  1019 + keywords: $(this).attr('data-keywords') || '',
  1020 + inline: $(this).attr('data-inline') === 'true',
  1021 + letterCase: $(this).attr('data-letterCase') || 'lowercase',
  1022 + opacity: $(this).attr('data-opacity'),
  1023 + position: $(this).attr('data-position') || 'bottom left',
  1024 + swatches: $(this).attr('data-swatches') ? $(this).attr('data-swatches').split('|') : [],
  1025 + change: function (value, opacity) {
  1026 + if (!value) return;
  1027 + if (opacity) value += ', ' + opacity;
  1028 + if (typeof console === 'object') {
  1029 + console.log(value);
  1030 + }
  1031 + },
  1032 + theme: 'bootstrap'
  1033 + });
  1034 +
  1035 + });
  1036 +
  1037 +
  1038 +
  1039 + $('.demo2').each(function () {
  1040 +
  1041 + $(this).minicolors({
  1042 + control: $(this).attr('data-control') || 'hue',
  1043 + defaultValue: $(this).attr('data-defaultValue') || '',
  1044 + format: $(this).attr('data-format') || 'hex',
  1045 + keywords: $(this).attr('data-keywords') || '',
  1046 + inline: $(this).attr('data-inline') === 'true',
  1047 + letterCase: $(this).attr('data-letterCase') || 'lowercase',
  1048 + opacity: $(this).attr('data-opacity'),
  1049 + position: $(this).attr('data-position') || 'bottom left',
  1050 + swatches: $(this).attr('data-swatches') ? $(this).attr('data-swatches').split('|') : [],
  1051 + change: function (value, opacity) {
  1052 + if (!value) return;
  1053 + if (opacity) value += ', ' + opacity;
  1054 + if (typeof console === 'object') {
  1055 + console.log(value);
  1056 + }
  1057 + },
  1058 + theme: 'bootstrap'
  1059 + });
  1060 +
  1061 + });
  1062 +
  1063 +
  1064 + });
  1065 + </script>
  1066 +
  1067 +
  1068 + <script>
  1069 + $(function () {
  1070 + $("#slider-range-min-3").slider({
  1071 + range: "min",
  1072 + min: 0,
  1073 + max: 100,
  1074 + value: 20,
  1075 + change: function (event, ui) {
  1076 +
  1077 +
  1078 + }
  1079 + });
  1080 +
  1081 +
  1082 +
  1083 + });
  1084 + </script>
  1085 +
  1086 + <script>
  1087 + $(function () {
  1088 +
  1089 +
  1090 +
  1091 + $("#slider-range-min-4").slider(
  1092 + {
  1093 + range: "min",
  1094 + value: .5,
  1095 + min: 0,
  1096 + max: 1,
  1097 + step: .1,
  1098 + slide: function (event, ui) {
  1099 +
  1100 + $(".marginTopBtm10 img.imgopacity").css("opacity", ui.value);
  1101 + // $("#slider-value").html(ui.value);
  1102 +
  1103 + }
  1104 +
  1105 + }
  1106 +
  1107 +);
  1108 +
  1109 + });
  1110 +
  1111 +
  1112 +
  1113 + </script>
  1114 +
  1115 +
  1116 +
  1117 +
  1118 +
  1119 +
  1120 +
875 </body> 1121 </body>
876 </html> 1122 </html>
877 \ No newline at end of file 1123 \ No newline at end of file