File

projects/i-components/src/lib/components/rad-ribbon-toggle-button/rad-ribbon-toggle-button.component.ts

Description

Angular Component for the RadRibbonToggle Control.

Extends

BaseRadRibbonButtonComponent

Implements

OnInit RibbonComponentData

Metadata

changeDetection	`ChangeDetectionStrategy.OnPush`
providers	`{ provide: D_COMPATIBLE_COMPONENT, useExisting: RadRibbonToggleButtonComponent, }`
selector	`wm-rad-ribbon-toggle-button`
styleUrls	`./rad-ribbon-toggle-button.component.scss`
templateUrl	`./rad-ribbon-toggle-button.component.html`

Index

Constructor

Public constructor(injectedModel: RadRibbonToggleButtonModel, injector: Injector, cdRef: ChangeDetectorRef)

Defined in projects/i-components/src/lib/components/rad-ribbon-toggle-button/rad-ribbon-toggle-button.component.ts:78

Creates an instance of RadRibbonToggleComponent.

Parameters :

Name	Type	Optional
injectedModel	`RadRibbonToggleButtonModel`	No
injector	`Injector`	No
cdRef	`ChangeDetectorRef`	No

Inputs

model
Type : `RadRibbonToggleButtonModel`
Defined in projects/i-components/src/lib/components/rad-ribbon-toggle-button/rad-ribbon-toggle-button.component.ts:69
RadRibbonToggleButtonModel.

largeImage
Type : `any`
Inherited from `BaseRadRibbonButtonComponent`
Defined in `BaseRadRibbonButtonComponent:121`
Sets largeImage

size
Type : `string`
Inherited from `BaseRadRibbonButtonComponent`
Defined in `BaseRadRibbonButtonComponent:62`
Sets size

controlTemplate
Type : `any`
Inherited from `BaseComponent`
Defined in `BaseComponent:1197`
Sets the controlTemplate Input property for changing the model's `TemplateProperty`

cursor
Inherited from `BaseComponent`
Defined in `BaseComponent:1451`
Property used to save the cursor value

dataContext
Type : `any`
Inherited from `BaseComponent`
Defined in `BaseComponent:952`
Gets/sets the dataContext Input property for changing the model's `DataContextProperty`

dataGridRowHeight
Type : `number`
Default value : `22`
Inherited from `BaseComponent`
Defined in `BaseComponent:507`
Represents the row height of both the DataGrid and XamGrid components it affects the css and also an internal function that virtualized data, so do not change directly on css, use this variable instead.

foreground
Type : `any`
Inherited from `BaseComponent`
Defined in `BaseComponent:1223`
Sets the value of the Foreground property

height
Inherited from `BaseComponent`
Defined in `BaseComponent:1394`
Sets the height

horizontalAlignment
Inherited from `BaseComponent`
Defined in `BaseComponent:1096`
Sets the horizontal alignment.

horizontalContentAlignment
Inherited from `BaseComponent`
Defined in `BaseComponent:1125`
Sets the horizontal content alignment.

hostHozSelfAlign
Type : `boolean`
Default value : `false`
Inherited from `BaseComponent`
Defined in `BaseComponent:380`
Applies horizontal selfalign class. Flags indicates when the control should handle its own horizontal alignment and ignore container alignment.

isEnabled
Inherited from `BaseComponent`
Defined in `BaseComponent:1008`
Gets/sets the isEnabled property for the BaseComponent

isTabStop
Type : `boolean`
Inherited from `BaseComponent`
Defined in `BaseComponent:760`
Sets/gets IsTabStop property of the BaseComponent

margin
Type : `string`
Inherited from `BaseComponent`
Defined in `BaseComponent:782`
Sets Margin property of the BaseComponent.

maxHeight
Type : `any`
Inherited from `BaseComponent`
Defined in `BaseComponent:1325`
Sets maxHeight

maxWidth
Type : `any`
Inherited from `BaseComponent`
Defined in `BaseComponent:1283`
Sets maxWidth

minHeight
Type : `any`
Inherited from `BaseComponent`
Defined in `BaseComponent:1304`
Sets minHeight

minWidth
Type : `any`
Inherited from `BaseComponent`
Defined in `BaseComponent:1262`
Sets min Width

name
Type : `string`
Inherited from `BaseComponent`
Defined in `BaseComponent:1153`
Sets the name model property for the control when the name is an input

opacity
Inherited from `BaseComponent`
Defined in `BaseComponent:1336`
Sets Opacity value property of the component

spellCheck
Type : `boolean`
Default value : `false`
Inherited from `BaseComponent`
Defined in `BaseComponent:186`
Flag to determinate if the component should do the spell check or not. Default value is false.

style
Inherited from `BaseComponent`
Defined in `BaseComponent:1434`
Sets the style

tabIndex
Type : `number`
Inherited from `BaseComponent`
Defined in `BaseComponent:733`
Sets the property TabIndex of the control model.

tag
Type : `any`
Inherited from `BaseComponent`
Defined in `BaseComponent:1171`
Object used in the Tag property of the Button

useCss
Type : `boolean`
Default value : `false`
Inherited from `BaseComponent`
Defined in `BaseComponent:177`
Determines if the component uses CSS height/width values, instead of inputs

verticalAlignment
Inherited from `BaseComponent`
Defined in `BaseComponent:1038`
Sets the vertical alignment.

verticalContentAlignment
Inherited from `BaseComponent`
Defined in `BaseComponent:1067`
Sets the vertical content alignment.

visibility
Type : `any`
Inherited from `BaseComponent`
Defined in `BaseComponent:980`
Gets/sets the visibility property for the BaseComponent

width
Inherited from `BaseComponent`
Defined in `BaseComponent:1365`
Sets the width

zindex
Type : `number`
Inherited from `BaseComponent`
Defined in `BaseComponent:1498`
Property used to set the canvas zindex value. Note: Consider moving this @Input to canvas.direcive.ts, refactoring the directive so all inputs are declared in the directive, and all @HostBindings are declared here in baseComponent, the directive would be responsible for updating the models, while baseComponent will be responsible for binding the values: zIndex, Top, Left...

