Commit 44cadc823b88f3085c4ef27664e008ee2443a535
1 parent
90e94162
Commit Changes For Erase Functionality and Canvas Opacity
Showing
13 changed files
with
348 additions
and
42 deletions
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("HomeController", ["$rootScope", "Modules", "$log", "$location", | @@ -94,7 +94,7 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location", | ||
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("HomeController", ["$rootScope", "Modules", "$log", "$location", | @@ -133,9 +133,9 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location", | ||
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("HomeController", ["$rootScope", "Modules", "$log", "$location", | @@ -175,9 +175,24 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location", | ||
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("HomeController", ["$rootScope", "Modules", "$log", "$location", | @@ -197,28 +212,23 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location", | ||
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("HomeController", ["$rootScope", "Modules", "$log", "$location", | @@ -232,13 +242,30 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location", | ||
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("HomeController", ["$rootScope", "Modules", "$log", "$location", | @@ -253,7 +280,7 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location", | ||
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("HomeController", ["$rootScope", "Modules", "$log", "$location", | @@ -267,7 +294,7 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location", | ||
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("HomeController", ["$rootScope", "Modules", "$log", "$location", | @@ -285,14 +312,14 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location", | ||
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("HomeController", ["$rootScope", "Modules", "$log", "$location", | @@ -300,7 +327,7 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location", | ||
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("HomeController", ["$rootScope", "Modules", "$log", "$location", | @@ -314,7 +341,7 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location", | ||
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("HomeController", ["$rootScope", "Modules", "$log", "$location", | @@ -331,7 +358,7 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location", | ||
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("HomeController", ["$rootScope", "Modules", "$log", "$location", | @@ -522,7 +549,7 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location", | ||
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> | 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> |
433 | <div class="marginL2 pull-left"><input type="number" id="amount-2" value="25" step="1" style="width:60px;"></div> | 433 | <div class="marginL2 pull-left"><input type="number" id="amount-2" value="25" step="1" style="width:60px;"></div> |
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;"> </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 |