From 36adb870797d3c26be33ab65a7a61be437429ca2 Mon Sep 17 00:00:00 2001
From: Catouse <catouse@gmail.com>
Date: Tue, 10 Dec 2013 09:50:25 +0800
Subject: [PATCH]  * added debug.js.

---
 examples/alerts.html        |  1 +
 examples/article.html       |  1 +
 examples/breadcrumb.html    |  1 +
 examples/button-groups.html |  1 +
 examples/buttons.html       |  1 +
 examples/cards.html         |  1 +
 examples/carousel.html      |  1 +
 examples/chosen.html        |  1 +
 examples/code.html          |  3 ++-
 examples/collapse.html      |  1 +
 examples/comment.html       |  1 +
 examples/dropdowns.html     |  1 +
 examples/forms.html         |  1 +
 examples/grid.html          |  1 +
 examples/headers.html       |  1 +
 examples/input-groups.html  |  1 +
 examples/kindeditor.html    |  1 +
 examples/labels.html        |  1 +
 examples/lightbox.html      |  1 +
 examples/list-group.html    |  1 +
 examples/list.html          |  1 +
 examples/modals.html        |  1 +
 examples/navbars.html       |  1 +
 examples/navs.html          |  1 +
 examples/pager.html         |  1 +
 examples/panels.html        |  1 +
 examples/popovers.html      |  1 +
 examples/progress.html      |  1 +
 examples/tables.html        |  1 +
 examples/tabs.html          |  1 +
 examples/textbox.html       |  1 +
 examples/tooltip.html       |  1 +
 examples/type.html          |  1 +
 src/js/debug.js             | 11 +++++++++++
 34 files changed, 45 insertions(+), 1 deletion(-)
 create mode 100644 src/js/debug.js

diff --git a/examples/alerts.html b/examples/alerts.html
index b68413c4a..75b80b300 100644
--- a/examples/alerts.html
+++ b/examples/alerts.html
@@ -13,6 +13,7 @@
   <link href="../assets/css/doc.css" rel="stylesheet">
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
   <!--[if lt IE 9]>
   <script src="../assets/js/html5shiv.js"></script>
   <script src="../assets/js/respond.js"></script>
diff --git a/examples/article.html b/examples/article.html
index cbcf6f56b..ea01776f6 100644
--- a/examples/article.html
+++ b/examples/article.html
@@ -13,6 +13,7 @@
   <link href="../assets/css/doc.css" rel="stylesheet">
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
 
 
   <!--[if lt IE 9]>
diff --git a/examples/breadcrumb.html b/examples/breadcrumb.html
index f956712f9..55afab9ea 100644
--- a/examples/breadcrumb.html
+++ b/examples/breadcrumb.html
@@ -10,6 +10,7 @@
   <link href="../assets/css/doc.css" rel="stylesheet">
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
 
 
   <!--[if lt IE 9]>
diff --git a/examples/button-groups.html b/examples/button-groups.html
index d158cce94..0bf14be17 100644
--- a/examples/button-groups.html
+++ b/examples/button-groups.html
@@ -5,6 +5,7 @@
   <link href="../assets/css/doc.css" rel="stylesheet">
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
 
 
   <link href="../dist/css/zui.css" rel="stylesheet">
diff --git a/examples/buttons.html b/examples/buttons.html
index 4b9f1dd19..e8d56dfdb 100644
--- a/examples/buttons.html
+++ b/examples/buttons.html
@@ -13,6 +13,7 @@
   <link href="../assets/css/doc.css" rel="stylesheet">
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
 
 
   <!--[if lt IE 9]>
diff --git a/examples/cards.html b/examples/cards.html
index 702a37f39..4e5af5633 100644
--- a/examples/cards.html
+++ b/examples/cards.html
@@ -13,6 +13,7 @@
   <link href="../assets/css/doc.css" rel="stylesheet">
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
 
 
   <!--[if lt IE 9]>
diff --git a/examples/carousel.html b/examples/carousel.html
index a8d912e66..ea3b12474 100644
--- a/examples/carousel.html
+++ b/examples/carousel.html
@@ -6,6 +6,7 @@
   <link href="../assets/css/doc.css" rel="stylesheet">
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
 
 
 
diff --git a/examples/chosen.html b/examples/chosen.html
index 26c6dff13..b660f2cf9 100644
--- a/examples/chosen.html
+++ b/examples/chosen.html
@@ -9,6 +9,7 @@
 
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
 
   <!--[if lt IE 9]>
   <script src="../assets/js/html5shiv.js"></script>
diff --git a/examples/code.html b/examples/code.html
index 0f1d2d26d..60e6fef98 100644
--- a/examples/code.html
+++ b/examples/code.html
@@ -14,6 +14,7 @@
   <script src="../assets/js/google-code-prettify/prettify.js"></script>
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
 
 
   <!--[if lt IE 9]>
@@ -50,4 +51,4 @@
   </article>
 
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/examples/collapse.html b/examples/collapse.html
index 1c9433148..4a6ade3f8 100644
--- a/examples/collapse.html
+++ b/examples/collapse.html
@@ -9,6 +9,7 @@
   <script src="../assets/js/less.js"></script>
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
 
 
 
