/topup

The #1 Javascript Pop Up / Lightbox made by Paul Engel

Primary LanguageJavaScript

= TopUp

The #1 Javascript Pop Up / Lightbox

== Introduction

TopUp ( http://gettopup.com ) is an easy to use Javascript library for unobtrusively displaying images and webpages in a Web 2.0 approach of popups.
The library is jQuery ( http://jquery.com ) and jQuery UI ( http://jqueryui.com ) driven in order to maintain cross-browser compatibility and compactness.
TopUp offers the following advantages:

  * TopUp is absolutely free, also for commercial use ( see also http://creativecommons.org/licenses/by-sa/3.0 )
  * A very easy setup process ( only one include and nothing more, see http://gettopup.com#installation )
  * Using TopUp presets ( http://gettopup.com/examples#grouped_links ) keeps your HTML code 100% clean, no extra 
    code needed whatsoever
  * The ability of displaying images, flash (from sites like Youtube, SWF and FLV files), movies (QuickTime, Windows 
    Media and Realplayer), iframes, DOM elements and raw HTML
  * TopUp can be used along with Prototype ( http://prototypejs.org ) (just include TopUp before Prototype)
  * TopUp is compressed with Yahoo! YUI Compressor ( http://developer.yahoo.com/yui/compressor/ )
  * Usage of CSS sprites to reduce the amount of image requests to two per layout for faster loading
    ( see also http://developer.yahoo.com/performance/rules.html )
  * Fancy layouts, animations and transitions
  * Auto-correction of size and position when required
  * The possibility to create groups
  * Support for AJAX requests

== How to develop TopUp yourself

Any help concerning bugfixes and improvements for TopUp is appreciated. Setting the environment up consists of only following 5 easy steps described below.
But before we go any furter, I think it's better that I'll explain one thing or two ;)

TopUp is developed in a Rails application. This gives us many advantages:

  * We don't have to mess with the HTML and CSS TopUp injects into the webpage
      HTML: use the standard Rails view templates
      CSS : use the power of SASS ( http://sass-lang.com ) to generate clean, correct and compact CSS
      JS  : use the power of Jzip ( http://github.com/archan937/jzip ) for merging the different combinations of the requirements to separate files
  * Release and pack a new release easily with the use of rake tasks
  * Test TopUp easily by adjusting and testing the homepage examples for instance

The locations of the TopUp resources are as follows:

  * TopUp Javascript file
    - public/javascripts/development/top_up.js (for the jQuery version)
    - public/javascripts/development/top_up-pt.js (for the Prototype version: pre-alpha phase)
  
  * TopUp layouts images
    - public/images/top_up/*

  * CSS - SASS templates
    - assets/sass/public/top_up/*
  
  * HTML - Rails view templates
    - app/views/layouts/_top_up.html.erb
    - app/views/layouts/_tu_top_up.html.erb
  
  * TopUp requirements - Jzip templates
    - assets/jzip/jquery
  
  * Rake tasks
    - lib/tasks/top_up.rake

So to develop TopUp yourself, you will have to setup the development environment and run the Rails application.
Doing this is a piece of cake, just follow these steps:

1. Get a clone of the TopUp repository and open that directory
   git clone git://github.com/archan937/topup.git && cd topup

2. Copy or rename config/environment.example.rb to config/environment.rb
   mv config/environment.example.rb config/environment.rb

3. Copy or rename config/database.example.yml to config/database.yml and correct the login settings
   mv config/database.example.yml config/database.yml

4. Create the database and run the migration task
   rake db:create && rake db:migrate

5. Run the Rails application
   ./script/server

6. Go do some cool scripting
   [ edit public/javascripts/development/top_up.js ]

7. Enjoy! :D

== Documentation

Please visit http://gettopup.com/documentation.

== Support or feedback

For support, remarks and requests please mail me at paul.engel@holder.nl.

== License
Copyright (c) 2009 Paul Engel (Internetbureau Holder B.V.)
Except otherwise noted, TopUp is licensed under http://creativecommons.org/licenses/by-sa/3.0
http://gettopup.com - http://holder.nl - http://twitter.com/archan937 - http://twitter.com/gettopup

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE 
WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR 
COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR 
OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.