Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

added api docs

  • Loading branch information...
commit 2e8b36d628073bc9ad29669d47ed7402600d07db 1 parent 40acbeb
Kristian Mandrup authored
Showing with 140 additions and 42 deletions.
  1. +50 −5 README.rdoc
  2. +90 −37 lib/apotomo/javascript_generator.rb
55 README.rdoc
View
@@ -46,11 +46,11 @@ Go and generate a widget stub.
$ rails generate apotomo:widget Comments display write -e haml
create app/cells/
- create app/cells/comments_widget
- create app/cells/comments_widget.rb
- create app/cells/comments_widget/display.html.haml
- create app/cells/comments_widget/write.html.haml
- create test/widgets/comments_widget_test.rb
+ create app/cells/comments
+ create app/cells/comments/comments_widget.rb
+ create app/cells/comments/views/display.html.haml
+ create app/cells/comments/views/write.html.haml
+ create test/widgets/comments/comments_widget_test.rb
Nothing special.
@@ -160,6 +160,51 @@ If that's not what you want, do
Apotomo doesn't depend on _any_ JS framework - you choose!
+== jQuery helpers
+
+* element(id)
+* update(id, markup)
+* replace(id, markup)
+* update_id(id, markup)
+* replace_id(id, markup)
+
+Extras (jQuery only):
+
+* selector_for(var, id, selector)
+
+Example usage:
+
+```ruby
+top_item = selector_for(:top_item, widget_id, '.item:first')
+render js: top_item + append_to(:_top_item, markup)
+
+Will select `.item:first` under the widget container element as a variable `_apo_top_item` and then append the markup to the DOM element(s) pointed to by that variable.
+```
+
+* update_text(id, selector, markup)
+* append(id, selector, markup)
+* prepend(id, selector, markup)
+* append_to(selector, markup)
+* prepend_to(selector, markup)
+* after(selector, markup)
+* before(selector, markup)
+* replace_all(selector, markup)
+* unwrap(selector)
+* wrap(selector, markup)
+* wrap_inner(selector, markup)
+* wrap_all(selector, markup)
+* remove(selector)
+* remove_class(selector, *classes)
+* add_class(selector, *classes)
+* toggle_class(selector, *classes)
+* toggle_class_fun(selector, fun)
+* get_attr(selector, name)
+* get_prop(selector, name)
+* get_val selector
+* get_html(selector)
+* empty(selector)
+
+
== Testing
Apotomo comes with its own test case and assertions to <b>build rock-solid web components</b>.
127 lib/apotomo/javascript_generator.rb
View
@@ -24,27 +24,34 @@ def escape(javascript)
module Prototype
def prototype; end
- def element(id); "$(\"#{id}\")"; end
- def update(id, markup); element(id) + '.update("'+escape(markup)+'");'; end
- def replace(id, markup); element(id) + '.replace("'+escape(markup)+'");'; end
- def update_id(id, markup); update(id, markup); end
- def replace_id(id, markup); replace(id, markup); end
+ def element(selector); "$(\"#{selector}\")"; end
+ def update(selector, markup); element(selector) + '.update("'+escape(markup)+'");'; end
+ def replace(selector, markup); element(selector) + '.replace("'+escape(markup)+'");'; end
+
+ alias_method :update_id, :update
+ alias_method :replace_id, :replace
end
module Right
def right; end
- def element(id); "$(\"#{id}\")"; end
- def update(id, markup); element(id) + '.update("'+escape(markup)+'");'; end
- def replace(id, markup); element(id) + '.replace("'+escape(markup)+'");'; end
- def update_id(id, markup); update(id, markup); end
- def replace_id(id, markup); replace(id, markup); end
+ def element(selector); "$(\"#{selector}\")"; end
+ def update(selector, markup); element(selector) + '.update("'+escape(markup)+'");'; end
+ def replace(selector, markup); element(selector) + '.replace("'+escape(markup)+'");'; end
+
+ alias_method :update_id, :update
+ alias_method :replace_id, :replace
end
module Jquery
def jquery; end
- def element(id); "$(\"#{id}\")"; end
+ def element(selector)
+ selector = selector =~ /^_apo_/ ? selector : "'#{selector}'"
+ "$(#{selector})"
+ end
+
def update(id, markup); element(id) + '.html("'+escape(markup)+'");'; end
def replace(id, markup); element(id) + '.replaceWith("'+escape(markup)+'");'; end
+
def update_id(id, markup); update("##{id}", markup); end
def replace_id(id, markup); replace("##{id}", markup); end
@@ -52,94 +59,140 @@ def update_text(id, selector, markup)
element(id) + ".find(#{selector}).text('#{escape(markup)}');"
end
+ def selector_for var, id, selector
+ raise ArgumentError, "Must not be an _apo_ selector here: #{selector}" if apo_match?(selector)
+ "var _apo_#{var} = " + element(id) + ".find('#{selector}');"
+ end
+
+ def find_element id, selector
+ element(id) + ".find('#{selector}')"
+ end
+
def append(id, selector, markup)
- element(id) + ".find(#{selector}).append('#{escape(markup)}');"
+ find_element(id, selector) + ".append(#{escaped(markup)});"
end
def prepend(id, selector, markup)
- element(id) + ".find(#{selector}).prepend('#{escape(markup)}');"
+ find_element(id, selector) + ".prepend(#{escaped(markup)});"
end
def append_to(selector, markup)
- "$(#{escape(markup)}').appendTo('#{selector}');"
+ selector = calc_selector selector
+ "$(#{escaped(markup)}).appendTo(#{selector});"
end
def prepend_to(selector, markup)
- "$(#{escape(markup)}').prependTo('#{selector}');"
+ selector = calc_selector selector
+ "$(#{escaped(markup)}).prependTo(#{selector});"
end
def after selector, markup
- "$('#{selector}').after('#{escape(markup)}');"
+ selector = calc_selector selector
+ element(selector) + ".after(#{escaped(markup)});"
end
def before selector, markup
- "$('#{selector}').before('#{escape(markup)}');"
+ selector = calc_selector selector
+ element(selector) + ".before(#{escaped(markup)});"
end
def replace_all(selector, markup)
- "$(#{escape(markup)}').replaceAll('#{selector}');"
+ selector = calc_selector selector
+ "$(#{escaped(markup)}).replaceAll(#{selector});"
end
- def unwrap (selector)
- "$('#{selector}').unwrap();"
+ def unwrap(selector)
+ selector = calc_selector selector
+ element(selector) + ".unwrap();"
end
- def wrap (selector, markup)
- "$('#{selector}').wrap('#{escape(markup)}');"
+ def wrap(selector, markup)
+ selector = calc_selector selector
+ element(selector) + ".wrap(#{escaped(markup)});"
end
- def wrap_innet (selector, markup)
- "$('#{selector}').wrapInner('#{escape(markup)}');"
+ def wrap_inner(selector, markup)
+ selector = calc_selector selector
+ element(selector) + ".wrapInner(#{escaped(markup)});"
end
- def wrap_all (selector, markup)
- "$('#{selector}').wrap_all('#{escape(markup)}');"
+ def wrap_all(selector, markup)
+ selector = calc_selector selector
+ element(selector) + ".wrap_all(#{escaped(markup)});"
end
def remove(selector)
- "$('#{selector}').remove();"
+ selector = calc_selector selector
+ element(selector) + ".remove();"
end
def remove_class(selector, *classes)
classes = classes.flatten.join(' ')
- "$('#{selector}').removeClass('#{classes}');"
+ selector = calc_selector selector
+ element(selector) + ".removeClass('#{classes}');"
end
alias_method :remove_classes, :remove_class
def add_class(selector, *classes)
classes = classes.flatten.join(' ')
- "$('#{selector}').addClass('#{classes}');"
+ selector = calc_selector selector
+ element(selector) + ".addClass('#{classes}');"
end
alias_method :add_classes, :add_class
def toggle_class(selector, *classes)
classes = classes.flatten.join(' ')
- "$('#{selector}').toggleClass('#{classes}');"
+ selector = calc_selector selector
+ element(selector) + ".toggleClass('#{classes}');"
end
alias_method :toggle_classes, :toggle_class
- def toggle_class_fun(selector, fun)
- "$('#{selector}').toggleClass(function() {#{fun}});"
+ def toggle_class_fun(selector, fun)
+ selector = calc_selector selector
+ element(selector) + ".toggleClass(function() {#{fun}});"
end
def get_attr(selector, name)
- "$('#{selector}').attr('#{name}');"
+ selector = calc_selector selector
+ element(selector) + ".attr('#{name}');"
end
def get_prop(selector, name)
- "$('#{selector}').prop('#{name}');"
+ selector = calc_selector selector
+ element(selector) + ".prop('#{name}');"
end
def get_val selector
- "$('#{selector}').val();"
+ selector = calc_selector selector
+ element(selector) + ".val();"
end
def get_html(selector)
- "$('#{selector}').html();"
+ selector = calc_selector selector
+ element(selector) + ".html();"
end
def empty(selector)
- "$('#{selector}').empty();"
+ selector = calc_selector selector
+ element(selector) + ".empty();"
+ end
+
+ private
+
+ def escaped markup
+ "'#{escape(markup)}'"
+ end
+
+ def apo_match? selector
+ selector.to_s =~ /^_apo_/
+ end
+
+ def calc_selector selector
+ selector = apo_selector?(selector) ? "_apo_#{selector}" : "'#{selector}'"
+ end
+
+ def apo_selector? selector
+ selector.kind_of?(Symbol) && selector.to_s[0..1] == '_'
end
end
end
Please sign in to comment.
Something went wrong with that request. Please try again.