From df21c1a0eb49578d7c062e60a52b349534f43930 Mon Sep 17 00:00:00 2001
From: jlukic <jacklukic@gmail.com>
Date: Sun, 21 Sep 2014 13:25:41 -0400
Subject: [PATCH] Fix some dropdown example inits

---
 server/documents/modules/dropdown.html.eco | 69 +++++++++++++++-------
 server/files/javascript/dropdown.js        |  2 +-
 server/layouts/default.html.eco            |  2 +-
 3 files changed, 51 insertions(+), 22 deletions(-)

diff --git a/server/documents/modules/dropdown.html.eco b/server/documents/modules/dropdown.html.eco
index 92c1f65d1..0224a15b4 100755
--- a/server/documents/modules/dropdown.html.eco
+++ b/server/documents/modules/dropdown.html.eco
@@ -954,8 +954,8 @@ themes      : ['Default']
       <div class="code" data-label="HTML" data-type="html">
         <div class="ui dropdown">
           <input type="hidden" name="gender">
-          <div class="default text">Gender</div>
           <i class="dropdown icon"></i>
+          <div class="default text">Gender</div>
           <div class="menu">
             <div class="item" data-value="male">Male</div>
             <div class="item" data-value="female">Female</div>
@@ -993,29 +993,58 @@ themes      : ['Default']
       <h4 class="ui header">Hybrid Option</h4>
       <p>As a third option, you can include a wrapper around your <code>select</code> so that it will appear correctly on page load, but will then <b>populate the hidden menu</b> when javascript fires. In this case, the <code>select</code> element does not receive the <code>ui dropdown</code> class.</p>
       <div class="code" data-label="HTML" data-type="html">
-        <div class="ui dropdown">
-          <select name="gender" id="hybrid-select">
-            <option value="">Gender</option>
-            <option value="male">Male</option>
-            <option value="female">Female</option>
-          </select>
-          <div class="default text">Gender</div>
-          <i class="dropdown icon"></i>
+        <div class="ui vertical menu" id="hybrid">
+          <div class="ui dropdown item">
+            <i class="dropdown icon"></i>
+            Colors
+            <select>
+              <option>Red</option>
+              <option>Black</option>
+              <option>Blue</option>
+              <option>Green</option>
+            </select>
+          </div>
+          <div class="ui dropdown item">
+            <i class="dropdown icon"></i>
+            Sizes
+            <select>
+              <option>Small</option>
+              <option>Medium</option>
+              <option>Large</option>
+              <option>Huge</option>
+            </select>
+          </div>
         </div>
       </div>
       <div class="code" data-type="javascript" data-demo="true">
-        $('#hybrid-select')
-          .dropdown()
+        $('#hybrid select')
+          .dropdown({
+            on: 'hover'
+          })
         ;
       </div>
-      <div class="ui dropdown">
-        <select name="gender" id="hybrid-select">
-          <option value="male">Male</option>
-          <option value="female">Female</option>
-        </select>
-        <div class="default text">Gender</div>
-        <i class="dropdown icon"></i>
-      </div>
+      <div class="ui vertical menu" id="hybrid">
+          <div class="ui dropdown item">
+            <i class="dropdown icon"></i>
+            Colors
+            <select>
+              <option>Red</option>
+              <option>Black</option>
+              <option>Blue</option>
+              <option>Green</option>
+            </select>
+          </div>
+          <div class="ui dropdown item">
+            <i class="dropdown icon"></i>
+            Sizes
+            <select>
+              <option>Small</option>
+              <option>Medium</option>
+              <option>Large</option>
+              <option>Huge</option>
+            </select>
+          </div>
+        </div>
     </div>
 
     <div class="no example">
@@ -1467,7 +1496,7 @@ themes      : ['Default']
         </div>
       </div>
 
-      <div class="ui dropdown icon button">
+      <div class="ui dropdown button">
         <div class="text">Go to</div>
         <i class="dropdown icon"></i>
         <div class="menu">
diff --git a/server/files/javascript/dropdown.js b/server/files/javascript/dropdown.js
index c2a381220..7d5dd397a 100755
--- a/server/files/javascript/dropdown.js
+++ b/server/files/javascript/dropdown.js
@@ -8,7 +8,7 @@ semantic.dropdown.ready = function() {
     $examples         = $('.example'),
     $hoverDropdown    = $examples.filter('.hover').find('.ui.dropdown'),
     $buttonDropdown   = $examples.filter('.button.example').find('.ui.dropdown'),
-    $dropdown         = $examples.filter('.dropdown').find('> .ui.dropdown:not(.simple)'),
+    $dropdown         = $examples.filter('.dropdown').find('> .ui.dropdown:not(.simple), .inline.dropdown, .icon.buttons .button, .form .dropdown.selection'),
     $transition       = $examples.filter('.transition').find('.ui.dropdown'),
     $transitionButton = $examples.filter('.transition').find('.ui.button').first(),
     // alias
diff --git a/server/layouts/default.html.eco b/server/layouts/default.html.eco
index 42750e059..d2f8d9c29 100755
--- a/server/layouts/default.html.eco
+++ b/server/layouts/default.html.eco
@@ -161,7 +161,7 @@
       ignore_class : ["code", "ace_editor"]
     };
   </script>
-  <script type="text/javascript" src="//cdn.transifex.com/live.js"></script>
+  <script type="text/javascript" src="http://cdn.transifex.com/live.js"></script>
 </head>
 <body id="example" class="pushable <%= @document.css %>" ontouchstart="">
   <div class="ui vertical inverted labeled icon sidebar menu" id="menu">