Diffstat (limited to 'frontend/gamma/js/MochiKit/Visual.js') (more/less context) (ignore whitespace changes)
-rw-r--r-- | frontend/gamma/js/MochiKit/Visual.js | 39 |
1 files changed, 20 insertions, 19 deletions
diff --git a/frontend/gamma/js/MochiKit/Visual.js b/frontend/gamma/js/MochiKit/Visual.js index 648d82a..372d99a 100644 --- a/frontend/gamma/js/MochiKit/Visual.js +++ b/frontend/gamma/js/MochiKit/Visual.js | |||
@@ -1,107 +1,107 @@ | |||
1 | /*** | 1 | /*** |
2 | 2 | ||
3 | MochiKit.Visual 1.5 | 3 | MochiKit.Visual 1.5 |
4 | 4 | ||
5 | See <http://mochikit.com/> for documentation, downloads, license, etc. | 5 | See <http://mochikit.com/> for documentation, downloads, license, etc. |
6 | 6 | ||
7 | (c) 2005 Bob Ippolito and others. All rights Reserved. | 7 | (c) 2005 Bob Ippolito and others. All rights Reserved. |
8 | 8 | ||
9 | ***/ | 9 | ***/ |
10 | 10 | ||
11 | MochiKit.Base._module('Visual', '1.5', ['Base', 'DOM', 'Style', 'Color', 'Position']); | 11 | MochiKit.Base.module(MochiKit, 'Visual', '1.5', ['Base', 'DOM', 'Style', 'Color', 'Position']); |
12 | 12 | ||
13 | MochiKit.Visual._RoundCorners = function (e, options) { | 13 | MochiKit.Visual._RoundCorners = function (e, options) { |
14 | e = MochiKit.DOM.getElement(e); | 14 | e = MochiKit.DOM.getElement(e); |
15 | this._setOptions(options); | 15 | this._setOptions(options); |
16 | if (this.options.__unstable__wrapElement) { | 16 | if (this.options.__unstable__wrapElement) { |
17 | e = this._doWrap(e); | 17 | e = this._doWrap(e); |
18 | } | 18 | } |
19 | 19 | ||
20 | var color = this.options.color; | 20 | var color = this.options.color; |
21 | var C = MochiKit.Color.Color; | 21 | var C = MochiKit.Color.Color; |
22 | if (this.options.color === "fromElement") { | 22 | if (this.options.color === "fromElement") { |
23 | color = C.fromBackground(e); | 23 | color = C.fromBackground(e); |
24 | } else if (!(color instanceof C)) { | 24 | } else if (!(color instanceof C)) { |
25 | color = C.fromString(color); | 25 | color = C.fromString(color); |
26 | } | 26 | } |
27 | this.isTransparent = (color.asRGB().a <= 0); | 27 | this.isTransparent = (color.asRGB().a <= 0); |
28 | 28 | ||
29 | var bgColor = this.options.bgColor; | 29 | var bgColor = this.options.bgColor; |
30 | if (this.options.bgColor === "fromParent") { | 30 | if (this.options.bgColor === "fromParent") { |
31 | bgColor = C.fromBackground(e.offsetParent); | 31 | bgColor = C.fromBackground(e.offsetParent); |
32 | } else if (!(bgColor instanceof C)) { | 32 | } else if (!(bgColor instanceof C)) { |
33 | bgColor = C.fromString(bgColor); | 33 | bgColor = C.fromString(bgColor); |
34 | } | 34 | } |
35 | 35 | ||
36 | this._roundCornersImpl(e, color, bgColor); | 36 | this._roundCornersImpl(e, color, bgColor); |
37 | }; | 37 | }; |
38 | 38 | ||
39 | MochiKit.Visual._RoundCorners.prototype = { | 39 | MochiKit.Visual._RoundCorners.prototype = { |
40 | _doWrap: function (e) { | 40 | _doWrap: function (e) { |
41 | var parent = e.parentNode; | 41 | var parent = e.parentNode; |
42 | var doc = MochiKit.DOM.currentDocument(); | 42 | var doc = MochiKit.DOM.currentDocument(); |
43 | if (typeof(doc.defaultView) === "undefined" | 43 | if (typeof(doc.defaultView) === "undefined" |
44 | || doc.defaultView === null) { | 44 | || doc.defaultView === null) { |
45 | return e; | 45 | return e; |
46 | } | 46 | } |
47 | var style = doc.defaultView.getComputedStyle(e, null); | 47 | var style = doc.defaultView.getComputedStyle(e, null); |
48 | if (typeof(style) === "undefined" || style === null) { | 48 | if (typeof(style) === "undefined" || style === null) { |
49 | return e; | 49 | return e; |
50 | } | 50 | } |
51 | var wrapper = MochiKit.DOM.DIV({"style": { | 51 | var wrapper = MochiKit.DOM.DIV({"style": { |
52 | display: "block", | 52 | display: "block", |
53 | // convert padding to margin | 53 | // convert padding to margin |
54 | marginTop: style.getPropertyValue("padding-top"), | 54 | marginTop: style.getPropertyValue("padding-top"), |
55 | marginRight: style.getPropertyValue("padding-right"), | 55 | marginRight: style.getPropertyValue("padding-right"), |
56 | marginBottom: style.getPropertyValue("padding-bottom"), | 56 | marginBottom: style.getPropertyValue("padding-bottom"), |
57 | marginLeft: style.getPropertyValue("padding-left"), | 57 | marginLeft: style.getPropertyValue("padding-left"), |
58 | // remove padding so the rounding looks right | 58 | // remove padding so the rounding looks right |
59 | padding: "0px" | 59 | padding: "0px" |
60 | /* | 60 | /* |
61 | paddingRight: "0px", | 61 | paddingRight: "0px", |
62 | paddingLeft: "0px" | 62 | paddingLeft: "0px" |
63 | */ | 63 | */ |
64 | }}); | 64 | }}); |
65 | wrapper.innerHTML = e.innerHTML; | 65 | wrapper.innerHTML = e.innerHTML; |
66 | e.innerHTML = ""; | 66 | e.innerHTML = ""; |
67 | e.appendChild(wrapper); | 67 | e.appendChild(wrapper); |
68 | return e; | 68 | return e; |
69 | }, | 69 | }, |
70 | 70 | ||
71 | _roundCornersImpl: function (e, color, bgColor) { | 71 | _roundCornersImpl: function (e, color, bgColor) { |
72 | if (this.options.border) { | 72 | if (this.options.border) { |
73 | this._renderBorder(e, bgColor); | 73 | this._renderBorder(e, bgColor); |
74 | } | 74 | } |
75 | if (this._isTopRounded()) { | 75 | if (this._isTopRounded()) { |
76 | this._roundTopCorners(e, color, bgColor); | 76 | this._roundTopCorners(e, color, bgColor); |
77 | } | 77 | } |
78 | if (this._isBottomRounded()) { | 78 | if (this._isBottomRounded()) { |
79 | this._roundBottomCorners(e, color, bgColor); | 79 | this._roundBottomCorners(e, color, bgColor); |
80 | } | 80 | } |
81 | }, | 81 | }, |
82 | 82 | ||
83 | _renderBorder: function (el, bgColor) { | 83 | _renderBorder: function (el, bgColor) { |
84 | var borderValue = "1px solid " + this._borderColor(bgColor); | 84 | var borderValue = "1px solid " + this._borderColor(bgColor); |
85 | var borderL = "border-left: " + borderValue; | 85 | var borderL = "border-left: " + borderValue; |
86 | var borderR = "border-right: " + borderValue; | 86 | var borderR = "border-right: " + borderValue; |
87 | var style = "style='" + borderL + ";" + borderR + "'"; | 87 | var style = "style='" + borderL + ";" + borderR + "'"; |
88 | el.innerHTML = "<div " + style + ">" + el.innerHTML + "</div>"; | 88 | el.innerHTML = "<div " + style + ">" + el.innerHTML + "</div>"; |
89 | }, | 89 | }, |
90 | 90 | ||
91 | _roundTopCorners: function (el, color, bgColor) { | 91 | _roundTopCorners: function (el, color, bgColor) { |
92 | var corner = this._createCorner(bgColor); | 92 | var corner = this._createCorner(bgColor); |
93 | for (var i = 0; i < this.options.numSlices; i++) { | 93 | for (var i = 0; i < this.options.numSlices; i++) { |
94 | corner.appendChild( | 94 | corner.appendChild( |
95 | this._createCornerSlice(color, bgColor, i, "top") | 95 | this._createCornerSlice(color, bgColor, i, "top") |
96 | ); | 96 | ); |
97 | } | 97 | } |
98 | el.style.paddingTop = 0; | 98 | el.style.paddingTop = 0; |
99 | el.insertBefore(corner, el.firstChild); | 99 | el.insertBefore(corner, el.firstChild); |
100 | }, | 100 | }, |
101 | 101 | ||
102 | _roundBottomCorners: function (el, color, bgColor) { | 102 | _roundBottomCorners: function (el, color, bgColor) { |
103 | var corner = this._createCorner(bgColor); | 103 | var corner = this._createCorner(bgColor); |
104 | for (var i = (this.options.numSlices - 1); i >= 0; i--) { | 104 | for (var i = (this.options.numSlices - 1); i >= 0; i--) { |
105 | corner.appendChild( | 105 | corner.appendChild( |
106 | this._createCornerSlice(color, bgColor, i, "bottom") | 106 | this._createCornerSlice(color, bgColor, i, "bottom") |
107 | ); | 107 | ); |
@@ -376,387 +376,401 @@ MochiKit.Visual._forceRerendering = function (element) { | |||
376 | }; | 376 | }; |
377 | 377 | ||
378 | /** @id MochiKit.Visual.multiple */ | 378 | /** @id MochiKit.Visual.multiple */ |
379 | MochiKit.Visual.multiple = function (elements, effect, /* optional */options) { | 379 | MochiKit.Visual.multiple = function (elements, effect, /* optional */options) { |
380 | /*** | 380 | /*** |
381 | 381 | ||
382 | Launch the same effect subsequently on given elements. | 382 | Launch the same effect subsequently on given elements. |
383 | 383 | ||
384 | ***/ | 384 | ***/ |
385 | options = MochiKit.Base.update({ | 385 | options = MochiKit.Base.update({ |
386 | speed: 0.1, delay: 0.0 | 386 | speed: 0.1, delay: 0.0 |
387 | }, options); | 387 | }, options); |
388 | var masterDelay = options.delay; | 388 | var masterDelay = options.delay; |
389 | var index = 0; | 389 | var index = 0; |
390 | MochiKit.Base.map(function (innerelement) { | 390 | MochiKit.Base.map(function (innerelement) { |
391 | options.delay = index * options.speed + masterDelay; | 391 | options.delay = index * options.speed + masterDelay; |
392 | new effect(innerelement, options); | 392 | new effect(innerelement, options); |
393 | index += 1; | 393 | index += 1; |
394 | }, elements); | 394 | }, elements); |
395 | }; | 395 | }; |
396 | 396 | ||
397 | MochiKit.Visual.PAIRS = { | 397 | MochiKit.Visual.PAIRS = { |
398 | 'slide': ['slideDown', 'slideUp'], | 398 | 'slide': ['slideDown', 'slideUp'], |
399 | 'blind': ['blindDown', 'blindUp'], | 399 | 'blind': ['blindDown', 'blindUp'], |
400 | 'appear': ['appear', 'fade'], | 400 | 'appear': ['appear', 'fade'], |
401 | 'size': ['grow', 'shrink'] | 401 | 'size': ['grow', 'shrink'] |
402 | }; | 402 | }; |
403 | 403 | ||
404 | /** @id MochiKit.Visual.toggle */ | 404 | /** @id MochiKit.Visual.toggle */ |
405 | MochiKit.Visual.toggle = function (element, /* optional */effect, /* optional */options) { | 405 | MochiKit.Visual.toggle = function (element, /* optional */effect, /* optional */options) { |
406 | /*** | 406 | /*** |
407 | 407 | ||
408 | Toggle an item between two state depending of its visibility, making | 408 | Toggle an item between two state depending of its visibility, making |
409 | a effect between these states. Default effect is 'appear', can be | 409 | a effect between these states. Default effect is 'appear', can be |
410 | 'slide' or 'blind'. | 410 | 'slide' or 'blind'. |
411 | 411 | ||
412 | ***/ | 412 | ***/ |
413 | element = MochiKit.DOM.getElement(element); | 413 | element = MochiKit.DOM.getElement(element); |
414 | effect = (effect || 'appear').toLowerCase(); | 414 | effect = (effect || 'appear').toLowerCase(); |
415 | options = MochiKit.Base.update({ | 415 | options = MochiKit.Base.update({ |
416 | queue: {position: 'end', scope: (element.id || 'global'), limit: 1} | 416 | queue: {position: 'end', scope: (element.id || 'global'), limit: 1} |
417 | }, options); | 417 | }, options); |
418 | var v = MochiKit.Visual; | 418 | var v = MochiKit.Visual; |
419 | v[MochiKit.Style.getStyle(element, 'display') != 'none' ? | 419 | v[MochiKit.Style.getStyle(element, 'display') != 'none' ? |
420 | v.PAIRS[effect][1] : v.PAIRS[effect][0]](element, options); | 420 | v.PAIRS[effect][1] : v.PAIRS[effect][0]](element, options); |
421 | }; | 421 | }; |
422 | 422 | ||
423 | /*** | 423 | /*** |
424 | 424 | ||
425 | Transitions: define functions calculating variations depending of a position. | 425 | Transitions: define functions calculating variations depending of a position. |
426 | 426 | ||
427 | ***/ | 427 | ***/ |
428 | 428 | ||
429 | MochiKit.Visual.Transitions = { __export__: false }; | 429 | MochiKit.Visual.Transitions = { __export__: false }; |
430 | 430 | ||
431 | /** @id MochiKit.Visual.Transitions.linear */ | 431 | /** @id MochiKit.Visual.Transitions.linear */ |
432 | MochiKit.Visual.Transitions.linear = function (pos) { | 432 | MochiKit.Visual.Transitions.linear = function (pos) { |
433 | return pos; | 433 | return pos; |
434 | }; | 434 | }; |
435 | 435 | ||
436 | /** @id MochiKit.Visual.Transitions.sinoidal */ | 436 | /** @id MochiKit.Visual.Transitions.sinoidal */ |
437 | MochiKit.Visual.Transitions.sinoidal = function (pos) { | 437 | MochiKit.Visual.Transitions.sinoidal = function (pos) { |
438 | return 0.5 - Math.cos(pos*Math.PI)/2; | 438 | return 0.5 - Math.cos(pos*Math.PI)/2; |
439 | }; | 439 | }; |
440 | 440 | ||
441 | /** @id MochiKit.Visual.Transitions.reverse */ | 441 | /** @id MochiKit.Visual.Transitions.reverse */ |
442 | MochiKit.Visual.Transitions.reverse = function (pos) { | 442 | MochiKit.Visual.Transitions.reverse = function (pos) { |
443 | return 1 - pos; | 443 | return 1 - pos; |
444 | }; | 444 | }; |
445 | 445 | ||
446 | /** @id MochiKit.Visual.Transitions.flicker */ | 446 | /** @id MochiKit.Visual.Transitions.flicker */ |
447 | MochiKit.Visual.Transitions.flicker = function (pos) { | 447 | MochiKit.Visual.Transitions.flicker = function (pos) { |
448 | return 0.25 - Math.cos(pos*Math.PI)/4 + Math.random()/2; | 448 | return 0.25 - Math.cos(pos*Math.PI)/4 + Math.random()/2; |
449 | }; | 449 | }; |
450 | 450 | ||
451 | /** @id MochiKit.Visual.Transitions.wobble */ | 451 | /** @id MochiKit.Visual.Transitions.wobble */ |
452 | MochiKit.Visual.Transitions.wobble = function (pos) { | 452 | MochiKit.Visual.Transitions.wobble = function (pos) { |
453 | return 0.5 - Math.cos(9*pos*Math.PI)/2; | 453 | return 0.5 - Math.cos(9*pos*Math.PI)/2; |
454 | }; | 454 | }; |
455 | 455 | ||
456 | /** @id MochiKit.Visual.Transitions.pulse */ | 456 | /** @id MochiKit.Visual.Transitions.pulse */ |
457 | MochiKit.Visual.Transitions.pulse = function (pos, pulses) { | 457 | MochiKit.Visual.Transitions.pulse = function (pos, pulses) { |
458 | if (pulses) { | 458 | if (pulses) { |
459 | pos *= 2 * pulses; | 459 | pos *= 2 * pulses; |
460 | } else { | 460 | } else { |
461 | pos *= 10; | 461 | pos *= 10; |
462 | } | 462 | } |
463 | var decimals = pos - Math.floor(pos); | 463 | var decimals = pos - Math.floor(pos); |
464 | return (Math.floor(pos) % 2 == 0) ? decimals : 1 - decimals; | 464 | return (Math.floor(pos) % 2 == 0) ? decimals : 1 - decimals; |
465 | }; | 465 | }; |
466 | 466 | ||
467 | /** @id MochiKit.Visual.Transitions.parabolic */ | 467 | /** @id MochiKit.Visual.Transitions.parabolic */ |
468 | MochiKit.Visual.Transitions.parabolic = function (pos) { | 468 | MochiKit.Visual.Transitions.parabolic = function (pos) { |
469 | return pos * pos; | 469 | return pos * pos; |
470 | }; | 470 | }; |
471 | 471 | ||
472 | /** @id MochiKit.Visual.Transitions.spring */ | ||
473 | MochiKit.Visual.Transitions.spring = function (pos) { | ||
474 | return 1 - (Math.cos(pos * 2.5 * Math.PI) * Math.exp(-pos * 6)); | ||
475 | }; | ||
476 | |||
472 | /** @id MochiKit.Visual.Transitions.none */ | 477 | /** @id MochiKit.Visual.Transitions.none */ |
473 | MochiKit.Visual.Transitions.none = function (pos) { | 478 | MochiKit.Visual.Transitions.none = function (pos) { |
474 | return 0; | 479 | return 0; |
475 | }; | 480 | }; |
476 | 481 | ||
477 | /** @id MochiKit.Visual.Transitions.full */ | 482 | /** @id MochiKit.Visual.Transitions.full */ |
478 | MochiKit.Visual.Transitions.full = function (pos) { | 483 | MochiKit.Visual.Transitions.full = function (pos) { |
479 | return 1; | 484 | return 1; |
480 | }; | 485 | }; |
481 | 486 | ||
482 | /*** | 487 | /*** |
483 | 488 | ||
484 | Core effects | 489 | Core effects |
485 | 490 | ||
486 | ***/ | 491 | ***/ |
487 | 492 | ||
488 | MochiKit.Visual.ScopedQueue = function () { | 493 | MochiKit.Visual.ScopedQueue = function () { |
489 | var cls = arguments.callee; | 494 | var cls = arguments.callee; |
490 | if (!(this instanceof cls)) { | 495 | if (!(this instanceof cls)) { |
491 | return new cls(); | 496 | return new cls(); |
492 | } | 497 | } |
493 | this.__init__(); | 498 | this.__init__(); |
494 | }; | 499 | }; |
495 | MochiKit.Visual.ScopedQueue.__export__ = false; | 500 | MochiKit.Visual.ScopedQueue.__export__ = false; |
496 | 501 | ||
497 | MochiKit.Base.update(MochiKit.Visual.ScopedQueue.prototype, { | 502 | MochiKit.Base.update(MochiKit.Visual.ScopedQueue.prototype, { |
498 | __init__: function () { | 503 | __init__: function () { |
499 | this.effects = []; | 504 | this.effects = []; |
500 | this.interval = null; | 505 | this.interval = null; |
501 | }, | 506 | }, |
502 | 507 | ||
503 | /** @id MochiKit.Visual.ScopedQueue.prototype.add */ | 508 | /** @id MochiKit.Visual.ScopedQueue.prototype.add */ |
504 | add: function (effect) { | 509 | add: function (effect) { |
505 | var timestamp = new Date().getTime(); | 510 | var timestamp = new Date().getTime(); |
506 | 511 | ||
507 | var position = (typeof(effect.options.queue) == 'string') ? | 512 | var position = (typeof(effect.options.queue) == 'string') ? |
508 | effect.options.queue : effect.options.queue.position; | 513 | effect.options.queue : effect.options.queue.position; |
509 | 514 | ||
510 | var ma = MochiKit.Base.map; | 515 | var ma = MochiKit.Base.map; |
511 | switch (position) { | 516 | switch (position) { |
512 | case 'front': | 517 | case 'front': |
513 | // move unstarted effects after this effect | 518 | // move unstarted effects after this effect |
514 | ma(function (e) { | 519 | ma(function (e) { |
515 | if (e.state == 'idle') { | 520 | if (e.state == 'idle') { |
516 | e.startOn += effect.finishOn; | 521 | e.startOn += effect.finishOn; |
517 | e.finishOn += effect.finishOn; | 522 | e.finishOn += effect.finishOn; |
518 | } | 523 | } |
519 | }, this.effects); | 524 | }, this.effects); |
520 | break; | 525 | break; |
521 | case 'end': | 526 | case 'end': |
522 | var finish; | 527 | var finish; |
523 | // start effect after last queued effect has finished | 528 | // start effect after last queued effect has finished |
524 | ma(function (e) { | 529 | ma(function (e) { |
525 | var i = e.finishOn; | 530 | var i = e.finishOn; |
526 | if (i >= (finish || i)) { | 531 | if (i >= (finish || i)) { |
527 | finish = i; | 532 | finish = i; |
528 | } | 533 | } |
529 | }, this.effects); | 534 | }, this.effects); |
530 | timestamp = finish || timestamp; | 535 | timestamp = finish || timestamp; |
531 | break; | 536 | break; |
532 | case 'break': | 537 | case 'break': |
533 | ma(function (e) { | 538 | ma(function (e) { |
534 | e.finalize(); | 539 | e.finalize(); |
535 | }, this.effects); | 540 | }, this.effects); |
536 | break; | 541 | break; |
542 | case 'replace': | ||
543 | ma(function (e) { | ||
544 | e.cancel(); | ||
545 | }, this.effects); | ||
546 | break; | ||
537 | } | 547 | } |
538 | 548 | ||
539 | effect.startOn += timestamp; | 549 | effect.startOn += timestamp; |
540 | effect.finishOn += timestamp; | 550 | effect.finishOn += timestamp; |
541 | if (!effect.options.queue.limit || | 551 | if (!effect.options.queue.limit || |
542 | this.effects.length < effect.options.queue.limit) { | 552 | this.effects.length < effect.options.queue.limit) { |
543 | this.effects.push(effect); | 553 | this.effects.push(effect); |
544 | } | 554 | } |
545 | 555 | ||
546 | if (!this.interval) { | 556 | if (!this.interval) { |
547 | this.interval = this.startLoop(MochiKit.Base.bind(this.loop, this), | 557 | this.interval = this.startLoop(MochiKit.Base.bind(this.loop, this), |
548 | 40); | 558 | 40); |
549 | } | 559 | } |
550 | }, | 560 | }, |
551 | 561 | ||
552 | /** @id MochiKit.Visual.ScopedQueue.prototype.startLoop */ | 562 | /** @id MochiKit.Visual.ScopedQueue.prototype.startLoop */ |
553 | startLoop: function (func, interval) { | 563 | startLoop: function (func, interval) { |
554 | return setInterval(func, interval); | 564 | return setInterval(func, interval); |
555 | }, | 565 | }, |
556 | 566 | ||
557 | /** @id MochiKit.Visual.ScopedQueue.prototype.remove */ | 567 | /** @id MochiKit.Visual.ScopedQueue.prototype.remove */ |
558 | remove: function (effect) { | 568 | remove: function (effect) { |
559 | this.effects = MochiKit.Base.filter(function (e) { | 569 | this.effects = MochiKit.Base.filter(function (e) { |
560 | return e != effect; | 570 | return e != effect; |
561 | }, this.effects); | 571 | }, this.effects); |
562 | if (!this.effects.length) { | 572 | if (!this.effects.length) { |
563 | this.stopLoop(this.interval); | 573 | this.stopLoop(this.interval); |
564 | this.interval = null; | 574 | this.interval = null; |
565 | } | 575 | } |
566 | }, | 576 | }, |
567 | 577 | ||
568 | /** @id MochiKit.Visual.ScopedQueue.prototype.stopLoop */ | 578 | /** @id MochiKit.Visual.ScopedQueue.prototype.stopLoop */ |
569 | stopLoop: function (interval) { | 579 | stopLoop: function (interval) { |
570 | clearInterval(interval); | 580 | clearInterval(interval); |
571 | }, | 581 | }, |
572 | 582 | ||
573 | /** @id MochiKit.Visual.ScopedQueue.prototype.loop */ | 583 | /** @id MochiKit.Visual.ScopedQueue.prototype.loop */ |
574 | loop: function () { | 584 | loop: function () { |
575 | var timePos = new Date().getTime(); | 585 | var timePos = new Date().getTime(); |
576 | MochiKit.Base.map(function (effect) { | 586 | MochiKit.Base.map(function (effect) { |
577 | effect.loop(timePos); | 587 | effect.loop(timePos); |
578 | }, this.effects); | 588 | }, this.effects); |
579 | } | 589 | } |
580 | }); | 590 | }); |
581 | 591 | ||
582 | MochiKit.Visual.Queues = { | 592 | MochiKit.Visual.Queues = { |
583 | __export__: false, | 593 | __export__: false, |
584 | instances: {}, | 594 | instances: {}, |
585 | get: function (queueName) { | 595 | get: function (queueName) { |
586 | if (typeof(queueName) != 'string') { | 596 | if (typeof(queueName) != 'string') { |
587 | return queueName; | 597 | return queueName; |
588 | } | 598 | } |
589 | 599 | ||
590 | if (!this.instances[queueName]) { | 600 | if (!this.instances[queueName]) { |
591 | this.instances[queueName] = new MochiKit.Visual.ScopedQueue(); | 601 | this.instances[queueName] = new MochiKit.Visual.ScopedQueue(); |
592 | } | 602 | } |
593 | return this.instances[queueName]; | 603 | return this.instances[queueName]; |
594 | } | 604 | } |
595 | }; | 605 | }; |
596 | 606 | ||
597 | MochiKit.Visual.Queue = MochiKit.Visual.Queues.get('global'); | 607 | MochiKit.Visual.Queue = MochiKit.Visual.Queues.get('global'); |
598 | MochiKit.Visual.Queue.__export__ = false; | 608 | MochiKit.Visual.Queue.__export__ = false; |
599 | 609 | ||
600 | MochiKit.Visual.DefaultOptions = { | 610 | MochiKit.Visual.DefaultOptions = { |
601 | __export__: false, | 611 | __export__: false, |
602 | transition: MochiKit.Visual.Transitions.sinoidal, | 612 | transition: MochiKit.Visual.Transitions.sinoidal, |
603 | duration: 1.0, // seconds | 613 | duration: 1.0, // seconds |
604 | fps: 25.0, // max. 25fps due to MochiKit.Visual.Queue implementation | 614 | fps: 25.0, // max. 25fps due to MochiKit.Visual.Queue implementation |
605 | sync: false, // true for combining | 615 | sync: false, // true for combining |
606 | from: 0.0, | 616 | from: 0.0, |
607 | to: 1.0, | 617 | to: 1.0, |
608 | delay: 0.0, | 618 | delay: 0.0, |
609 | queue: 'parallel' | 619 | queue: 'parallel' |
610 | }; | 620 | }; |
611 | 621 | ||
612 | MochiKit.Visual.Base = function () {}; | 622 | MochiKit.Visual.Base = function () {}; |
613 | 623 | ||
614 | MochiKit.Visual.Base.prototype = { | 624 | MochiKit.Visual.Base.prototype = { |
615 | /*** | 625 | /*** |
616 | 626 | ||
617 | Basic class for all Effects. Define a looping mechanism called for each step | 627 | Basic class for all Effects. Define a looping mechanism called for each step |
618 | of an effect. Don't instantiate it, only subclass it. | 628 | of an effect. Don't instantiate it, only subclass it. |
619 | 629 | ||
620 | ***/ | 630 | ***/ |
621 | 631 | ||
622 | __class__ : MochiKit.Visual.Base, | 632 | __class__ : MochiKit.Visual.Base, |
623 | 633 | ||
624 | /** @id MochiKit.Visual.Base.prototype.start */ | 634 | /** @id MochiKit.Visual.Base.prototype.start */ |
625 | start: function (options) { | 635 | start: function (options) { |
626 | var v = MochiKit.Visual; | 636 | var v = MochiKit.Visual; |
627 | this.options = MochiKit.Base.setdefault(options, | 637 | this.options = MochiKit.Base.setdefault(options, |
628 | v.DefaultOptions); | 638 | v.DefaultOptions); |
629 | this.currentFrame = 0; | 639 | this.currentFrame = 0; |
630 | this.state = 'idle'; | 640 | this.state = 'idle'; |
631 | this.startOn = this.options.delay*1000; | 641 | this.startOn = this.options.delay*1000; |
632 | this.finishOn = this.startOn + (this.options.duration*1000); | 642 | this.finishOn = this.startOn + (this.options.duration*1000); |
633 | this.event('beforeStart'); | 643 | this.event('beforeStart'); |
634 | if (!this.options.sync) { | 644 | if (!this.options.sync) { |
635 | v.Queues.get(typeof(this.options.queue) == 'string' ? | 645 | v.Queues.get(typeof(this.options.queue) == 'string' ? |
636 | 'global' : this.options.queue.scope).add(this); | 646 | 'global' : this.options.queue.scope).add(this); |
637 | } | 647 | } |
638 | }, | 648 | }, |
639 | 649 | ||
640 | /** @id MochiKit.Visual.Base.prototype.loop */ | 650 | /** @id MochiKit.Visual.Base.prototype.loop */ |
641 | loop: function (timePos) { | 651 | loop: function (timePos) { |
642 | if (timePos >= this.startOn) { | 652 | if (timePos >= this.startOn) { |
643 | if (timePos >= this.finishOn) { | 653 | if (timePos >= this.finishOn) { |
644 | return this.finalize(); | 654 | return this.finalize(); |
645 | } | 655 | } |
646 | var pos = (timePos - this.startOn) / (this.finishOn - this.startOn); | 656 | var pos = (timePos - this.startOn) / (this.finishOn - this.startOn); |
647 | var frame = | 657 | var frame = |
648 | Math.round(pos * this.options.fps * this.options.duration); | 658 | Math.round(pos * this.options.fps * this.options.duration); |
649 | if (frame > this.currentFrame) { | 659 | if (frame > this.currentFrame) { |
650 | this.render(pos); | 660 | this.render(pos); |
651 | this.currentFrame = frame; | 661 | this.currentFrame = frame; |
652 | } | 662 | } |
653 | } | 663 | } |
654 | }, | 664 | }, |
655 | 665 | ||
656 | /** @id MochiKit.Visual.Base.prototype.render */ | 666 | /** @id MochiKit.Visual.Base.prototype.render */ |
657 | render: function (pos) { | 667 | render: function (pos) { |
658 | if (this.state == 'idle') { | 668 | if (this.state == 'idle') { |
659 | this.state = 'running'; | 669 | this.state = 'running'; |
660 | this.event('beforeSetup'); | 670 | this.event('beforeSetup'); |
661 | this.setup(); | 671 | this.setup(); |
662 | this.event('afterSetup'); | 672 | this.event('afterSetup'); |
663 | } | 673 | } |
664 | if (this.state == 'running') { | 674 | if (this.state == 'running') { |
665 | if (this.options.transition) { | 675 | var trans = this.options.transition; |
666 | pos = this.options.transition(pos); | 676 | if (typeof(trans) == "string") { |
677 | trans = MochiKit.Visual.Transitions[trans]; | ||
678 | } | ||
679 | if (typeof(trans) == "function") { | ||
680 | pos = trans(pos); | ||
667 | } | 681 | } |
668 | pos *= (this.options.to - this.options.from); | 682 | pos *= (this.options.to - this.options.from); |
669 | pos += this.options.from; | 683 | pos += this.options.from; |
670 | this.event('beforeUpdate'); | 684 | this.event('beforeUpdate'); |
671 | this.update(pos); | 685 | this.update(pos); |
672 | this.event('afterUpdate'); | 686 | this.event('afterUpdate'); |
673 | } | 687 | } |
674 | }, | 688 | }, |
675 | 689 | ||
676 | /** @id MochiKit.Visual.Base.prototype.cancel */ | 690 | /** @id MochiKit.Visual.Base.prototype.cancel */ |
677 | cancel: function () { | 691 | cancel: function () { |
678 | if (!this.options.sync) { | 692 | if (!this.options.sync) { |
679 | MochiKit.Visual.Queues.get(typeof(this.options.queue) == 'string' ? | 693 | MochiKit.Visual.Queues.get(typeof(this.options.queue) == 'string' ? |
680 | 'global' : this.options.queue.scope).remove(this); | 694 | 'global' : this.options.queue.scope).remove(this); |
681 | } | 695 | } |
682 | this.state = 'finished'; | 696 | this.state = 'finished'; |
683 | }, | 697 | }, |
684 | 698 | ||
685 | /** @id MochiKit.Visual.Base.prototype.finalize */ | 699 | /** @id MochiKit.Visual.Base.prototype.finalize */ |
686 | finalize: function () { | 700 | finalize: function () { |
687 | this.render(1.0); | 701 | this.render(1.0); |
688 | this.cancel(); | 702 | this.cancel(); |
689 | this.event('beforeFinish'); | 703 | this.event('beforeFinish'); |
690 | this.finish(); | 704 | this.finish(); |
691 | this.event('afterFinish'); | 705 | this.event('afterFinish'); |
692 | }, | 706 | }, |
693 | 707 | ||
694 | setup: function () { | 708 | setup: function () { |
695 | }, | 709 | }, |
696 | 710 | ||
697 | finish: function () { | 711 | finish: function () { |
698 | }, | 712 | }, |
699 | 713 | ||
700 | update: function (position) { | 714 | update: function (position) { |
701 | }, | 715 | }, |
702 | 716 | ||
703 | /** @id MochiKit.Visual.Base.prototype.event */ | 717 | /** @id MochiKit.Visual.Base.prototype.event */ |
704 | event: function (eventName) { | 718 | event: function (eventName) { |
705 | if (this.options[eventName + 'Internal']) { | 719 | if (this.options[eventName + 'Internal']) { |
706 | this.options[eventName + 'Internal'](this); | 720 | this.options[eventName + 'Internal'](this); |
707 | } | 721 | } |
708 | if (this.options[eventName]) { | 722 | if (this.options[eventName]) { |
709 | this.options[eventName](this); | 723 | this.options[eventName](this); |
710 | } | 724 | } |
711 | }, | 725 | }, |
712 | 726 | ||
713 | /** @id MochiKit.Visual.Base.prototype.repr */ | 727 | /** @id MochiKit.Visual.Base.prototype.repr */ |
714 | repr: function () { | 728 | repr: function () { |
715 | return '[' + this.__class__.NAME + ', options:' + | 729 | return '[' + this.__class__.NAME + ', options:' + |
716 | MochiKit.Base.repr(this.options) + ']'; | 730 | MochiKit.Base.repr(this.options) + ']'; |
717 | } | 731 | } |
718 | }; | 732 | }; |
719 | 733 | ||
720 | /** @id MochiKit.Visual.Parallel */ | 734 | /** @id MochiKit.Visual.Parallel */ |
721 | MochiKit.Visual.Parallel = function (effects, options) { | 735 | MochiKit.Visual.Parallel = function (effects, options) { |
722 | var cls = arguments.callee; | 736 | var cls = arguments.callee; |
723 | if (!(this instanceof cls)) { | 737 | if (!(this instanceof cls)) { |
724 | return new cls(effects, options); | 738 | return new cls(effects, options); |
725 | } | 739 | } |
726 | 740 | ||
727 | this.__init__(effects, options); | 741 | this.__init__(effects, options); |
728 | }; | 742 | }; |
729 | 743 | ||
730 | MochiKit.Visual.Parallel.prototype = new MochiKit.Visual.Base(); | 744 | MochiKit.Visual.Parallel.prototype = new MochiKit.Visual.Base(); |
731 | 745 | ||
732 | MochiKit.Base.update(MochiKit.Visual.Parallel.prototype, { | 746 | MochiKit.Base.update(MochiKit.Visual.Parallel.prototype, { |
733 | /*** | 747 | /*** |
734 | 748 | ||
735 | Run multiple effects at the same time. | 749 | Run multiple effects at the same time. |
736 | 750 | ||
737 | ***/ | 751 | ***/ |
738 | 752 | ||
739 | __class__ : MochiKit.Visual.Parallel, | 753 | __class__ : MochiKit.Visual.Parallel, |
740 | 754 | ||
741 | __init__: function (effects, options) { | 755 | __init__: function (effects, options) { |
742 | this.effects = effects || []; | 756 | this.effects = effects || []; |
743 | this.start(options); | 757 | this.start(options); |
744 | }, | 758 | }, |
745 | 759 | ||
746 | /** @id MochiKit.Visual.Parallel.prototype.update */ | 760 | /** @id MochiKit.Visual.Parallel.prototype.update */ |
747 | update: function (position) { | 761 | update: function (position) { |
748 | MochiKit.Base.map(function (effect) { | 762 | MochiKit.Base.map(function (effect) { |
749 | effect.render(position); | 763 | effect.render(position); |
750 | }, this.effects); | 764 | }, this.effects); |
751 | }, | 765 | }, |
752 | 766 | ||
753 | /** @id MochiKit.Visual.Parallel.prototype.finish */ | 767 | /** @id MochiKit.Visual.Parallel.prototype.finish */ |
754 | finish: function () { | 768 | finish: function () { |
755 | MochiKit.Base.map(function (effect) { | 769 | MochiKit.Base.map(function (effect) { |
756 | effect.finalize(); | 770 | effect.finalize(); |
757 | }, this.effects); | 771 | }, this.effects); |
758 | } | 772 | } |
759 | }); | 773 | }); |
760 | 774 | ||
761 | /** @id MochiKit.Visual.Sequence */ | 775 | /** @id MochiKit.Visual.Sequence */ |
762 | MochiKit.Visual.Sequence = function (effects, options) { | 776 | MochiKit.Visual.Sequence = function (effects, options) { |
@@ -1593,194 +1607,194 @@ MochiKit.Visual.slideDown = function (element, /* optional */ options) { | |||
1593 | s.setStyle(effect.element, {top: ''}); | 1607 | s.setStyle(effect.element, {top: ''}); |
1594 | } | 1608 | } |
1595 | elemClip = s.makeClipping(effect.element); | 1609 | elemClip = s.makeClipping(effect.element); |
1596 | s.setStyle(effect.element, {height: '0px'}); | 1610 | s.setStyle(effect.element, {height: '0px'}); |
1597 | s.showElement(effect.element); | 1611 | s.showElement(effect.element); |
1598 | }, | 1612 | }, |
1599 | afterUpdateInternal: function (effect) { | 1613 | afterUpdateInternal: function (effect) { |
1600 | var elementDimensions = s.getElementDimensions(effect.element, true); | 1614 | var elementDimensions = s.getElementDimensions(effect.element, true); |
1601 | s.setStyle(effect.element.firstChild, | 1615 | s.setStyle(effect.element.firstChild, |
1602 | {bottom: (effect.dims[0] - elementDimensions.h) + 'px'}); | 1616 | {bottom: (effect.dims[0] - elementDimensions.h) + 'px'}); |
1603 | }, | 1617 | }, |
1604 | afterFinishInternal: function (effect) { | 1618 | afterFinishInternal: function (effect) { |
1605 | s.undoClipping(effect.element, elemClip); | 1619 | s.undoClipping(effect.element, elemClip); |
1606 | // IE will crash if child is undoPositioned first | 1620 | // IE will crash if child is undoPositioned first |
1607 | if (/MSIE/.test(navigator.userAgent)) { | 1621 | if (/MSIE/.test(navigator.userAgent)) { |
1608 | s.undoPositioned(effect.element); | 1622 | s.undoPositioned(effect.element); |
1609 | s.undoPositioned(effect.element.firstChild); | 1623 | s.undoPositioned(effect.element.firstChild); |
1610 | } else { | 1624 | } else { |
1611 | s.undoPositioned(effect.element.firstChild); | 1625 | s.undoPositioned(effect.element.firstChild); |
1612 | s.undoPositioned(effect.element); | 1626 | s.undoPositioned(effect.element); |
1613 | } | 1627 | } |
1614 | s.setStyle(effect.element.firstChild, {bottom: oldInnerBottom}); | 1628 | s.setStyle(effect.element.firstChild, {bottom: oldInnerBottom}); |
1615 | } | 1629 | } |
1616 | }, options); | 1630 | }, options); |
1617 | 1631 | ||
1618 | return new MochiKit.Visual.Scale(element, 100, options); | 1632 | return new MochiKit.Visual.Scale(element, 100, options); |
1619 | }; | 1633 | }; |
1620 | 1634 | ||
1621 | /** @id MochiKit.Visual.slideUp */ | 1635 | /** @id MochiKit.Visual.slideUp */ |
1622 | MochiKit.Visual.slideUp = function (element, /* optional */ options) { | 1636 | MochiKit.Visual.slideUp = function (element, /* optional */ options) { |
1623 | /*** | 1637 | /*** |
1624 | 1638 | ||
1625 | Slide an element up. | 1639 | Slide an element up. |
1626 | It needs to have the content of the element wrapped in a container | 1640 | It needs to have the content of the element wrapped in a container |
1627 | element with fixed height. | 1641 | element with fixed height. |
1628 | 1642 | ||
1629 | ***/ | 1643 | ***/ |
1630 | var d = MochiKit.DOM; | 1644 | var d = MochiKit.DOM; |
1631 | var b = MochiKit.Base; | 1645 | var b = MochiKit.Base; |
1632 | var s = MochiKit.Style; | 1646 | var s = MochiKit.Style; |
1633 | element = d.getElement(element); | 1647 | element = d.getElement(element); |
1634 | if (!element.firstChild) { | 1648 | if (!element.firstChild) { |
1635 | throw new Error("MochiKit.Visual.slideUp must be used on a element with a child"); | 1649 | throw new Error("MochiKit.Visual.slideUp must be used on a element with a child"); |
1636 | } | 1650 | } |
1637 | d.removeEmptyTextNodes(element); | 1651 | d.removeEmptyTextNodes(element); |
1638 | var oldInnerBottom = s.getStyle(element.firstChild, 'bottom'); | 1652 | var oldInnerBottom = s.getStyle(element.firstChild, 'bottom'); |
1639 | var elementDimensions = s.getElementDimensions(element, true); | 1653 | var elementDimensions = s.getElementDimensions(element, true); |
1640 | var elemClip; | 1654 | var elemClip; |
1641 | options = b.update({ | 1655 | options = b.update({ |
1642 | scaleContent: false, | 1656 | scaleContent: false, |
1643 | scaleX: false, | 1657 | scaleX: false, |
1644 | scaleMode: {originalHeight: elementDimensions.h, | 1658 | scaleMode: {originalHeight: elementDimensions.h, |
1645 | originalWidth: elementDimensions.w}, | 1659 | originalWidth: elementDimensions.w}, |
1646 | scaleFrom: 100, | 1660 | scaleFrom: 100, |
1647 | restoreAfterFinish: true, | 1661 | restoreAfterFinish: true, |
1648 | beforeStartInternal: function (effect) { | 1662 | beforeStartInternal: function (effect) { |
1649 | s.makePositioned(effect.element); | 1663 | s.makePositioned(effect.element); |
1650 | s.makePositioned(effect.element.firstChild); | 1664 | s.makePositioned(effect.element.firstChild); |
1651 | if (/Opera/.test(navigator.userAgent)) { | 1665 | if (/Opera/.test(navigator.userAgent)) { |
1652 | s.setStyle(effect.element, {top: ''}); | 1666 | s.setStyle(effect.element, {top: ''}); |
1653 | } | 1667 | } |
1654 | elemClip = s.makeClipping(effect.element); | 1668 | elemClip = s.makeClipping(effect.element); |
1655 | s.showElement(effect.element); | 1669 | s.showElement(effect.element); |
1656 | }, | 1670 | }, |
1657 | afterUpdateInternal: function (effect) { | 1671 | afterUpdateInternal: function (effect) { |
1658 | var elementDimensions = s.getElementDimensions(effect.element, true); | 1672 | var elementDimensions = s.getElementDimensions(effect.element, true); |
1659 | s.setStyle(effect.element.firstChild, | 1673 | s.setStyle(effect.element.firstChild, |
1660 | {bottom: (effect.dims[0] - elementDimensions.h) + 'px'}); | 1674 | {bottom: (effect.dims[0] - elementDimensions.h) + 'px'}); |
1661 | }, | 1675 | }, |
1662 | afterFinishInternal: function (effect) { | 1676 | afterFinishInternal: function (effect) { |
1663 | s.hideElement(effect.element); | 1677 | s.hideElement(effect.element); |
1664 | s.undoClipping(effect.element, elemClip); | 1678 | s.undoClipping(effect.element, elemClip); |
1665 | s.undoPositioned(effect.element.firstChild); | 1679 | s.undoPositioned(effect.element.firstChild); |
1666 | s.undoPositioned(effect.element); | 1680 | s.undoPositioned(effect.element); |
1667 | s.setStyle(effect.element.firstChild, {bottom: oldInnerBottom}); | 1681 | s.setStyle(effect.element.firstChild, {bottom: oldInnerBottom}); |
1668 | } | 1682 | } |
1669 | }, options); | 1683 | }, options); |
1670 | return new MochiKit.Visual.Scale(element, 0, options); | 1684 | return new MochiKit.Visual.Scale(element, 0, options); |
1671 | }; | 1685 | }; |
1672 | 1686 | ||
1673 | // Bug in opera makes the TD containing this element expand for a instance | 1687 | // Bug in opera makes the TD containing this element expand for a instance |
1674 | // after finish | 1688 | // after finish |
1675 | /** @id MochiKit.Visual.squish */ | 1689 | /** @id MochiKit.Visual.squish */ |
1676 | MochiKit.Visual.squish = function (element, /* optional */ options) { | 1690 | MochiKit.Visual.squish = function (element, /* optional */ options) { |
1677 | /*** | 1691 | /*** |
1678 | 1692 | ||
1679 | Reduce an element and make it disappear. | 1693 | Reduce an element and make it disappear. |
1680 | 1694 | ||
1681 | ***/ | 1695 | ***/ |
1682 | var d = MochiKit.DOM; | 1696 | var d = MochiKit.DOM; |
1683 | var b = MochiKit.Base; | 1697 | var b = MochiKit.Base; |
1684 | var s = MochiKit.Style; | 1698 | var s = MochiKit.Style; |
1685 | var elementDimensions = s.getElementDimensions(element, true); | 1699 | var elementDimensions = s.getElementDimensions(element, true); |
1686 | var elemClip; | 1700 | var elemClip; |
1687 | options = b.update({ | 1701 | options = b.update({ |
1688 | restoreAfterFinish: true, | 1702 | restoreAfterFinish: true, |
1689 | scaleMode: {originalHeight: elementDimensions.w, | 1703 | scaleMode: {originalHeight: elementDimensions.h, |
1690 | originalWidth: elementDimensions.h}, | 1704 | originalWidth: elementDimensions.w}, |
1691 | beforeSetupInternal: function (effect) { | 1705 | beforeSetupInternal: function (effect) { |
1692 | elemClip = s.makeClipping(effect.element); | 1706 | elemClip = s.makeClipping(effect.element); |
1693 | }, | 1707 | }, |
1694 | afterFinishInternal: function (effect) { | 1708 | afterFinishInternal: function (effect) { |
1695 | s.hideElement(effect.element); | 1709 | s.hideElement(effect.element); |
1696 | s.undoClipping(effect.element, elemClip); | 1710 | s.undoClipping(effect.element, elemClip); |
1697 | } | 1711 | } |
1698 | }, options); | 1712 | }, options); |
1699 | 1713 | ||
1700 | return new MochiKit.Visual.Scale(element, /Opera/.test(navigator.userAgent) ? 1 : 0, options); | 1714 | return new MochiKit.Visual.Scale(element, /Opera/.test(navigator.userAgent) ? 1 : 0, options); |
1701 | }; | 1715 | }; |
1702 | 1716 | ||
1703 | /** @id MochiKit.Visual.grow */ | 1717 | /** @id MochiKit.Visual.grow */ |
1704 | MochiKit.Visual.grow = function (element, /* optional */ options) { | 1718 | MochiKit.Visual.grow = function (element, /* optional */ options) { |
1705 | /*** | 1719 | /*** |
1706 | 1720 | ||
1707 | Grow an element to its original size. Make it zero-sized before | 1721 | Grow an element to its original size. Make it zero-sized before |
1708 | if necessary. | 1722 | if necessary. |
1709 | 1723 | ||
1710 | ***/ | 1724 | ***/ |
1711 | var d = MochiKit.DOM; | 1725 | var d = MochiKit.DOM; |
1712 | var v = MochiKit.Visual; | 1726 | var v = MochiKit.Visual; |
1713 | var s = MochiKit.Style; | 1727 | var s = MochiKit.Style; |
1714 | element = d.getElement(element); | 1728 | element = d.getElement(element); |
1715 | options = MochiKit.Base.update({ | 1729 | options = MochiKit.Base.update({ |
1716 | direction: 'center', | 1730 | direction: 'center', |
1717 | moveTransition: v.Transitions.sinoidal, | 1731 | moveTransition: v.Transitions.sinoidal, |
1718 | scaleTransition: v.Transitions.sinoidal, | 1732 | scaleTransition: v.Transitions.sinoidal, |
1719 | opacityTransition: v.Transitions.full, | 1733 | opacityTransition: v.Transitions.full, |
1720 | scaleContent: true, | 1734 | scaleContent: true, |
1721 | scaleFromCenter: false | 1735 | scaleFromCenter: false |
1722 | }, options); | 1736 | }, options); |
1723 | var oldStyle = { | 1737 | var oldStyle = { |
1724 | top: element.style.top, | 1738 | top: element.style.top, |
1725 | left: element.style.left, | 1739 | left: element.style.left, |
1726 | height: element.style.height, | 1740 | height: element.style.height, |
1727 | width: element.style.width, | 1741 | width: element.style.width, |
1728 | opacity: s.getStyle(element, 'opacity') | 1742 | opacity: s.getStyle(element, 'opacity') |
1729 | }; | 1743 | }; |
1730 | var dims = s.getElementDimensions(element, true); | 1744 | var dims = s.getElementDimensions(element, true); |
1731 | var initialMoveX, initialMoveY; | 1745 | var initialMoveX, initialMoveY; |
1732 | var moveX, moveY; | 1746 | var moveX, moveY; |
1733 | 1747 | ||
1734 | switch (options.direction) { | 1748 | switch (options.direction) { |
1735 | case 'top-left': | 1749 | case 'top-left': |
1736 | initialMoveX = initialMoveY = moveX = moveY = 0; | 1750 | initialMoveX = initialMoveY = moveX = moveY = 0; |
1737 | break; | 1751 | break; |
1738 | case 'top-right': | 1752 | case 'top-right': |
1739 | initialMoveX = dims.w; | 1753 | initialMoveX = dims.w; |
1740 | initialMoveY = moveY = 0; | 1754 | initialMoveY = moveY = 0; |
1741 | moveX = -dims.w; | 1755 | moveX = -dims.w; |
1742 | break; | 1756 | break; |
1743 | case 'bottom-left': | 1757 | case 'bottom-left': |
1744 | initialMoveX = moveX = 0; | 1758 | initialMoveX = moveX = 0; |
1745 | initialMoveY = dims.h; | 1759 | initialMoveY = dims.h; |
1746 | moveY = -dims.h; | 1760 | moveY = -dims.h; |
1747 | break; | 1761 | break; |
1748 | case 'bottom-right': | 1762 | case 'bottom-right': |
1749 | initialMoveX = dims.w; | 1763 | initialMoveX = dims.w; |
1750 | initialMoveY = dims.h; | 1764 | initialMoveY = dims.h; |
1751 | moveX = -dims.w; | 1765 | moveX = -dims.w; |
1752 | moveY = -dims.h; | 1766 | moveY = -dims.h; |
1753 | break; | 1767 | break; |
1754 | case 'center': | 1768 | case 'center': |
1755 | initialMoveX = dims.w / 2; | 1769 | initialMoveX = dims.w / 2; |
1756 | initialMoveY = dims.h / 2; | 1770 | initialMoveY = dims.h / 2; |
1757 | moveX = -dims.w / 2; | 1771 | moveX = -dims.w / 2; |
1758 | moveY = -dims.h / 2; | 1772 | moveY = -dims.h / 2; |
1759 | break; | 1773 | break; |
1760 | } | 1774 | } |
1761 | 1775 | ||
1762 | var optionsParallel = MochiKit.Base.update({ | 1776 | var optionsParallel = MochiKit.Base.update({ |
1763 | beforeSetupInternal: function (effect) { | 1777 | beforeSetupInternal: function (effect) { |
1764 | s.setStyle(effect.effects[0].element, {height: '0px'}); | 1778 | s.setStyle(effect.effects[0].element, {height: '0px'}); |
1765 | s.showElement(effect.effects[0].element); | 1779 | s.showElement(effect.effects[0].element); |
1766 | }, | 1780 | }, |
1767 | afterFinishInternal: function (effect) { | 1781 | afterFinishInternal: function (effect) { |
1768 | s.undoClipping(effect.effects[0].element); | 1782 | s.undoClipping(effect.effects[0].element); |
1769 | s.undoPositioned(effect.effects[0].element); | 1783 | s.undoPositioned(effect.effects[0].element); |
1770 | s.setStyle(effect.effects[0].element, oldStyle); | 1784 | s.setStyle(effect.effects[0].element, oldStyle); |
1771 | } | 1785 | } |
1772 | }, options); | 1786 | }, options); |
1773 | 1787 | ||
1774 | return new v.Move(element, { | 1788 | return new v.Move(element, { |
1775 | x: initialMoveX, | 1789 | x: initialMoveX, |
1776 | y: initialMoveY, | 1790 | y: initialMoveY, |
1777 | duration: 0.01, | 1791 | duration: 0.01, |
1778 | beforeSetupInternal: function (effect) { | 1792 | beforeSetupInternal: function (effect) { |
1779 | s.hideElement(effect.element); | 1793 | s.hideElement(effect.element); |
1780 | s.makeClipping(effect.element); | 1794 | s.makeClipping(effect.element); |
1781 | s.makePositioned(effect.element); | 1795 | s.makePositioned(effect.element); |
1782 | }, | 1796 | }, |
1783 | afterFinishInternal: function (effect) { | 1797 | afterFinishInternal: function (effect) { |
1784 | new v.Parallel( | 1798 | new v.Parallel( |
1785 | [new v.Opacity(effect.element, { | 1799 | [new v.Opacity(effect.element, { |
1786 | sync: true, to: 1.0, from: 0.0, | 1800 | sync: true, to: 1.0, from: 0.0, |
@@ -1865,111 +1879,98 @@ MochiKit.Visual.shrink = function (element, /* optional */ options) { | |||
1865 | elemClip = s.makeClipping(effect.effects[0].element); | 1879 | elemClip = s.makeClipping(effect.effects[0].element); |
1866 | }, | 1880 | }, |
1867 | afterFinishInternal: function (effect) { | 1881 | afterFinishInternal: function (effect) { |
1868 | s.hideElement(effect.effects[0].element); | 1882 | s.hideElement(effect.effects[0].element); |
1869 | s.undoClipping(effect.effects[0].element, elemClip); | 1883 | s.undoClipping(effect.effects[0].element, elemClip); |
1870 | s.undoPositioned(effect.effects[0].element); | 1884 | s.undoPositioned(effect.effects[0].element); |
1871 | s.setStyle(effect.effects[0].element, oldStyle); | 1885 | s.setStyle(effect.effects[0].element, oldStyle); |
1872 | } | 1886 | } |
1873 | }, options); | 1887 | }, options); |
1874 | 1888 | ||
1875 | return new v.Parallel( | 1889 | return new v.Parallel( |
1876 | [new v.Opacity(element, { | 1890 | [new v.Opacity(element, { |
1877 | sync: true, to: 0.0, from: 1.0, | 1891 | sync: true, to: 0.0, from: 1.0, |
1878 | transition: options.opacityTransition | 1892 | transition: options.opacityTransition |
1879 | }), | 1893 | }), |
1880 | new v.Scale(element, /Opera/.test(navigator.userAgent) ? 1 : 0, { | 1894 | new v.Scale(element, /Opera/.test(navigator.userAgent) ? 1 : 0, { |
1881 | scaleMode: {originalHeight: dims.h, originalWidth: dims.w}, | 1895 | scaleMode: {originalHeight: dims.h, originalWidth: dims.w}, |
1882 | sync: true, transition: options.scaleTransition, | 1896 | sync: true, transition: options.scaleTransition, |
1883 | scaleContent: options.scaleContent, | 1897 | scaleContent: options.scaleContent, |
1884 | scaleFromCenter: options.scaleFromCenter, | 1898 | scaleFromCenter: options.scaleFromCenter, |
1885 | restoreAfterFinish: true | 1899 | restoreAfterFinish: true |
1886 | }), | 1900 | }), |
1887 | new v.Move(element, { | 1901 | new v.Move(element, { |
1888 | x: moveX, y: moveY, sync: true, transition: options.moveTransition | 1902 | x: moveX, y: moveY, sync: true, transition: options.moveTransition |
1889 | }) | 1903 | }) |
1890 | ], optionsParallel | 1904 | ], optionsParallel |
1891 | ); | 1905 | ); |
1892 | }; | 1906 | }; |
1893 | 1907 | ||
1894 | /** @id MochiKit.Visual.pulsate */ | 1908 | /** @id MochiKit.Visual.pulsate */ |
1895 | MochiKit.Visual.pulsate = function (element, /* optional */ options) { | 1909 | MochiKit.Visual.pulsate = function (element, /* optional */ options) { |
1896 | /*** | 1910 | /*** |
1897 | 1911 | ||
1898 | Pulse an element between appear/fade. | 1912 | Pulse an element between appear/fade. |
1899 | 1913 | ||
1900 | ***/ | 1914 | ***/ |
1901 | var d = MochiKit.DOM; | 1915 | var d = MochiKit.DOM; |
1902 | var v = MochiKit.Visual; | 1916 | var v = MochiKit.Visual; |
1903 | var b = MochiKit.Base; | 1917 | var b = MochiKit.Base; |
1904 | var oldOpacity = MochiKit.Style.getStyle(element, 'opacity'); | 1918 | var oldOpacity = MochiKit.Style.getStyle(element, 'opacity'); |
1905 | options = b.update({ | 1919 | options = b.update({ |
1906 | duration: 3.0, | 1920 | duration: 3.0, |
1907 | from: 0, | 1921 | from: 0, |
1908 | afterFinishInternal: function (effect) { | 1922 | afterFinishInternal: function (effect) { |
1909 | MochiKit.Style.setStyle(effect.element, {'opacity': oldOpacity}); | 1923 | MochiKit.Style.setStyle(effect.element, {'opacity': oldOpacity}); |
1910 | } | 1924 | } |
1911 | }, options); | 1925 | }, options); |
1912 | var transition = options.transition || v.Transitions.sinoidal; | 1926 | var transition = options.transition || v.Transitions.sinoidal; |
1913 | options.transition = function (pos) { | 1927 | options.transition = function (pos) { |
1914 | return transition(1 - v.Transitions.pulse(pos, options.pulses)); | 1928 | return transition(1 - v.Transitions.pulse(pos, options.pulses)); |
1915 | }; | 1929 | }; |
1916 | return new v.Opacity(element, options); | 1930 | return new v.Opacity(element, options); |
1917 | }; | 1931 | }; |
1918 | 1932 | ||
1919 | /** @id MochiKit.Visual.fold */ | 1933 | /** @id MochiKit.Visual.fold */ |
1920 | MochiKit.Visual.fold = function (element, /* optional */ options) { | 1934 | MochiKit.Visual.fold = function (element, /* optional */ options) { |
1921 | /*** | 1935 | /*** |
1922 | 1936 | ||
1923 | Fold an element, first vertically, then horizontally. | 1937 | Fold an element, first vertically, then horizontally. |
1924 | 1938 | ||
1925 | ***/ | 1939 | ***/ |
1926 | var d = MochiKit.DOM; | 1940 | var d = MochiKit.DOM; |
1927 | var v = MochiKit.Visual; | 1941 | var v = MochiKit.Visual; |
1928 | var s = MochiKit.Style; | 1942 | var s = MochiKit.Style; |
1929 | element = d.getElement(element); | 1943 | element = d.getElement(element); |
1930 | var elementDimensions = s.getElementDimensions(element, true); | 1944 | var elementDimensions = s.getElementDimensions(element, true); |
1931 | var oldStyle = { | 1945 | var oldStyle = { |
1932 | top: element.style.top, | 1946 | top: element.style.top, |
1933 | left: element.style.left, | 1947 | left: element.style.left, |
1934 | width: element.style.width, | 1948 | width: element.style.width, |
1935 | height: element.style.height | 1949 | height: element.style.height |
1936 | }; | 1950 | }; |
1937 | var elemClip = s.makeClipping(element); | 1951 | var elemClip = s.makeClipping(element); |
1938 | options = MochiKit.Base.update({ | 1952 | options = MochiKit.Base.update({ |
1939 | scaleContent: false, | 1953 | scaleContent: false, |
1940 | scaleX: false, | 1954 | scaleX: false, |
1941 | scaleMode: {originalHeight: elementDimensions.h, | 1955 | scaleMode: {originalHeight: elementDimensions.h, |
1942 | originalWidth: elementDimensions.w}, | 1956 | originalWidth: elementDimensions.w}, |
1943 | afterFinishInternal: function (effect) { | 1957 | afterFinishInternal: function (effect) { |
1944 | new v.Scale(element, 1, { | 1958 | new v.Scale(element, 1, { |
1945 | scaleContent: false, | 1959 | scaleContent: false, |
1946 | scaleY: false, | 1960 | scaleY: false, |
1947 | scaleMode: {originalHeight: elementDimensions.h, | 1961 | scaleMode: {originalHeight: elementDimensions.h, |
1948 | originalWidth: elementDimensions.w}, | 1962 | originalWidth: elementDimensions.w}, |
1949 | afterFinishInternal: function (effect) { | 1963 | afterFinishInternal: function (effect) { |
1950 | s.hideElement(effect.element); | 1964 | s.hideElement(effect.element); |
1951 | s.undoClipping(effect.element, elemClip); | 1965 | s.undoClipping(effect.element, elemClip); |
1952 | s.setStyle(effect.element, oldStyle); | 1966 | s.setStyle(effect.element, oldStyle); |
1953 | } | 1967 | } |
1954 | }); | 1968 | }); |
1955 | } | 1969 | } |
1956 | }, options); | 1970 | }, options); |
1957 | return new v.Scale(element, 5, options); | 1971 | return new v.Scale(element, 5, options); |
1958 | }; | 1972 | }; |
1959 | 1973 | ||
1960 | 1974 | ||
1961 | /* end of Rico adaptation */ | 1975 | MochiKit.Base.nameFunctions(MochiKit.Visual); |
1962 | |||
1963 | MochiKit.Visual.__new__ = function () { | ||
1964 | var m = MochiKit.Base; | ||
1965 | |||
1966 | // Backwards compatibility aliases | ||
1967 | m._deprecated(this, 'Color', 'MochiKit.Color.Color', '1.1'); | ||
1968 | m._deprecated(this, 'getElementsComputedStyle', 'MochiKit.Style.getStyle', '1.1'); | ||
1969 | |||
1970 | m.nameFunctions(this); | ||
1971 | }; | ||
1972 | |||
1973 | MochiKit.Visual.__new__(); | ||
1974 | |||
1975 | MochiKit.Base._exportSymbols(this, MochiKit.Visual); | 1976 | MochiKit.Base._exportSymbols(this, MochiKit.Visual); |