working on the PTO section

app/assets/javascripts/application.js

@@ -17,15 +17,17 @@
 //= require bootstrap.js
 //= require jquery.scrollUp.js
 //= require wysiwyg/bootstrap-wysihtml5.js
+//= require bootstrap-colorpicker.js
 //= require date-picker/date.js
 //= require date-picker/daterangepicker.js
+//= require bootstrap-timepicker.js
+//= require jquery.bootstrap.wizard.js
 //= require jquery.sparkline.js
 //= require tiny-scrollbar.js
 //= require jquery.validate.js
 //= require jquery.snippet.js
 //= require jquery.easy-pie-chart.js
 
-
 function rubyCodeFormat() {
 
 $("pre.ruby").snippet("ruby",{style:"rand01",transparent:true,showNum:true});
@@ -37,150 +39,6 @@ $("pre.ruby").snippet("ruby",{style:"rand01",transparent:true,showNum:true});
 
 };
 
-function pieChartHome() {
-    $(function () {
-      //create instance
-      $('.chart1').easyPieChart({
-        animate: 2000,
-        barColor: '#e26666',
-        trackColor: '#dddddd',
-        scaleColor: '#e26666',
-        size: 160,
-        lineWidth: 7,
-      });
-      //update instance after 5 sec
-      setTimeout(function () {
-        $('.chart1').data('easyPieChart').update(50);
-      }, 5000);
-      setTimeout(function () {
-        $('.chart1').data('easyPieChart').update(70);
-      }, 10000);
-      setTimeout(function () {
-        $('.chart1').data('easyPieChart').update(30);
-      }, 15000);
-      setTimeout(function () {
-        $('.chart1').data('easyPieChart').update(90);
-      }, 19000);
-      setTimeout(function () {
-        $('.chart1').data('easyPieChart').update(40);
-      }, 32000);
-    });
-
-    $(function () {
-      //create instance
-      $('.chart2').easyPieChart({
-        animate: 2000,
-        barColor: '#b5799e',
-        trackColor: '#dddddd',
-        scaleColor: '#b5799e',
-        size: 160,
-        lineWidth: 7,
-      });
-      //update instance after 5 sec
-      setTimeout(function () {
-        $('.chart2').data('easyPieChart').update(90);
-      }, 10000);
-      setTimeout(function () {
-        $('.chart2').data('easyPieChart').update(40);
-      }, 18000);
-      setTimeout(function () {
-        $('.chart2').data('easyPieChart').update(70);
-      }, 28000);
-      setTimeout(function () {
-        $('.chart2').data('easyPieChart').update(50);
-      }, 32000);
-      setTimeout(function () {
-        $('.chart2').data('easyPieChart').update(80);
-      }, 40000);
-    });
-
-    $(function () {
-      //create instance
-      $('.chart3').easyPieChart({
-        animate: 2000,
-        barColor: '#579da9',
-        trackColor: '#dddddd',
-        scaleColor: '#579da9',
-        size: 160,
-        lineWidth: 7,
-      });
-      //update instance after 5 sec
-      setTimeout(function () {
-        $('.chart3').data('easyPieChart').update(20);
-      }, 9000);
-      setTimeout(function () {
-        $('.chart3').data('easyPieChart').update(59);
-      }, 20000);
-      setTimeout(function () {
-        $('.chart3').data('easyPieChart').update(38);
-      }, 35000);
-      setTimeout(function () {
-        $('.chart3').data('easyPieChart').update(79);
-      }, 49000);
-      setTimeout(function () {
-        $('.chart3').data('easyPieChart').update(96);
-      }, 52000);
-    });
-
-    $(function () {
-      //create instance
-      $('.chart4').easyPieChart({
-        animate: 2000,
-        barColor: '#dba26b',
-        trackColor: '#dddddd',
-        scaleColor: '#dba26b',
-        size: 160,
-        lineWidth: 7,
-      });
-      //update instance after 5 sec
-      setTimeout(function () {
-        $('.chart4').data('easyPieChart').update(40);
-      }, 6000);
-      setTimeout(function () {
-        $('.chart4').data('easyPieChart').update(67);
-      }, 14000);
-      setTimeout(function () {
-        $('.chart4').data('easyPieChart').update(43);
-      }, 23000);
-      setTimeout(function () {
-        $('.chart4').data('easyPieChart').update(80);
-      }, 36000);
-      setTimeout(function () {
-        $('.chart4').data('easyPieChart').update(66);
-      }, 41000);
-    });
-
-
-    $(function () {
-      //create instance
-      $('.chart5').easyPieChart({
-        animate: 3000,
-        barColor: '#1e825e',
-        trackColor: '#dddddd',
-        scaleColor: '#1e825e',
-        size: 160,
-        lineWidth: 7,
-      });
-      //update instance after 5 sec
-      setTimeout(function () {
-        $('.chart5').data('easyPieChart').update(30);
-      }, 9000);
-      setTimeout(function () {
-        $('.chart5').data('easyPieChart').update(87);
-      }, 19000);
-      setTimeout(function () {
-        $('.chart5').data('easyPieChart').update(28);
-      }, 27000);
-      setTimeout(function () {
-        $('.chart5').data('easyPieChart').update(69);
-      }, 39000);
-      setTimeout(function () {
-        $('.chart5').data('easyPieChart').update(99);
-      }, 47000);
-    });
-
-  }
-
 $(document).ready(function(){
 	rubyCodeFormat()
 });