diff --git a/examples/comment.html b/examples/comment.html
index 7cc34cbce..e91a2a32e 100644
--- a/examples/comment.html
+++ b/examples/comment.html
@@ -13,6 +13,7 @@
   <link href="../assets/css/doc.css" rel="stylesheet">
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
 
 
   <script>
diff --git a/examples/dropdowns.html b/examples/dropdowns.html
index 61cdc290c..4fa349280 100644
--- a/examples/dropdowns.html
+++ b/examples/dropdowns.html
@@ -8,6 +8,7 @@
   <script src="../assets/js/less.js"></script>
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
 
 
   <link href="../dist/css/zui.css" rel="stylesheet">
diff --git a/examples/forms.html b/examples/forms.html
index 86ead22bb..e1f602d2f 100644
--- a/examples/forms.html
+++ b/examples/forms.html
@@ -12,6 +12,7 @@
   <script src="../assets/js/less.js"></script>
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
 
 
   <!--[if lt IE 9]>
diff --git a/examples/grid.html b/examples/grid.html
index c222c92ca..fd82c7c66 100644
--- a/examples/grid.html
+++ b/examples/grid.html
@@ -13,6 +13,7 @@
   <!-- Latest compiled and minified JavaScript -->
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
 
 
   <!--[if lt IE 9]>
diff --git a/examples/headers.html b/examples/headers.html
index 3f6977956..9a94ba318 100644
--- a/examples/headers.html
+++ b/examples/headers.html
@@ -13,6 +13,7 @@
   <link href="../assets/css/doc.css" rel="stylesheet">
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
 
 
   <!--[if lt IE 9]>
diff --git a/examples/input-groups.html b/examples/input-groups.html
index 03a0b5519..821bf74e5 100644
--- a/examples/input-groups.html
+++ b/examples/input-groups.html
@@ -12,6 +12,7 @@
   <script src="../assets/js/less.js"></script>
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
 
 
   <!--[if lt IE 9]>
diff --git a/examples/kindeditor.html b/examples/kindeditor.html
index 396b1c097..8f6942b3e 100644
--- a/examples/kindeditor.html
+++ b/examples/kindeditor.html
@@ -7,6 +7,7 @@
     <script src="../plugins/kindeditor/kindeditor-all-min.js"></script>
     <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
 
 
     <script>
diff --git a/examples/labels.html b/examples/labels.html
index 8748f3ed1..81ad1c527 100644
--- a/examples/labels.html
+++ b/examples/labels.html
@@ -12,6 +12,7 @@
   <script src="../assets/js/less.js"></script>
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
 
 
   <!--[if lt IE 9]>
diff --git a/examples/lightbox.html b/examples/lightbox.html
index 19e36ec87..9603f4613 100644
--- a/examples/lightbox.html
+++ b/examples/lightbox.html
@@ -9,6 +9,7 @@
   <script src="../assets/js/less.js"></script>
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
   <script src="../src/js/modal.js"></script>
   <script src="../src/js/lightbox.js"></script>
   <script>
diff --git a/examples/list-group.html b/examples/list-group.html
index 7ac7b3e42..fb78e3707 100644
--- a/examples/list-group.html
+++ b/examples/list-group.html
@@ -12,6 +12,7 @@
   <script src="../assets/js/less.js"></script>
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
 
 
   <!--[if lt IE 9]>
diff --git a/examples/list.html b/examples/list.html
index b896541d7..d3390c995 100644
--- a/examples/list.html
+++ b/examples/list.html
@@ -13,6 +13,7 @@
   <link href="../assets/css/doc.css" rel="stylesheet">
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
 
 
   <!--[if lt IE 9]>
diff --git a/examples/modals.html b/examples/modals.html
index a8359a211..e15e56146 100644
--- a/examples/modals.html
+++ b/examples/modals.html
@@ -9,6 +9,7 @@
   <script src="../assets/js/less.js"></script>
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
   <script src="../src/js/modal.js"></script>
 
   <link href="../assets/css/doc.css" rel="stylesheet">
diff --git a/examples/navbars.html b/examples/navbars.html
index cd4439293..021509898 100644
--- a/examples/navbars.html
+++ b/examples/navbars.html
@@ -14,6 +14,7 @@
   <!-- Latest compiled and minified JavaScript -->
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
 
 
   <!--[if lt IE 9]>
diff --git a/examples/navs.html b/examples/navs.html
index e2a3a4643..a26e3b7c2 100644
--- a/examples/navs.html
+++ b/examples/navs.html
@@ -13,6 +13,7 @@
   <link href="../assets/css/doc.css" rel="stylesheet">
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
 
 
   <script>
diff --git a/examples/pager.html b/examples/pager.html
index bcf1fb1de..898dd1afc 100644
--- a/examples/pager.html
+++ b/examples/pager.html
@@ -11,6 +11,7 @@
 
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
 
 
   <script src="../src/js/pager.js"></script>