Outputs

bindingValidationError
Type : `EventEmitter<any>`
Inherited from `BaseComponent`
Defined in `BaseComponent:114`
output to emit the new value of the bindingValidationError event

layoutUpdated
Type : `EventEmitter<any>`
Inherited from `BaseComponent`
Defined in `BaseComponent:140`
Output to emit when then component's layout is updated.

loaded
Type : `EventEmitter<any>`
Inherited from `BaseComponent`
Defined in `BaseComponent:123`
Output to emit when then component is loaded.

mouseEnter
Type : `EventEmitter<literal type>`
Inherited from `BaseComponent`
Defined in `BaseComponent:157`
Event Emitter. EventEmitter normally called in the mouseEnterHandler.

mouseLeave
Type : `EventEmitter<literal type>`
Inherited from `BaseComponent`
Defined in `BaseComponent:167`
Event Emitter Called in the mouseLeave handler

mouseLeftButtonUp
Type : `EventEmitter<literal type>`
Inherited from `BaseComponent`
Defined in `BaseComponent:147`
MouseLeftButtonUp event Emitter.

sizeChanged
Type : `EventEmitter<any>`
Inherited from `BaseComponent`
Defined in `BaseComponent:132`
Output to emit when then component size is changed.

HostBindings

class

Type : string

Default value : null

Inherited from BaseComponent

Defined in BaseComponent:407

Applies custom CSS classes

class.defaultFontStyles

Type : boolean

Default value : false

Inherited from BaseComponent

Defined in BaseComponent:398

Applies default font styles class, used to allow specificity for each control css

class.focusable

Type : boolean

Default value : false

Inherited from BaseComponent

Defined in BaseComponent:388

Display if the component is focusable or not

class.hasDefinedCursor

Type : boolean

Default value : false

Inherited from BaseComponent

Defined in BaseComponent:415

Applies Defined Cursor class

class.horizontal-center

Type : boolean

Default value : false

Inherited from BaseComponent

Defined in BaseComponent:308

Applies horizontal alignment left class

class.horizontal-left

Type : boolean

Default value : false

Inherited from BaseComponent

Defined in BaseComponent:298

Applies horizontal alignment left class

class.horizontal-right

Type : boolean

Default value : false

Inherited from BaseComponent

Defined in BaseComponent:368

Applies horizontal alignment right class

class.horizontal-stretch

Type : boolean

Default value : false

Inherited from BaseComponent

Defined in BaseComponent:358

Applies horizontal alignment stretch class

class.vertical-bottom

Type : boolean

Default value : false

Inherited from BaseComponent

Defined in BaseComponent:328

Applies vertical alignment bottom class

class.vertical-center

Type : boolean

Default value : false

Inherited from BaseComponent

Defined in BaseComponent:338

Applies vertical alignment center class

class.vertical-stretch

Type : boolean

Default value : false

Inherited from BaseComponent

Defined in BaseComponent:318

Applies horizontal alignment stretch class

class.vertical-top

Type : boolean

Default value : false

Inherited from BaseComponent

Defined in BaseComponent:348

Applies vertical alignment top class

style.display

Type : any

Default value : null

Inherited from BaseComponent

Defined in BaseComponent:243

Property use it to apply the host binding for the visibility

style.font-family

Type : any

Default value : null

Inherited from BaseComponent

Defined in BaseComponent:261

Property use it to apply the host binding for the font-family

style.font-size

Type : any

Default value : null

Inherited from BaseComponent

Defined in BaseComponent:270

Property use it to apply the host binding for the font-size

style.font-style

Type : any

Default value : null

Inherited from BaseComponent

Defined in BaseComponent:279

Property use it to apply the host binding for the font-style

style.font-weight

Type : any

Default value : null

Inherited from BaseComponent

Defined in BaseComponent:288

Property use it to apply the host binding for the font-weight

style.height

Type : string

Default value : null

Inherited from BaseComponent

Defined in BaseComponent:218

Property use it to apply the host binding for the height

style.max-height.px

Type : number

Inherited from BaseComponent

Defined in BaseComponent:234

Property used to apply the host binding for max-height

style.max-width.px

Type : number

Inherited from BaseComponent

Defined in BaseComponent:210

Property used to apply the host binding for max-width

style.min-height.px

Type : number

Inherited from BaseComponent

Defined in BaseComponent:226

Property used to apply the host binding for min-height

style.min-width.px

Type : number

Inherited from BaseComponent

Defined in BaseComponent:202

Property used to apply the host binding for min-width

style.opacity

Type : any

Default value : null

Inherited from BaseComponent

Defined in BaseComponent:252

Property use it to apply the host binding for the opacity

style.width

Type : string

Default value : null

Inherited from BaseComponent

Defined in BaseComponent:194

Property use it to apply the host binding for the width

style.z-index

Type : string

Default value : null

Inherited from BaseComponent

Defined in BaseComponent:424

Sets the z-index style.

Methods

clickHandler

clickHandler(event: any)

Decorators :

@stopEventPropagation()

Defined in projects/i-components/src/lib/components/rad-ribbon-toggle-button/rad-ribbon-toggle-button.component.ts:103

Click handler Event

Parameters :

Name	Type	Optional
event	`any`	No

Returns : void

Protected getLargeImageProperty

getLargeImageProperty()

Inherited from BaseRadRibbonButtonComponent

Defined in BaseRadRibbonButtonComponent:140

Returns the large image property for this control

Returns : DependencyProperty

{DependencyProperty}

ngclassFunction

ngclassFunction()

Inherited from BaseRadRibbonButtonComponent

Defined in BaseRadRibbonButtonComponent:125

Apply class

Returns : string

{string}

ngOnInit

ngOnInit()

Inherited from BaseComponent

Defined in BaseComponent:112