app/assets/stylesheets/main.css

@@ -811,9 +811,7 @@ table {
   max-width: 100%;
   background-color: transparent;
   border-collapse: collapse;
-  border-spacing: 0; 
-  table-layout: fixed;
-}
+  border-spacing: 0; }
 
 .table {
   width: 100%;
@@ -1969,31 +1967,31 @@ button.btn.btn-mini, input[type="submit"].btn.btn-mini {
   *margin-right: .3em;
   line-height: 14px;
   vertical-align: text-top;
-  background-image: url("../assets/glyphicons-halflings.png");
+  background-image: url("../img/glyphicons-halflings.png");
   background-position: 14px 14px;
   background-repeat: no-repeat;
   margin-top: 1px; }
 
 /* White icons with optional class, or on hover/active states of certain elements */
 .icon-white {
-  background-image: url("../assets/glyphicons-halflings-white.png"); }
+  background-image: url("../img/glyphicons-halflings-white.png"); }
 
 .nav-pills > .active > a > [class^="icon-"], .nav-pills > .active > a > [class*=" icon-"] {
-  background-image: url("../assets/glyphicons-halflings-white.png"); }
+  background-image: url("../img/glyphicons-halflings-white.png"); }
 
 .nav-list > .active > a > [class^="icon-"], .nav-list > .active > a > [class*=" icon-"] {
-  background-image: url("../assets/glyphicons-halflings-white.png"); }
+  background-image: url("../img/glyphicons-halflings-white.png"); }
 
 .navbar-inverse .nav > .active > a > [class^="icon-"], .navbar-inverse .nav > .active > a > [class*=" icon-"] {
-  background-image: url("../assets/glyphicons-halflings-white.png"); }
+  background-image: url("../img/glyphicons-halflings-white.png"); }
 
 .dropdown-menu > li > a:hover > [class^="icon-"], .dropdown-menu > li > a:hover > [class*=" icon-"] {
-  background-image: url("../assets/glyphicons-halflings-white.png"); }
+  background-image: url("../img/glyphicons-halflings-white.png"); }
 .dropdown-menu > .active > a > [class^="icon-"], .dropdown-menu > .active > a > [class*=" icon-"] {
-  background-image: url("../assets/glyphicons-halflings-white.png"); }
+  background-image: url("../img/glyphicons-halflings-white.png"); }
 
 .dropdown-submenu:hover > a > [class^="icon-"], .dropdown-submenu:hover > a > [class*=" icon-"] {
-  background-image: url("../assets/glyphicons-halflings-white.png"); }
+  background-image: url("../img/glyphicons-halflings-white.png"); }
 
 .icon-glass {
   background-position: 0 0; }
