Added sidebar clases on-hover 'highlight' work

hourglass/.meteor/packages

@@ -6,7 +6,7 @@
 
 meteor-base@1.0.4             # Packages every Meteor app needs to have
 mobile-experience@1.0.4       # Packages for a great mobile UX
-mongo@1.1.11                   # The database Meteor supports right now
+mongo@1.1.12                   # The database Meteor supports right now
 blaze-html-templates@1.0.4    # Compile .html files into Meteor Blaze views
 reactive-var@1.0.10            # Reactive variable for tracker
 jquery@1.11.9                  # Helpful client-side library
@@ -30,5 +30,5 @@ alanning:roles
 rzymek:fullcalendar
 momentjs:moment
 eternicode:bootstrap-datepicker
-shell-server
+shell-server@0.2.1
-http
+http@1.2.9

hourglass/.meteor/release

@@ -1 +1 @@
-METEOR@1.4.1
+METEOR@1.4.1.1

hourglass/.meteor/versions

@@ -19,7 +19,7 @@ caching-compiler@1.1.7
 caching-html-compiler@1.0.6
 callback-hook@1.0.9
 check@1.2.3
-coffeescript@1.2.4
+coffeescript@1.2.4_1
 dandv:caret-position@2.1.1
 ddp@1.2.5
 ddp-client@1.3.1
@@ -68,9 +68,9 @@ mobile-status-bar@1.0.12
 modules@0.7.6
 modules-runtime@0.7.6
 momentjs:moment@2.14.4
-mongo@1.1.11
+mongo@1.1.12
 mongo-id@1.0.5
-npm-mongo@1.5.46
+npm-mongo@1.5.48
 oauth@1.1.11
 oauth2@1.1.10
 observe-sequence@1.0.12

hourglass/client/main/main.css

