/*! jGrid Plugin - v0.1.0 - 2012-09-03
* https://github.com/dpiatek/jgrid
* Copyright (c) 2012 Dominik Piatek; Licensed MIT */
(function(a){var b={init:function(b){this.self=this,window.updateID=null,this.keylistener(),this.addmenu(),this.updateGrid(),a("#jgrid-setup, #jgrid-overlay, #jgrid-col-width").hide()},addmenu:function(){a("head").append("<style>#jgrid-setup {position:fixed; top:0; right:0; width:85px; height:370px; background-color:#DDD; padding:0 10px; border-radius:0 0 0 5px; border-left:1px solid #999; border-bottom:1px solid #999; z-index:999; } #show-hide {display:block; width:80px; height:30px; text-transform:uppercase; border:0; border-radius:3px; margin:10px 0 10px; padding:0; color:#fff; cursor:pointer; text-align:center; line-height:30px; background-color:#929292; } #jgrid-form                     { font-family: sans-serif; color:#222; font-size:14px; } #jgrid-form label                  { display:block; padding:0; margin:10px 0; cursor:pointer; } #jgrid-form input                  { padding:0; margin:0; border:3px solid #FFF; border-radius:3px; } #jgrid-form input[type=number]   { width:60px; height:22px;} #jgrid-form input[type=checkbox] { margin-right:3px; } #jgrid-overlay {position:fixed; top:0; left:0; width:100%; height:100%; background-color:#000; opacity:0.2; z-index:997; } #jgrid-wrapper       { width:960px; margin:0 auto; background-color:rgb(255, 192, 203); height:100%; z-index:998; } #jgrid-wrapper > span {width:70px; margin-right:10px; height:100%; background-color:#000; opacity:0.3; display:block; float:left; } #jgrid-wrapper > span:last-child     { margin-right:5px; } #jgrid-wrapper > span:first-child     { margin-left:5px; } #jgrid-col-width {position:fixed; top:5px; left:5px; color: #EEE; background-color: #555; border-radius: 5px; height: 63px; width: 105px; display: block; font-size: 16px; padding: 5px; }</style>"),a("body").append('<div id="jgrid-setup"><form method="get" accept-charset="utf-8" id="jgrid-form"><label for="wrapper">Wrapper</label><input type="number" name="wrapper" placeholder="960" required pattern="^[0-9]+$" title="Only integer values"><span>px</span><label for="columns">Columns</label><input type="number" name="columns" placeholder="12" required pattern="^[0-9]+$" title="Only integer values"><label for="gutter">Gutter</label><input type="number" name="gutter" placeholder="5" required pattern="^[0-9]+$" title="Only integer values"><span>px</span><label for="marLeft">Margin left</label><input type="number" name="marLeft" required pattern="^[0-9]+$" title="Only integer values"><label for="marRight">Margin right</label><input type="number" name="marRight" required pattern="^[0-9]+$" title="Only integer values"><span id="show-hide">Hide</span></form></div>')},keylistener:function(){var b=!1,c=!1,d=this.self;a("body").on("keyup",function(a){a.which===16&&(c=!1),a.which===17&&(b=!1)}),a("body").on("keydown",d,function(e){e.which===17&&(b=!0),e.which===16&&(c=!0),e.which===76&&b&&c&&(window.clearTimeout(d.updateID),a("#jgrid-setup, #jgrid-overlay, #jgrid-col-width").toggle(),a("#jgrid-setup").css("display")!=="none"&&d.updateGrid())})},setupGrid:function(b,c){var d="",e=null;a("#jgrid-overlay").length||(a("body").append('<div id="jgrid-overlay"><div id="jgrid-wrapper"></div></div>'),a("#jgrid-wrapper").width(c.wrapper)),e=a("#jgrid-wrapper"),e.empty();for(var f=0;f<c.columns;f++)d+="<span></span>";e.width(c.wrapper),e.append(d),e.find("span").width(b).css("margin-right",c.gutter),e.find("span:first-child").css("margin-left",c.marLeft),e.find("span:last-child").css("margin-right",c.marRight)},calculateGrid:function(a){var b=(a.wrapper-a.marLeft-a.marRight-(a.columns-1)*a.gutter)/a.columns,c=a.columns*b+(a.columns-1)*a.gutter+a.marLeft+a.marRight,d=Math.round(b/a.wrapper*1e4)/1e3;this.setupGrid(b,a),this.updateColWidth(b,d)},getDimensions:function(){var b={};b.wrapper=parseInt(a("input[name=wrapper]").val(),10)||0,b.columns=parseInt(a("input[name=columns]").val(),10)||1,b.gutter=parseInt(a("input[name=gutter]").val(),10)||0,b.marLeft=parseInt(a("input[name=marLeft]").val(),10)||0,b.marRight=parseInt(a("input[name=marRight]").val(),10)||0,this.calculateGrid(b)},updateColWidth:function(b,c){var d=a("#jgrid-col-width");d.length||(a("body").append('<span id="jgrid-col-width"></span>'),d=a("#jgrid-col-width")),typeof b!="number"||b%1!==0?(b=Math.round(b*100)/100,d.css("color","#F55")):(b=b+"px",d.css("color","#DDD")),c=isNaN(c)?"0%":c+"%",d.text("Column width: "+b),d.append("<br>"+c)},updateGrid:function(){var a=this.self;this.getDimensions(),this.updateID=window.setTimeout(function(){a.updateGrid()},1e3,a)}};b.init()})(jQuery);