@@ -4719,7 +4717,7 @@ button.close {
   display: none; }
 
 .modal-loading .modal-image {
-  background: url(../assets/loading-orange.gif) center no-repeat; }
+  background: url(../img/loading-orange.gif) center no-repeat; }
 
 .modal-gallery.fade .modal-image {
   -webkit-transition: width 0.15s ease, height 0.15s ease;
@@ -4793,7 +4791,7 @@ button.close {
       height: 40px;
       margin: 0 2px;
       outline: none;
-      background: transparent url(../assets/social_icons.png) no-repeat top left;
+      background: transparent url(../img/social_icons.png) no-repeat top left;
       text-indent: -9000px;
       position: relative; }
     .fancy-tooltip-wrapper li .tooltip-facebook, .fancy-tooltip-wrapper1 li .tooltip-facebook {
@@ -5048,7 +5046,7 @@ button.close {
 .colorpicker-saturation {
   width: 100px;
   height: 100px;
-  background-image: url(../assets/saturation.png);
+  background-image: url(../img/saturation.png);
   cursor: crosshair;
   float: left; }
   .colorpicker-saturation i {
@@ -5092,10 +5090,10 @@ button.close {
   margin-top: -1px; }
 
 .colorpicker-hue {
-  background-image: url(../assets/hue.png); }
+  background-image: url(../img/hue.png); }
 
 .colorpicker-alpha {
-  background-image: url(../assets/alpha.png);
+  background-image: url(../img/alpha.png);
   display: none; }
 
 .colorpicker {
@@ -5121,7 +5119,7 @@ button.close {
   height: 10px;
   margin-top: 5px;
   clear: both;
-  background-image: url(../assets/alpha.png);
+  background-image: url(../img/alpha.png);
   background-position: 0 100%; }
   .colorpicker-color div {
     height: 10px; }
@@ -5604,7 +5602,7 @@ header {
 #mainnav {
   display: block;
   float: left;
-  position: absolute;
+  position: relative;
   top: 50px; }
   #mainnav > ul {
     width: 110px;
@@ -6119,13 +6117,13 @@ header {
       background: #f9f9f9; }
   #dt_example .dataTable .sorting {
     cursor: pointer;
-    background: url(../assets/sorting.png) no-repeat center right; }
+    background: url(../img/sorting.png) no-repeat center right; }
   #dt_example .dataTable .sorting_asc {
     cursor: pointer;
-    background: url(../assets/sorting_asc.png) no-repeat center right; }
+    background: url(../img/sorting_asc.png) no-repeat center right; }
   #dt_example .dataTable .sorting_desc {
     cursor: pointer;
-    background: url(../assets/sorting_desc.png) no-repeat center right; }
+    background: url(../img/sorting_desc.png) no-repeat center right; }
 
 /* Progress UI  */
 .progress-statistics li {

app/views/dashboard/home.html.erb

@@ -15,9 +15,153 @@ function makeActive(){
 	$('li[id="home"]').addClass('active');
 };
 
+function pieChartHome() {
+    $(function () {
+      //create instance
+      $('.chart1').easyPieChart({
+        animate: 2000,
+        barColor: '#e26666',
+        trackColor: '#dddddd',
+        scaleColor: '#e26666',
+        size: 160,
+        lineWidth: 7,
+      });
+      //update instance after 5 sec
+      setTimeout(function () {
+        $('.chart1').data('easyPieChart').update(50);
+      }, 5000);
+      setTimeout(function () {
+        $('.chart1').data('easyPieChart').update(70);
+      }, 10000);
+      setTimeout(function () {
+        $('.chart1').data('easyPieChart').update(30);
+      }, 15000);
+      setTimeout(function () {
+        $('.chart1').data('easyPieChart').update(90);
+      }, 19000);
+      setTimeout(function () {
+        $('.chart1').data('easyPieChart').update(40);
+      }, 32000);
+    });
+
+    $(function () {
+      //create instance
+      $('.chart2').easyPieChart({
+        animate: 2000,
+        barColor: '#b5799e',
+        trackColor: '#dddddd',
+        scaleColor: '#b5799e',
+        size: 160,
+        lineWidth: 7,
+      });
+      //update instance after 5 sec
+      setTimeout(function () {
+        $('.chart2').data('easyPieChart').update(90);
+      }, 10000);
+      setTimeout(function () {
+        $('.chart2').data('easyPieChart').update(40);
+      }, 18000);
+      setTimeout(function () {
+        $('.chart2').data('easyPieChart').update(70);
+      }, 28000);
+      setTimeout(function () {
+        $('.chart2').data('easyPieChart').update(50);
+      }, 32000);
+      setTimeout(function () {
+        $('.chart2').data('easyPieChart').update(80);
+      }, 40000);
+    });
+
+    $(function () {
+      //create instance
+      $('.chart3').easyPieChart({
+        animate: 2000,
+        barColor: '#579da9',
+        trackColor: '#dddddd',
+        scaleColor: '#579da9',
+        size: 160,
+        lineWidth: 7,
+      });
+      //update instance after 5 sec
+      setTimeout(function () {
+        $('.chart3').data('easyPieChart').update(20);
+      }, 9000);
+      setTimeout(function () {
+        $('.chart3').data('easyPieChart').update(59);
+      }, 20000);
+      setTimeout(function () {
+        $('.chart3').data('easyPieChart').update(38);
+      }, 35000);
+      setTimeout(function () {
+        $('.chart3').data('easyPieChart').update(79);
+      }, 49000);
+      setTimeout(function () {
+        $('.chart3').data('easyPieChart').update(96);
+      }, 52000);
+    });
+
+    $(function () {
+      //create instance
+      $('.chart4').easyPieChart({
+        animate: 2000,
+        barColor: '#dba26b',
+        trackColor: '#dddddd',
+        scaleColor: '#dba26b',
+        size: 160,
+        lineWidth: 7,
+      });
+      //update instance after 5 sec
+      setTimeout(function () {
+        $('.chart4').data('easyPieChart').update(40);
+      }, 6000);
+      setTimeout(function () {
+        $('.chart4').data('easyPieChart').update(67);
+      }, 14000);
+      setTimeout(function () {
+        $('.chart4').data('easyPieChart').update(43);
+      }, 23000);
+      setTimeout(function () {
+        $('.chart4').data('easyPieChart').update(80);
+      }, 36000);
+      setTimeout(function () {
+        $('.chart4').data('easyPieChart').update(66);
+      }, 41000);
+    });
+
+
+    $(function () {
+      //create instance
+      $('.chart5').easyPieChart({
+        animate: 3000,
+        barColor: '#1e825e',
+        trackColor: '#dddddd',
+        scaleColor: '#1e825e',
+        size: 160,
+        lineWidth: 7,
+      });
+      //update instance after 5 sec
+      setTimeout(function () {
+        $('.chart5').data('easyPieChart').update(30);
+      }, 9000);
+      setTimeout(function () {
+        $('.chart5').data('easyPieChart').update(87);
+      }, 19000);
+      setTimeout(function () {
+        $('.chart5').data('easyPieChart').update(28);
+      }, 27000);
+      setTimeout(function () {
+        $('.chart5').data('easyPieChart').update(69);
+      }, 39000);
+      setTimeout(function () {
+        $('.chart5').data('easyPieChart').update(99);
+      }, 47000);
+    });
+
+  }
+
 $(document).ready(
 	makeActive,
-	 pieChartHome()
+	pieChartHome()
 );
 
 </script>

app/views/layouts/application.html.erb

@@ -5,7 +5,7 @@
   <%= stylesheet_link_tag    "application", :media => "all" %>
   <%= javascript_include_tag "application" %>
   <%= csrf_meta_tags %> <!-- <~ What is this for? I hear it helps w/ JS and Sea-surfing.....whatevz -->
-
+  <!-- bootstrap css -->
  <script type="text/javascript" src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
  <!--[if lte IE 7]>
  <script src="assets/fonts/lte-ie7.js">
@@ -31,5 +31,6 @@
 	</div>
 </div>	
 	<%= render "layouts/shared/footer" %>
+	
 </body>
 </html>

app/views/paid_time_off/index.html.erb

@@ -1,8 +1,41 @@
 <div class="dashboard-wrapper">
 	<div class="main-container">
+		<!-- Begin DP-->
+		<div class="row-fluid">
+			<div class="span6">
+              <div class="widget">
+                <div class="widget-header">
+                  <div class="title">
+                    <span class="fs1" aria-hidden="true" data-icon="&#xe052;"></span> Schedule PTO
+                  </div>
+                </div>
+                <div class="widget-body">
+                  	 <form class="form-horizontal" action="#">
+	                   
+	                    <div class="control-group">
+	                      <label class="control-label" for="date_range1">
+	                        Date Range Input
+	                      </label>
+	                      <div class="controls">
+	                        <div class="input-append">
+	                          <input type="text" name="date_range1" id="date_range1" class="span8 date_picker" placeholder="Select Date"/>
+	                          <span class="add-on">
+	                            <i class="icon-calendar"></i>
+	                          </span>
+	                        </div>
+	                      </div>
+	                    </div>
+
+	                    
+	                  </form>
+                </div>
+              </div>
+            </div>
+		</div>	
+		<!-- End DP-->
 		<div class="row-fluid">
 			<!-- Begin Span-->
-		   	<div class="span12">
+		   	<div class="span6">
               <div class="widget no-margin">
                 <div class="widget-header">
                   <div class="title">
@@ -60,8 +93,7 @@
 			<!-- End Span-->
 		</div><br/>
 		<div class="row-fluid">
-		
-				<div class="span12">
+				<div class="span6">
 	              <div class="widget no-margin">
 	                <div class="widget-header">
 	                  <div class="title">
@@ -113,8 +145,18 @@
 	                      </div>
 	                    </li>
 	                  </ul>
-	               
 	              </div>
 		</div>	
 	</div>
-</div>
+</div>
+
+<script type="text/javascript">
+
+ //Dropdown
+  $('.dropdown-toggle').dropdown();
+
+//Date picker
+$('.date_picker').daterangepicker({
+  opens: 'right'
+});
+</script>

app/views/sessions/new.html.erb

@@ -1,28 +1,13 @@
 <div class="row-fluid">
+	<h2 align="center">MetaCorp</h2>
+	<h3 align="center">A GoatGroup Company</h3>
   <div class="span12">
         <div class="row-fluid">
           <div class="span4 offset4">
             <div class="signup">
-<!--              <form action="#" class="signup-wrapper" method="post">
-                <div class="header">
-                  <h2>Login</h2>
-                  <p>Fill out the form below to login to your control panel.</p>
-                </div>
-                <div class="content">
-                  <input class="input input-block-level" placeholder="Email" required="required" type="email" value="">
-                  <input class="input input-block-level" placeholder="Password" required="required" type="password">
-                </div>
-                <div class="actions">
-                  <input class="btn btn-info btn-large pull-right" type="submit" value="Login">
-                  <span class="checkbox-wrapper">
-                    <a href="#" class="pull-left">Forgot Password</a>
-                  </span>
-                  <div class="clearfix"></div>
-                </div>
-              </form>-->
 				<%= form_tag "sessions", :class=> "signup-wrapper" do %>
-
                 		<div class="header">
+	 
                 		  <h2>Login</h2>
                 		  <p>Fill out the form below to login to your control panel.</p>
                 		</div>