Angular lifecycle hook. Rad ribbon button onInit

Returns : void

Protected alignmentHandler

alignmentHandler()

Inherited from BaseComponent

Defined in BaseComponent:2346

Calculate the values for the grid size behavior from the alignments

Returns : void

Protected assignPendingPropertyValues

assignPendingPropertyValues()

Inherited from BaseComponent

Defined in BaseComponent:2057

Apply pending assignments to properties with property values

Returns : void

calculateActualSize

calculateActualSize(name?: string)

Inherited from BaseComponent

Defined in BaseComponent:1674

If the name is equal to 'calculateActualSize', then call the handlerCalcActualSize function and pass in false to avoid the timer in the function.

memberof BaseComponent

Parameters :

Name	Type	Optional	Description
name	`string`	Yes	The name of the event. memberof BaseComponent

Returns : void

Protected checkAndRegisterCompatibilityBinding

checkAndRegisterCompatibilityBinding(property: DependencyProperty, bindingObjectCandidate: any)

Inherited from BaseComponent

Defined in BaseComponent:2023

Verifies if the given object (bindingObjectCandidate) is a binding object. If so the binding will be registered.

Parameters :

Name	Type	Optional
property	`DependencyProperty`	No
bindingObjectCandidate	`any`	No

Returns : boolean

{boolean} true if the value is a binding info object and if the binding was registered, false if not

Protected checkForStaticResource

checkForStaticResource(property: string, value: any)

Inherited from BaseComponent

Defined in BaseComponent:2043

Checks if the given value is a static resource reference or not, if a reference then the value is queue for later assignment.

Parameters :

Name	Type	Optional	Description
property	`string`	No	the name of the property to check for
value	`any`	No	the property value

Returns : boolean

true if the value is a static resource reference, otherwise false

checkStaticItemInModelCollection

checkStaticItemInModelCollection(collection: any, itemToCheck: any)

Inherited from BaseComponent

Defined in BaseComponent:1889

Checks if the element exists previously in the items collection

Parameters :

Name	Type	Optional	Description
collection	`any`	No	The control items collection
itemToCheck	`any`	No	The static element to be reviewed

Returns : number

number Returns -1 if the item is not present in the items collection otherwise the index value

createElementInRoot

createElementInRoot(injector: Injector, componentToCreate: any)

Inherited from BaseComponent

Defined in BaseComponent:2698

Create a given component on the HTML body.

Parameters :

Name	Type	Optional
injector	`Injector`	No
componentToCreate	`any`	No

Returns : ComponentRef<any>

cursorStyle

cursorStyle()

Inherited from BaseComponent

Defined in BaseComponent:1549

Returns the correct CSS cursor style and sets the definedCursor flag if necessary

Returns : string

{string}

detectChanges

detectChanges()

Inherited from BaseComponent

Defined in BaseComponent:813

Performs a single detect Changes over the component

Returns : void

detectChangesAction

detectChangesAction()

Inherited from BaseComponent

Defined in BaseComponent:1686

Handle subscription to the notifyDetectChanges action Refresh the component whenever a model modification was performed

Returns : void

getForeground

getForeground()

Inherited from BaseComponent

Defined in BaseComponent:1966

Calculates the Foreground color to be applied

Returns : string

string

getImageString

getImageString(value: any)

Inherited from BaseComponent

Defined in BaseComponent:2221

Returns string path to the image.

Parameters :

Name	Type	Optional
value	`any`	No

Returns : any

getTargetValue

getTargetValue(e: Event)

Inherited from BaseComponent

Defined in BaseComponent:2239

Returns the value from a $event

Parameters :

Name	Type	Optional
e	`Event`	No

Returns : string

Protected handlerCalcActualSize

handlerCalcActualSize(async: boolean)

Inherited from BaseComponent

Defined in BaseComponent:2391

Handler that calculates ActualHeight & ActualWidth based on its inner content.

Parameters :

Name	Type	Optional
async	`boolean`	No

Returns : void

heightCalc

heightCalc()

Inherited from BaseComponent

Defined in BaseComponent:1939

Applies the height CSS value

Returns : any

heightDefaultStyle

heightDefaultStyle()

Inherited from BaseComponent

Defined in BaseComponent:1914

Calculates the auto height value

Returns : string

{string}

Protected hostHorizontalAlignmentCall

hostHorizontalAlignmentCall()

Inherited from BaseComponent

Defined in BaseComponent:2374

Assign all the horizontal bindings for the control

Returns : void

Protected hostVerticalAlignmentCall

hostVerticalAlignmentCall()

Inherited from BaseComponent

Defined in BaseComponent:2357

Assign all the vertical bindings for the control

Returns : void

imageToPath

imageToPath(value: any)

Inherited from BaseComponent

Defined in BaseComponent:2202

Returns the path of the given image.

Parameters :

Name	Type	Optional
value	`any`	No

Returns : any

loadStaticItems

loadStaticItems(staticItems: any, itemsCollection: any)

Inherited from BaseComponent

Defined in BaseComponent:1634

Parameters :

Name	Type	Optional	Description
staticItems	`any`	No	The static elements to be added
itemsCollection	`any`	No	The control items collection

Returns : void

void

Private markForCheckComp

markForCheckComp()

Inherited from BaseComponent

Defined in BaseComponent:2451

Marks current component

Returns : void

modelChangeHandler

modelChangeHandler(name?: string)

Inherited from BaseComponent

Defined in BaseComponent:1650

Method to handle the model's change

Parameters :

Name	Type	Optional	Description
name	`string`	Yes	property name that change

Returns : void

mouseEnterHandler

mouseEnterHandler(event: any)

Inherited from BaseComponent

Defined in BaseComponent:1982

Event Handler for when the mouse enter the Image component.

Parameters :

Name	Type	Optional	Description
event	`any`	No	event from the DOM event

Returns : void

mouseLeaveHandler

mouseLeaveHandler(event: any)

Inherited from BaseComponent

Defined in BaseComponent:2001

