Showing posts with label plugin. Show all posts
Showing posts with label plugin. Show all posts

Wednesday, August 31, 2011

defunkt/jquery-pjax - GitHub

what is it?

pjax loads HTML from your server into the current page without a full reload. It's ajax with real permalinks, page titles, and a working back button that fully degrades.
pjax enhances the browsing experience - nothing more.
You can find a demo on http://pjax.heroku.com/

browser support

pjax only works with browsers that support the history.pushState API.
For a table of supported browsers see: http://caniuse.com/#search=pushstate
To check if pjax is supported, use the $.support.pjax boolean.
When pjax is not supported, $('a').pjax() calls will do nothing (aka links work normally) and $.pjax({url:url}) calls will redirect to the given URL.

Tuesday, July 26, 2011

Chosen

Chosen is a JavaScript plugin that makes long, unwieldy select boxes much more user-friendly. It is currently available in both jQuery and Prototype flavors.

https://github.com/harvesthq/chosen/
http://harvesthq.github.com/chosen/ 

Sunday, June 12, 2011

jVectorMap

jVectorMap is a jQuery plugin employed to show vector maps and visualize data on HTML pages. It uses SVG in all modern browsers like Firefox 3 or 4, Safari, Chrome, Opera, IE9, while legacy support for older versions of IE from 6 to 8 is provided with VML. Using jVectorMap is pretty simple as for any other jQuery plugin.

http://jvectormap.owl-hollow.net

Sunday, May 1, 2011

How to develop rails plugin from scratch?

Generate Plugin with command: ruby script/generate plugin hello_world
It will create file system as bellow:
- lib
    - hello_world.rb
- tasks
    - hello_world_tasks.rake
- test
    - hello_world_test.rb
- init.rb
- install.rb
- uninstall.rb
- README
- Rakefile
- MIT-LICENSE

init.rb will be executed every time when your application runs. Generally hook code is to be included here like you want to make all methods of your plugin available in your app’s models, controllers, views and helpers

http://abdul-barek-rails.blogspot.com/2010/02/how-to-develop-rails-plugin-from.html

Monday, March 21, 2011

Firebug 1.7.0

After eleven alphas and four betas Firebug Working Group (FWG) is proud to declare victory and release the final Firebug 1.7.0! Of course also Chromebug 1.7.0 is available.
This version fixes three bugs reported since the last beta.
The main goal of Firebug 1.7 has been full compatibility with Firefox 4 (released tomorrow! No, no, no - today :) ). However there are also new features and improvements. They have been all published here on this blog, so see just some highlights.
  • Break notification message redesign
  • Only show applied styles
  • Open with editor feature improved
  • Support for local, session and global storage examination in the DOM and Console panels
  • New API for Firebug extensions
  • New Firebug start button
  • Large command line has history
  • CSS panel is now displaying @font-face rules.
  • Pressing F1 opens a help page (Firebug UI must be opened and focused)
  • Inspector improved and solid as a rock!
  • Our automated testing framework improved and 150+ tests watching Firebug features
The version has been also uploaded to AMO, but it can take some time to appear.
http://getfirebug.com/

Sunday, February 13, 2011

Isotope

  1. An exquisite jQuery plugin for magical layouts
  2. Reveal & hide items with filtering
  3. Re–order items with sorting
  4. Dynamic, intelligent layouts
  5. Captivating animations
  6. Sort items by just about anything
  7. Powerful methods, simple syntax
  8. Progressively enhanced for CSS3 transforms & transitions
http://isotope.metafizzy.co/

jQuery Splatter Plugin

Splatter is a jQuery plugin which applies a random position, size, and color to elements on a page. The most basic implementation adds randomly colored and positioned asterisks to the element:
simple_example
To see some working examples, check out the demo page.

http://coryschires.com/jquery-splatter-plugin/

zClip

zClip is a lightweight jQuery "copy to clipboard" plugin built using the popular Zero Clipboard library. This plugin uses an invisible Adobe Flash movie that is fully compatible with Flash Player 10 and below.

