lsm/konva
1
0
Fork 0
mirror of https://github.com/konvajs/konva.git synced 2025-09-19 10:47:59 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Added rgb and rgba types

Browse Source 
Added some type guards
This commit is contained in:
Alexey Kalmakov
2019-10-05 23:52:08 +03:00
parent 8816aa5154
commit d5a6584c26
2 changed files with 24 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
src/Util.ts
View File

@@ -1,6 +1,6 @@
import { glob, Konva } from './Global'; import { glob, Konva } from './Global';
import { Node } from './Node'; import { Node } from './Node';
import { IRect } from './types'; import { IRect, RGB, RGBA } from './types';
export type Point = { export type Point = {
x: number; x: number;
@@ -500,7 +500,7 @@ export const Util = {
/* /*
* cherry-picked utilities from underscore.js * cherry-picked utilities from underscore.js
*/ */
_isElement(obj: any) { _isElement(obj: any): obj is Element {
return !!(obj && obj.nodeType == 1); return !!(obj && obj.nodeType == 1);
}, },
_isFunction(obj: any) { _isFunction(obj: any) {
@@ -512,21 +512,21 @@ export const Util = {
_isArray(obj: any) { _isArray(obj: any) {
return Object.prototype.toString.call(obj) === OBJECT_ARRAY; return Object.prototype.toString.call(obj) === OBJECT_ARRAY;
}, },
_isNumber(obj: any) { _isNumber(obj: any): obj is number {
return ( return (
Object.prototype.toString.call(obj) === OBJECT_NUMBER && Object.prototype.toString.call(obj) === OBJECT_NUMBER &&
!isNaN(obj) && !isNaN(obj) &&
isFinite(obj) isFinite(obj)
); );
}, },
_isString(obj: any) { _isString(obj: any): obj is string {
return Object.prototype.toString.call(obj) === OBJECT_STRING; return Object.prototype.toString.call(obj) === OBJECT_STRING;
}, },
_isBoolean(obj: any) { _isBoolean(obj: any): obj is boolean {
return Object.prototype.toString.call(obj) === OBJECT_BOOLEAN; return Object.prototype.toString.call(obj) === OBJECT_BOOLEAN;
}, },
// arrays are objects too // arrays are objects too
isObject(val: any) { isObject(val: any): val is Object {
return val instanceof Object; return val instanceof Object;
}, },
isValidSelector(selector: any) { isValidSelector(selector: any) {
@@ -616,7 +616,7 @@ export const Util = {
_rgbToHex(r: number, g: number, b: number) { _rgbToHex(r: number, g: number, b: number) {
return ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1); return ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);
}, },
_hexToRgb(hex: string) { _hexToRgb(hex: string): RGB {
hex = hex.replace(HASH, EMPTY_STRING); hex = hex.replace(HASH, EMPTY_STRING);
var bigint = parseInt(hex, 16); var bigint = parseInt(hex, 16);
return { return {
@@ -658,7 +658,7 @@ export const Util = {
* var rgb = Konva.Util.getRGB('#0000ff'); * var rgb = Konva.Util.getRGB('#0000ff');
* var rgb = Konva.Util.getRGB('rgb(0,0,255)'); * var rgb = Konva.Util.getRGB('rgb(0,0,255)');
*/ */
getRGB(color: string) { getRGB(color: string): RGB {
var rgb; var rgb;
// color string // color string
if (color in COLORS) { if (color in COLORS) {
@@ -690,7 +690,7 @@ export const Util = {
}, },
// convert any color string to RGBA object // convert any color string to RGBA object
// from https://github.com/component/color-parser // from https://github.com/component/color-parser
colorToRGBA(str: string) { colorToRGBA(str: string): RGBA {
str = str || 'black'; str = str || 'black';
return ( return (
Util._namedColorToRBA(str) || Util._namedColorToRBA(str) ||
@@ -715,7 +715,7 @@ export const Util = {
}; };
}, },
// Parse rgb(n, n, n) // Parse rgb(n, n, n)
_rgbColorToRGBA(str: string) { _rgbColorToRGBA(str: string): RGBA {
if (str.indexOf('rgb(') === 0) { if (str.indexOf('rgb(') === 0) {
str = str.match(/rgb\(([^)]+)\)/)[1]; str = str.match(/rgb\(([^)]+)\)/)[1];
var parts = str.split(/ *, */).map(Number); var parts = str.split(/ *, */).map(Number);
@@ -728,7 +728,7 @@ export const Util = {
} }
}, },
// Parse rgba(n, n, n, n) // Parse rgba(n, n, n, n)
_rgbaColorToRGBA(str: string) { _rgbaColorToRGBA(str: string): RGBA {
if (str.indexOf('rgba(') === 0) { if (str.indexOf('rgba(') === 0) {
str = str.match(/rgba\(([^)]+)\)/)[1]; str = str.match(/rgba\(([^)]+)\)/)[1];
var parts = str.split(/ *, */).map(Number); var parts = str.split(/ *, */).map(Number);
@@ -741,7 +741,7 @@ export const Util = {
} }
}, },
// Parse #nnnnnn // Parse #nnnnnn
_hex6ColorToRGBA(str: string) { _hex6ColorToRGBA(str: string): RGBA {
if (str[0] === '#' && str.length === 7) { if (str[0] === '#' && str.length === 7) {
return { return {
r: parseInt(str.slice(1, 3), 16), r: parseInt(str.slice(1, 3), 16),
@@ -752,7 +752,7 @@ export const Util = {
} }
}, },
// Parse #nnn // Parse #nnn
_hex3ColorToRGBA(str: string) { _hex3ColorToRGBA(str: string): RGBA {
if (str[0] === '#' && str.length === 4) { if (str[0] === '#' && str.length === 4) {
return { return {
r: parseInt(str[1] + str[1], 16), r: parseInt(str[1] + str[1], 16),
@@ -763,7 +763,7 @@ export const Util = {
} }
}, },
// Code adapted from https://github.com/Qix-/color-convert/blob/master/conversions.js#L244 // Code adapted from https://github.com/Qix-/color-convert/blob/master/conversions.js#L244
_hslColorToRGBA(str: string) { _hslColorToRGBA(str: string): RGBA {
// Check hsl() format // Check hsl() format
if (/hsl\((\d+),\s*([\d.]+)%,\s*([\d.]+)%\)/g.test(str)) { if (/hsl\((\d+),\s*([\d.]+)%,\s*([\d.]+)%\)/g.test(str)) {
// Extract h, s, l // Extract h, s, l

10
src/types.ts
View File

@@ -48,3 +48,13 @@ export enum KonvaNodeEvent {
dragmove = 'dragmove', dragmove = 'dragmove',
dragend = 'dragend' dragend = 'dragend'
} }
export interface RGB {
r: number;
g: number;
b: number;
}
export interface RGBA extends RGB {
a: number;
}