diff --git a/examples/panels.html b/examples/panels.html
index 6160a15ba..efad1c85e 100644
--- a/examples/panels.html
+++ b/examples/panels.html
@@ -14,6 +14,7 @@
   <script src="../assets/js/less.js"></script>
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
 
 
   <!--[if lt IE 9]>
diff --git a/examples/popovers.html b/examples/popovers.html
index ecb50a85c..e7bbdf92b 100644
--- a/examples/popovers.html
+++ b/examples/popovers.html
@@ -13,6 +13,7 @@
   <link href="../assets/css/doc.css" rel="stylesheet">
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
 
 
   <script src="../assets/js/google-code-prettify/prettify.js"></script>
diff --git a/examples/progress.html b/examples/progress.html
index a036565e6..f8ee3b53b 100644
--- a/examples/progress.html
+++ b/examples/progress.html
@@ -9,6 +9,7 @@
   <script src="../assets/js/less.js"></script>
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
 
 
   <!--[if lt IE 9]>
diff --git a/examples/tables.html b/examples/tables.html
index 61e5e2bfc..5241b6ee8 100644
--- a/examples/tables.html
+++ b/examples/tables.html
@@ -13,6 +13,7 @@
   <link href="../assets/css/doc.css" rel="stylesheet">
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
 
 
   <!--[if lt IE 9]>
diff --git a/examples/tabs.html b/examples/tabs.html
index 56380604a..fd6a25d2b 100644
--- a/examples/tabs.html
+++ b/examples/tabs.html
@@ -9,6 +9,7 @@
   <script src="../assets/js/less.js"></script>
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
 
 
 
diff --git a/examples/textbox.html b/examples/textbox.html
index bf86cf283..d738a1651 100644
--- a/examples/textbox.html
+++ b/examples/textbox.html
@@ -12,6 +12,7 @@
   <script src="../assets/js/less.js"></script>
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
 
 
   <!--[if lt IE 9]>
diff --git a/examples/tooltip.html b/examples/tooltip.html
index c0b765014..0bbae1c63 100644
--- a/examples/tooltip.html
+++ b/examples/tooltip.html
@@ -13,6 +13,7 @@
   <link href="../assets/css/doc.css" rel="stylesheet">
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
   <script src="../assets/js/google-code-prettify/prettify.js"></script>
   <script>
   $(function ()
diff --git a/examples/type.html b/examples/type.html
index 333430c79..08e30f3b6 100644
--- a/examples/type.html
+++ b/examples/type.html
@@ -13,6 +13,7 @@
   <link href="../assets/css/doc.css" rel="stylesheet">
   <script src="../assets/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
+  <script src="../src/js/debug.js"></script>
   <!--[if lt IE 9]>
   <script src="../assets/js/html5shiv.js"></script>
   <script src="../assets/js/respond.js"></script>
diff --git a/src/js/debug.js b/src/js/debug.js
new file mode 100644
index 000000000..611770335
--- /dev/null
+++ b/src/js/debug.js
@@ -0,0 +1,11 @@
+$(function()
+{
+    $('body').append('<style>#zuiDebug{display:none; position: fixed;left: 2%;top: 30%;}#zuiDebug .icon{width: 160px;height: 160px;padding: 20px;border-radius: 100px;background-color: #333;color: #fff;transition:all 0.4s;}#zuiDebug .icon.visible-xs{background-color: #39B3D7;}#zuiDebug .icon.visible-sm{background-color: #47A447;}#zuiDebug .icon.visible-md{background-color: #ED9C28;}#zuiDebug .icon.visible-lg{background-color: #D2322D;}#zuiDebug .icon:hover{opacity: 0.5;}#zuiDebug .icon > i{display: block;font-size: 60px;}#zuiDebug .icon small{display: inline-block;height: 24px;opacity: 0.7;font-size: 12px;background-color: rgba(0,0,0,0.5);border-radius:12px; line-height: 24px;margin-top: 10px;padding: 0 10px;}</style><div id="zuiDebug"><div class="icon text-center visible-xs"><i class="icon-mobile-phone"></i><strong>Phone</strong><div class="text-center"><small>XS <span class="screen-size"></span></small></div></div><div class="icon text-center visible-sm"><i class="icon-tablet"></i><strong>Tablet</strong><div class="text-center"><small>SM <span class="screen-size"></span></small></div></div><div class="icon text-center visible-md"><i class="icon-desktop"></i><strong>Desktop</strong><div class="text-center"><small>MD <span class="screen-size"></span></small></div></div><div class="icon text-center visible-lg"><i class="icon-desktop"></i><strong>Widescreen</strong><div class="text-center"><small>LG <span class="screen-size"></span></small></div></div></div>')
+    displayScreenSize();
+    $('#zuiDebug').fadeIn();
+    $(window).resize(displayScreenSize);
+    function displayScreenSize()
+    {
+        $('#zuiDebug .screen-size').text($(document).width() + ' x ' + $(document).height());
+    }
+});
-- 
GitLab