http://www.steamdev.com/zclip/

Wednesday, February 2, 2011

NestedSet

Nested Set is an implementation of the nested set pattern for ActiveRecord models. It is replacement for acts_as_nested_set and BetterNestedSet, but awesomer. It supports Rails 3.0 and later.

https://github.com/skyeagle/nested_set

Smooth Div Scroll

Smooth Div Scroll is a jQuery plugin that scrolls content horizontally left or right. Apart from many of the other scrolling plugins that have been written for jQuery, Smooth Div Scroll does not limit the scrolling to distinct steps. As the name of the plugin hints, scrolling is smooth. There are no visible buttons or links since the scrolling is done using hotspots within the scrollable area or via autoscrolling. Unobtrusive and smooth is the key here.

Table of contents

  1. What is Smooth Div Scroll?
  2. Quick demo
  3. Basic demo (use as template)
  4. More examples!
  5. Options
  6. Altering options after initialization
  7. Public methods
  8. Callbacks
  9. The CSS
  10. Dependencies
  11. Download
  12. Help and support
  13. Newsletter
  14. Version history
  15. To-do (the next version)
  16. Copyright, license and all that
  17. About me
  18. Nice sites that use Smooth Div Scroll
  19. Please give this plugin a rating
http://www.smoothdivscroll.com/

Thursday, January 27, 2011

Rails SQL Views

Getting started

The Rails SQL Views extension modifies some of the modules in ActiveRecord to add support for SQL Views. It adds the methods create_view and drop_view to the AbstractAdapter so you can use these in migrations. It also modifies the SchemaDumper class to support dumping of create_view logic. Currently the following adapters are supported:
  • MySQL
  • PostgreSQL (native and pure ruby)
  • SQL Server
  1. Get It

    There are several ways to get the Rails SQL Views extension:
    Install the Gem
    Get to your command line and type sudo gem install rails_sql_views on Linux or OS X or type gem install rails_sql_views on Windows. Rails SQL Views depends on ActiveRecord. If necessary you may have to approve the installation of these dependencies if they are not already installed.
    Download
    You can also download the packages in Zip, Gzip, or Gem format from the ActiveWarehouse files section on RubyForge.
    Github Clone
    For the brave you can get the latest code from the Github repository: git clone git://github.com/aeden/rails_sql_views.git.





  2. Require Statements

    Add the following to your config/environment.rb:
    require 'rubygems'
    require 'rails_sql_views'



  3. Use It!

    You can now use the library:
    class CreatePersonView < ActiveRecord::Migration
        def self.up
          create_view :v_people, "select * from people" do |t|
            t.column :id
            t.column :name
            t.column :social_security
          end
        end
    
        def self.down
          drop_view :v_people
        end
      end



What's There Now?

Right now the library does the following:
  • Adds create_view and drop_view methods to Rails schema code
  • Makes ActiveRecord::SchemaDumper view-aware
  • Adds a supports_views? abstract method to ActiveRecord::ConnectionAdapters::AbstractAdapter which returns false by default
  • Changes the MySQL connection adapter to use SHOW TABLE STATUS rather than SHOW TABLES, so that the tables method returns only tables. Views are returned through the views method
  • Implements view support for MySQL, PostgreSQL and SQL Server
  • Unit tests included
