  

  


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head>
    <meta http-equiv="content-type" content="text/html;charset=UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="chrome=1">
        <title>Home - interaction.js - GitHub</title>
    <link rel="search" type="application/opensearchdescription+xml" href="/opensearch.xml" title="GitHub" />
    <link rel="fluid-icon" href="http://github.com/fluidicon.png" title="GitHub" />


    <link href="http://assets0.github.com/stylesheets/bundle_common.css?7ad939d173d4570ea03788d947f22a2da46eac7b" media="screen" rel="stylesheet" type="text/css" />
<link href="http://assets3.github.com/stylesheets/bundle_github.css?7ad939d173d4570ea03788d947f22a2da46eac7b" media="screen" rel="stylesheet" type="text/css" />

    <script type="text/javascript" charset="utf-8">
      var GitHub = {}
      var github_user = null
    </script>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
    <script src="http://assets2.github.com/javascripts/bundle_common.js?7ad939d173d4570ea03788d947f22a2da46eac7b" type="text/javascript"></script>
<script src="http://assets3.github.com/javascripts/bundle_github.js?7ad939d173d4570ea03788d947f22a2da46eac7b" type="text/javascript"></script>

    <script type="text/javascript" charset="utf-8">
      GitHub.spy({
        repo: "raid-ox/interaction.js"
      })
    </script>

    
  <link href="http://github.com/feeds/raid-ox/commits/interaction.js/master" rel="alternate" title="Recent Commits to interaction.js:master" type="application/atom+xml" />

    <meta name="description" content="Interaction Service Plugin for chain.js" />
    <script type="text/javascript">
      GitHub.nameWithOwner = GitHub.nameWithOwner || "raid-ox/interaction.js";
      GitHub.currentRef = "master";    
    </script>
  

    
  </head>

  

  <body>
    

    <div id="main">
      <div id="header" class="">
        <div class="site">
          <div class="logo">
            <a href="http://github.com"><img src="/images/modules/header/logov3.png" alt="github" /></a>
          </div>
          
          <div class="topsearch">
  
    <form action="http://github.com/search" id="top_search_form" method="get">
      <a href="http://github.com/search" class="advanced-search tooltipped downwards" title="Advanced Search">Advanced Search</a>
      <input type="search" class="search repo_autocompleter" name="q" results="5" placeholder="Search GitHub&hellip;" /> <input type="submit" value="Search", class="button" />
      <input type="hidden" name="type" value="Everything" />
      <input type="hidden" name="repo" value="" />
      <input type="hidden" name="langOverride" value="" />
      <input type="hidden" name="start_value" value="1" />
    </form>
  
  
    <ul class="nav logged_out">
      
        <li><a href="http://github.com">Home</a></li>
        <li class="pricing"><a href="http://github.com/plans">Pricing and Signup</a></li>
        <li><a href="http://github.com/popular/forked">Explore GitHub</a></li>
        
        <li><a href="/blog">Blog</a></li>
      
      <li></li>
    </ul>
  
</div>
        </div>
      </div>

      
        
      <div id="repo_menu">
        <div class="site">
          <ul>
            
              <li class=""><a href="http://github.com/raid-ox/interaction.js/tree/master">Source</a></li>

              <li class=""><a href="http://github.com/raid-ox/interaction.js/commits/master">Commits</a></li>

              
              <li class=""><a href="http://github.com/raid-ox/interaction.js/network">Network</a></li>

              

              
                
                
              

              
                
                <li class=""><a href="http://github.com/raid-ox/interaction.js/downloads">Downloads</a></li>
              

              
                
                <li class="active"><a href="http://wiki.github.com/raid-ox/interaction.js">Wiki</a></li>
              

              <li class=""><a href="http://github.com/raid-ox/interaction.js/graphs">Graphs</a></li>

              

            
          </ul>
        </div>
      </div>

    <div id="repo_sub_menu">
      <div class="site">
        <div class="joiner"></div>
        

        

        

        
      </div>
    </div>

    <div class="site">
      