Event Handler for when the mouse enter the Image component.

Parameters :

Name	Type	Optional	Description
event	`any`	No	event from the DOM event

Returns : void

Public ngAfterContentChecked

ngAfterContentChecked()

Inherited from BaseComponent

Defined in BaseComponent:867

Angular Lifecycle Hooks

Returns : void

Public ngAfterContentInit

ngAfterContentInit()

Inherited from BaseComponent

Defined in BaseComponent:857

Angular Lifecycle Hooks

Returns : void

Public ngAfterViewChecked

ngAfterViewChecked()

Inherited from BaseComponent

Defined in BaseComponent:893

Angular Lifecycle Hooks

Returns : void

Public ngAfterViewInit

ngAfterViewInit()

Inherited from BaseComponent

Defined in BaseComponent:877

Angular Lifecycle Hooks

Returns : void

Public ngDoCheck

ngDoCheck()

Inherited from BaseComponent

Defined in BaseComponent:847

Angular Lifecycle Hooks

Returns : void

Public ngOnChanges

ngOnChanges()

Inherited from BaseComponent

Defined in BaseComponent:824

Angular Lifecycle Hooks

Returns : void

Public ngOnDestroy

ngOnDestroy()

Inherited from BaseComponent

Defined in BaseComponent:906

Cleanup operations for base component

Returns : void

preventItemsDuplication

preventItemsDuplication(itemsToRender: any, items: any, contentChildTemplate: any, afterContentInitCalled: boolean, injector: Injector)

Inherited from BaseComponent

Defined in BaseComponent:2170

Validates if coming models are the same, and prevents to be recreated on Ribbon DOM. (Needs to be checked, in some statics scenarios RibbonTab, RibbonGroup duplicates items)

Parameters :

Name	Type	Optional
itemsToRender	`any`	No
items	`any`	No
contentChildTemplate	`any`	No
afterContentInitCalled	`boolean`	No
injector	`Injector`	No

Returns : any[]

processAlignments

processAlignments(name: string)

Inherited from BaseComponent

Defined in BaseComponent:1704

Method to check if the component should assign a alignment property

Parameters :

Name	Type	Optional
name	`string`	No

Returns : void

{void}

processCursor

processCursor(name: string)

Inherited from BaseComponent

Defined in BaseComponent:1850

Method to set the cursor style of the component

Parameters :

Name	Type	Optional
name	`string`	No

Returns : void

processCustomCssClasses

processCustomCssClasses(name: string)

Inherited from BaseComponent

Defined in BaseComponent:1723

Method to set custom CSS Clases

Parameters :

Name	Type	Optional
name	`string`	No

Returns : void

{void}

processFocusable

processFocusable(name: string)

Inherited from BaseComponent

Defined in BaseComponent:1816

Method to check and set the height of the grid

Parameters :

Name	Type	Optional
name	`string`	No

Returns : void

Private processFontFamily

processFontFamily(name: string)

Inherited from BaseComponent

Defined in BaseComponent:2784

Process the FontFamily property

Parameters :

Name	Type	Optional
name	`string`	No

Returns : any

processFonts

processFonts(name: string)

Inherited from BaseComponent

Defined in BaseComponent:1778

Method to apply the font styles for the component.

Parameters :

Name	Type	Optional
name	`string`	No

Returns : void

Private processFontSize

processFontSize(name: string)

Inherited from BaseComponent

Defined in BaseComponent:2798

Process the FontSize property

Parameters :

Name	Type	Optional
name	`string`	No

Returns : any

Private processFontStyle

processFontStyle(name: string)

Inherited from BaseComponent

Defined in BaseComponent:2815

Process the FontStyle property

Parameters :

Name	Type	Optional
name	`string`	No

Returns : any

Private processFontWeight

processFontWeight(name: string)

Inherited from BaseComponent

Defined in BaseComponent:2832

Process the FontWeight property

Parameters :

Name	Type	Optional
name	`string`	No

Returns : any

processHeights

processHeights(name: string)

Inherited from BaseComponent

Defined in BaseComponent:1797

Method to check and set the height of the grid

Parameters :

Name	Type	Optional
name	`string`	No

Returns : void

processIsEnabled

processIsEnabled(name: string)

Inherited from BaseComponent

Defined in BaseComponent:1764

Process changes to IsEnabled property.

Parameters :

Name	Type	Optional
name	`string`	No

Returns : void

processOpacity

processOpacity(name: string)

Inherited from BaseComponent

Defined in BaseComponent:1751

Method to apply the opacity for the component.

Parameters :

Name	Type	Optional
name	`string`	No

Returns : void

processVisibility

processVisibility(name: string)

Inherited from BaseComponent

Defined in BaseComponent:1737

Method to check if the component should be show or hide.

Parameters :

Name	Type	Optional
name	`string`	No

Returns : void

processWidths

processWidths(name: string)

Inherited from BaseComponent

Defined in BaseComponent:1829

Method to check and set the width of the grid

Parameters :

Name	Type	Optional
name	`string`	No

Returns : void

Private processZIndex

processZIndex(name: string)

Inherited from BaseComponent

Defined in BaseComponent:1872

Method to process the ZIndex when set through the model

Parameters :

Name	Type	Optional
name	`string`	No

Returns : void

Private recreateInvalidBindings

recreateInvalidBindings()

Inherited from BaseComponent

Defined in BaseComponent:2756

Execution of removeModelProxyHandlers in a previous instance of the component (that used the same model) could have set some bindings in an invalid state, this will check if some of them has to be recreated

Returns : void

Private registerContextMenuActions

registerContextMenuActions(ctxMenu: ContextMenuManager)

Inherited from BaseComponent

Defined in BaseComponent:2533

Enable the contextMenu actions to be displayed when the user perform an action Creates dinamically a new instance of XamContextMenu to be displayed in the screen

Parameters :

Name	Type	Optional
ctxMenu	`ContextMenuManager`	No

Returns : void

