Update qtip configuration to 2.0

Web/Scripts/Shared/Site.js

@@ -33,10 +33,13 @@
         var content = $(this).next('.report-calculation');
         $(this).qtip({
             content: content,
-            hide: { fixed: true, delay: 1000 },
+            hide: {
+                fixed: true,
+                delay: 1000
+            },
             style: {
-                name: 'light',
-                width: 400
+                width: 400,
+                classes: "qtip-light"
             }
         });
     });
@@ -46,7 +49,7 @@
             $(this).qtip({
                 content: "No previous log for this vehicle",
                 style: {
-                    name: 'red'
+                    classes: "qtip-red"
                 }
             });
         });
@@ -69,34 +72,35 @@
 
     $("input#EmployeeName").change(employeeHistoryKeydownHandler).keydown(employeeHistoryKeydownHandler);
 
-    employeeHistoryIconUpdate($("input#EmployeeName"), $("#icon-employee-history"));
+    if ($("input#EmployeeName").length > 0)
+        employeeHistoryIconUpdate($("input#EmployeeName"), $("#icon-employee-history"));
 
     $("#icon-employee-history").qtip({
-        content: '<p class="loading">Recent Logs...</p>',
-        api: {
-            beforeShow: function () {
-                var qt = this;
-                $.ajax(
-                    {
+            content: {
+                text: "<p class=\"loading\">Recent Logs...</p>",
+            },
+            style: {
+                width: 320,
+                classes: 'qtip-light'
+            },
+            hide: {
+                fixed: true,
+                delay: 500
+            },
+            events: {
+                show: function (event, api) {
+                    $.ajax({
                         url: "CreateLog/RecentLogs",
-                        data: { employeeName: $("input#EmployeeName").val() },
-                        success: function (data) {
-                            qt.updateContent(data, true);
+                        data: {
+                             employeeName: $("input#EmployeeName").val()
+                        },
+                        success: function(data) {
+                            api.set("content.text", data);
                         }
                     });
+                }
             }
-        },
-        style: {
-            width: 320,
-            border: {
-                color: '#81B3B3'
-            }
-        },
-        hide: {
-            fixed: true,
-            delay: 500
-        }
-    });
+        });
 
     if ($('input#VehicleId').length > 0) {
         //        var settings = $('form').validate().settings;
@@ -116,16 +120,16 @@
 
 function bindQtipModal(element) {
     var corner = {
-        target: 'topLeft',
-        tooltip: 'bottomCenter'
+        target: 'top left',
+        tooltip: 'bottom center'
     };
-    var tip = 'bottomLeft';
+    var tip = 'bottom left';
     if (element.hasClass("below")) {
         corner = {
-            target: 'bottomMiddle',
-            tooltip: 'topRight'
+            target: 'bottom middle',
+            tooltip: 'top right'
         };
-        tip = 'topRight';
+        tip = 'top right';
     }
 
     element.click(function () { return false; });
@@ -134,7 +138,10 @@ function bindQtipModal(element) {
 
     element.qtip({
         content: {
-            url: element.attr('href')
+            ajax: {
+                url: element.attr('href')
+            },
+            text: "<p class=\"loading\">Recent Logs...</p>"
         },
         hide: {
             fixed: true,
@@ -144,7 +151,7 @@ function bindQtipModal(element) {
             corner: corner
         },
         style: {
-            name: 'light',
+            classes: 'qtip-light',
             tip: tip,
             width: 300
         }