<div id="repos">
  


<script type="text/javascript">
  GitHub.currentCommitRef = "master"
  GitHub.currentRepoOwner = "raid-ox"
  GitHub.currentRepo = "interaction.js"
  
</script>



  <div class="repo public" id="repo_details">
    <div class="title">
      <div class="path">
        <a href="http://github.com/raid-ox">raid-ox</a> / <b><a href="http://github.com/raid-ox/interaction.js">interaction.js</a></b>

        

          <span id="edit_button" style="display:none;">
            <a href="/raid-ox/interaction.js/edit"><img alt="edit" class="button" src="http://assets3.github.com/images/modules/repos/edit_button.png?7ad939d173d4570ea03788d947f22a2da46eac7b" /></a>
          </span>

          

          <span id="watch_button">
            <a href="http://github.com/raid-ox/interaction.js/toggle_watch" class="toggle_watch"><img alt="watch" class="button" src="http://assets3.github.com/images/modules/repos/watch_button.png?7ad939d173d4570ea03788d947f22a2da46eac7b" /></a>
          </span>

          <span id="unwatch_button" style="display:none;">
            <a href="http://github.com/raid-ox/interaction.js/toggle_watch" class="toggle_watch"><img alt="watch" class="button" src="http://assets2.github.com/images/modules/repos/unwatch_button.png?7ad939d173d4570ea03788d947f22a2da46eac7b" /></a>
          </span>

          
        
      </div>

      <div class="security private_security" style="display:none">
        <a href="#private_repo" rel="facebox"><img src="/images/icons/private.png" alt="private" /></a>
      </div>

      <div id="private_repo" class="hidden">
        This repository is private.
        All pages are served over SSL and all pushing and pulling is done over SSH.
        No one may fork, clone, or view it unless they are added as a <a href="/raid-ox/interaction.js/edit">member</a>.

        <br/>
        <br/>
        Every repository with this icon (<img src="/images/icons/private.png" alt="private" />) is private.
      </div>

      <div class="security public_security" style="">
        <a href="#public_repo" rel="facebox"><img src="/images/icons/public.png" alt="public" /></a>
      </div>

      <div id="public_repo" class="hidden">
        This repository is public.
        Anyone may fork, clone, or view it.

        <br/>
        <br/>
        Every repository with this icon (<img src="/images/icons/public.png" alt="public" />) is public.
      </div>

      

        <div class="flexipill">
          <a href="http://github.com/raid-ox/interaction.js/network">
          <table cellpadding="0" cellspacing="0">
            <tr><td><img alt="Forks" src="http://assets0.github.com/images/modules/repos/pills/forks.png?7ad939d173d4570ea03788d947f22a2da46eac7b" /></td><td class="middle"><span>1</span></td><td><img alt="Right" src="http://assets0.github.com/images/modules/repos/pills/right.png?7ad939d173d4570ea03788d947f22a2da46eac7b" /></td></tr>
          </table>
          </a>
        </div>

        <div class="flexipill">
          <a href="http://github.com/raid-ox/interaction.js/watchers">
          <table cellpadding="0" cellspacing="0">
            <tr><td><img alt="Watchers" src="http://assets3.github.com/images/modules/repos/pills/watchers.png?7ad939d173d4570ea03788d947f22a2da46eac7b" /></td><td class="middle"><span>21</span></td><td><img alt="Right" src="http://assets0.github.com/images/modules/repos/pills/right.png?7ad939d173d4570ea03788d947f22a2da46eac7b" /></td></tr>
          </table>
          </a>
        </div>
      </div>

    <div class="meta">
      <table>
        
        <tr>
          <td class="label" style="vertical-align:top">Description:</td>
          <td>
            <span id="repository_description" rel="/raid-ox/interaction.js/edit/update">Interaction Service Plugin for chain.js</span>
            <a href="#description" class="edit_link action" style="display:none;">edit</a>
          </td>
        </tr>

        
      </table>

          </div>
  </div>






