From df3c3b0883df78d7116a5c7b38d002c3f1552b3e Mon Sep 17 00:00:00 2001
From: Andres Barrios <andybar2@gmail.com>
Date: Thu, 30 Jun 2016 15:38:36 -0300
Subject: [PATCH 1/3] Fix sub-directives compilation.

---
 lib/molecules/select-ul/example.html          |  15 +-
 lib/molecules/select-ul/metadata.json         |   2 +-
 .../select-ul/select-ul-item.directive.js     |  14 --
 .../select-ul/select-ul.directive.js          | 133 +++++++++---------
 lib/molecules/select-ul/template.html         |  14 +-
 5 files changed, 85 insertions(+), 93 deletions(-)
 delete mode 100644 lib/molecules/select-ul/select-ul-item.directive.js

diff --git a/lib/molecules/select-ul/example.html b/lib/molecules/select-ul/example.html
index bd13202..bdb49b9 100644
--- a/lib/molecules/select-ul/example.html
+++ b/lib/molecules/select-ul/example.html
@@ -1,8 +1,9 @@
-<ln-m-select-ul ng-model="{{ngModel}}"
-                ln-options="{{lnOptions}}"
-                ln-value-field="value"
-                ln-label-field="label"
-                ln-placeholder="-- Select --"
-                ln-none="None"
-                ln-mobile-none="-- Select --">
+<ln-m-select-ul 
+  ln-model="lnModel"
+  ln-options="lnOptions"
+  ln-value-field="{{lnValueField}}"
+  ln-label-field="{{lnLabelField}}"
+  ln-placeholder="{{lnPlaceholder}}"
+  ln-none="{{lnNone}}"
+  ln-mobile-none="{{lnMobileNone}}">
 </ln-m-select-ul>
