Init version of DnD.

app/assets/javascripts/app/controllers/dashboard.js.coffee

@@ -80,6 +80,15 @@ class Index extends App.Controller
           params.el = @el.find( '#' + target )
           new plugin.controller( params )
 
+    dndOptions =
+      placeholder:          'can-move-plcaeholder'
+      tolerance:            'pointer'
+      distance:             15
+      opacity:              0.6
+      forcePlaceholderSize: true
+
+    @el.find( '#sortable' ).sortable( dndOptions )
+    @el.find( '#sortable-sidebar' ).sortable( dndOptions )
 
 App.Config.set( '', Index, 'Routes' )
 App.Config.set( '/', Index, 'Routes' )

app/assets/javascripts/app/views/dashboard.jst.eco

@@ -13,9 +13,9 @@
       </div>
     </div>
 -->
-    <div class="main-overviews"></div>
+    <div class="main-overviews" id="sortable"></div>
   </div>
   <div class="span3">
-    <div class="side-overviews"></div>
+    <div class="side-overviews" id="sortable-sidebar"></div>
   </div>
 </div>

app/assets/javascripts/app/views/dashboard/activity_stream.jst.eco

@@ -1,5 +1,5 @@
 <div class="row">
-  <div class="span3">
+  <div class="span3 can-move">
     <h2><%- @T( @head ) %></h2>
     <dl>
     <% for item in @items: %>

app/assets/javascripts/app/views/dashboard/recent_viewed.jst.eco

@@ -1,5 +1,5 @@
 <div class="row">
-  <div class="span3">
+  <div class="span3 can-move">
     <h2><%- @T( @head ) %></h2>
     <ul>
     <% for item in @items: %>

app/assets/javascripts/app/views/dashboard/rss.jst.eco

@@ -1,5 +1,5 @@
 <div class="row">
-  <div class="span3">
+  <div class="span3 can-move">
     <h2><%- @T( @head ) %></h2>
     <ul>
     <% for item in @items: %>

app/assets/javascripts/app/views/dashboard/ticket.jst.eco

@@ -1,7 +1,7 @@
 <div class="row">
   <div class="span9">
     <div class="row">
-      <div class="span6">
+      <div class="span6 can-move">
       <h2><%- @T( @overview.meta.name ) %> <small><a href="#" data-type="settings" class="icon-edit"></a></small></h2>
       </div>
       <div class="span3">

app/assets/stylesheets/zzz.css

@@ -169,7 +169,6 @@ form {
 }
 
 footer {
-//  margin-top: 17px;
   padding-top: 17px;
   border-top: 1px solid #EEE;
 }
@@ -186,6 +185,18 @@ footer {
   float: right;
 }
 
+.can-move {
+  cursor: move;
+}
+
+.can-move-plcaeholder {
+    border: 1px dashed #DDD;
+    background: #EEE;
+    margin-top: 5px;
+    margin-bottom: 5px;
+}
+
+
 .ticket-answer .avatar {
   margin-left: 10px;
 }