vistaprint / skinnyjs Goto Github PK

View Code? Open in Web Editor NEW

41.0 8.0 27.0 15.05 MB

Slim little jQuery plugins

Home Page: http://vistaprint.github.io/SkinnyJS

License: Other

CSS 10.05% JavaScript 86.73% HTML 3.22%

skinnyjs's Introduction

skinny.js: Slim little jQuery plugins

View the project page

skinny.js is a collection of jQuery plugins that are useful for building web applications. Its design is a response to having used too many JavaScript frameworks that require you to buy into a particular philosophy, coding style, or architecture. Instead, skinny.js embraces the single responsibility principle, and aims to create tiny, granular libraries with minimal dependencies.

Download skinny.js

Skinny libraries

date-parse: Polyfill for Date.parse to ensure support for ISO 8601 dates. Also provides support for Microsoft JSON format dates.
jQuery.clientRect: Gets element coordinates several orders of magnitude more efficiently than jQuery.top()/left()
jQuery.cookies: Practically oriented cookie management.
jQuery.css: Parses and serializes CSS style strings
jQuery.customEvent: A class that implements an observable event, useful for cases where there's no DOM element involved.
jQuery.delimitedString: Base class for parsing delimited strings, such as querystrings or CSS styles
jQuery.disableEvent: Temporarily disables/enables all event handlers for a DOM element
jQuery.hostIframe: Manages references between iframe content and their host window
jQuery.hoverDelay: Binds mouseover/out event handlers with a delay. Useful for authoring components with hover-based activation.
jQuery.htmlEncode: Bare bones HTML encoding
jQuery.imageSize: Some utilities for dealing with image sizes, async loading, and fitting images to a bounding box
jQuery.isVisibleKeyCode: Extension to jQuery.Event which indicates if a keypress is a visible character (i.e. not a function or modifier key)
jQuery.msAjax: Microsoft friendly AJAX. Handles the quirks of ASMX, WCF, DataJsonContractSerializer, Microsoft's JSON date format, and provides an interface identical to jQuery.ajax().
jQuery.ns: Declare namespaces without boilerplate
jQuery.partialLoad: Works like jQuery.load, but is more intelligent about executing downloaded scripts (i.e. don't re-run scripts that are already loaded)
jQuery.postMessage: Provides cross-document messaging support, works on all browsers to IE6 (without URL fragments and polling).
jQuery.proxyAll: Binds functions to their host object (like jQuery.proxy(), but for all functions declared as properties of an object at once)
jQuery.queryString: Parses querystrings (the opposite of jQuery.param())
jQuery.scrollAnchor: Smooth scrolling support for anchor elements with internal references.
jQuery.uncomment: Allows lazy evaluation of HTML blobs by removing them from comment blocks.
jQuery.url: Parses and serializes URLs.

Skinny UI components

jQuery.menu: A traditional hierarchical menu widget, designed from the ground up to be both touch and mouse friendly. TODO: Get existing docs from the wiki
jQuery.modalDialog: A powerful modal dialog system that works across all devices: TODO: Get existing docs from the wiki
jQuery.richTooltip: Responsive tooltips that support HTML content.

Dependencies

skinny.js libraries were designed to have minimal dependencies, and are not intended to be used as a bundle. For this reason, we don't provide a concatenated, minified version of the whole set of libraries. Take the libraries you need, include their dependencies, and concatenate/minify to your heart's content using your own project's build system.

How do I know what dependencies my file has?

All dependencies in skinny.js plugins are marked at the top using the following syntax:

/// <reference path="{path}" />

Contributing

Pull requests must build and pass unit tests to be accepted. New functionality should also include unit tests. To build and run unit tests:

Ensure you have node.js installed
cd {repo dir}
npm install grunt-cli -g
npm install
grunt

Origin

The libraires that comprise skinny.js were written at Vistaprint.

Vistaprint empowers more than 15 million micro businesses and consumers annually with affordable, professional options to make an impression. With a unique business model supported by proprietary technologies, high-volume production facilities, and direct marketing expertise, Vistaprint offers a wide variety of products and services that micro businesses can use to expand their business. A global company, Vistaprint employs over 4,100 people, operates more than 25 localized websites globally and ships to more than 130 countries around the world. Vistaprint's broad range of products and services are easy to access online, 24 hours a day at www.vistaprint.com.

skinnyjs's People

Contributors

Stargazers

Watchers

skinnyjs's Issues

Create hooks to set max-height on container elements in modal dialog content

It would be useful to automate setting the max height of a container div in a modal dialog in order to make overflow-x: auto work. This will help ensure that dialog buttons don't ever go off the bottom of the screen.

The max-height of this container should be a function of the device, and may be best rendered as a css class dynamically the first time a dialog is created.

Research better ways to make the Site dir easier to develop in

Document responsive features of modal dialogs

stub out unit tests for modal dialog

Document how to get the dialog content node from the dialog object

Allow modal dialogs to open iframes from non-skinny enabled sites

Allow the host page to specify the size (perhaps the framework would figure out the available size), and make the iframe scrollable. This would allow us to integrate pages that don't have skinny.js on them.

Document skin creation for modal dialogs

Passing Message from Parent Window to Child Window

Hello There - First of all great work on creating this library.

Since I am fairly new in using this library, I am having an issue with passing message from parent window to child window in ie8 using postmessage.htm.

The issues are below:

In the Jquery.PostMessage.js, the serializewnidowreference function is somehow throws an exception because it can't build a relationship between parent (opener) to the child window. On the other hand child to parent works okay since it check on window.parent.
I saw an optional parameter to pass the targetWindowName by the name. I did this, but then I encountered another error in the postmessage.htm

ript type="text/javascript">
(function () {

    var win, data = document.location.hash.split("&");
    if (data.length < 4) throw new Error("Invalid hash for postmessage");
    // Refernece is a name (string)
    if (data[1].substr(0, 1) === ':') {
        win = window.open("", winRef[1].substr(1));
    }

This condition yields true if (data[1].substr(0, 1) === ':') {
however winRef was not defined.

I appreciate your help in advance!

Smitty

gruntfile- identifying js files in the dist directory: find cleaner way

contribute fix for location.js generation

https://github.com/Obvious/phantomjs/blob/master/install.js

This is generating bad paths to the phantomjs exe on windows

Ensure jquery.menu works on windows 8 (touch + mouse)

Use tab characters over four spaces

The styling for the project was recently changed along with it all use of tabs being replaced by four spaces.

The standard most JavaScript projects is to use tabs (see jQuery's spec) - this is because many people prefer a two-space over a four-space tab size and using a tab character allows the developer to select how it looks for themselves.

Add versioning to the distribution

We need to stamp the distribution with a version number, and automatically increment it. We should use the semantic versioning standard.

Run modal dialog tests at "small screen" and "large screen" sizes

Modal dialogs have a big fork in behavior between small (i.e. phone) and large screens that should be exercised in unit tests. There doesn't appear to be any hook in grunt-contrib-qunit to set the WebPage.viewportSize property in phantomjs. Investigate and come up with a solution.

Since we're considering migrating to mocha anyway, it may make sense to see if the mocha grunt plugins support setting viewportHeight.

dialogs: close/cancel with esc key or stop button clicked

jquery.clientRect(): Write a unit test to verify IE8 scrollTop

When the page is scrolled down, IE8 wasn't including the docElem.scrollTop in the coordinates:

8307e97

Missing Tags/Releases

This repository was submitted at VersionEye. But without tags/releases on this repository it doesn't make much sense for us to track it.
Is there a reason why there or tags?

Consider moving from qunit to mocha/sinon

Add behavior component to modal dialog skins

Skins should be able to specify a javascript object that can decorate the dialog with behaviors.

First use case might be to remove the !important positioning styles from the lightbox skin.

Add coverage reports

Consider using Istanbul

Event handlers added with one() are fired multiple times

In jquery.customEvent.js, one() has the comment: "This currently wont work because the wrapper is in the callbacks list"

And it's true, one() does not actually work as expected, and any event handler added via it will fire multiple times.

Add feature: add API to ajax load content into an existing ajax dialog

I imagine a common case might be to use ajax dialogs to create a wizard flow. It would be good to have framework support for this- call a method to use the same built-in ajax mechanism to load new content (and possibly resize the dialog) as the user progresses through the wizard.

Sample API: AjaxModalDialog.loadContent(url, title)
Should return a promise

Unit tests should verify compatibility multiple versions of jquery

modal dialog- make _ methods private

Consider adding a grunt task to delete private method accessors in production version
** Is there an existing tool for this?

This may break the architecture of the download builder (all client side)
** Unless we can concatenate existing sourcemaps, or run uglify2 in the browser