OLD | NEW |
1 // Copyright (c) 2012 The Chromium Authors. All rights reserved. | 1 // Copyright (c) 2012 The Chromium Authors. All rights reserved. |
2 // Use of this source code is governed by a BSD-style license that can be | 2 // Use of this source code is governed by a BSD-style license that can be |
3 // found in the LICENSE file. | 3 // found in the LICENSE file. |
4 | 4 |
5 cr.define('options', function() { | 5 cr.define('options', function() { |
6 var OptionsPage = options.OptionsPage; | 6 var OptionsPage = options.OptionsPage; |
7 | 7 |
8 // The scale ratio of the display rectangle to its original size. | 8 // The scale ratio of the display rectangle to its original size. |
9 /** @const */ var VISUAL_SCALE = 1 / 10; | 9 /** @const */ var VISUAL_SCALE = 1 / 10; |
10 | 10 |
(...skipping 194 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
205 onTouchMove_: function(e) { | 205 onTouchMove_: function(e) { |
206 if (e.touches.length != 1) | 206 if (e.touches.length != 1) |
207 return true; | 207 return true; |
208 | 208 |
209 var touchLocation = {x: e.touches[0].pageX, y: e.touches[0].pageY}; | 209 var touchLocation = {x: e.touches[0].pageX, y: e.touches[0].pageY}; |
210 // Touch move events happen even if the touch location doesn't change, but | 210 // Touch move events happen even if the touch location doesn't change, but |
211 // it doesn't need to process the dragging. Since sometimes the touch | 211 // it doesn't need to process the dragging. Since sometimes the touch |
212 // position changes slightly even though the user doesn't think to move | 212 // position changes slightly even though the user doesn't think to move |
213 // the finger, very small move is just ignored. | 213 // the finger, very small move is just ignored. |
214 /** @const */ var IGNORABLE_TOUCH_MOVE_PX = 1; | 214 /** @const */ var IGNORABLE_TOUCH_MOVE_PX = 1; |
215 var x_diff = Math.abs(touchLocation.x - this.lastTouchLocation_.x); | 215 var xDiff = Math.abs(touchLocation.x - this.lastTouchLocation_.x); |
216 var y_diff = Math.abs(touchLocation.y - this.lastTouchLocation_.y); | 216 var yDiff = Math.abs(touchLocation.y - this.lastTouchLocation_.y); |
217 if (x_diff <= IGNORABLE_TOUCH_MOVE_PX && | 217 if (xDiff <= IGNORABLE_TOUCH_MOVE_PX && |
218 y_diff <= IGNORABLE_TOUCH_MOVE_PX) { | 218 yDiff <= IGNORABLE_TOUCH_MOVE_PX) { |
219 return true; | 219 return true; |
220 } | 220 } |
221 | 221 |
222 this.lastTouchLocation_ = touchLocation; | 222 this.lastTouchLocation_ = touchLocation; |
223 return this.processDragging_(e, touchLocation); | 223 return this.processDragging_(e, touchLocation); |
224 }, | 224 }, |
225 | 225 |
226 /** | 226 /** |
227 * Mouse down handler for dragging display rectangle. | 227 * Mouse down handler for dragging display rectangle. |
228 * @param {Event} e The mouse down event. | 228 * @param {Event} e The mouse down event. |
(...skipping 120 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
349 y: newPosition.y + draggingDiv.offsetHeight / 2 | 349 y: newPosition.y + draggingDiv.offsetHeight / 2 |
350 }; | 350 }; |
351 | 351 |
352 var baseBounds = { | 352 var baseBounds = { |
353 x: baseDiv.offsetLeft, | 353 x: baseDiv.offsetLeft, |
354 y: baseDiv.offsetTop, | 354 y: baseDiv.offsetTop, |
355 width: baseDiv.offsetWidth, | 355 width: baseDiv.offsetWidth, |
356 height: baseDiv.offsetHeight | 356 height: baseDiv.offsetHeight |
357 }; | 357 }; |
358 switch (getPositionToRectangle(baseBounds, newCenter)) { | 358 switch (getPositionToRectangle(baseBounds, newCenter)) { |
359 case SecondaryDisplayLayout.RIGHT: | 359 case SecondaryDisplayLayout.RIGHT: |
360 this.layout_ = this.dragging_.display.isPrimary ? | 360 this.layout_ = this.dragging_.display.isPrimary ? |
361 SecondaryDisplayLayout.LEFT : SecondaryDisplayLayout.RIGHT; | 361 SecondaryDisplayLayout.LEFT : SecondaryDisplayLayout.RIGHT; |
362 break; | 362 break; |
363 case SecondaryDisplayLayout.LEFT: | 363 case SecondaryDisplayLayout.LEFT: |
364 this.layout_ = this.dragging_.display.isPrimary ? | 364 this.layout_ = this.dragging_.display.isPrimary ? |
365 SecondaryDisplayLayout.RIGHT : SecondaryDisplayLayout.LEFT; | 365 SecondaryDisplayLayout.RIGHT : SecondaryDisplayLayout.LEFT; |
366 break; | 366 break; |
367 case SecondaryDisplayLayout.TOP: | 367 case SecondaryDisplayLayout.TOP: |
368 this.layout_ = this.dragging_.display.isPrimary ? | 368 this.layout_ = this.dragging_.display.isPrimary ? |
369 SecondaryDisplayLayout.BOTTOM : SecondaryDisplayLayout.TOP; | 369 SecondaryDisplayLayout.BOTTOM : SecondaryDisplayLayout.TOP; |
370 break; | 370 break; |
371 case SecondaryDisplayLayout.BOTTOM: | 371 case SecondaryDisplayLayout.BOTTOM: |
372 this.layout_ = this.dragging_.display.isPrimary ? | 372 this.layout_ = this.dragging_.display.isPrimary ? |
373 SecondaryDisplayLayout.TOP : SecondaryDisplayLayout.BOTTOM; | 373 SecondaryDisplayLayout.TOP : SecondaryDisplayLayout.BOTTOM; |
374 break; | 374 break; |
375 } | 375 } |
376 | 376 |
377 if (this.layout_ == SecondaryDisplayLayout.LEFT || | 377 if (this.layout_ == SecondaryDisplayLayout.LEFT || |
378 this.layout_ == SecondaryDisplayLayout.RIGHT) { | 378 this.layout_ == SecondaryDisplayLayout.RIGHT) { |
379 if (newPosition.y > baseDiv.offsetTop + baseDiv.offsetHeight) | 379 if (newPosition.y > baseDiv.offsetTop + baseDiv.offsetHeight) |
380 this.layout_ = this.dragging_.display.isPrimary ? | 380 this.layout_ = this.dragging_.display.isPrimary ? |
381 SecondaryDisplayLayout.TOP : SecondaryDisplayLayout.BOTTOM; | 381 SecondaryDisplayLayout.TOP : SecondaryDisplayLayout.BOTTOM; |
382 else if (newPosition.y + draggingDiv.offsetHeight < | 382 else if (newPosition.y + draggingDiv.offsetHeight < |
383 baseDiv.offsetTop) | 383 baseDiv.offsetTop) |
384 this.layout_ = this.dragging_.display.isPrimary ? | 384 this.layout_ = this.dragging_.display.isPrimary ? |
385 SecondaryDisplayLayout.BOTTOM : SecondaryDisplayLayout.TOP; | 385 SecondaryDisplayLayout.BOTTOM : SecondaryDisplayLayout.TOP; |
386 } else { | 386 } else { |
387 if (newPosition.y > baseDiv.offsetLeft + baseDiv.offsetWidth) | 387 if (newPosition.y > baseDiv.offsetLeft + baseDiv.offsetWidth) |
388 this.layout_ = this.dragging_.display.isPrimary ? | 388 this.layout_ = this.dragging_.display.isPrimary ? |
389 SecondaryDisplayLayout.LEFT : SecondaryDisplayLayout.RIGHT; | 389 SecondaryDisplayLayout.LEFT : SecondaryDisplayLayout.RIGHT; |
390 else if (newPosition.y + draggingDiv.offsetWidth < | 390 else if (newPosition.y + draggingDiv.offsetWidth < |
391 baseDiv.offstLeft) | 391 baseDiv.offstLeft) |
392 this.layout_ = this.dragging_.display.isPrimary ? | 392 this.layout_ = this.dragging_.display.isPrimary ? |
393 SecondaryDisplayLayout.RIGHT : SecondaryDisplayLayout.LEFT; | 393 SecondaryDisplayLayout.RIGHT : SecondaryDisplayLayout.LEFT; |
394 } | 394 } |
395 | 395 |
396 var layout_to_base; | 396 var layoutToBase; |
397 if (!this.dragging_.display.isPrimary) { | 397 if (!this.dragging_.display.isPrimary) { |
398 layout_to_base = this.layout_; | 398 layoutToBase = this.layout_; |
399 } else { | 399 } else { |
400 switch (this.layout_) { | 400 switch (this.layout_) { |
401 case SecondaryDisplayLayout.RIGHT: | 401 case SecondaryDisplayLayout.RIGHT: |
402 layout_to_base = SecondaryDisplayLayout.LEFT; | 402 layoutToBase = SecondaryDisplayLayout.LEFT; |
403 break; | 403 break; |
404 case SecondaryDisplayLayout.LEFT: | 404 case SecondaryDisplayLayout.LEFT: |
405 layout_to_base = SecondaryDisplayLayout.RIGHT; | 405 layoutToBase = SecondaryDisplayLayout.RIGHT; |
406 break; | 406 break; |
407 case SecondaryDisplayLayout.TOP: | 407 case SecondaryDisplayLayout.TOP: |
408 layout_to_base = SecondaryDisplayLayout.BOTTOM; | 408 layoutToBase = SecondaryDisplayLayout.BOTTOM; |
409 break; | 409 break; |
410 case SecondaryDisplayLayout.BOTTOM: | 410 case SecondaryDisplayLayout.BOTTOM: |
411 layout_to_base = SecondaryDisplayLayout.TOP; | 411 layoutToBase = SecondaryDisplayLayout.TOP; |
412 break; | 412 break; |
413 } | 413 } |
414 } | 414 } |
415 | 415 |
416 switch (layout_to_base) { | 416 switch (layoutToBase) { |
417 case SecondaryDisplayLayout.RIGHT: | 417 case SecondaryDisplayLayout.RIGHT: |
418 draggingDiv.style.left = | 418 draggingDiv.style.left = |
419 baseDiv.offsetLeft + baseDiv.offsetWidth + 'px'; | 419 baseDiv.offsetLeft + baseDiv.offsetWidth + 'px'; |
420 draggingDiv.style.top = newPosition.y + 'px'; | 420 draggingDiv.style.top = newPosition.y + 'px'; |
421 break; | 421 break; |
422 case SecondaryDisplayLayout.LEFT: | 422 case SecondaryDisplayLayout.LEFT: |
423 draggingDiv.style.left = | 423 draggingDiv.style.left = |
424 baseDiv.offsetLeft - draggingDiv.offsetWidth + 'px'; | 424 baseDiv.offsetLeft - draggingDiv.offsetWidth + 'px'; |
425 draggingDiv.style.top = newPosition.y + 'px'; | 425 draggingDiv.style.top = newPosition.y + 'px'; |
426 break; | 426 break; |
427 case SecondaryDisplayLayout.TOP: | 427 case SecondaryDisplayLayout.TOP: |
428 draggingDiv.style.top = | 428 draggingDiv.style.top = |
429 baseDiv.offsetTop - draggingDiv.offsetHeight + 'px'; | 429 baseDiv.offsetTop - draggingDiv.offsetHeight + 'px'; |
430 draggingDiv.style.left = newPosition.x + 'px'; | 430 draggingDiv.style.left = newPosition.x + 'px'; |
431 break; | 431 break; |
432 case SecondaryDisplayLayout.BOTTOM: | 432 case SecondaryDisplayLayout.BOTTOM: |
433 draggingDiv.style.top = | 433 draggingDiv.style.top = |
434 baseDiv.offsetTop + baseDiv.offsetHeight + 'px'; | 434 baseDiv.offsetTop + baseDiv.offsetHeight + 'px'; |
435 draggingDiv.style.left = newPosition.x + 'px'; | 435 draggingDiv.style.left = newPosition.x + 'px'; |
436 break; | 436 break; |
437 } | 437 } |
438 | 438 |
439 return false; | 439 return false; |
440 }, | 440 }, |
441 | 441 |
442 /** | 442 /** |
443 * start dragging of a display rectangle. | 443 * start dragging of a display rectangle. |
444 * @param {HTMLElement} target The event target. | 444 * @param {HTMLElement} target The event target. |
445 * @param {Object} eventLocation The object to hold the location where | 445 * @param {Object} eventLocation The object to hold the location where |
446 * this event happens. | 446 * this event happens. |
(...skipping 326 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
773 mirroring, displays, layout, offset) { | 773 mirroring, displays, layout, offset) { |
774 DisplayOptions.getInstance().onDisplayChanged_( | 774 DisplayOptions.getInstance().onDisplayChanged_( |
775 mirroring, displays, layout, offset); | 775 mirroring, displays, layout, offset); |
776 }; | 776 }; |
777 | 777 |
778 // Export | 778 // Export |
779 return { | 779 return { |
780 DisplayOptions: DisplayOptions | 780 DisplayOptions: DisplayOptions |
781 }; | 781 }; |
782 }); | 782 }); |
OLD | NEW |