http://activewarehouse.rubyforge.org/rails_sql_views/
http://stackoverflow.com/questions/3137192/creating-migrations-for-sql-views-in-rails-with-boolean-values

    Thursday, January 20, 2011

    Signature Pad

    A jQuery plugin for assisting in the creation of an HTML5 canvas based signature pad. Records the drawn signature in JSON for later regeneration.

    The Signature Pad jQuery plugin will transform an HTML form into a signature pad. The Signature Pad has two modes: TypeIt and DrawIt. In TypeIt mode the user’s signature is automatically generated as HTML text, styled with @font-face, from the input field where they type their name. In DrawIt mode the user is able to draw their signature on the canvas element.
    The drawn signature is written out to a hidden input field as a JSON array using JSON.strinify(). Since the signature is saved as JSON it can be submitted as part of the form and kept on file. Using the JSON array, the signature can then be regenerated into the canvas element for display.
    Obviously, Signature Pad has a couple extra dependencies: Douglas Crockford’s JSON2 and Google’s Explorer Canvas. (Both scripts are included in the downloadable package.)
    Signature Pad tries to maintain a certain level of progressive enhancement, while still giving developers enough control. There is very little generated HTML. The HTML in the examples has some elements that should be hidden by default (including canvas). Signature Pad will trigger the display of certain items if the browser supports Javascript and canvas.
    Signature Pad works with both mouse and touch devices.
    Get the source code on GitHub:
    http://github.com/thomasjbradley/signature-pad/

    Signature Pad is able to create multiple instances on a single page by selecting multiple items with jQuery. The limitation lies in the API return; Signature Pad will only return the API for the last selected element. If you would like to store the API for multiple elements they must be initialised with separate jQuery calls.

    http://thomasjbradley.ca/lab/signature-pad

    Wednesday, January 19, 2011

    Embedded help system

    Introduction

    Embedded Help System is "providing help where help is needed" concept that can be easily integrated into web interface. The point is to offer help to user in their working interface and actual situation.

    Jquery plugin

    Jquery E-Help is plugin for procedural("How to ...") web user interface help and it's easy to integrate into any web interface that supports Jquery. Useful for all web applications, CMS and E-commerce systems.
    Try jquery.eHelp here and be free to download, use and modify...

    Contribute

    Contribute to embedded help concept and develop more useful scripts that can be easily integrated into web interface.

    http://embedded-help.net/home

    Tuesday, January 11, 2011

    NETEYE Activity Indicator

    NETEYE Activity Indicator

    A jQuery plugin that renders a translucent activity indicator (spinner) using SVG or VML.

    Features

    • Lightweight script
    • No images required
    • No external CSS
    • Resolution independent
    • Alpha transparency
    • Highly configurable appearance
    • Works in all major browsers
    • Uses feature detection
    • Degrades gracefully

    Supported Browsers

    The plugin has been successfully tested in the following browsers:
    • Firefox 2.0
    • Safari 3.2.1
    • Internet Explorer 6.0
    • Opera 10.6
    Of course newer versions of the various browsers are also supported.

    Dependencies

    The plugin requires jQuery v1.4.2 (or higher). Besides that, no other files are required, especially no style-sheets or images.

    http://neteye.github.com/activity-indicator.html

    Thursday, December 30, 2010

    jQuery custom content scroller

    Custom scrollbar plugin utilizing jquery UI that’s fully customizable with CSS. It features vertical/horizontal scrolling, mouse-wheel support (via Brandon Aaron jquery mouse-wheel plugin), scroll easing and adjustable scrollbar height/width.




    malihu custom scrollbar plugin
    http://manos.malihu.gr/jquery-custom-content-scroller

    Sunday, December 5, 2010

    rotate3Di - Flip HTML content in 3D

    Rotate3Di is a jQuery Effect Plugin that makes it possible to do an isometric 3D flip or 3D rotation of any HTML content. It also enables custom 3D rotation animations. CSS3 Transforms are used to create this visual "3D" isometric effect. Supported browsers are WebKit, Safari, Chrome, Firefox 3.5+, IE9 (Platform Preview 7+), and probably Opera. The plugin's functionality includes: setting or animating HTML content to an arbitrary isometric rotation angle, as well as flipping, unflipping, or toggling the flip state of an object.

    http://www.zachstronaut.com/projects/rotate3di/

    Monday, November 8, 2010

    Social Stream

    Social Stream is a plugin for Ruby on Rails. It provides your application with social networking features and activity streams.

    Social networking

    Social networks are a new paradigm on web application design. Social networking platforms stand among the most popular websites, while many content oriented applications are supporting social networking features in order to improve engagement, enhance user awareness and stimulate communities around the website.
    Social Stream is based in Social Network Analysis concepts and methods, including social entities (actors), ties and relations. It also provides a new tie-based access control model.

    Activity Streams

    Activity Streams is a format for syndicating social activities around the web. It has already been adopted by some of the major social networking platforms.
    Social Stream provides a database schema based on the Activity Streams specification, leading your application towards a well-known compatible data model design.

    Installation

    Add to your Gemfile:
    gem 'social_stream'
    and run:
    bundle update
    Then, execute:
    rails generate social_stream:install
    This will generate the following:
    • A jquery:install generation for jQuery support
    • A devise:install generation for authentication support
    • An initializer configuration file for Social Stream.
    • A database seeds file for defining Social Stream relations, along with an entry
    in db/seeds.rb to load it.
    • A new application layout
    • A migration providing the database schema
    Do not forget to migrate and seed your database
    rake db:migrate
      rake db:seed
     
    http://rubydoc.info/gems/social_stream/0.1.0/frames
    

    Tuesday, October 5, 2010

    Using acts_as_archive instead of soft delete

    For the application I am working on right now, the ability to restore content that has been deleted is one of the requirements. A lot of people would just go ahead and add acts_as_paranoid or is_paranoid and be done with it, but I've had trouble with that approach before.
    I've been reading a lot about the trouble with "soft deletes" (flagging a record as deleted instead of deleting it). Using a plugin that monkey patches ActiveRecord can go a long way towards fixing thesee problems, but it's a leaky abstraction and will bite you in the ass in unexpected ways. For example, all your uniqueness validations (and indexes) become much more complicated.
    That's why Jeffrey Chupp decided to kill is_paranoid and Rick Olson doesn't use acts_as_paranoid any more.
    There are other problems too. If you delete a lot of records, and you keep them in the same table, your table can get quite large, and all your queries slow down. At this point you have to use partitioning or partial indexes to get acceptable performance.

    Alternatives to soft delete

    In my reading, I found two alternatives to soft delete to be compelling.
    The first was the suggestion to properly model your domain. Why do you want to delete a record? What does that mean? Udi Dahan puts it this way:
    Orders aren’t deleted – they’re cancelled. There may also be fees incurred if the order is canceled too late.
    Employees aren’t deleted – they’re fired (or possibly retired). A compensation package often needs to be handled.
    Jobs aren’t deleted – they’re filled (or their requisition is revoked).
    Keeping that in mind, what if the task at hand really is to delete the record? The other idea that I liked was to archive the records in another table.
    The first Rails plugin I came across that implemented this was acts_as_soft_deletable which besides being misnamed doesn't appear to be actively maintained. The author even disavows the plugin somewhat for Rails 2.3:
    Before using this with a new Rails 2.3 app, you may want to consider using the new default_scope feature (or named_scopes) with a deleted_at flag.
    Then I found acts_as_archive which is more recently maintained and used in production for a major Rails website.
    There was only one problem -- acts_as_archive didn't support PostgreSQL. Fortunately, that was easy enough to fix.

    Restoring deleted records with acts_as_archive

    acts_as_archive has the ability to restore a deleted record, but only that record, not associated records.
    I was troubled by this at first, but after thinking about it I came to the conclusion that restoring a network of objects is an application-dependant problem. Here's one way to achieve it.
    Imagine you have a model like this, with Posts having many Comments and Votes.
    Post model
    A Post can be deleted, and when it is, it should take the Comments and Votes with it:
    class Post
      acts_as_archive
    
      has_many :votes, :dependent => :destroy
      has_many :comments, :dependent => :destroy
    end
    
    (Assume Comment and Vote also have acts_as_archive.)
    Now, I can restore a Post with its associated Votes and Comments like this:
    def self.restore(id)
      transaction do
        Post.restore_all(["id = ?", id])
        post = Post.find(id)
    
        Vote.restore_all(Vote::Archive.all(:conditions => ["post_id = ?", id]).map(&:id))
        Comment.restore_all(Comment::Archive.all(:conditions => ["post_id = ?", id]).map(&:id))
      end
    
    In my real code, I've broken apart the two pieces of this into a class method restore and an instance method post_restore which the freshly restored object uses to find its associated records and restore them. post_restore also takes care of post-restore tasks like putting the object back in the Solr index.
    This all works great. But now let's say Comments can be deleted individually, and we want to restore them.
    Here the logic is a little different, because a Comment can't be restored unless its parent Post still exists (unless it's being restored by the Post, as above).
    I take care of this logic in the administrative controller, by only showing child objects that it's valid to restore, and my foreign key constraints prevent anyone from getting around that.

    I really wanted to delete that!

    Sometimes you don't want to archive a deleted object. For example, in the application I'm working on, votes are canceled by re-voting. I don't want to save those votes -- there's no point, and it can even cause problems with restoring. Imagine having several archived votes from a user for a Post, and then deleting and restoring that Post. The restoration will try to bring back all the votes. Again, I catch this with a uniqueness constraint, but I don't want it to happen in the first place.
    Fortunately acts_as_archive has me covered.
    To destroy a record without archiving it, you can use destroy!. Likewise for deleting, there is delete_all!.

    http://railspikes.com/2010/2/26/acts-as-archive?utm_source=feedburner&utm_medium=feed&utm_campaign=Feed%3A+RailSpikes+%28Rail+Spikes%29

    Monday, October 4, 2010

    Polaroid Photobar Gallery with jQuery


    In this tutorial we are going to create an image gallery with a Polaroid look. We will have albums that will expand to sets of slightly rotated thumbnails that pop out on hover. The full image will slide in from the bottom once a thumbnail is clicked. In the full image view the user can navigate through the pictures or simply choose another thumbnail to be displayed.
    For this gallery we will be using the 2D Transform plugin to animate rotations.
    The beautiful photos used in the demo are by talented Tetsumo. Visit his blog here.

    http://tympanus.net/codrops/2010/09/28/polaroid-photobar-gallery/

    Tuesday, September 28, 2010

    jQuery plugin to disable text selection on elements

    It took my a while to find a bit of script that worked cross browser, but the jquery plugin at http://code.jdempster.com/jQuery.DisableTextSelect/ does the job!
    When working on the UI of a web application text would often get selected by the browser incorrectly, for example while dragging an element, or clicking on an element with an onclick event.
    If you are using jquery already; download it, include it, then use:
    $(‘.elementsToDisableSelectFor’).disableTextSelect();
    If you need this functionality without including the whole of jquery, take a look at the source code for the plugin. It’s only about 20 lines long. It uses a different method for Firefox and Internet Explorer, with a fallback for everything else but it should be easy to convert in to native JS or another javascript framework.
    
    (function($) {
        if ($.browser.mozilla) {
            $.fn.disableTextSelect = function() {
                return this.each(function() {
                    $(this).css({
                        'MozUserSelect' : 'none'
                    });
                });
            };
            $.fn.enableTextSelect = function() {
                return this.each(function() {
                    $(this).css({
                        'MozUserSelect' : ''
                    });
                });
            };
        } else if ($.browser.msie) {
            $.fn.disableTextSelect = function() {
                return this.each(function() {
                    $(this).bind('selectstart.disableTextSelect', function() {
                        return false;
                    });
                });
            };
            $.fn.enableTextSelect = function() {
                return this.each(function() {
                    $(this).unbind('selectstart.disableTextSelect');
                });
            };
        } else {
            $.fn.disableTextSelect = function() {
                return this.each(function() {
                    $(this).bind('mousedown.disableTextSelect', function() {
                        return false;
                    });
                });
            };
            $.fn.enableTextSelect = function() {
                return this.each(function() {
                    $(this).unbind('mousedown.disableTextSelect');
                });
            };
        }
    })(jQuery);
    

    http://www.blograndom.com/blog/2009/07/jquery-plugin-to-disable-text-selection-on-elements/