dragAnimDemo-yui3.js 1.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657
  1. /**
  2. unavoidable separate file for jquery specific parts of the dragAnimDemo.
  3. */
  4. ;(function() {
  5. jsPlumbDemo.initClearButton = function() {
  6. Y.one("#clear").detach("click", jsPlumb.detachEverything );
  7. Y.one("#clear").on("click", jsPlumb.detachEverything );
  8. };
  9. jsPlumbDemo.initAddButton = function() {
  10. Y.one("#add").detach("click", jsPlumbDemo.addDisc );
  11. Y.one("#add").on("click", jsPlumbDemo.addDisc );
  12. };
  13. jsPlumbDemo.initHover = function(elId) {
  14. var el = Y.one("#" + elId);
  15. el.on('mouseover', function(e) {
  16. this.addClass("bigdot-hover");
  17. });
  18. el.on('mouseout', function(e) {
  19. this.removeClass("bigdot-hover");
  20. });
  21. };
  22. jsPlumbDemo.initAnimation = function(elId) {
  23. var el = Y.one("#" + elId);
  24. el.on('click', function(e) {
  25. if (this.hasClass("jsPlumb_dragged")) {
  26. this.removeClass("jsPlumb_dragged");
  27. return;
  28. }
  29. var o = this._node.getBoundingClientRect();
  30. var w = o.width;
  31. var h = o.height;
  32. var c = [o.left + (w/2) - e.pageX, o.top + (h/2) - e.pageY];
  33. var oo = [c[0] / w, c[1] / h];
  34. var DIST = 450;
  35. var l = o.left - (oo[0] * DIST);
  36. var t = o.top - (oo[1] * DIST);
  37. jsPlumb.animate(elId, {left:l, top:t}, {duration:0.9});
  38. });
  39. };
  40. jsPlumbDemo.createDisc = function() {
  41. var id = 'disc_' + ((new Date().getTime()));
  42. var w = screen.width - 162, h = screen.height - 162;
  43. var x = (0.2 * w) + Math.floor(Math.random()*(0.5 * w));
  44. var y = (0.2 * h) + Math.floor(Math.random()*(0.6 * h));
  45. var style="top:" + y + "px;left:" + x + "px;";
  46. var d = Y.Node.create('<div id="' + id + '" style="' + style + '" class="bigdot"></div>');
  47. Y.one("body").append(d);
  48. return {d:d, id:id};
  49. };
  50. })();