summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorFabio Bas <ctrlaltca@gmail.com>2013-11-28 13:30:42 +0100
committerFabio Bas <ctrlaltca@gmail.com>2013-11-28 13:30:42 +0100
commitfeb814ead577a12676f31e713edfcbfd3a937df4 (patch)
tree790475584ef86d74275da6fba3cea427a8d88e16
parenta3a7c130090d398e42c4d0f9bec15ab868328c32 (diff)
nome notes on porting existing prado javascript from prototype to jquery
-rw-r--r--jQuery-PORTING.txt82
1 files changed, 82 insertions, 0 deletions
diff --git a/jQuery-PORTING.txt b/jQuery-PORTING.txt
new file mode 100644
index 00000000..b5635cff
--- /dev/null
+++ b/jQuery-PORTING.txt
@@ -0,0 +1,82 @@
+Get element by id
+OLD: $('element_id')
+NEW: $('#element_id') // for the extended element
+NEW: $('#element_id').get(0) // for the base DOM element
+---
+Get element by css selector
+OLD: $$('.class')
+NEW: $('.class')
+---
+Apply a function to multiple elements
+OLD: $$('.class').each(Element.remove);
+NEW: $('.class').remove();
+---
+Class creation/extension
+
+OLD: Class.create(Prado.WebUI.TActiveImageButton, { ... })
+OLD: Class.extend(Prado.WebUI.TActiveImageButton, { ... })
+NEW: jQuery.klass(Prado.WebUI.TActiveImageButton, { ... })
+---
+Extending an object
+OLD: Object.extend(...)
+NEW: jQuery.extend(...)
+---
+Bind an event to a callback event handler
+OLD: Event.observe(element, 'click', callback)
+NEW: $(element).on('click', callback)
+---
+Bind an event to a callback event handler
+OLD: Event.stopObserving(element, 'click', callback)
+NEW: $(element).off('click', callback)
+---
+Stopping event propagation
+OLD: Event.stop(event)
+NEW: event.stopPropagation() or event.preventDefault()
+---
+Detect keypress event: use the numeric codes
+OLD: if(kc == Event.KEY_RETURN || kc == Event.KEY_SPACEBAR || kc == Event.KEY_TAB)
+NEW: if(kc == 13 || kc == 32 || kc == 9)
+---
+Implementing the postback handler for a PostBackControl; the function signature has changed (parameters are inverted):
+OLD: onPostBack : function(event, options)
+NEW: onPostBack : function(options, event)
+---
+Execute a function when the pagfe has finished loading
+OLD: document.observe("dom:loaded", function(event) { ... });
+NEW: $( document ).ready(function() { ... });
+---
+Create an animation effect with a "finish" callback
+OLD: new Effect.Fade(element, {duration: 400, afterFinish: function() { // Animation complete. });
+NEW: $(element).fadeOut( 400, function() { // Animation complete. });
+---
+Declare a function to be used as event handler binding its "this" property
+OLD: this.functionName.bindAsEventListener(this);
+NEW: this.functionName.bind(this);
+---
+Css class functions
+OLD: addClassName, removeClassName, hasClassName
+NEW: addClass, removeClass, hasClass
+---
+Get event target
+OLD: Event.element(event)
+NEW: event.target
+---
+Get event mouse position
+OLD: Event.pointerX(event), Event.pointerY(event);
+NEW: event.pageX, event.pageY;
+---
+Fire events
+OLD: Event.fireEvent(this.control, "change");
+NEW: $(element).trigger("change");
+---
+Test browser
+OLD: Prado.Browser().ie
+NEW: jQuery.support
+---
+Focus an element
+OLD: Prado.Element.focus(element);
+NEW: $(element).focus();
+---
+Get element size
+OLD: element.getWidth(), element.getHeight()
+NEW: element.width, element.height \ No newline at end of file