diff --git a/lib/molecules/select-ul/metadata.json b/lib/molecules/select-ul/metadata.json
index 23f566b..42428dc 100644
--- a/lib/molecules/select-ul/metadata.json
+++ b/lib/molecules/select-ul/metadata.json
@@ -2,7 +2,7 @@
   "name": "ln-m-select-ul",
   "description": "Molecule - Select control which converts to a ul for styling on desktop.",
   "params": {
-    "ngModel": "VAR",
+    "lnModel": "VAR",
     "lnOptions": [{
       "value": "STRING",
       "label": "STRING"
diff --git a/lib/molecules/select-ul/select-ul-item.directive.js b/lib/molecules/select-ul/select-ul-item.directive.js
deleted file mode 100644
index 0989e4d..0000000
--- a/lib/molecules/select-ul/select-ul-item.directive.js
+++ /dev/null
@@ -1,14 +0,0 @@
-angular
-  .module('lnPatterns')
-  .directive('lnMSelectUlItem', lnMSelectUlItem);
-
-function lnMSelectUlItem() {
-
-  return {
-    restrict: 'A',
-    template: '<span ng-bind-html="lnLabel"></span>',
-    scope: {
-      lnLabel: '@'
-    }
-  };
-}
diff --git a/lib/molecules/select-ul/select-ul.directive.js b/lib/molecules/select-ul/select-ul.directive.js
index b6d12ba..72c64aa 100644
--- a/lib/molecules/select-ul/select-ul.directive.js
+++ b/lib/molecules/select-ul/select-ul.directive.js
@@ -1,29 +1,23 @@
-// require('@iamadamjowett/angular-click-outside');
-require( './select-ul-item.directive');
-
 angular
   .module('lnPatterns')
-  .directive('lnMSelectUl', lnMSelectUl);
-
+  .constant('DEFAULT_DIRECTIVE', 'ln-m-select-ul-item')
+  .directive('lnMSelectUl', lnMSelectUl)
+  .directive('lnMSelectUlWrapper', lnMSelectUlWrapper)
+  .directive('lnMSelectUlItem', lnMSelectUlItem);
 
-// angular
-//   .module('lnSelectToUl', [
-//     'angular-click-outside'
-//   ])
-//   .directive('selectToUl', selectToUl);
+/////////////
 
-lnMSelectUl.$inject = ['$timeout', '$sanitize', '$compile', '$sce'];
-
-function lnMSelectUl( $timeout, $sanitize, $compile, $sce ) {
+lnMSelectUl.$inject = ['$timeout', 'DEFAULT_DIRECTIVE'];
 
+function lnMSelectUl( $timeout, DEFAULT_DIRECTIVE ) {
   return {
     restrict: 'E',
     link: link,
     templateUrl: 'lnPatterns/molecules/select-ul/template.html',
-    controller: controller,
+    controller: lnMSelectUlController,
     controllerAs: 'vm',
     scope: {
-      ngModel: '=',
+      lnModel: '=',
       lnOptions: '=',
       lnValueField: '@',
       lnLabelField: '@',
@@ -36,27 +30,15 @@ function lnMSelectUl( $timeout, $sanitize, $compile, $sce ) {
   };
 
   function link( scope, elem ) {
-
-    var DEFAULT_DIRECTIVE = 'ln-m-select-ul-item';
-
     scope.valueField = scope.lnValueField ? scope.lnValueField : 'value';
-
     scope.labelField = scope.lnLabelField ? scope.lnLabelField : 'label';
-
     scope.required = scope.lnRequired ? scope.lnRequired : false;
-
     scope.placholder = scope.lnPlaceholder ? scope.lnPlaceholder : '-- Select --';
-
     scope.none = scope.lnNone ? scope.lnNone : false;
-
     scope.mobileNone = scope.lnMobileNone ? scope.lnMobileNone : false;
-
     scope.itemDirective = scope.lnItemDirective ? scope.lnItemDirective : DEFAULT_DIRECTIVE;
-
     scope.displayOptions = false;
 
-    scope.$watch( 'lnOptions', compile );
-
     scope.getSelected = function( field ) {
       var selected = {};
 
@@ -64,20 +46,20 @@ function lnMSelectUl( $timeout, $sanitize, $compile, $sce ) {
 
       if ( angular.equals({}, selected) ) {
         selected[scope.valueField] = null;
-        selected[scope.labelField] = scope.lnPlaceholder;
+        selected[scope.labelField] = scope.placholder;
       }
 
       return angular.isDefined( field ) ? selected[ field ] : selected;
 
       function checkOption( option ) {
-        if ( scope.ngModel === option[scope.lnValueField] ) {
+        if ( scope.lnModel === option[scope.lnValueField] ) {
           selected = option;
         }
       }
     };
 
     scope.setSelected = function( index ) {
-      scope.ngModel = -1 === index ? null : scope.lnOptions[index][scope.valueField];
+      scope.lnModel = -1 === index ? null : scope.lnOptions[index][scope.valueField];
       scope.hideOptions();
     };
 
@@ -96,45 +78,14 @@ function lnMSelectUl( $timeout, $sanitize, $compile, $sce ) {
     scope.showOptions = function() {
       scope.displayOptions = true;
     };
-
-    scope.getOptionHtml = function( option ) {
-      var props = '';
-
-      if ( DEFAULT_DIRECTIVE === scope.itemDirective ) {
-        props = ' ln-label="' + option[scope.labelField] + '"';
-      } else {
-        for ( var key in option ) {
-          if ( option.hasOwnProperty( key ) ) {
-            var parAttr = 'mx-' + normalize( key );
-
-            var value = angular.isObject(option[key]) ? $sanitize(angular.toJson(option[key])) : option[key];
-
-            props += ' ' + parAttr + '="' + value + '"';
-          }
-        }
-      }
-
-      return $sce.trustAsHtml( '<span ' + scope.itemDirective + props + '></span>' );
-    };
-
-    function normalize( string ) {
-      return string.replace( /_/g, '-' ).toLowerCase();
-    }
-
-    function compile() {
-      $timeout( compileElem, 2000 );
-
-      function compileElem() {
-        $compile( elem[0].querySelector('.desktop li') )( scope );
-      }
-    }
   }
 }
 
+/////////////
 
-controller.$inject = ['$document'];
+lnMSelectUlController.$inject = ['$document'];
 
-function controller($document) {
+function lnMSelectUlController($document) {
   var vm = this;
 
   vm.hasTouchSupport = isTouchSupported() && isMobile();
@@ -152,3 +103,57 @@ function controller($document) {
     return devices.test(userAgent);
   }
 }
+
+/////////////
+
+lnMSelectUlWrapper.$inject = ['DEFAULT_DIRECTIVE', '$sanitize', '$compile'];
+
+function lnMSelectUlWrapper( DEFAULT_DIRECTIVE, $sanitize, $compile ) {
+  return {
+    restrict: 'A',
+    link: link,
+    scope: {
+      lnOption: '='
+    }
+  };
+
+  function link( scope, elem ) {
+    var props = '';
+
+    if ( DEFAULT_DIRECTIVE === scope.$parent.itemDirective ) {
+      props = ' ln-label="' + scope.lnOption[scope.$parent.labelField] + '"';
+    } else {
+      for ( var key in scope.lnOption ) {
+        if ( scope.lnOption.hasOwnProperty( key ) ) {
+          var parAttr = 'mx-' + normalize( key );
+
+          var value = 
+            angular.isObject(scope.lnOption[key])
+            ? $sanitize(angular.toJson(scope.lnOption[key]))
+            : scope.lnOption[key];
+
+          props += ' ' + parAttr + '="' + value + '"';
+        }
+      }
+    }
+
+    var span = $compile( '<span ' + scope.$parent.itemDirective + props + '></span>' )( scope );
+    elem.append( span );
+  }
+
+  function normalize( string ) {
+    return string.replace( /_/g, '-' ).toLowerCase();
+  }
+}
+
+/////////////
+
+function lnMSelectUlItem() {
+  return {
+    restrict: 'A',
+    template: '<span ng-bind-html="lnLabel"></span>',
+    scope: {
+      lnLabel: '@'
+    }
+  };
+}
\ No newline at end of file
diff --git a/lib/molecules/select-ul/template.html b/lib/molecules/select-ul/template.html
index 1a6c608..38a3e5a 100644
--- a/lib/molecules/select-ul/template.html
+++ b/lib/molecules/select-ul/template.html
@@ -1,10 +1,9 @@
 <div class="select-to-ul-container" ng-class="{'hiding': hidingInProgress, 'displaying-options': displayOptions}">
   <div class="desktop" ng-show="!vm.hasTouchSupport" ng-click="toggleOptions()">
-    <span ln-m-select-ul-item
-          ln-label="{{getSelected(labelField)}}"
+    <span id="select-to-ul_{{lnPlaceholder}}"
           class="fake-select"
-          id="select-to-ul_{{lnPlaceholder}}"
-          click-outside="hideOptions()"></span>
+          ng-bind-html="getSelected(labelField)">
+    </span>
     <ul ng-show="displayOptions">
       <li ln-m-select-ul-item
           ln-label="{{none}}"
@@ -13,13 +12,14 @@
       </li>
       <li ng-repeat="option in lnOptions"
           ng-click="setSelected($index)"
-          ng-bind-html="getOptionHtml( option )">
+          ln-m-select-ul-wrapper
+          ln-option="option">
       </li>
     </ul>
   </div>
 
-  <div class="mobile" ng-show="!vm.hasTouchSupport">
-    <select ng-model="ngModel"
+  <div class="mobile" ng-show="vm.hasTouchSupport">
+    <select ng-model="lnModel"
             ng-required="{{required}}"
             placeholder="{{lnPlaceholder}}">
       <option value=""

From cf50635495dc13861d10735829772b1db6b6b850 Mon Sep 17 00:00:00 2001
From: Andres Barrios <andybar2@gmail.com>
Date: Thu, 30 Jun 2016 15:46:57 -0300
Subject: [PATCH 2/3] Fix ci issue.

---
 lib/molecules/select-ul/select-ul.directive.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lib/molecules/select-ul/select-ul.directive.js b/lib/molecules/select-ul/select-ul.directive.js
index 72c64aa..7b34902 100644
--- a/lib/molecules/select-ul/select-ul.directive.js
+++ b/lib/molecules/select-ul/select-ul.directive.js
@@ -29,7 +29,7 @@ function lnMSelectUl( $timeout, DEFAULT_DIRECTIVE ) {
     }
   };
 
-  function link( scope, elem ) {
+  function link( scope ) {
     scope.valueField = scope.lnValueField ? scope.lnValueField : 'value';
     scope.labelField = scope.lnLabelField ? scope.lnLabelField : 'label';
     scope.required = scope.lnRequired ? scope.lnRequired : false;

From f8d6275fd4e9c81fbfe35dd9ccbff97a9a8baaf9 Mon Sep 17 00:00:00 2001
From: Andres Barrios <andybar2@gmail.com>
Date: Thu, 30 Jun 2016 15:54:58 -0300
Subject: [PATCH 3/3] Add controller definition.

---
 .../select-ul/select-ul.directive.js          | 23 +++++++++++++------
 1 file changed, 16 insertions(+), 7 deletions(-)

diff --git a/lib/molecules/select-ul/select-ul.directive.js b/lib/molecules/select-ul/select-ul.directive.js
index 7b34902..40ffddd 100644
--- a/lib/molecules/select-ul/select-ul.directive.js
+++ b/lib/molecules/select-ul/select-ul.directive.js
@@ -1,11 +1,14 @@
 angular
   .module('lnPatterns')
   .constant('DEFAULT_DIRECTIVE', 'ln-m-select-ul-item')
-  .directive('lnMSelectUl', lnMSelectUl)
+  .controller('lnMSelectUlController', lnMSelectUlController)
   .directive('lnMSelectUlWrapper', lnMSelectUlWrapper)
-  .directive('lnMSelectUlItem', lnMSelectUlItem);
+  .directive('lnMSelectUlItem', lnMSelectUlItem)
+  .directive('lnMSelectUl', lnMSelectUl);
 
-/////////////
+//
+// lnMSelectUl
+//
 
 lnMSelectUl.$inject = ['$timeout', 'DEFAULT_DIRECTIVE'];
 
@@ -14,7 +17,7 @@ function lnMSelectUl( $timeout, DEFAULT_DIRECTIVE ) {
     restrict: 'E',
     link: link,
     templateUrl: 'lnPatterns/molecules/select-ul/template.html',
-    controller: lnMSelectUlController,
+    controller: 'lnMSelectUlController',
     controllerAs: 'vm',
     scope: {
       lnModel: '=',
@@ -81,7 +84,9 @@ function lnMSelectUl( $timeout, DEFAULT_DIRECTIVE ) {
   }
 }
 
-/////////////
+//
+// lnMSelectUlController
+//
 
 lnMSelectUlController.$inject = ['$document'];
 
@@ -104,7 +109,9 @@ function lnMSelectUlController($document) {
   }
 }
 
-/////////////
+//
+// lnMSelectUlWrapper
+//
 
 lnMSelectUlWrapper.$inject = ['DEFAULT_DIRECTIVE', '$sanitize', '$compile'];
 
@@ -146,7 +153,9 @@ function lnMSelectUlWrapper( DEFAULT_DIRECTIVE, $sanitize, $compile ) {
   }
 }
 
-/////////////
+//
+// lnMSelectUlItem
+//
 
 function lnMSelectUlItem() {
   return {