</div>

<div id="guides">
  <div class="guide">
    <!-- main content -->
    
    <div class="main">

      
        <div class="actions">
          <a href="http://wiki.github.com/raid-ox/interaction.js">Home</a> 
          | <a href="http://github.com/raid-ox/interaction.js/wikis/home/edit">Edit</a> | 
          <a href="http://github.com/raid-ox/interaction.js/wikis/new">New</a>
        </div>
      

      <h1>Home</h1>

      <div class="wikistyle">
        <link rel="stylesheet" title="Sunburst" href="http://code.riiv.net/assets/styles/sunburst.css">
<script type="text/javascript" src="http://code.riiv.net/assets/scripts/jquery-1.2.6.pack.js"></script><script type="text/javascript" src="http://github.com/raid-ox/chain.js/tree/v0.1-stable/build/chain.js?raw=true"></script><script type="text/javascript" src="http://code.riiv.net/assets/scripts/jquery-noconflict.js"></script><h1>Interaction.js &#8211; Interaction Services for Chain.js</h1>
<p><strong>Interaction.js</strong> is an extension to <a href="http://github.com/raid-ox/chain.js/wikis/">chain.js</a>, providing essential interaction services, such as draggable, droppable, sortable and selectable. While similar to the Official jQuery UI Core Interaction, it is specially designed for use with chain.js. Have a look at our <a href="http://wiki.github.com/raid-ox/interaction.js/demos">Demos</a> .</p>
<h3>Download</h3>
<div style="background:#DCE9F4;padding:0.5em">
<p>Click <a href="http://github.com/raid-ox/chain.js/zipball/stable">here</a> to download the latest release.</p>
</div>
<p><strong>Interaction.js</strong> <em>is</em> an <em><a href="http://en.wikipedia.org/wiki/Open_source">open source</a></em> library, licensed under the very liberal <em><span class="caps">MIT</span> License</em>. You can use it as you want.</p>
<h3><span class="caps">API</span> Documentation and Reference</h3>
<div style="background:#DCE9F4;padding:0.5em">
<p>Currently there is no documentation available.</p>
</div>
<script type="text/javascript" src="http://code.riiv.net/assets/scripts/highlight.js"></script>
      </div>
    </div>
    
    <!-- sidebar -->
    
    <div class="sidebar">
      <h3> 
        Pages 
        <a href="http://wiki.github.com/raid-ox/interaction.js/wikis.atom"><img alt="feed" src="http://assets1.github.com/images/icons/feed.png?7ad939d173d4570ea03788d947f22a2da46eac7b" title="Feed of recent interaction.js wiki edits" /></a>
      </h3>
      
<!--# block name="pages" -->
      <ul>
  
    <li><b><a href="http://wiki.github.com/raid-ox/interaction.js/demo-all-services-together">Demo: All Services Together</a></b></li>
  
    <li><b><a href="http://wiki.github.com/raid-ox/interaction.js/demo-draggable-with-droppable">Demo: Draggable with Droppable</a></b></li>
  
    <li><b><a href="http://wiki.github.com/raid-ox/interaction.js/demo-draggable-sortable-and-droppable">Demo: Draggable, Sortable and Droppable</a></b></li>
  
    <li><b><a href="http://wiki.github.com/raid-ox/interaction.js/demo-multiple-selectable-with-linking">Demo: Multiple Selectable with Linking</a></b></li>
  
    <li><b><a href="http://wiki.github.com/raid-ox/interaction.js/demo-multiple-sortable">Demo: Multiple Sortable</a></b></li>
  
    <li><b><a href="http://wiki.github.com/raid-ox/interaction.js/demo-selectable-with-linking">Demo: Selectable with Linking</a></b></li>
  
    <li><b><a href="http://wiki.github.com/raid-ox/interaction.js/demo-simple-draggable">Demo: Simple Draggable</a></b></li>
  
    <li><b><a href="http://wiki.github.com/raid-ox/interaction.js/demo-simple-selectable">Demo: Simple Selectable</a></b></li>
  
    <li><b><a href="http://wiki.github.com/raid-ox/interaction.js/demo-simple-sortable">Demo: Simple Sortable</a></b></li>
  
    <li><b><a href="http://wiki.github.com/raid-ox/interaction.js/demos">Demos</a></b></li>
  
    <li><b><a href="http://wiki.github.com/raid-ox/interaction.js">Home</a></b></li>
  
