compresses images

Author: kanakiyajay

README.md

@@ -7,10 +7,10 @@ A grid builder for Bootstrap 3.
 Licensed under the Apache License v2.0
 http://www.apache.org/licenses/LICENSE-2.0
 
-<!-- For 2.3.3 Refer http://jaykanakiya.com/bootstrap-grid-builder-2-3-2/-->
-
 TO BE DONE :-
+
 <ul>
   <li>Html generation should be done via $compile and should be instant</li>
   <li>Implement push-pull classes of bootstrap 3</li>
+  <li>Implement Grid Builder for 2.3.2</li>
 </ul>

css/devices/imac.png

@@ -111,7 +111,12 @@ <h4 class="modal-title">Bootstrap Grid Builder</h4>
     </div><!-- /.modal-dialog -->
   </div><!-- /.modal -->
 
-
+  <script type="text/javascript" src="js/jquery-draggable.min.js"></script>
+  <script type="text/javascript">
+    $(document).ready(function  () {
+      $('#toolbar').drags();
+    })
+  </script>
   <script async defer type="text/javascript" src="js/prism.js"></script>
 </body>
 </html>

css/devices/ipad_land_black.png

@@ -333,4 +333,5 @@ app.controller('gridCtrl',function  ($scope) {
   http://stackoverflow.com/questions/12430820/accessing-clicked-element-in-angularjs
   http://stackoverflow.com/questions/15458609/angular-js-how-to-execute-function-on-page-load
   http://stackoverflow.com/questions/17982561/using-angular-templates-to-generate-exportable-html
+  http://css-tricks.com/snippets/jquery/draggable-without-jquery-ui/
 */

css/devices/ipad_port_black.png

@@ -0,0 +1,41 @@
+(function($) {
+    $.fn.drags = function(opt) {
+
+        opt = $.extend({handle:"",cursor:"move"}, opt);
+
+        if(opt.handle === "") {
+            var $el = this;
+        } else {
+            var $el = this.find(opt.handle);
+        }
+
+        return $el.css('cursor', opt.cursor).on("mousedown", function(e) {
+            if(opt.handle === "") {
+                var $drag = $(this).addClass('draggable');
+            } else {
+                var $drag = $(this).addClass('active-handle').parent().addClass('draggable');
+            }
+            var z_idx = $drag.css('z-index'),
+                drg_h = $drag.outerHeight(),
+                drg_w = $drag.outerWidth(),
+                pos_y = $drag.offset().top + drg_h - e.pageY,
+                pos_x = $drag.offset().left + drg_w - e.pageX;
+            $drag.css('z-index', 1000).parents().on("mousemove", function(e) {
+                $('.draggable').offset({
+                    top:e.pageY + pos_y - drg_h,
+                    left:e.pageX + pos_x - drg_w
+                }).on("mouseup", function() {
+                    $(this).removeClass('draggable').css('z-index', z_idx);
+                });
+            });
+            e.preventDefault(); // disable selection
+        }).on("mouseup", function() {
+            if(opt.handle === "") {
+                $(this).removeClass('draggable');
+            } else {
+                $(this).removeClass('active-handle').parent().removeClass('draggable');
+            }
+        });
+
+    }
+})(jQuery);