@stratiods/core
v1.5.3
Published
SDS Components :: Angular Core Services and Tools
Downloads
7
Readme
SDS Components :: Angular Core Services and Tools
Some help services, generic types, classes, pipes, etc.
Compatibility
Angular >= v.8.2.14
Installation
Run npm install @stratiods/core
or
run yarn add @stratiods/core
.
Services Use
You need to declare BoxModelService
, EventsService
and/or ToolService
providers into your module providers
section.
Then you can use methods through dependency injection. Some methods are available as static.
Available Services
BoxModelService
Set of methods to make box model task easy:
public readCssUnits(expression: string): ProcessedUnitObject
This method transforms unit string
ex. '20px'
into an object
{ value: 20, unit: 'px' }
.Units allowed are: 'px' and '%'.
public processSizeString(sizeString: string): SizeObject
This method transforms size string
ex. '20px 50px'
into an object
{ width: 50, height: 20 }
.Size strings allowed are: 'XXpx', 'XX%', 'XXpx YYpx', 'XX% YY%'.
public getElement(element: string | SelectDomElementObject): Element
Receives string or SelectDomElementObject:
ex. { name: 'some_class', type: 'class' }
.And returns DOM Element for your selection. If method receives string, it will assume that type is
class
by default.Types allowed: 'class', 'tag', 'id'.
public getBoxModel(elementId: ElementId, boxModelType?: BoxModelType): BoxModelSwapObject
Receives ElementId complex data and returns analysis object about box model of this ElementId.
ElementId can be: string or array of strings (In this case we assume the type is class). ElementId can be: SelectDomElementObject or array of SelectDomElementObject. SelectDomElementObject works like previous method explains. Optional parameter boxModelType can be: 'horizontal' or 'vertical'. Default value is 'vertical'.
The returned object, BoxModelSwapObject, has the next form:
{ type: BoxModelType, // ('horizontal' or 'vertical'). boxModel: number, // Width or Height (depends on type) of element id, or the addition of all element id's widths or heights if elementId received is array. boxModelAdditions: number, // Width or Height (depends on type) of element id additions. // Additions are paddings, margins and borders. boxModelAggregated: number, // The sum of boxModel and boxModelAdditions. boxModelExtracted: number // The substraction of boxModelAdditions from boxModel. }
EventsService
Set of methods about DOM events handlers:
public preventNeededEvent(event: Event, immediatePropagation?: boolean): void
This method receives any kind of DOM Event and boolean parameter which indicates if method applies
event.stopPropagation()
orevent.stopImmediatePropagation()
.
public preventNoNeededEvent(event: Event, immediatePropagation?: boolean): void
This method works in the same way than the previous one and also executes
event.preventDefault()
method.
public scrollTop(element?: SelectDomElementObject): void
Moves vertical scroll of the element given to top. Element has the form of SelectDomElementObject:
{ name: string, type: SelectDomElementObjectType }
Property
name
is some element name identifier.Property
type
only can be:tag
,class
orid
.If element is not given, de default will be:
{ name: 'main', type: 'tag' }
ToolService
Several help parameters and methods:
public static readonly PATTERNS = { FLOAT: { GREATER_THAN_0_LOWER_THAN_1: '^(0|0+(\.[0-9]{1,2})|1*)$', GREATER_THAN_0COMMA1_LOWER_THAN_1: '^(0+(\.[1-9]{1,2})|1*)$', }, NUMBER: '^(0|[1-9][0-9]*)$' };
Static parameter width some predefined regular expressions to use as patterns.
public months: Array<string> = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
Array parameter defining three letters months to use in several dates use.
public static readonly PATTERNS = { FLOAT: { GREATER_THAN_0_LOWER_THAN_1: '^(0|0+(\.[0-9]{1,2})|1*)$', GREATER_THAN_0COMMA1_LOWER_THAN_1: '^(0+(\.[1-9]{1,2})|1*)$', }, NUMBER: '^(0|[1-9][0-9]*)$' };
Static parameter width some predefined regular expressions to use as patterns.
public static getValueFromMultiLevelObject(object: any, key: string, separator?: string): any
This method uses a reducer to check inside the multi-level
object
given and finds the value forkey
given.Parameter
key
is a string where levels are indicated using an optionalseparator
character.If
separator
is not given, default separator will be the dot character:.
Example:
const person = { name: 'John Black', age: 43, sons: { kevin: { name: 'Kevin Black', age: 15 }, mary: { name: 'Mary Black', age: 11 } } } const key = 'sons.kevin.age'; const kevinAge = ToolsService.getValueFromMultiLevelObject(person, key);
Variable
kevinAge
will be15
.
public static formatString(string: string): string
Transforms string into start case string.
public static waitFor(milliseconds: number): void
Stops the execution flow during
milliseconds
given.
public identifier(index: number, item: any): any
This method is for use in
trackBy
in *ngFor directives.
Repo
https://github.com/stratio-design/sds-components/tree/master/projects/core