Protected registerDomEventListenerOnElement

registerDomEventListenerOnElement(eventName: string, handler: any)

Inherited from BaseComponent

Defined in BaseComponent:2316

Registers a DOM handler on the current element

Parameters :

Name	Type	Optional
eventName	`string`	No
handler	`any`	No

Returns : void

Protected registerHandler

registerHandler(event: SubscriptionEvent<void>, arrowHandler: (s: any,a: any) => void)

Inherited from BaseComponent

Defined in BaseComponent:2298

Parameters :

Name	Type	Optional
event	`SubscriptionEvent<void>`	No
arrowHandler	`function`	No

Returns : void

Protected registerMouseEvents

registerMouseEvents()

Inherited from BaseComponent

Defined in BaseComponent:2272

Registers mouse events if required

Returns : void

Protected registerObservers

registerObservers(emitter: EventEmitter, model: FrameworkElement, event: SubscriptionEvent<void>)

Inherited from BaseComponent

Defined in BaseComponent:2252

Parameters :

Name	Type	Optional
emitter	`EventEmitter<any>`	No
model	`FrameworkElement`	No
event	`SubscriptionEvent<void>`	No

Returns : void

Private registerToolTip

registerToolTip(element: ElementRef, tooltip: ToolTipModel)

Inherited from BaseComponent

Defined in BaseComponent:2607

Registers a tooltip to a component

Parameters :

Name	Type	Optional
element	`ElementRef<any>`	No
tooltip	`ToolTipModel`	No

Returns : void

Private removeModelProxyHandlers

removeModelProxyHandlers()

Inherited from BaseComponent

Defined in BaseComponent:2738

Clean up the handlers when the component is destroyed

Returns : void

Private setComponentForDirectives

setComponentForDirectives()

Inherited from BaseComponent

Defined in BaseComponent:2512

Sets an internal reference through the element ref to access the component in a directive

Returns : void

Protected setPendingPropertyValue

setPendingPropertyValue(property: string, value: any)

Inherited from BaseComponent

Defined in BaseComponent:2336

Stores the pending property values for instance attach properties. Which will be applied when the model is available

Parameters :

Name	Type	Optional
property	`string`	No
value	`any`	No

Returns : void

setupDependencyComponents

setupDependencyComponents(model: FrameworkElement)

Inherited from BaseComponent

Defined in BaseComponent:1612

Adds the references to the dependency components

Parameters :

Name	Type	Optional
model	`FrameworkElement`	No

Returns : void

setupModel

setupModel(model: FrameworkElement)

Inherited from BaseComponent

Defined in BaseComponent:1559

Syncs the modelProxy with model

Parameters :

Name	Type	Optional
model	`FrameworkElement`	No

Returns : void

void

Private syncToolTip

syncToolTip(tooltip: ToolTipModel)

Inherited from BaseComponent

Defined in BaseComponent:2587

Updates the tooltip associated to a component

Parameters :

Name	Type	Optional
tooltip	`ToolTipModel`	No

Returns : void

Private syncValidationError

syncValidationError(name?: string)

Inherited from BaseComponent

Defined in BaseComponent:2766

Syncs validation information with component properties

Parameters :

Name	Type	Optional
name	`string`	Yes

Returns : void

Private tabSelectionSubscription

tabSelectionSubscription()

Inherited from BaseComponent

Defined in BaseComponent:2471

Subscribe to the tabhandler event if Required When the component is inside a tab control it should trigger the load event every time the tab is selected

Returns : void

trackByFn

trackByFn(index: any, item: any)

Inherited from BaseComponent

Defined in BaseComponent:1904

Function used by Angular to track elements in the ngFor directive. We use the GUID property to compare elements.

Parameters :

Name	Type	Optional	Description
index	`any`	No	index of the array
item	`any`	No	item of the array

Returns : any

{*} -return the model or object itself

Private unregisterToolTip

unregisterToolTip(element: ElementRef)

Inherited from BaseComponent

Defined in BaseComponent:2719

Unregisters a tooltip to a component

Parameters :

Name	Type	Optional
element	`ElementRef<any>`	No

Returns : void

Private updateSizePropertiesForActualSizeChange

updateSizePropertiesForActualSizeChange(element: Element)

Inherited from BaseComponent

Defined in BaseComponent:2421

Updates the size properties of the component based on the initial size change

Parameters :

Name	Type	Optional	Description
element	`Element`	No	HTML element

Returns : void

validatesLoadingFlag

validatesLoadingFlag()

Inherited from BaseComponent

Defined in BaseComponent:1519

Validates loading flag for components outside current tab index TabIndexService should be only tabItem provider, and when currentTabId is different from selectedTab IsFirstTimeLoad is set to false because tabService is going to be one in charge to trigger only one time when tab changes.

Returns : void

widthCalc

widthCalc()

Inherited from BaseComponent

Defined in BaseComponent:1953

Applies the width CSS value

Returns : any

widthDefaultStyle

widthDefaultStyle()

Inherited from BaseComponent

Defined in BaseComponent:1926

Calculates the auto width value

Returns : string

{string}

Properties

Public model

Type : RadRibbonToggleButtonModel

Decorators :


                            @Input()

Inherited from BaseRadRibbonButtonComponent

Defined in BaseRadRibbonButtonComponent:69

RadRibbonToggleButtonModel.

modelProxy

Type : RadRibbonToggleButtonModel

Default value : ModelProxy.create<RadRibbonToggleButtonModel>()

Inherited from BaseComponent

Defined in BaseComponent:77

Model copy RadRibbonToggleModel

Public sizeButtonClass

Type : string

Inherited from BaseRadRibbonButtonComponent

Defined in BaseRadRibbonButtonComponent:55

SizeClassTo apply on button.

actualSizeCalled

Default value : false

Inherited from BaseComponent

Defined in BaseComponent:481

Flag to know if the Angular event was called

afterContentInitCalled

Default value : false

Inherited from BaseComponent

Defined in BaseComponent:465

