Optimizations and making the code more readable

Changed all element declarations to use document.createElement, as it turns out to be far faster. Also moved the Header of the table into a separate container to get ready for allowing scrollable schedulers.
coolthejackal · Jun 8, 2013 · b1b9d50 · b1b9d50
1 parent d0cb460
commit b1b9d50
Show file tree

Hide file tree

Showing 5 changed files with 185 additions and 125 deletions.
diff --git a/css/timelineScheduler.css b/css/timelineScheduler.css
@@ -48,6 +48,9 @@
 .time-sch-time-button-today {
   margin-right: .5em; }
 
+.time-sch-content-wrap {
+  position: relative; }
+
 .time-sch-wrapper th, .time-sch-wrapper td {
   border-width: 1px;
   border-style: solid;
@@ -56,25 +59,25 @@
   border-left-color: #C1C1C1;
   border-right-color: #C1C1C1; }
 .time-sch-wrapper .time-sch-section-header {
-  border: none; }
-
-.time-sch-section-header {
-  width: 200px;
-  text-align: left; }
-
-.time-sch-date-header {
+  border-top-color: transparent;
+  border-left-color: transparent;
+  border-bottom-color: transparent; }
+.time-sch-wrapper .time-sch-date-header {
   text-align: left;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis; }
+.time-sch-wrapper .time-sch-section {
+  width: 200px; }
 
-.time-sch-section {
+.time-sch-section-content {
   vertical-align: middle;
   text-align: center;
   overflow: hidden; }
 
 .time-sch-section-wrapper {
   position: absolute;
+  top: 0;
   right: 0;
   bottom: 0;
   z-index: 1; }

diff --git a/css/timelineScheduler.scss b/css/timelineScheduler.scss
@@ -56,6 +56,10 @@
 	margin-right: .5em;
 	}
 
+.time-sch-content-wrap {
+	position: relative;
+	}
+
 //== Table defaults
 .time-sch-wrapper {
 	th, td {
@@ -69,24 +73,25 @@
 		}
 
 	.time-sch-section-header {
-		border: none;
+		border-top-color: transparent;
+		border-left-color: transparent;
+		border-bottom-color: transparent;
 		}
-	}
 
-//== Header row
-.time-sch-section-header {
-	width: 200px;
-	text-align: left;
-	}
-.time-sch-date-header {
-	text-align: left;
-	white-space: nowrap;
-	overflow: hidden;
-	text-overflow: ellipsis;
-	}
+	.time-sch-date-header {
+		text-align: left;
+		white-space: nowrap;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		}
 
+	.time-sch-section {
+		width: 200px;
+		}
+	}
+
 //== Section rows
-.time-sch-section {
+.time-sch-section-content {
 	vertical-align: middle;
 	text-align: center;
 	overflow: hidden;
@@ -95,6 +100,7 @@
 //== Sections
 .time-sch-section-wrapper {
 	position: absolute;
+	top: 0;
 	right: 0;
 	bottom: 0;
 	z-index: 1;