Skip to content
This repository
Browse code

Initial import.

  • Loading branch information...
commit 2b9ae11922cd0c850ba0b2498b0a526165c39e35 0 parents
Rowan Lewis authored August 22, 2009
3  .gitignore
... ...
@@ -0,0 +1,3 @@
  1
+.Apple*
  2
+.DS*
  3
+*.esproj
5  chrome.manifest
... ...
@@ -0,0 +1,5 @@
  1
+content abduction chrome/content/
  2
+locale abduction en-US chrome/locale/en-US/
  3
+locale abduction en-AU chrome/locale/en-AU/
  4
+locale abduction it-IT chrome/locale/it-IT/
  5
+overlay chrome://browser/content/browser.xul chrome://abduction/content/browser.xul
885  chrome/content/browser.js
... ...
@@ -0,0 +1,885 @@
  1
+/*-----------------------------------------------------------------------------------------------*/
  2
+	
  3
+	var abduction = function(target, label) {
  4
+		var setting = {
  5
+			min_height:			4,
  6
+			min_width:			4,
  7
+			scroll_factor:		0.5,
  8
+		};
  9
+		
  10
+		var widget = {
  11
+			window:				null,
  12
+			document:			null,
  13
+			root:				null,
  14
+			body:				null,
  15
+			overlay:			null,
  16
+			selection:			null,
  17
+			selection_top:		null,
  18
+			selection_bottom:	null,
  19
+			selection_left:		null,
  20
+			selection_right:	null
  21
+		};
  22
+		
  23
+		var get_position = function(element) {
  24
+			var result = {
  25
+				left:	0,
  26
+				top:	0,
  27
+				height:	element.offsetHeight,
  28
+				width:	element.offsetWidth
  29
+			};
  30
+			
  31
+			if (element.offsetParent) do {
  32
+				result.left += element.offsetLeft;
  33
+				result.top += element.offsetTop;
  34
+				
  35
+			} while (element = element.offsetParent);
  36
+			
  37
+			return result;
  38
+		};
  39
+		
  40
+		var scroll_to_y = function(min_y, max_y) {
  41
+			var scroll_up = Math.round(
  42
+				(24 - min_y + widget.root.scrollTop) * setting.scroll_factor
  43
+			);
  44
+			var scroll_down = Math.round(
  45
+				(24 + max_y - widget.overlay.offsetHeight - widget.root.scrollTop) * setting.scroll_factor
  46
+			);
  47
+			
  48
+			if (scroll_up > 0) {
  49
+				widget.root.scrollTop -= scroll_up;
  50
+			}
  51
+			
  52
+			else if (scroll_down > 0) {
  53
+				widget.root.scrollTop += scroll_down;
  54
+			}
  55
+		};
  56
+		
  57
+		var scroll_to_x = function(min_x, max_x) {
  58
+			var scroll_left = Math.round(
  59
+				(24 - min_x + widget.root.scrollLeft) * setting.scroll_factor
  60
+			);
  61
+			var scroll_down = Math.round(
  62
+				(24 + max_x - widget.overlay.offsetWidth - widget.root.scrollLeft) * setting.scroll_factor
  63
+			);
  64
+			
  65
+			if (scroll_left > 0) {
  66
+				widget.root.scrollLeft -= scroll_left;
  67
+			}
  68
+			
  69
+			else if (scroll_down > 0) {
  70
+				widget.root.scrollLeft += scroll_down;
  71
+			}
  72
+		};
  73
+		
  74
+		var event_connect = function(target, event, listener) {
  75
+			target.addEventListener(event, listener, false);
  76
+		};
  77
+		
  78
+		var event_release = function(target, event, listener) {
  79
+			target.removeEventListener(event, listener, false);
  80
+		};
  81
+		
  82
+		var event_stop = function(event) {
  83
+			if (event.preventDefault) {
  84
+				event.preventDefault();
  85
+			}
  86
+			
  87
+			event.stopPropagation();
  88
+		};
  89
+		
  90
+		var action_move = function(event) {
  91
+			var stop = function() {
  92
+				event_release(widget.selection, 'mousemove', move)
  93
+				event_release(widget.selection, 'mouseup', stop);
  94
+				event_release(widget.overlay, 'mousemove', move)
  95
+				event_release(widget.overlay, 'mouseup', stop);
  96
+				event_release(widget.document, 'mouseleave', stop);
  97
+			};
  98
+			var move = function(event) {
  99
+				var position = get_position(widget.selection);
  100
+				var left = (event.pageX + offsetX);
  101
+				var top = (event.pageY + offsetY);
  102
+				var height = position.height;
  103
+				var width = position.width;
  104
+				
  105
+				if (left < 0) left = 0;
  106
+				if (top < 0) top = 0;
  107
+				
  108
+				if (left + width > widget.root.scrollWidth) {
  109
+					left = widget.root.scrollWidth - width;
  110
+				}
  111
+				
  112
+				if (top + height > widget.root.scrollHeight) {
  113
+					top = widget.root.scrollHeight - height;
  114
+				}
  115
+				
  116
+				scroll_to_y(top, top + height);
  117
+				scroll_to_x(left, left + width);
  118
+				
  119
+				widget.selection.style.left = left + 'px';
  120
+				widget.selection.style.top = top + 'px';
  121
+			};
  122
+			
  123
+			if (action_maximize_state != null) return;
  124
+			
  125
+			var position = get_position(widget.selection);
  126
+			var offsetX = position.left - event.pageX;
  127
+			var offsetY = position.top - event.pageY;
  128
+			
  129
+			event_connect(widget.selection, 'mousemove', move)
  130
+			event_connect(widget.selection, 'mouseup', stop);
  131
+			event_connect(widget.overlay, 'mousemove', move)
  132
+			event_connect(widget.overlay, 'mouseup', stop);
  133
+			event_connect(widget.document, 'mouseleave', stop);
  134
+			event_stop(event);
  135
+		};
  136
+		
  137
+		// Maximze selection:
  138
+		var action_maximize_state = null;
  139
+		var action_maximize = function(event) {
  140
+			if (action_maximize_state != null) {
  141
+				var position = action_maximize_state;
  142
+				var height = position.height;
  143
+				var width = position.width;
  144
+				var top = position.top;
  145
+				var left = position.left;
  146
+				
  147
+				action_maximize_state = null;
  148
+			}
  149
+			
  150
+			else {
  151
+				var height = widget.root.scrollHeight;
  152
+				var width = widget.root.scrollWidth;
  153
+				var top = 0, left = 0;
  154
+				
  155
+				action_maximize_state = get_position(widget.selection);
  156
+			}
  157
+			
  158
+			widget.selection.style.height = height + 'px';
  159
+			widget.selection.style.left = left + 'px';
  160
+			widget.selection.style.top = top + 'px';
  161
+			widget.selection.style.width = width + 'px';
  162
+			
  163
+			event_stop(event);
  164
+		};
  165
+		
  166
+		var init_selection_top = function(event) {
  167
+			var selection = get_position(widget.selection);
  168
+			
  169
+			return {
  170
+				selection:	selection,
  171
+				offset:		selection.top - event.pageY,
  172
+				height:		selection.height + selection.top
  173
+			};
  174
+		};
  175
+		
  176
+		var init_selection_bottom = function(event) {
  177
+			var selection = get_position(widget.selection);
  178
+			
  179
+			return {
  180
+				selection:	selection,
  181
+				offset:		selection.height - event.pageY,
  182
+			};
  183
+		};
  184
+		
  185
+		var init_selection_left = function(event) {
  186
+			var selection = get_position(widget.selection);
  187
+			
  188
+			return {
  189
+				selection:	selection,
  190
+				offset:		selection.left - event.pageX,
  191
+				width:		selection.width + selection.left
  192
+			};
  193
+		};
  194
+		
  195
+		var init_selection_right = function(event) {
  196
+			var selection = get_position(widget.selection);
  197
+			
  198
+			return {
  199
+				selection:	selection,
  200
+				offset:		selection.width - event.pageX
  201
+			};
  202
+		};
  203
+		
  204
+		var set_selection_top = function(event, context) {
  205
+			var top = event.pageY + context.offset;
  206
+			var height = context.height;
  207
+			
  208
+			if (top < 0) top = 0;
  209
+			
  210
+			if (height - top < setting.min_height) {
  211
+				height = setting.min_height;
  212
+				top = context.height - height;
  213
+			}
  214
+			
  215
+			else {
  216
+				height -= top;
  217
+			}
  218
+			
  219
+			scroll_to_y(event.pageY, event.pageY);
  220
+			
  221
+			widget.selection.style.height = height + 'px';
  222
+			widget.selection.style.top = top + 'px';
  223
+		};
  224
+		
  225
+		var set_selection_bottom = function(event, context) {
  226
+			var height = (event.pageY + context.offset);
  227
+			
  228
+			if (height < setting.min_height) {
  229
+				height = setting.min_height;
  230
+			}
  231
+			
  232
+			if (context.selection.top + height > widget.root.scrollHeight) {
  233
+				height = widget.root.scrollHeight - context.selection.top;
  234
+			}
  235
+			
  236
+			scroll_to_y(event.pageY, event.pageY);
  237
+			
  238
+			widget.selection.style.height = height + 'px';
  239
+		};
  240
+		
  241
+		var set_selection_left = function(event, context) {
  242
+			var left = event.pageX + context.offset;
  243
+			var width = context.width;
  244
+			
  245
+			if (left < 0) left = 0;
  246
+			
  247
+			if (width - left < setting.min_width) {
  248
+				width = setting.min_width;
  249
+				left = context.width - width;
  250
+			}
  251
+			
  252
+			else {
  253
+				width -= left;
  254
+			}
  255
+			
  256
+			scroll_to_x(event.pageX, event.pageX);
  257
+			
  258
+			widget.selection.style.width = width + 'px';
  259
+			widget.selection.style.left = left + 'px';
  260
+		};
  261
+		
  262
+		var set_selection_right = function(event, context) {
  263
+			var width = (event.pageX + context.offset);
  264
+			
  265
+			if (width < setting.min_width) {
  266
+				width = setting.min_width;
  267
+			}
  268
+			
  269
+			if (context.selection.left + width > widget.root.scrollWidth) {
  270
+				width = widget.root.scrollWidth - context.selection.left;
  271
+			}
  272
+			
  273
+			scroll_to_x(event.pageX, event.pageX);
  274
+			
  275
+			widget.selection.style.width = width + 'px';
  276
+		};
  277
+		
  278
+		// Resize top:
  279
+		var action_top = function(event) {
  280
+			var stop = function() {
  281
+				widget.overlay.setAttribute('state', '');
  282
+				widget.selection.setAttribute('state', '');
  283
+				
  284
+				event_release(widget.selection, 'mousemove', move)
  285
+				event_release(widget.selection, 'mouseup', stop);
  286
+				event_release(widget.overlay, 'mousemove', move)
  287
+				event_release(widget.overlay, 'mouseup', stop);
  288
+				event_release(widget.document, 'mouseleave', stop);
  289
+			};
  290
+			var move = function(event) {
  291
+				widget.overlay.setAttribute('state', 'resize-top');
  292
+				widget.selection.setAttribute('state', 'resize-top');
  293
+				
  294
+				set_selection_top(event, context_top);
  295
+			};
  296
+			
  297
+			var context_top = init_selection_top(event);
  298
+			
  299
+			action_maximize_state = null;
  300
+			
  301
+			event_connect(widget.selection, 'mousemove', move)
  302
+			event_connect(widget.selection, 'mouseup', stop);
  303
+			event_connect(widget.overlay, 'mousemove', move)
  304
+			event_connect(widget.overlay, 'mouseup', stop);
  305
+			event_connect(widget.document, 'mouseleave', stop);
  306
+			event_stop(event);
  307
+		};
  308
+		
  309
+		// Resize top left:
  310
+		var action_top_left = function(event) {
  311
+			var stop = function() {
  312
+				widget.overlay.setAttribute('state', '');
  313
+				widget.selection.setAttribute('state', '');
  314
+				
  315
+				event_release(widget.selection, 'mousemove', move)
  316
+				event_release(widget.selection, 'mouseup', stop);
  317
+				event_release(widget.overlay, 'mousemove', move)
  318
+				event_release(widget.overlay, 'mouseup', stop);
  319
+				event_release(widget.document, 'mouseleave', stop);
  320
+			};
  321
+			var move = function(event) {
  322
+				widget.overlay.setAttribute('state', 'resize-top-left');
  323
+				widget.selection.setAttribute('state', 'resize-top-left');
  324
+				
  325
+				set_selection_top(event, context_top);
  326
+				set_selection_left(event, context_left);
  327
+			};
  328
+			
  329
+			var context_top = init_selection_top(event);
  330
+			var context_left = init_selection_left(event);
  331
+			
  332
+			action_maximize_state = null;
  333
+			
  334
+			event_connect(widget.selection, 'mousemove', move)
  335
+			event_connect(widget.selection, 'mouseup', stop);
  336
+			event_connect(widget.overlay, 'mousemove', move)
  337
+			event_connect(widget.overlay, 'mouseup', stop);
  338
+			event_connect(widget.document, 'mouseleave', stop);
  339
+			event_stop(event);
  340
+		};
  341
+		
  342
+		// Resize top right:
  343
+		var action_top_right = function(event) {
  344
+			var stop = function() {
  345
+				widget.overlay.setAttribute('state', '');
  346
+				widget.selection.setAttribute('state', '');
  347
+				
  348
+				event_release(widget.selection, 'mousemove', move)
  349
+				event_release(widget.selection, 'mouseup', stop);
  350
+				event_release(widget.overlay, 'mousemove', move)
  351
+				event_release(widget.overlay, 'mouseup', stop);
  352
+				event_release(widget.document, 'mouseleave', stop);
  353
+			};
  354
+			var move = function(event) {
  355
+				widget.overlay.setAttribute('state', 'resize-top-right');
  356
+				widget.selection.setAttribute('state', 'resize-top-right');
  357
+				
  358
+				set_selection_top(event, context_top);
  359
+				set_selection_right(event, context_right);
  360
+			};
  361
+			
  362
+			var context_top = init_selection_top(event);
  363
+			var context_right = init_selection_right(event);
  364
+			
  365
+			action_maximize_state = null;
  366
+			
  367
+			event_connect(widget.selection, 'mousemove', move)
  368
+			event_connect(widget.selection, 'mouseup', stop);
  369
+			event_connect(widget.overlay, 'mousemove', move)
  370
+			event_connect(widget.overlay, 'mouseup', stop);
  371
+			event_connect(widget.document, 'mouseleave', stop);
  372
+			event_stop(event);
  373
+		};
  374
+		
  375
+		// Resize bottom:
  376
+		var action_bottom = function(event) {
  377
+			var stop = function() {
  378
+				widget.overlay.setAttribute('state', '');
  379
+				widget.selection.setAttribute('state', '');
  380
+				
  381
+				event_release(widget.selection, 'mousemove', move)
  382
+				event_release(widget.selection, 'mouseup', stop);
  383
+				event_release(widget.overlay, 'mousemove', move)
  384
+				event_release(widget.overlay, 'mouseup', stop);
  385
+				event_release(widget.document, 'mouseleave', stop);
  386
+			};
  387
+			var move = function(event) {
  388
+				widget.overlay.setAttribute('state', 'resize-bottom');
  389
+				widget.selection.setAttribute('state', 'resize-bottom');
  390
+				
  391
+				set_selection_bottom(event, context_bottom);
  392
+			};
  393
+			
  394
+			var context_bottom = init_selection_bottom(event);
  395
+			
  396
+			action_maximize_state = null;
  397
+			
  398
+			event_connect(widget.selection, 'mousemove', move)
  399
+			event_connect(widget.selection, 'mouseup', stop);
  400
+			event_connect(widget.overlay, 'mousemove', move)
  401
+			event_connect(widget.overlay, 'mouseup', stop);
  402
+			event_connect(widget.document, 'mouseleave', stop);
  403
+			event_stop(event);
  404
+		};
  405
+		
  406
+		// Resize bottom left:
  407
+		var action_bottom_left = function(event) {
  408
+			var stop = function() {
  409
+				widget.overlay.setAttribute('state', '');
  410
+				widget.selection.setAttribute('state', '');
  411
+				
  412
+				event_release(widget.selection, 'mousemove', move)
  413
+				event_release(widget.selection, 'mouseup', stop);
  414
+				event_release(widget.overlay, 'mousemove', move)
  415
+				event_release(widget.overlay, 'mouseup', stop);
  416
+				event_release(widget.document, 'mouseleave', stop);
  417
+			};
  418
+			var move = function(event) {
  419
+				widget.overlay.setAttribute('state', 'resize-bottom-left');
  420
+				widget.selection.setAttribute('state', 'resize-bottom-left');
  421
+				
  422
+				set_selection_bottom(event, context_bottom);
  423
+				set_selection_left(event, context_left);
  424
+			};
  425
+			
  426
+			var context_bottom = init_selection_bottom(event);
  427
+			var context_left = init_selection_left(event);
  428
+			
  429
+			action_maximize_state = null;
  430
+			
  431
+			event_connect(widget.selection, 'mousemove', move)
  432
+			event_connect(widget.selection, 'mouseup', stop);
  433
+			event_connect(widget.overlay, 'mousemove', move)
  434
+			event_connect(widget.overlay, 'mouseup', stop);
  435
+			event_connect(widget.document, 'mouseleave', stop);
  436
+			event_stop(event);
  437
+		};
  438
+		
  439
+		// Resize bottom right:
  440
+		var action_bottom_right = function(event) {
  441
+			var stop = function() {
  442
+				widget.overlay.setAttribute('state', '');
  443
+				widget.selection.setAttribute('state', '');
  444
+				
  445
+				event_release(widget.selection, 'mousemove', move)
  446
+				event_release(widget.selection, 'mouseup', stop);
  447
+				event_release(widget.overlay, 'mousemove', move)
  448
+				event_release(widget.overlay, 'mouseup', stop);
  449
+				event_release(widget.document, 'mouseleave', stop);
  450
+			};
  451
+			var move = function(event) {
  452
+				widget.overlay.setAttribute('state', 'resize-bottom-right');
  453
+				widget.selection.setAttribute('state', 'resize-bottom-right');
  454
+				
  455
+				set_selection_bottom(event, context_bottom);
  456
+				set_selection_right(event, context_right);
  457
+			};
  458
+			
  459
+			var context_bottom = init_selection_bottom(event);
  460
+			var context_right = init_selection_right(event);
  461
+			
  462
+			action_maximize_state = null;
  463
+			
  464
+			event_connect(widget.selection, 'mousemove', move)
  465
+			event_connect(widget.selection, 'mouseup', stop);
  466
+			event_connect(widget.overlay, 'mousemove', move)
  467
+			event_connect(widget.overlay, 'mouseup', stop);
  468
+			event_connect(widget.document, 'mouseleave', stop);
  469
+			event_stop(event);
  470
+		};
  471
+		
  472
+		// Resize left:
  473
+		var action_left = function(event) {
  474
+			var stop = function() {
  475
+				widget.overlay.setAttribute('state', '');
  476
+				widget.selection.setAttribute('state', '');
  477
+				
  478
+				event_release(widget.selection, 'mousemove', move)
  479
+				event_release(widget.selection, 'mouseup', stop);
  480
+				event_release(widget.overlay, 'mousemove', move)
  481
+				event_release(widget.overlay, 'mouseup', stop);
  482
+				event_release(widget.document, 'mouseleave', stop);
  483
+			};
  484
+			var move = function(event) {
  485
+				widget.overlay.setAttribute('state', 'resize-left');
  486
+				widget.selection.setAttribute('state', 'resize-left');
  487
+				
  488
+				set_selection_left(event, context_left);
  489
+			};
  490
+			
  491
+			var context_left = init_selection_left(event);
  492
+			
  493
+			action_maximize_state = null;
  494
+			
  495
+			event_connect(widget.selection, 'mousemove', move)
  496
+			event_connect(widget.selection, 'mouseup', stop);
  497
+			event_connect(widget.overlay, 'mousemove', move)
  498
+			event_connect(widget.overlay, 'mouseup', stop);
  499
+			event_connect(widget.document, 'mouseleave', stop);
  500
+			event_stop(event);
  501
+		};
  502
+		
  503
+		// Resize right:
  504
+		var action_right = function(event) {
  505
+			var stop = function() {
  506
+				widget.overlay.setAttribute('state', '');
  507
+				widget.selection.setAttribute('state', '');
  508
+				
  509
+				event_release(widget.selection, 'mousemove', move)
  510
+				event_release(widget.selection, 'mouseup', stop);
  511
+				event_release(widget.overlay, 'mousemove', move)
  512
+				event_release(widget.overlay, 'mouseup', stop);
  513
+				event_release(widget.document, 'mouseleave', stop);
  514
+			};
  515
+			var move = function(event) {
  516
+				widget.overlay.setAttribute('state', 'resize-right');
  517
+				widget.selection.setAttribute('state', 'resize-right');
  518
+				
  519
+				set_selection_right(event, context_right);
  520
+			};
  521
+			
  522
+			var context_right = init_selection_right(event);
  523
+			
  524
+			action_maximize_state = null;
  525
+			
  526
+			event_connect(widget.selection, 'mousemove', move)
  527
+			event_connect(widget.selection, 'mouseup', stop);
  528
+			event_connect(widget.overlay, 'mousemove', move)
  529
+			event_connect(widget.overlay, 'mouseup', stop);
  530
+			event_connect(widget.document, 'mouseleave', stop);
  531
+			event_stop(event);
  532
+		};
  533
+		
  534
+		// Select:
  535
+		var action_all = function(event) {
  536
+			var stop = function() {
  537
+				widget.overlay.setAttribute('state', '');
  538
+				widget.selection.setAttribute('state', '');
  539
+				
  540
+				event_release(widget.selection, 'mousemove', move)
  541
+				event_release(widget.selection, 'mouseup', stop);
  542
+				event_release(widget.overlay, 'mousemove', move)
  543
+				event_release(widget.overlay, 'mouseup', stop);
  544
+				event_release(widget.document, 'mouseleave', stop);
  545
+			};
  546
+			var move = function(event) {
  547
+				widget.overlay.setAttribute('state', 'selecting');
  548
+				widget.selection.setAttribute('state', 'selecting');
  549
+				
  550
+				if (start.x < event.pageX) {
  551
+					var width = event.pageX - start.x;
  552
+					var left = start.x;
  553
+				}
  554
+				
  555
+				else {
  556
+					var width = start.x - event.pageX;
  557
+					var left = event.pageX;
  558
+				}
  559
+				
  560
+				if (start.y < event.pageY) {
  561
+					var height = event.pageY - start.y;
  562
+					var top = start.y;
  563
+				}
  564
+				
  565
+				else {
  566
+					var height = start.y - event.pageY;
  567
+					var top = event.pageY;
  568
+				}
  569
+				
  570
+				if (width < 4) width = 4;
  571
+				if (height < 4) height = 4;
  572
+				
  573
+				scroll_to_y(event.pageY, event.pageY);
  574
+				scroll_to_x(event.pageX, event.pageX);
  575
+				
  576
+				widget.selection.style.top = top + 'px';
  577
+				widget.selection.style.left = left + 'px';
  578
+				widget.selection.style.width = width + 'px';
  579
+				widget.selection.style.height = height + 'px';
  580
+			};
  581
+			
  582
+			var start = {
  583
+				x:	event.pageX,
  584
+				y:	event.pageY
  585
+			};
  586
+			
  587
+			action_maximize_state = null;
  588
+			
  589
+			event_connect(widget.selection, 'mousemove', move)
  590
+			event_connect(widget.selection, 'mouseup', stop);
  591
+			event_connect(widget.overlay, 'mousemove', move)
  592
+			event_connect(widget.overlay, 'mouseup', stop);
  593
+			event_connect(widget.document, 'mouseleave', stop);
  594
+			event_stop(event);
  595
+		};
  596
+		
  597
+		// Define widgets:
  598
+		widget.document = window.top.getBrowser().selectedBrowser.contentWindow.document;
  599
+		//widget.document = document;
  600
+		widget.window = widget.document.defaultView;
  601
+		widget.root = widget.document.documentElement;
  602
+		widget.overlay = widget.document.createElement('abduction-overlay');
  603
+		widget.selection = widget.document.createElement('abduction-selection');
  604
+		widget.selection_inner = widget.document.createElement('abduction-selection-inner');
  605
+		widget.selection_top = widget.document.createElement('abduction-selection-top');
  606
+		widget.selection_top_left = widget.document.createElement('abduction-selection-top-left');
  607
+		widget.selection_top_right = widget.document.createElement('abduction-selection-top-right');
  608
+		widget.selection_bottom = widget.document.createElement('abduction-selection-bottom');
  609
+		widget.selection_bottom_left = widget.document.createElement('abduction-selection-bottom-left');
  610
+		widget.selection_bottom_right = widget.document.createElement('abduction-selection-bottom-right');
  611
+		widget.selection_left = widget.document.createElement('abduction-selection-left');
  612
+		widget.selection_right = widget.document.createElement('abduction-selection-right');
  613
+		
  614
+		var styles = widget.document.createElement('style');
  615
+		styles.setAttribute('type', 'text/css');
  616
+		styles.appendChild(widget.document.createTextNode('\
  617
+			abduction-overlay {\
  618
+				background: hsla(0, 0%, 0%, 0.3);\
  619
+				cursor: crosshair;\
  620
+				height: 100%;\
  621
+				left: 0;\
  622
+				position: fixed;\
  623
+				top: 0;\
  624
+				width: 100%;\
  625
+				z-index: 1000002;\
  626
+			}\
  627
+			abduction-selection,\
  628
+			abduction-selection * {\
  629
+				-moz-box-sizing: border-box;\
  630
+				display: block;\
  631
+			}\
  632
+			abduction-selection {\
  633
+				background: hsla(80, 100%, 50%, 0.3);\
  634
+				border: 1px solid hsla(80, 100%, 20%, 0.7);\
  635
+				overflow: hidden;\
  636
+				position: absolute;\
  637
+				z-index: 1000003;\
  638
+			}\
  639
+			abduction-selection-inner {\
  640
+				border: 1px solid hsla(80, 100%, 80%, 0.5);\
  641
+				cursor: move;\
  642
+				height: 100%;\
  643
+				overflow: hidden;\
  644
+				width: 100%;\
  645
+			}\
  646
+			abduction-selection-top {\
  647
+				border-bottom: 1px dashed hsla(80, 100%, 80%, 0.5);\
  648
+				cursor: n-resize;\
  649
+				height: 8px;\
  650
+				left: 8px;\
  651
+				position: absolute;\
  652
+				right: 8px;\
  653
+				top: 0;\
  654
+			}\
  655
+			abduction-selection-top-left {\
  656
+				cursor: nw-resize;\
  657
+				height: 8px;\
  658
+				left: 0;\
  659
+				position: absolute;\
  660
+				top: 0;\
  661
+				width: 8px;\
  662
+			}\
  663
+			abduction-selection-top-right {\
  664
+				cursor: ne-resize;\
  665
+				height: 8px;\
  666
+				position: absolute;\
  667
+				right: 0;\
  668
+				top: 0;\
  669
+				width: 8px;\
  670
+			}\
  671
+			abduction-selection-bottom {\
  672
+				border-top: 1px dashed hsla(80, 100%, 80%, 0.5);\
  673
+				bottom: 0;\
  674
+				cursor: s-resize;\
  675
+				height: 8px;\
  676
+				left: 8px;\
  677
+				position: absolute;\
  678
+				right: 8px;\
  679
+			}\
  680
+			abduction-selection-bottom-left {\
  681
+				bottom: 0;\
  682
+				cursor: sw-resize;\
  683
+				height: 8px;\
  684
+				left: 0;\
  685
+				position: absolute;\
  686
+				width: 8px;\
  687
+			}\
  688
+			abduction-selection-bottom-right {\
  689
+				bottom: 0;\
  690
+				cursor: se-resize;\
  691
+				height: 8px;\
  692
+				position: absolute;\
  693
+				right: 0;\
  694
+				width: 8px;\
  695
+			}\
  696
+			abduction-selection-left {\
  697
+				border-right: 1px dashed hsla(80, 100%, 80%, 0.5);\
  698
+				bottom: 8px;\
  699
+				cursor: w-resize;\
  700
+				left: 0;\
  701
+				position: absolute;\
  702
+				top: 8px;\
  703
+				width: 8px;\
  704
+			}\
  705
+			abduction-selection-right {\
  706
+				border-left: 1px dashed hsla(80, 100%, 80%, 0.5);\
  707
+				bottom: 8px;\
  708
+				cursor: e-resize;\
  709
+				position: absolute;\
  710
+				right: 0;\
  711
+				top: 8px;\
  712
+				width: 8px;\
  713
+			}\
  714
+			abduction-overlay[state = "selecting"],\
  715
+			abduction-selection[state = "selecting"],\
  716
+			abduction-selection[state = "selecting"] * {\
  717
+				cursor: crosshair;\
  718
+			}\
  719
+			abduction-overlay[state = "resize-top"],\
  720
+			abduction-selection[state = "resize-top"],\
  721
+			abduction-selection[state = "resize-top"] * {\
  722
+				cursor: n-resize;\
  723
+			}\
  724
+			abduction-overlay[state = "resize-top-left"],\
  725
+			abduction-selection[state = "resize-top-left"],\
  726
+			abduction-selection[state = "resize-top-left"] * {\
  727
+				cursor: nw-resize;\
  728
+			}\
  729
+			abduction-overlay[state = "resize-top-right"],\
  730
+			abduction-selection[state = "resize-top-right"],\
  731
+			abduction-selection[state = "resize-top-right"] * {\
  732
+				cursor: ne-resize;\
  733
+			}\
  734
+			abduction-overlay[state = "resize-bottom"],\
  735
+			abduction-selection[state = "resize-bottom"],\
  736
+			abduction-selection[state = "resize-bottom"] * {\
  737
+				cursor: s-resize;\
  738
+			}\
  739
+			abduction-overlay[state = "resize-bottom-left"],\
  740
+			abduction-selection[state = "resize-bottom-left"],\
  741
+			abduction-selection[state = "resize-bottom-left"] * {\
  742
+				cursor: sw-resize;\
  743
+			}\
  744
+			abduction-overlay[state = "resize-bottom-right"],\
  745
+			abduction-selection[state = "resize-bottom-right"],\
  746
+			abduction-selection[state = "resize-bottom-right"] * {\
  747
+				cursor: se-resize;\
  748
+			}\
  749
+			abduction-overlay[state = "resize-left"],\
  750
+			abduction-selection[state = "resize-left"],\
  751
+			abduction-selection[state = "resize-left"] * {\
  752
+				cursor: w-resize;\
  753
+			}\
  754
+			abduction-overlay[state = "resize-right"],\
  755
+			abduction-selection[state = "resize-right"],\
  756
+			abduction-selection[state = "resize-right"] * {\
  757
+				cursor: e-resize;\
  758
+			}\
  759
+		'));
  760
+		widget.root.appendChild(styles);
  761
+		widget.root.appendChild(widget.overlay);
  762
+		
  763
+		if (target) {
  764
+			var target_position = get_position(target);
  765
+			
  766
+			if (target_position.height < setting.min_height) {
  767
+				target_position.height = setting.min_height;
  768
+			}
  769
+			
  770
+			if (target_position.width < setting.min_width) {
  771
+				target_position.width = setting.min_width;
  772
+			}
  773
+			
  774
+			widget.selection.style.height = target_position.height + 'px';
  775
+			widget.selection.style.left = target_position.left + 'px';
  776
+			widget.selection.style.top = target_position.top + 'px';
  777
+			widget.selection.style.width = target_position.width + 'px';
  778
+		}
  779
+		
  780
+		else {
  781
+			widget.selection.style.height = (widget.window.innerHeight * 0.33) + 'px';
  782
+			widget.selection.style.left = (widget.window.innerWidth * 0.33) + 'px';
  783
+			widget.selection.style.top = (widget.root.scrollTop + (widget.window.innerHeight * 0.33)) + 'px';
  784
+			widget.selection.style.width = (widget.window.innerWidth * 0.33) + 'px';
  785
+		}
  786
+		
  787
+		widget.root.appendChild(widget.selection);
  788
+		widget.selection.appendChild(widget.selection_inner);
  789
+		widget.selection_inner.appendChild(widget.selection_top);
  790
+		widget.selection_inner.appendChild(widget.selection_top_left);
  791
+		widget.selection_inner.appendChild(widget.selection_top_right);
  792
+		widget.selection_inner.appendChild(widget.selection_bottom);
  793
+		widget.selection_inner.appendChild(widget.selection_bottom_left);
  794
+		widget.selection_inner.appendChild(widget.selection_bottom_right);
  795
+		widget.selection_inner.appendChild(widget.selection_left);
  796
+		widget.selection_inner.appendChild(widget.selection_right);
  797
+		
  798
+		widget.overlay.setAttribute('state', '');
  799
+		widget.selection.setAttribute('state', '');
  800
+		
  801
+		// Bind actions:
  802
+		event_connect(widget.overlay, 'mousedown', action_all);
  803
+		event_connect(widget.selection, 'mousedown', action_move);
  804
+		event_connect(widget.selection, 'dblclick', action_maximize);
  805
+		event_connect(widget.selection_top, 'mousedown', action_top);
  806
+		event_connect(widget.selection_top_left, 'mousedown', action_top_left);
  807
+		event_connect(widget.selection_top_right, 'mousedown', action_top_right);
  808
+		event_connect(widget.selection_bottom, 'mousedown', action_bottom);
  809
+		event_connect(widget.selection_bottom_left, 'mousedown', action_bottom_left);
  810
+		event_connect(widget.selection_bottom_right, 'mousedown', action_bottom_right);
  811
+		event_connect(widget.selection_left, 'mousedown', action_left);
  812
+		event_connect(widget.selection_right, 'mousedown', action_right);
  813
+		
  814
+	/*-------------------------------------------------------------------------------------------*/
  815
+
  816
+		var capture = function() {
  817
+			var canvas = document.createElementNS('http://www.w3.org/1999/xhtml', 'html:canvas');
  818
+			var context = canvas.getContext('2d');
  819
+			var selection = get_position(widget.selection);
  820
+			
  821
+			canvas.height = selection.height;
  822
+			canvas.width = selection.width;
  823
+			
  824
+			widget.overlay.style.display = 'none';
  825
+			widget.selection.style.display = 'none';
  826
+			
  827
+			context.drawWindow(
  828
+				widget.window,
  829
+				selection.left,
  830
+				selection.top,
  831
+				selection.width,
  832
+				selection.height,
  833
+				'rgb(255, 255, 255)'
  834
+			);
  835
+			
  836
+			widget.overlay.style.display = 'block';
  837
+			widget.selection.style.display = 'block';
  838
+			
  839
+			return canvas.toDataURL();
  840
+		};
  841
+		var action_close = function(event) {
  842
+			event_release(notice, 'command', action_close);
  843
+			event_release(widget.window, 'unload', action_close);
  844
+			
  845
+			widget.root.removeChild(styles);
  846
+			widget.root.removeChild(widget.overlay);
  847
+			widget.root.removeChild(widget.selection);
  848
+			notices.removeAllNotifications(true);
  849
+		};
  850
+		var action_save = function(event) {
  851
+			internalSave(
  852
+				capture(), null, filename + '.png', null,
  853
+				'image/png', true, null, null, null, false
  854
+			);
  855
+			action_close();
  856
+		};
  857
+		var action_keydown = function(event) {
  858
+			if (event.keyCode == 27) action_close();
  859
+			else if (event.keyCode == 13) action_save();
  860
+			else return;
  861
+			
  862
+			event_release(widget.window, 'keydown', action_keydown);
  863
+		};
  864
+		var append_notice = function() {
  865
+			return notices.appendNotification(
  866
+				label.notice + ' ' + filename, 'abduction-controls',
  867
+				null, notices.PRIORITY_INFO_HIGH, [
  868
+					{
  869
+						label:		label.save,
  870
+						callback:	action_save
  871
+					}
  872
+				]
  873
+			);
  874
+		};
  875
+		
  876
+		var notices = window.getNotificationBox(widget.window);
  877
+		var filename = (widget.document.title ? widget.document.title : widget.document.URL);
  878
+		var notice = append_notice();
  879
+		
  880
+		event_connect(notice, 'command', action_close);
  881
+		event_connect(widget.window, 'unload', action_close);
  882
+		event_connect(widget.window, 'keydown', action_keydown);
  883
+	};
  884
+	
  885
+/*-----------------------------------------------------------------------------------------------*/
36  chrome/content/browser.xul
... ...
@@ -0,0 +1,36 @@
  1
+<?xml version="1.0"?>
  2
+<!DOCTYPE overlay SYSTEM "chrome://abduction/locale/abduction.dtd">
  3
+<overlay xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" xmlns:html="http://www.w3.org/1999/xhtml">
  4
+	<script src="chrome://abduction/content/browser.js" />
  5
+	
  6
+	<!-- File Menu -->
  7
+	<menupopup id="menu_FilePopup">
  8
+		<menuitem
  9
+			id="menu_FileAbduction"
  10
+			insertafter="menu_saveFrame"
  11
+			key="key_Abduction"
  12
+			label="&abduction.menu;"
  13
+			oncommand="
  14
+				abduction(document.popupNode, {
  15
+					notice:	'&abduction.notice;',
  16
+					save:	'&abduction.save;'
  17
+				});
  18
+			"
  19
+		/>
  20
+	</menupopup>
  21
+	
  22
+	<!-- Context Menu -->
  23
+	<popup id="contentAreaContextMenu">
  24
+		<menuitem
  25
+			id="menu_ContextAbduction"
  26
+			insertafter="context-savepage"
  27
+			label="&abduction.menu;"
  28
+			oncommand="
  29
+				abduction(document.popupNode, {
  30
+					notice:	'&abduction.notice;',
  31
+					save:	'&abduction.save;'
  32
+				});
  33
+			"
  34
+		/>
  35
+	</popup>
  36
+</overlay>
BIN  chrome/content/icon.png
3  chrome/locale/en-AU/abduction.dtd
... ...
@@ -0,0 +1,3 @@
  1
+<!ENTITY abduction.notice	"Save image of:">
  2
+<!ENTITY abduction.save		"Save selection...">
  3
+<!ENTITY abduction.menu		"Save Page As Image...">
3  chrome/locale/en-US/abduction.dtd
... ...
@@ -0,0 +1,3 @@
  1
+<!ENTITY abduction.notice	"Save image of:">
  2
+<!ENTITY abduction.save		"Save selection...">
  3
+<!ENTITY abduction.menu		"Save Page As Image...">
3  chrome/locale/it-IT/abduction.dtd
... ...
@@ -0,0 +1,3 @@
  1
+<!ENTITY abduction.notice	"Salva immagine di:">
  2
+<!ENTITY abduction.save		"Salva selezione...">
  3
+<!ENTITY abduction.menu		"Salva pagina come immagine...">
45  install.rdf
... ...
@@ -0,0 +1,45 @@
  1
+<?xml version="1.0"?>
  2
+<RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:em="http://www.mozilla.org/2004/em-rdf#">
  3
+	<Description about="urn:mozilla:install-manifest">
  4
+		<em:id>{b0e1b4a6-2c6f-4e99-94f2-8e625d7ae255}</em:id>
  5
+		<em:localized>
  6
+			<Description>
  7
+				<em:locale>en-US</em:locale>
  8
+				<em:name>Abduction!</em:name>
  9
+				<em:description>Lets you capture an image of a web page, select the part you want and save it.</em:description>
  10
+			</Description>
  11
+		</em:localized>
  12
+		<em:localized>
  13
+			<Description>
  14
+				<em:locale>en-AU</em:locale>
  15
+				<em:name>Abduction!</em:name>
  16
+				<em:description>Lets you capture an image of a web page, select the part you want and save it.</em:description>
  17
+			</Description>
  18
+		</em:localized>
  19
+		<em:localized>
  20
+			<Description>
  21
+				<em:locale>it-IT</em:locale>
  22
+				<em:name>Abduction!</em:name>
  23
+				<em:description>Permette di salvare come immagine una pagina web o una sua porzione.</em:description>
  24
+			</Description>
  25
+		</em:localized>
  26
+		
  27
+		<em:name>Abduction!</em:name>
  28
+		<em:version>3.0.4</em:version>		
  29
+		<em:description>Lets you capture an image of a web page, select the part you want and save it.</em:description>
  30
+		<em:creator>Rowan Lewis</em:creator>
  31
+		<em:homepageURL>http://github.com/rowan-lewis/abduction/</em:homepageURL>
  32
+		<em:iconURL>chrome://abduction/content/icon.png</em:iconURL>
  33
+		<em:type>2</em:type>
  34
+		<em:translator>Stefano Tintorini</em:translator>
  35
+		
  36
+		<!-- Firefox -->
  37
+		<em:targetApplication>
  38
+			<Description>
  39
+				<em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id>
  40
+				<em:minVersion>3.5</em:minVersion>
  41
+				<em:maxVersion>3.6b1pre</em:maxVersion>
  42
+			</Description>
  43
+		</em:targetApplication>
  44
+	</Description>      
  45
+</RDF>

0 notes on commit 2b9ae11

Please sign in to comment.
Something went wrong with that request. Please try again.