@@ -394,10 +394,10 @@ input, textarea {
 	box-shadow: 2px 2px 5px 3px #666;
 	cursor: pointer;
 
-	-webkit-transition: background-color 0.4s ease;  
+	-webkit-transition: background-color 0.4s ease, transform 0.3s ease;  
-	-moz-transition: background-color 0.4s ease; 
+	-moz-transition: background-color 0.4s ease, transform 0.3s ease; 
-	-ms-transition: background-color 0.4s ease;
+	-ms-transition: background-color 0.4s ease, transform 0.3s ease;
-	transition: background-color 0.4s ease;
+	transition: background-color 0.4s ease, transform 0.3s ease;
 }
 
 .workCard:hover {
@@ -691,6 +691,13 @@ input, textarea {
 	background-color: rgba(255,255,255,0.9) !important;
 }
 
+.workevent {
+	-webkit-transition: transform 0.4s ease;  
+	-moz-transition: transform 0.4s ease; 
+	-ms-transition: transform 0.4s ease;
+	transition: transform 0.4s ease; 
+}
+
 .workevent span {
 	padding: 2%;
 	display: inline-block;

hourglass/client/main/main.html

@@ -89,7 +89,7 @@
 
         {{#if currMode 'calendar'}}
         <div id="calbg" style="{{calbg}}"></div>
-            <div id="calendar" style="{{calCenter}}{{calColor}}">
+            <div id="calendar" style="{{calCenter}}{{calColor}}{{highlight}}">
                 {{> fullcalendar calendarOptions}}
             </div>
         {{/if}}
@@ -175,17 +175,17 @@
             <h4>Add Work</h4>
         </div>
         <div class="workHolder">
-        {{#each thisClassWork}}
+            {{#each thisClassWork}}
-            {{> classModeWork}}
+                {{> classModeWork}}
-        {{/each}}
+            {{/each}}
         </div>
     </div>
 </template>
 
 <template name="classModeWork">
-    <div class="workCard" workid="{{_id}}">
+    <div class="workCard" workid="{{_id}}" style="{{scale}}">
         <div class="cWorkType" style="background-color:{{typeColor}}"></div>
-        <div class="cWorkCont">
+        <div class="cWorkCont" style="background-color:{{divColor 'cards'}}">
             <p class="cWorkName">{{name}}</p>
             <span class="cWorkDate">{{dueDate}}</span>
         </div>

hourglass/client/main/main.js

@@ -64,6 +64,8 @@ Session.set("serverData",null);
 Session.set("noclass",null);
 Session.set("creCalWork",null);
 Session.set("calWorkDate",null);
+Session.set("classDisp",[]);
+Session.set("classDispHover",null);
 
 Template.registerHelper('divColor', (div) => {
     return themeColors[Meteor.user().profile.preferences.theme][div];
@@ -112,6 +114,12 @@ Template.registerHelper('myClasses', () => {
                     sameElse: 'MMMM Do'
                 });
                 thisWork[j].typeColor = workColors[thisWork[j].type];
+                var hoverHighlight = Session.get("classDispHover");
+                if(hoverHighlight !== null && hoverHighlight === found._id) {
+                    thisWork[j].scale = "-ms-transform: scale(1.12)-webkit-transform: scale(1.12);transform: scale(1.12)";
+                } else {
+                    thisWork[j].scale = "";
+                }
             }
             array[i].thisClassWork = thisWork;
         }
@@ -190,6 +198,7 @@ Template.main.helpers({
             events: function(start, end, timezone, callback) {
                 var events = [];
                 var cursor = work.find({class: {$in: Session.get("calendarclasses")}});
+                var hoverHighlight = Session.get("classDispHover");
                 cursor.forEach(function(current) {
                     var inRole = false;
                     if(Meteor.userId() === current.creator || 
@@ -208,7 +217,7 @@ Template.main.helpers({
                         backgroundColor: backgroundColor,
                         borderColor: "#444",
                         startEditable: inRole,
-                        className: "workevent",
+                        className: "workevent "+current.class,
                     });
                 });
                 callback(events);
@@ -263,6 +272,36 @@ Template.main.helpers({
             return;
         }
     },
+    highlight() {
+        var hoverHighlight = Session.get("classDispHover");
+        if(hoverHighlight === null) {
+           try {
+                works[i].style.webkitTransform = '';
+                works[i].style.msTransform = '';
+                works[i].style.transform = ''; 
+            } catch(err) {} 
+            return;
+        }
+        var works = document.getElementsByClassName("workevent");
+        for(var i = 0; i < works.length; i++) {
+            var id = works[i].className;
+            var index = id.indexOf("workevent");
+            id = id.substring(index+10,index+27);
+            console.log(id);console.log(hoverHighlight);
+            if(id === hoverHighlight) {
+                works[i].style.webkitTransform = 'scale(1.12)';
+                works[i].style.msTransform = 'scale(1.12)';
+                works[i].style.transform = 'scale(1.12)';
+            } else {
+                try {
+                    works[i].style.webkitTransform = '';
+                    works[i].style.msTransform = '';
+                    works[i].style.transform = ''; 
+                } catch(err) {}
+            } 
+        }
+        return;
+    },
     workCenter() {
         var w = window.innerWidth * 0.3;
         var h = window.innerHeight * 0.7;
@@ -487,7 +526,6 @@ Template.main.events({
             span.appendChild(document.createTextNode(num.toString() + " characters left"));
             ele.parentNode.appendChild(span);
         }
-
     },
     'click .radio' (event) {
         var op = event.target;
@@ -608,29 +646,51 @@ Template.main.events({
         });
     },
     'click .sideClass' (event) {
-        if(!Session.equals("mode","calendar")) return;
         var div = event.target;
         while(div.getAttribute("classid") === null) div = div.parentNode;
         var classid = div.getAttribute("classid");
 
-        if(Session.get("calCreWork")) {
+        if(!Session.equals("mode","calendar")) {  
-            Session.set("calCreWork",null);
+            if(Session.get("calCreWork")) {
-            Session.set("sidebar",null);
+                Session.set("calCreWork",null);
+                Session.set("sidebar",null);
 
-            var date = Session.get("calWorkDate").split("-");
+                var date = Session.get("calWorkDate").split("-");
-            var date = new Date(date[0],parseInt(date[1])-1,date[2],11,59,59);
+                var date = new Date(date[0],parseInt(date[1])-1,date[2],11,59,59);
-            Session.set("newWork", true);
+                Session.set("newWork", true);
-            Session.set("currentReadableWork",
+                Session.set("currentReadableWork",
-            {
+                {
-                  name:"Name | Click here to edit...",
+                      name:"Name | Click here to edit...",
-                  class:classid,
+                      class:classid,
-                  dueDate:getReadableDate(date),
+                      dueDate:getReadableDate(date),
-                  description:"Click here to edit...",
+                      description:"Click here to edit...",
-                  type:"Click here to edit..."
+                      type:"Click here to edit..."
-            });
+                });
-            Session.set("currentWork",{class:classid,dueDate:date});
+                Session.set("currentWork",{class:classid,dueDate:date});
-            openDivFade(document.getElementsByClassName("overlay")[0]);
+                openDivFade(document.getElementsByClassName("overlay")[0]);  
-        } 
+            }
+        } else if(!Session.get("calCreWork")) {
+            var array = Session.get("classDisp");
+            array.push(classid);
+            Session.set("classDisp",array);
+        }
+    },
+    'mouseover .sideClass' (event) {
+        if(event.target.className !== "sideClass") {
+            var div = event.target.parentNode;
+        } else {
+            var div = event.target;  
+        }
+        while(div.getAttribute("classid") === null) div = div.parentNode;
+        var classid = div.getAttribute("classid");
+        Session.set("classDispHover",classid);
+    },
+    'mouseleave .sideClass' (event) {
+        if(event.target.className !== "sideClass") {
+            var div = event.target.parentNode;
+            if(div.contains(event.target)) return;
+        }
+        Session.set("classDispHover",null);
     }
 });
 
@@ -749,3 +809,29 @@ function formReadable(input) {
     input.type = input.type[0].toUpperCase() + input.type.slice(1);
     return input;
 }
+
+function changeColor(hex, amt) {
+
+    hex = hex.slice(1);
+    var num = parseInt(hex,16);
+    var r = (num >> 16) + amt;
+ 
+    if (r > 255) r = 255;
+    else if  (r < 0) r = 0;
+ 
+    var b = ((num >> 8) & 0x00FF) + amt;
+ 
+    if (b > 255) b = 255;
+    else if  (b < 0) b = 0;
+ 
+    var g = (num & 0x0000FF) + amt;
+ 
+    if (g > 255) g = 255;
+    else if (g < 0) g = 0;
+    
+    var final = (g | (b << 8) | (r << 16)).toString(16);
+
+    // Adds preceeding zeros
+    while (final.length < 6) {final = "0" + final};
+    return "#" + final;
+}