Flag to know if the Angular event was called

afterViewCheckedCalled

Default value : false

Inherited from BaseComponent

Defined in BaseComponent:473

Flag to know if the Angular event was called

afterViewInitCalled

Default value : false

Inherited from BaseComponent

Defined in BaseComponent:457

Flag to know if the Angular event was called

Private bindingValidationCallback

Type : function

Inherited from BaseComponent

Defined in BaseComponent:618

Callback for binding validation

bindingValidationError

Type : EventEmitter<any>

Default value : new EventEmitter()

Decorators :


                            @Output()

Inherited from BaseComponent

Defined in BaseComponent:114

output to emit the new value of the bindingValidationError event

Private cdRefInjection

Type : ChangeDetectorRef

Inherited from BaseComponent

Defined in BaseComponent:659

Change Detector Reference for the component

Private changeDetectionTimer

Type : any

Inherited from BaseComponent

Defined in BaseComponent:668

A timer to debounce changedetection actions

Protected changeDetectorNotifier

Type : ChangeDectionNotifierService

Inherited from BaseComponent

Defined in BaseComponent:576

Change Detection Notifier Service instace.

Private contextMenuUnlistener

Type : function

Inherited from BaseComponent

Defined in BaseComponent:676

Context Menu event unlisten action.

Private ctxMenuInstance

Type : any

Inherited from BaseComponent

Defined in BaseComponent:630

Reference to the ctxMenuInstance

customCssClasses

Type : string

Default value : null

Decorators :


                            @HostBinding('class')

Inherited from BaseComponent

Defined in BaseComponent:407

Applies custom CSS classes

Private customTooltipInstance

Type : any

Default value : null

Inherited from BaseComponent

Defined in BaseComponent:641

Reference to the custom tooltip instance this is used to render a popup with custom elements used when the content value is not a string

dataGridRowHeight

Type : number

Default value : 22

Decorators :


                            @Input()

Inherited from BaseComponent

Defined in BaseComponent:507

Represents the row height of both the DataGrid and XamGrid components it affects the css and also an internal function that virtualized data, so do not change directly on css, use this variable instead.

Protected domHandlerUnListeners

Type : Array<void>

Inherited from BaseComponent

Defined in BaseComponent:567

A collection (possible undefined) of DOM unlistener functions . That is, functions to de register handlers

fireLoadedSubscription

Type : Subscription

Default value : null

Inherited from BaseComponent

Defined in BaseComponent:449

Flag to control load event for components inside tab control

focusable

Default value : false

Decorators :


                            @HostBinding('class.focusable')

Inherited from BaseComponent

Defined in BaseComponent:388

Display if the component is focusable or not

Protected handlersToUnregister

Type : Array<>

Default value : []

Inherited from BaseComponent

Defined in BaseComponent:558

handlers to unregister when the component is destroyed

hasDefinedCursor

Default value : false

Decorators :


                            @HostBinding('class.hasDefinedCursor')

Inherited from BaseComponent

Defined in BaseComponent:415

Applies Defined Cursor class

hostFontFamily

Type : any

Default value : null

Decorators :


                            @HostBinding('style.font-family')

Inherited from BaseComponent

Defined in BaseComponent:261

Property use it to apply the host binding for the font-family

hostFontSize

Type : any

Default value : null

Decorators :


                            @HostBinding('style.font-size')

Inherited from BaseComponent

Defined in BaseComponent:270

Property use it to apply the host binding for the font-size

hostFontStyle

Type : any

Default value : null

Decorators :


                            @HostBinding('style.font-style')

Inherited from BaseComponent

Defined in BaseComponent:279

Property use it to apply the host binding for the font-style

hostFontStyles

Default value : false

Decorators :


                            @HostBinding('class.defaultFontStyles')

Inherited from BaseComponent

Defined in BaseComponent:398

Applies default font styles class, used to allow specificity for each control css

hostFontWeight

Type : any

Default value : null

Decorators :


                            @HostBinding('style.font-weight')

Inherited from BaseComponent

Defined in BaseComponent:288

Property use it to apply the host binding for the font-weight

hostHeight

Type : string

Default value : null

Decorators :


                            @HostBinding('style.height')

Inherited from BaseComponent

Defined in BaseComponent:218

Property use it to apply the host binding for the height

hostHozCenter

Default value : false

Decorators :


                            @HostBinding('class.horizontal-center')

Inherited from BaseComponent

Defined in BaseComponent:308

Applies horizontal alignment left class

hostHozLeft

Default value : false

Decorators :


                            @HostBinding('class.horizontal-left')

Inherited from BaseComponent

Defined in BaseComponent:298

Applies horizontal alignment left class

hostHozRight

Default value : false

Decorators :


                            @HostBinding('class.horizontal-right')

Inherited from BaseComponent

Defined in BaseComponent:368

Applies horizontal alignment right class

hostHozSelfAlign

Default value : false

Decorators :


                            @HostBinding('class.horizontal-selfalign')
@Input()

Inherited from BaseComponent

Defined in BaseComponent:380

Applies horizontal selfalign class. Flags indicates when the control should handle its own horizontal alignment and ignore container alignment.

hostHozStretch

Default value : false

Decorators :


                            @HostBinding('class.horizontal-stretch')

Inherited from BaseComponent

Defined in BaseComponent:358

Applies horizontal alignment stretch class

hostMaxHeight

Type : number

Decorators :


                            @HostBinding('style.max-height.px')

Inherited from BaseComponent

Defined in BaseComponent:234

Property used to apply the host binding for max-height

hostMaxWidth

Type : number

Decorators :


                            @HostBinding('style.max-width.px')

Inherited from BaseComponent

Defined in BaseComponent:210

Property used to apply the host binding for max-width

hostMinHeight

Type : number

Decorators :


                            @HostBinding('style.min-height.px')

Inherited from BaseComponent

Defined in BaseComponent:226

Property used to apply the host binding for min-height

hostMinWidth

Type : number

