Bumping to v0.5.0

Author: ruhley

README.md

@@ -39,6 +39,7 @@ If a list is given then choose one of the items. The first item in the list will
     color-picker-alpha="true, false"
     color-picker-swatch="true, false"
     color-picker-swatch-pos="'left', 'right'"
+    color-picker-swatch-bootstrap="true, false"
     color-picker-swatch-only="true, false"
     color-picker-pos="'bottom left', 'bottom right', 'top left', 'top right'"
     color-picker-case="'upper', 'lower'"

angularjs-color-picker.css

@@ -1,10 +1,10 @@
 /*!
- * angular-color-picker v0.4.0
+ * angular-color-picker v0.5.0
  * https://github.com/ruhley/angular-color-picker/
  *
  * Copyright 2015 ruhley
  *
- * 2015-05-28 13:06:45
+ * 2015-06-04 14:13:50
  *
  */
 (function() {
@@ -29,6 +29,7 @@
                 colorPickerSwatch: '=',
                 colorPickerSwatchOnly: '=',
                 colorPickerSwatchPos: '=',
+                colorPickerSwatchBootstrap: '='
             },
             templateUrl: 'template/color-picker/directive.html',
             link: function ($scope, element, attrs, control) {
@@ -66,6 +67,7 @@
                     $scope.config.swatch = $scope.colorPickerSwatch === undefined ? true : $scope.colorPickerSwatch;
                     $scope.config.swatchOnly = $scope.colorPickerSwatchOnly === undefined ? false : $scope.colorPickerSwatchOnly;
                     $scope.config.swatchPos = $scope.colorPickerSwatchPos === undefined ? 'left' : $scope.colorPickerSwatchPos;
+                    $scope.config.swatchBootstrap = $scope.colorPickerSwatchBootstrap === undefined ? true : $scope.colorPickerSwatchBootstrap;
                     $scope.log('Color Picker: Config', $scope.config);
                 };
 
@@ -205,7 +207,7 @@
                 );
 
                 $scope.$watchGroup(
-                    ['colorPickerSwatchPos', 'colorPickerSwatchOnly', 'colorPickerSwatch', 'colorPickerPos'],
+                    ['colorPickerSwatchPos', 'colorPickerSwatchBootstrap', 'colorPickerSwatchOnly', 'colorPickerSwatch', 'colorPickerPos'],
                     function (newValue, oldValue) {
                         if (newValue !== undefined) {
                             $scope.initConfig();
@@ -421,31 +423,37 @@
 })();
 
 angular.module('color.picker').run(['$templateCache', function($templateCache) {
-  $templateCache.put('template/color-picker/directive.html',
-    '<div class="color-picker-wrapper" ng-class="{\'color-picker-swatch-only\': config.swatchOnly}">\n' +
-    '   <input class="color-picker-input form-control" type="text" ng-model="ngModel" size="7" ng-focus="show()" ng-class="{\'color-picker-input-swatch\': config.swatch && !config.swatchOnly && config.swatchPos === \'left\'}">\n' +
-    '   <span class="color-picker-swatch" ng-click="focus()" ng-show="config.swatch" ng-class="{\'color-picker-swatch-left\': config.swatchPos !== \'right\', \'color-picker-swatch-right\': config.swatchPos === \'right\'}">\n' +
-    '       <span class="color-picker-swatch-color" style="background-color: {{swatchColor}};"></span>\n' +
-    '   </span>\n' +
-    '   <div class="color-picker-panel" ng-show="visible" ng-class="{\n' +
-    '       \'color-picker-panel-top color-picker-panel-right\': config.pos === \'top right\',\n' +
-    '       \'color-picker-panel-top color-picker-panel-left\': config.pos === \'top left\',\n' +
-    '       \'color-picker-panel-bottom color-picker-panel-right\': config.pos === \'bottom right\',\n' +
-    '       \'color-picker-panel-bottom color-picker-panel-left\': config.pos === \'bottom left\',\n' +
-    '   }">\n' +
-    '       <div class="color-picker-hue color-picker-sprite" ng-click="hueChange($event, true)" ng-mousemove="hueChange($event, false)" ng-mousedown="hueDown()" ng-mouseup="hueUp()">\n' +
-    '           <div class="color-picker-slider" style="top: {{huePos}}%;"></div>\n' +
-    '       </div>\n' +
-    '       <div class="color-picker-opacity color-picker-sprite" ng-show="config.alpha" ng-click="opacityChange($event, true)" ng-mousemove="opacityChange($event, false)" ng-mousedown="opacityDown()" ng-mouseup="opacityUp()">\n' +
-    '           <div class="color-picker-slider" style="top: {{opacityPos}}%;"></div>\n' +
-    '           </div>\n' +
-    '       <div class="color-picker-grid color-picker-sprite" style="background-color: {{grid}};" ng-click="colorChange($event, true)" ng-mousemove="colorChange($event, false)" ng-mousedown="colorDown()" ng-mouseup="colorUp()">\n' +
-    '           <div class="color-picker-grid-inner"></div>\n' +
-    '           <div class="color-picker-picker" style="top: {{lightnessPos}}%; left: {{saturationPos}}%;">\n' +
-    '               <div></div>\n' +
-    '           </div>\n' +
-    '       </div>\n' +
-    '   </div>\n' +
-    '</div>' +
-    '');
+    $templateCache.put('template/color-picker/directive.html',
+        '<div class="color-picker-wrapper" ng-class="{\'color-picker-swatch-only\': config.swatchOnly}">\n' +
+        '   <div ng-class="{\'input-group\': config.swatchBootstrap}">\n' +
+        '       <span ng-if="config.swatchPos === \'left\'" class="color-picker-swatch" ng-click="focus()" ng-show="config.swatch" ng-class="{\'color-picker-swatch-left\': config.swatchPos !== \'right\', \'color-picker-swatch-right\': config.swatchPos === \'right\', \'input-group-addon\': config.swatchBootstrap}">\n' +
+        '           <span class="color-picker-swatch-color" style="background-color: {{swatchColor}};"></span>\n' +
+        '       </span>\n' +
+        '       <input class="color-picker-input form-control" type="text" ng-model="ngModel" size="7" ng-focus="show()" ng-class="{\'color-picker-input-swatch\': config.swatch && !config.swatchOnly && config.swatchPos === \'left\'}">\n' +
+        '       <span ng-if="config.swatchPos === \'right\'" class="color-picker-swatch" ng-click="focus()" ng-show="config.swatch" ng-class="{\'color-picker-swatch-left\': config.swatchPos !== \'right\', \'color-picker-swatch-right\': config.swatchPos === \'right\', \'input-group-addon\': config.swatchBootstrap}">\n' +
+        '           <span class="color-picker-swatch-color" style="background-color: {{swatchColor}};"></span>\n' +
+        '       </span>\n' +
+        '   </div>\n' +
+        '   <div class="color-picker-panel" ng-show="visible" ng-class="{\n' +
+        '       \'color-picker-panel-top color-picker-panel-right\': config.pos === \'top right\',\n' +
+        '       \'color-picker-panel-top color-picker-panel-left\': config.pos === \'top left\',\n' +
+        '       \'color-picker-panel-bottom color-picker-panel-right\': config.pos === \'bottom right\',\n' +
+        '       \'color-picker-panel-bottom color-picker-panel-left\': config.pos === \'bottom left\',\n' +
+        '   }">\n' +
+        '       <div class="color-picker-hue color-picker-sprite" ng-click="hueChange($event, true)" ng-mousemove="hueChange($event, false)" ng-mousedown="hueDown()" ng-mouseup="hueUp()">\n' +
+        '           <div class="color-picker-slider" style="top: {{huePos}}%;"></div>\n' +
+        '       </div>\n' +
+        '       <div class="color-picker-opacity color-picker-sprite" ng-show="config.alpha" ng-click="opacityChange($event, true)" ng-mousemove="opacityChange($event, false)" ng-mousedown="opacityDown()" ng-mouseup="opacityUp()">\n' +
+        '           <div class="color-picker-slider" style="top: {{opacityPos}}%;"></div>\n' +
+        '           </div>\n' +
+        '       <div class="color-picker-grid color-picker-sprite" style="background-color: {{grid}};" ng-click="colorChange($event, true)" ng-mousemove="colorChange($event, false)" ng-mousedown="colorDown()" ng-mouseup="colorUp()">\n' +
+        '           <div class="color-picker-grid-inner"></div>\n' +
+        '           <div class="color-picker-picker" style="top: {{lightnessPos}}%; left: {{saturationPos}}%;">\n' +
+        '               <div></div>\n' +
+        '           </div>\n' +
+        '       </div>\n' +
+        '   </div>\n' +
+        '</div>'
+    );
+
 }]);