</ul>

<!--# endblock -->

<!--# include virtual="/raid-ox/interaction.js/_all_pages" stub="pages" -->
      
    </div>

  </div>
  
  <!-- admin -->
    
  
    <div class="admin">
      <div style="float:left;">
        <small>Last edited by <b>raid-ox</b>, <abbr class="relatize" title="2008-08-18 16:44:52">Mon Aug 18 16:44:52 -0700 2008</abbr></small>

        <div class="actions">
          <a href="http://wiki.github.com/raid-ox/interaction.js">Home</a> 
          | <a href="http://github.com/raid-ox/interaction.js/wikis/home/edit">Edit</a> | 
          <a href="http://github.com/raid-ox/interaction.js/wikis/new">New</a>
        </div>
      </div>

      <div style="float:right;">
        <small>Versions:</small>
        <select id="versions_select" name="versions_select"><option value="http://github.com/raid-ox/interaction.js/wikis/home">Current</option><option value="http://wiki.github.com/raid-ox/interaction.js/home/5">Version 5 by raid-ox</option><option value="http://wiki.github.com/raid-ox/interaction.js/home/4">Version 4 by raid-ox</option><option value="http://wiki.github.com/raid-ox/interaction.js/home/3">Version 3 by raid-ox</option><option value="http://wiki.github.com/raid-ox/interaction.js/home/2">Version 2 by raid-ox</option><option value="http://wiki.github.com/raid-ox/interaction.js/home/1">Version 1 by raid-ox</option></select>
      </div>
    </div>
      
</div>



    </div>
  
      

      <div class="push"></div>
    </div>

    <div id="footer">
      <div class="site">
        <div class="info">
          <div class="links">
            <a href="http://github.com/blog"><b>Blog</b></a> |
            <a href="http://support.github.com/">Support</a> |
            <a href="http://github.com/training">Training</a> |
            <a href="http://github.com/contact">Contact</a> |
            <a href="http://develop.github.com">API</a> |
            <a href="http://twitter.com/github">Status</a> |
            <a href="http://twitter.com/github">Twitter</a> |
            <a href="http://help.github.com">Help</a> |
            <a href="http://github.com/security">Security</a>
          </div>
          <div class="company">
            <span id="_rrt" title="0.07798s from fe4.rs.github.com">GitHub</span>&trade;
            is <a href="http://logicalawesome.com/">Logical Awesome</a> &copy;2009 | <a href="/site/terms">Terms of Service</a> | <a href="/site/privacy">Privacy Policy</a>
          </div>
        </div>
        <div class="sponsor">
          <div>
            Powered by the <a href="http://www.rackspace.com ">Dedicated
            Servers</a> and<br/> <a href="http://www.rackspacecloud.com">Cloud
            Computing</a> of Rackspace Hosting<span>&reg;</span>
          </div>
          <a href="http://www.rackspace.com">
            <img alt="Dedicated Server" src="http://assets3.github.com/images/modules/footer/rackspace_logo.png?7ad939d173d4570ea03788d947f22a2da46eac7b" />
          </a>
        </div>
      </div>
    </div>

    <div id="coming_soon" style="display:none;">
      This feature is coming soon.  Sit tight!
    </div>

    
        <script type="text/javascript">
    var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
    document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
    </script>
    <script type="text/javascript">
    var pageTracker = _gat._getTracker("UA-3769691-2");
    pageTracker._initData();
    pageTracker._trackPageview();
    </script>

    
  </body>
</html>