Decorators :


                            @HostBinding('style.min-width.px')

Inherited from BaseComponent

Defined in BaseComponent:202

Property used to apply the host binding for min-width

hostOpacity

Type : any

Default value : null

Decorators :


                            @HostBinding('style.opacity')

Inherited from BaseComponent

Defined in BaseComponent:252

Property use it to apply the host binding for the opacity

hostVerBottom

Default value : false

Decorators :


                            @HostBinding('class.vertical-bottom')

Inherited from BaseComponent

Defined in BaseComponent:328

Applies vertical alignment bottom class

hostVerCenter

Default value : false

Decorators :


                            @HostBinding('class.vertical-center')

Inherited from BaseComponent

Defined in BaseComponent:338

Applies vertical alignment center class

hostVerStretch

Default value : false

Decorators :


                            @HostBinding('class.vertical-stretch')

Inherited from BaseComponent

Defined in BaseComponent:318

Applies horizontal alignment stretch class

hostVerTop

Default value : false

Decorators :


                            @HostBinding('class.vertical-top')

Inherited from BaseComponent

Defined in BaseComponent:348

Applies vertical alignment top class

hostVisibility

Type : any

Default value : null

Decorators :


                            @HostBinding('style.display')

Inherited from BaseComponent

Defined in BaseComponent:243

Property use it to apply the host binding for the visibility

hostWidth

Type : string

Default value : null

Decorators :


                            @HostBinding('style.width')

Inherited from BaseComponent

Defined in BaseComponent:194

Property use it to apply the host binding for the width

hostZIndex

Type : string

Default value : null

Decorators :


                            @HostBinding('style.z-index')

Inherited from BaseComponent

Defined in BaseComponent:424

Sets the z-index style.

isInitialized

Type : any

Default value : undefined

Inherited from BaseComponent

Defined in BaseComponent:523

Flag to know if the component is ready to render

isInternalInherit

Default value : false

Inherited from BaseComponent

Defined in BaseComponent:515

Flag which indicates that the component is an internal use for inheritance

layoutUpdated

Type : EventEmitter<any>

Default value : new EventEmitter()

Decorators :


                            @Output()

Inherited from BaseComponent

Defined in BaseComponent:140

Output to emit when then component's layout is updated.

loaded

Type : EventEmitter<any>

Default value : new EventEmitter()

Decorators :


                            @Output()

Inherited from BaseComponent

Defined in BaseComponent:123

Output to emit when then component is loaded.

Protected modelChangeRef

Type : function

Inherited from BaseComponent

Defined in BaseComponent:601

Contains the reference of the function added for handle the model's change

mouseEnter

Type : EventEmitter<literal type>

Default value : new EventEmitter()

Decorators :


                            @Output()

Inherited from BaseComponent

Defined in BaseComponent:157

Event Emitter. EventEmitter normally called in the mouseEnterHandler.

mouseLeave

Type : EventEmitter<literal type>

Default value : new EventEmitter()

Decorators :


                            @Output()

Inherited from BaseComponent

Defined in BaseComponent:167

Event Emitter Called in the mouseLeave handler

Private mouseLeaveTooltipUnlistener

Type : function

Default value : null

Inherited from BaseComponent

Defined in BaseComponent:684

Mouse over event for tooltip unlisten action.

mouseLeftButtonUp

Type : EventEmitter<literal type>

Default value : new EventEmitter<any>()

Decorators :


                            @Output()

Inherited from BaseComponent

Defined in BaseComponent:147

MouseLeftButtonUp event Emitter.

Private mouseMoveTooltipUnlistener

Type : function

Default value : null

Inherited from BaseComponent

Defined in BaseComponent:701

Mouse move event for tooltip unlisten action. This should have a short lifespan, as much as it takes for the tooltip to be shown

Private mouseOverTooltipUnlistener

Type : function

Default value : null

Inherited from BaseComponent

Defined in BaseComponent:692

Mouse over event for tooltip unlisten action.

Protected ngZone

Type : NgZone

Inherited from BaseComponent

Defined in BaseComponent:585

Angular´s NgZone accessor

Protected pendingDependencyPropertyValue

Type : Array<>

Default value : []

Inherited from BaseComponent

Defined in BaseComponent:549

A collection of pending dependency properties values to assign to the model

Protected pendingSetValues

Type : Array<>

Default value : []

Inherited from BaseComponent

Defined in BaseComponent:540

A collection of pending values to assign to the model

Protected renderer2

Type : Renderer2

Inherited from BaseComponent

Defined in BaseComponent:594

Angular´s Renderer2

sizeChanged

Type : EventEmitter<any>

Default value : new EventEmitter()

Decorators :


                            @Output()

Inherited from BaseComponent

Defined in BaseComponent:132

Output to emit when then component size is changed.

Private sizeChangedPendingTimeout

Type : any

Inherited from BaseComponent

Defined in BaseComponent:610

Timeout id for triggering the sizechanged event

spellCheck

Default value : false

Decorators :


                            @Input()

Inherited from BaseComponent

Defined in BaseComponent:186

Flag to determinate if the component should do the spell check or not. Default value is false.

staticContent

Type : any

Default value : null

Inherited from BaseComponent

Defined in BaseComponent:432

cache the static content of the control to validate if the current data is not equals.

tabSubscription

Type : Subscription

Default value : null

Inherited from BaseComponent

Defined in BaseComponent:440

TabSelection event subscription

Private tooltipMousePosition

Type : DOMRect

Default value : null

Inherited from BaseComponent

Defined in BaseComponent:710

To track the position of the mouse while the tooltip is being displayed

Private toolTipTimeout

Type : any

Default value : null

Inherited from BaseComponent

Defined in BaseComponent:650

To control the timer to show the tooltip

useCss

Default value : false

Decorators :


                            @Input()

Inherited from BaseComponent

Defined in BaseComponent:177

Determines if the component uses CSS height/width values, instead of inputs

validationError

Default value : false

Inherited from BaseComponent

