From 554ee36f66a16b06a8fe472e3c104ea8f2ad68a5 Mon Sep 17 00:00:00 2001 From: Michael Weibel Date: Wed, 30 Oct 2013 06:43:07 +0100 Subject: [PATCH] Add adapter to be used with browserify Use it as follows: ```javascript var Opentip = require('path/to/lib/opentip'); // jQuery shim can be done as follows: // require('path/to/jquery'); // module.exports = $; var jQuery = require('path/to/jquery/shim'); require('path/to/lib/adapter-browserify')(Opentip, jQuery); ``` Basicly this adapter could also be used for component.js etc. But as I don't know how the original developer would like to have it, I just created this as well. Tests are not working with it as I didn't figure out how the test for the component.js adapter works. --- src/adapter-browserify.coffee | 151 ++++++++++++++++++++++++++++++++ test/src/200-adapters.coffee | 6 +- test/test.html | 3 +- test/test.js | 156 +--------------------------------- 4 files changed, 159 insertions(+), 157 deletions(-) create mode 100644 src/adapter-browserify.coffee diff --git a/src/adapter-browserify.coffee b/src/adapter-browserify.coffee new file mode 100644 index 0000000..dbeb00f --- /dev/null +++ b/src/adapter-browserify.coffee @@ -0,0 +1,151 @@ +# jQuery Opentip Adapter +# ====================== +# +# Uses jQuery + +# Because $ is my favorite character +module.exports = ((Opentip, $) -> + + + # Augment jQuery + $.fn.opentip = (content, title, options) -> + new Opentip this, content, title, options + + + # And now the class + class Adapter + + name: "browserify" + + # Simply using $.domReady + domReady: (callback) -> $ callback + + + # DOM + # === + + # Using bonzo to create html + create: (html) -> $ html + + + # Element handling + # ---------------- + + # Wraps the element in ender + wrap: (element) -> + element = $ element + throw new Error "Multiple elements provided." if element.length > 1 + element + + # Returns the unwrapped element + unwrap: (element) -> $(element)[0] + + # Returns the tag name of the element + tagName: (element) -> @unwrap(element).tagName + + # Returns or sets the given attribute of element + # + # It's important not to simply forward name and value because the value + # is set whether or not the value argument is present + attr: (element, args...) -> $(element).attr args... + + # Returns or sets the given data of element + # It's important not to simply forward name and value because the value + # is set whether or not the value argument is present + data: (element, args...) -> $(element).data args... + + # Finds elements by selector + find: (element, selector) -> $(element).find(selector).get(0) + + # Finds all elements by selector + findAll: (element, selector) -> $(element).find selector + + # Updates the content of the element + update: (element, content, escape) -> + element = $ element + if escape + element.text content + else + element.html content + + # Appends given child to element + append: (element, child) -> $(element).append child + + # Removes element + remove: (element) -> $(element).remove() + + # Add a class + addClass: (element, className) -> $(element).addClass className + + # Remove a class + removeClass: (element, className) -> $(element).removeClass className + + # Set given css properties + css: (element, properties) -> $(element).css properties + + # Returns an object with given dimensions + dimensions: (element) -> + { + width: $(element).outerWidth() + height: $(element).outerHeight() + } + + # Returns the scroll offsets of current document + scrollOffset: -> + [ + window.pageXOffset or document.documentElement.scrollLeft or document.body.scrollLeft + window.pageYOffset or document.documentElement.scrollTop or document.body.scrollTop + ] + + # Returns the dimensions of the viewport (currently visible browser area) + viewportDimensions: -> + { + width: document.documentElement.clientWidth + height: document.documentElement.clientHeight + } + + # Returns an object with x and y + mousePosition: (e) -> + return null unless e? + x: e.pageX, y: e.pageY + + + # Returns the offset of the element + offset: (element) -> + offset = $(element).offset() + { + left: offset.left + top: offset.top + } + + # Observe given eventName + observe: (element, eventName, observer) -> $(element).bind eventName, observer + + # Stop observing event + stopObserving: (element, eventName, observer) -> $(element).unbind eventName, observer + + # Perform an AJAX request and call the appropriate callbacks. + ajax: (options) -> + throw new Error "No url provided" unless options.url? + $.ajax( + url: options.url + type: options.method?.toUpperCase() ? "GET" + ) + .done((content) -> options.onSuccess? content) + .fail((request) -> options.onError? "Server responded with status #{request.status}") + .always(-> options.onComplete?()) + + + # Utility functions + # ================= + + # Creates a shallow copy of the object + clone: (object) -> $.extend { }, object + + # Copies all properties from sources to target + extend: (target, sources...) -> $.extend target, sources... + + # Add the adapter to the list + Opentip.addAdapter new Adapter + +) diff --git a/test/src/200-adapters.coffee b/test/src/200-adapters.coffee index 5f164c8..68be160 100644 --- a/test/src/200-adapters.coffee +++ b/test/src/200-adapters.coffee @@ -3,6 +3,8 @@ $ = jQuery if Opentip.adapters.component adapters = [ "component" ] +else if Opentip.adapters.browserify + adapters = [ "browserify" ] else adapters = [ "native" @@ -180,8 +182,8 @@ describe "Generic adapter", -> describe "viewportDimensions()", -> it "should return the viewportDimensions", -> - - origDimensions = + + origDimensions = width: document.documentElement.clientWidth height: document.documentElement.clientHeight diff --git a/test/test.html b/test/test.html index 170c9cd..b5833ea 100644 --- a/test/test.html +++ b/test/test.html @@ -23,6 +23,7 @@ + @@ -32,7 +33,7 @@