Skip to content

Commit 2dd0ba5

Browse files
ruhleyruhley
committed
Bumping to v0.6.2
1 parent c874f71 commit 2dd0ba5

File tree

7 files changed

+85
-79
lines changed

7 files changed

+85
-79
lines changed

‎angularjs-color-picker.css‎

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎angularjs-color-picker.js‎

Lines changed: 75 additions & 69 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
/*!
2-
* angular-color-picker v0.6.1
2+
* angular-color-picker v0.6.2
33
* https://github.com/ruhley/angular-color-picker/
44
*
55
* Copyright 2015 ruhley
66
*
7-
* 2015-06-25 14:06:20
7+
* 2015-06-26 11:33:27
88
*
99
*/
1010
(function() {
@@ -82,6 +82,10 @@
8282
$scope.hueMouse = false;
8383
$scope.opacityMouse = false;
8484
$scope.colorMouse = false;
85+
86+
// force the grid selection circle to redraw and fix its position
87+
$scope.saturationUpdate();
88+
$scope.lightnessUpdate();
8589
};
8690

8791
$scope.hide = function (apply) {
@@ -94,77 +98,63 @@
9498
};
9599

96100
$scope.update = function () {
97-
var color = tinycolor({h: $scope.hue, s: $scope.saturation / 100, v: $scope.lightness / 100}),
98-
colorString;
101+
if ($scope.hue !== undefined && $scope.saturation !== undefined && $scope.lightness !== undefined) {
102+
var color = tinycolor({h: $scope.hue, s: $scope.saturation / 100, v: $scope.lightness / 100}),
103+
colorString;
99104

100-
if ($scope.config.alpha) {
101-
color.setAlpha($scope.opacity / 100);
102-
}
105+
if ($scope.config.alpha) {
106+
color.setAlpha($scope.opacity / 100);
107+
}
103108

104-
$scope.log('Color Picker: COLOR CHANGED TO ', color, $scope.hue, $scope.saturation, $scope.lightness, $scope.opacity);
109+
$scope.log('Color Picker: COLOR CHANGED TO ', color, $scope.hue, $scope.saturation, $scope.lightness, $scope.opacity);
105110

106-
$scope.swatchColor = color.toHslString();
111+
$scope.swatchColor = color.toHslString();
107112

108-
switch ($scope.config.format) {
109-
case 'rgb':
110-
colorString = color.toRgbString();
111-
break;
113+
switch ($scope.config.format) {
114+
case 'rgb':
115+
colorString = color.toRgbString();
116+
break;
112117

113-
case 'hex':
114-
colorString = color.toHexString();
115-
if ($scope.config.case === 'lower') {
116-
colorString = colorString.toLowerCase();
117-
} else {
118-
colorString = colorString.toUpperCase();
119-
}
120-
break;
121-
122-
case 'hex8':
123-
colorString = color.toHex8String();
124-
if ($scope.config.case === 'lower') {
125-
colorString = colorString.toLowerCase();
126-
} else {
127-
colorString = colorString.toUpperCase();
128-
}
129-
break;
118+
case 'hex':
119+
colorString = color.toHexString();
120+
if ($scope.config.case === 'lower') {
121+
colorString = colorString.toLowerCase();
122+
} else {
123+
colorString = colorString.toUpperCase();
124+
}
125+
break;
126+
127+
case 'hex8':
128+
colorString = color.toHex8String();
129+
if ($scope.config.case === 'lower') {
130+
colorString = colorString.toLowerCase();
131+
} else {
132+
colorString = colorString.toUpperCase();
133+
}
134+
break;
130135

131-
case 'hsv':
132-
colorString = color.toHsvString();
133-
break;
136+
case 'hsv':
137+
colorString = color.toHsvString();
138+
break;
134139

135-
default:
136-
colorString = color.toHslString();
137-
break;
138-
}
140+
default:
141+
colorString = color.toHslString();
142+
break;
143+
}
139144

140-
$scope.ngModel = colorString;
145+
$scope.ngModel = colorString;
146+
}
141147
};
142148

143149
$scope.$watch('ngModel', function (newValue, oldValue) {
144-
if (newValue !== undefined && newValue !== oldValue) {
150+
if (newValue !== undefined && newValue !== oldValue && newValue.length > 4) {
145151
$scope.log('Color Picker: MODEL - CHANGED', newValue);
146152
var color = tinycolor(newValue);
147153

148154
if (color.isValid()) {
149155
var hsl = color.toHsv();
150156

151-
if (!$scope.isValid) {
152-
$scope.show();
153-
154-
$timeout(function() {
155-
$scope.hue = hsl.h;
156-
$scope.saturation = hsl.s * 100;
157-
$scope.lightness = hsl.v * 100;
158-
159-
if ($scope.config.alpha) {
160-
$scope.opacity = hsl.a * 100;
161-
}
162-
163-
if (oldValue === undefined) {
164-
$scope.hide();
165-
}
166-
});
167-
} else {
157+
if ($scope.isValid) {
168158
$scope.hue = hsl.h;
169159
$scope.saturation = hsl.s * 100;
170160
$scope.lightness = hsl.v * 100;
@@ -238,11 +228,11 @@
238228
}
239229
};
240230

241-
$scope.$watch('hue', function (newValue, oldValue) {
242-
if (newValue !== undefined) {
231+
$scope.hueUpdate = function() {
232+
if ($scope.hue !== undefined) {
243233
$scope.log('Color Picker: HUE - CHANGED');
244-
$scope.huePos = (1 - (newValue / 360)) * 100;
245-
$scope.grid = tinycolor({h: newValue, s: 100, v: 1}).toHslString();
234+
$scope.huePos = (1 - ($scope.hue / 360)) * 100;
235+
$scope.grid = tinycolor({h: $scope.hue, s: 100, v: 1}).toHslString();
246236

247237
if ($scope.huePos < 0) {
248238
$scope.huePos = 0;
@@ -252,6 +242,10 @@
252242

253243
$scope.update();
254244
}
245+
};
246+
247+
$scope.$watch('hue', function (newValue, oldValue) {
248+
$scope.hueUpdate();
255249
});
256250

257251
//---------------------------
@@ -275,10 +269,10 @@
275269
}
276270
};
277271

278-
$scope.$watch('opacity', function (newValue, oldValue) {
279-
if (newValue !== undefined) {
272+
$scope.opacityUpdate = function() {
273+
if ($scope.opacity !== undefined) {
280274
$scope.log('Color Picker: OPACITY - CHANGED');
281-
$scope.opacityPos = (1 - (newValue / 100)) * 100;
275+
$scope.opacityPos = (1 - ($scope.opacity / 100)) * 100;
282276

283277
if ($scope.opacityPos < 0) {
284278
$scope.opacityPos = 0;
@@ -288,6 +282,10 @@
288282

289283
$scope.update();
290284
}
285+
};
286+
287+
$scope.$watch('opacity', function (newValue, oldValue) {
288+
$scope.opacityUpdate();
291289
});
292290

293291
//---------------------------
@@ -312,10 +310,10 @@
312310
}
313311
};
314312

315-
$scope.$watch('saturation', function (newValue, oldValue) {
316-
if (newValue !== undefined && newValue !== oldValue) {
313+
$scope.saturationUpdate = function(oldValue) {
314+
if ($scope.saturation !== undefined && $scope.saturation !== oldValue) {
317315
$scope.log('Color Picker: SATURATION - CHANGED');
318-
$scope.saturationPos = (newValue / 100) * 100;
316+
$scope.saturationPos = ($scope.saturation / 100) * 100;
319317

320318
if ($scope.saturationPos < 0) {
321319
$scope.saturationPos = 0;
@@ -325,12 +323,16 @@
325323

326324
$scope.update();
327325
}
326+
};
327+
328+
$scope.$watch('saturation', function (newValue, oldValue) {
329+
$scope.saturationUpdate(oldValue);
328330
});
329331

330-
$scope.$watch('lightness', function (newValue, oldValue) {
331-
if (newValue !== undefined && newValue !== oldValue) {
332+
$scope.lightnessUpdate = function(oldValue) {
333+
if ($scope.lightness !== undefined && $scope.lightness !== oldValue) {
332334
$scope.log('Color Picker: LIGHTNESS - CHANGED');
333-
$scope.lightnessPos = (1 - (newValue / 100)) * 100;
335+
$scope.lightnessPos = (1 - ($scope.lightness / 100)) * 100;
334336

335337
if ($scope.lightnessPos < 0) {
336338
$scope.lightnessPos = 0;
@@ -340,6 +342,10 @@
340342

341343
$scope.update();
342344
}
345+
};
346+
347+
$scope.$watch('lightness', function (newValue, oldValue) {
348+
$scope.lightnessUpdate(oldValue);
343349
});
344350

345351

‎angularjs-color-picker.min.css‎

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎angularjs-color-picker.min.js‎

Lines changed: 3 additions & 3 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)