Defined in BaseComponent:488

Property to set the validationError class in the component

validationErrorMessage

Type : string

Default value : ''

Inherited from BaseComponent

Defined in BaseComponent:496

Property for specifying validation error message

import {
  ChangeDetectionStrategy,
  ChangeDetectorRef,
  Component,
  Injector,
  Input,
  OnInit,
  Optional,
} from '@angular/core';
import {
  ModelProxy,
  RadRibbonToggleButtonModel,
  AngularComponentId,
  ComponentId,
  DependencyProperty,
} from '@mobilize/wms-framework';
import { stopEventPropagation } from '../../decorators/stopEventPropagation';
import { D_COMPATIBLE_COMPONENT, RibbonComponentData } from '../../directives';
import { BaseRadRibbonButtonComponent } from '../base-rad-ribbon-button/base-rad-ribbon-button.component';

/**
 * Angular Component for the RadRibbonToggle Control.
 *
 * @export
 * @class RadRibbonToggleComponent
 * @extends {BaseComponent}
 * @implements {OnInit}
 */
@Component({
  selector: 'wm-rad-ribbon-toggle-button',
  styleUrls: ['./rad-ribbon-toggle-button.component.scss'],
  templateUrl: './rad-ribbon-toggle-button.component.html',
  changeDetection: ChangeDetectionStrategy.OnPush,
  providers: [
    {
      provide: D_COMPATIBLE_COMPONENT,
      useExisting: RadRibbonToggleButtonComponent,
    },
  ],
})
@ComponentId([AngularComponentId.radRibbonToggleButton])
export class RadRibbonToggleButtonComponent
  extends BaseRadRibbonButtonComponent
  implements OnInit, RibbonComponentData
{
  /**
   * RadRibbonToggleButtonModel.
   *
   * @type {RadRibbonToggleButtonModel}
   * @memberof RadRibbonToggleComponent
   */
  @Input()
  public model: RadRibbonToggleButtonModel;

  /**
   * Model copy RadRibbonToggleModel
   *
   * @type {RadRibbonToggleModel}
   * @memberof RadRibbonToggleComponent
   */
  modelProxy: RadRibbonToggleButtonModel =
    ModelProxy.create<RadRibbonToggleButtonModel>();

  /**
   * Creates an instance of RadRibbonToggleComponent.
   *
   * @param {RadRibbonToggleButtonModel} injectedModel
   * @param {Injector} injector
   * @memberof RadRibbonToggleComponent
   */
  public constructor(
    @Optional() private injectedModel: RadRibbonToggleButtonModel,
    private injector: Injector,
    private cdRef: ChangeDetectorRef
  ) {
    super(cdRef, injector);
    this.model = injectedModel;
  }

  /**
   * Click handler Event
   *
   * @param {*} event
   * @memberof RadRibbonToggleComponent
   */
  @stopEventPropagation()
  clickHandler(event: any): void {
    this.model.OnClick();
  }
  /**
   * Angular lifecycle hook.
   * Rad ribbon button onInit
   *
   * @memberof RadRibbonToggleComponent
   */
  ngOnInit(): void {
    this.model =
      this.model || this.injectedModel || new RadRibbonToggleButtonModel();
    this.setupModel(this.model);
    super.ngOnInit();
  }

  /**
   * Apply class
   *
   * @return {*}  {string}
   * @memberof RadRibbonToggleComponent
   */
  ngclassFunction(): string {
    let result = super.ngclassFunction();
    if (this.model.IsChecked) {
      result = result + ' checkedBackground';
    }
    return result;
  }

  /**
   *  Returns the large image property for this control
   *
   * @protected
   * @return {*}  {DependencyProperty}
   * @memberof RadRibbonToggleButtonComponent
   */
  protected getLargeImageProperty(): DependencyProperty {
    return RadRibbonToggleButtonModel.LargeImageProperty;
  }
}

<div *ngIf="visibility" [class]="!isEnabled ? 'disabled' : ''">
  <button
    class="ribbonToggleButton"
    (click)="clickHandler($event)"
    [disabled]="!isEnabled"
    [ngClass]="ngclassFunction()"
  >
    <img *ngIf="largeImage" class="largeImage" [src]="largeImage" />
    <span *ngIf="size !== 'SmallButtonClass'" class="caption"> {{ text }}</span>
  </button>
</div>

./rad-ribbon-toggle-button.component.scss

@import '../../scss/variables';

.ribbonToggleButton {
  height: 100%;
  width: 100%;
  background-color: $normal-ribbon-item-background-color;
  border: $ribbon-item-border-style;
  padding: $padding-rad-ribbon-item-drop-down;
  border-color: $normal-ribbon-item-border-color;
  border-radius: $ribbon-item-border-radius;
}

.ribbonToggleButton:hover:not(.disabled) {
  background: $hover-ribbon-item-background;
  border-color: $hover-ribbon-item-border-color;
}

.checkedBackground,
.checkedBackground:active:not(.disabled),
.checkedBackground:focus:not(.disabled) {
  background: $selected-ribbon-item-background;
  border-color: $selected-ribbon-item-border-color;
}

.caption {
  display: block;
  font-size: $ribbon-font-size;
  text-overflow: ellipsis;
}

.smallImage {
  width: $ribbon-item-small-image;
  height: $ribbon-item-small-image;
}

.largeImage {
  width: $ribbon-item-large-image;
  height: $ribbon-item-large-image;
}

.SmallButtonClass {
  width: 100%;
  height: 100%;
  display: inline-flex;
}

.MediumButtonClass {
  width: 100%;
  height: 100%;
  display: inline-flex;
}

.LargeButtonClass {
  width: 100%;
  height: 100%;
}

Legend

Html element

Component

Html element with directive

File

Description

Extends

Implements

Metadata

Index

Properties

Methods

Inputs

Outputs

HostBindings

Constructor

Inputs

Outputs

HostBindings

Methods

Properties

result-matching ""

No results matching ""