Skip to content

Commit

Permalink
Merge pull request #778 from HealthCatalyst/dev
Browse files Browse the repository at this point in the history
dev -> master
  • Loading branch information
benjanderson committed Mar 21, 2019
2 parents 9339174 + 662d2f3 commit 5f246d4
Show file tree
Hide file tree
Showing 13 changed files with 459 additions and 74 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@
</hc-navbar-mobile-menu>
</hc-navbar>

<hc-popover-content #appSwitcher><hc-app-switcher></hc-app-switcher></hc-popover-content>
<hc-popover-content #appSwitcher><hc-app-switcher iconHeight="100"></hc-app-switcher></hc-popover-content>

<hc-popover-content #options>
<ul class="list-options">
Expand Down
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<hc-typeform-survey [surveyUri]="surveyUri" #survey></hc-typeform-survey>
<hc-typeform-survey [surveyUri]="surveyUri" appVersion="1.0" #survey></hc-typeform-survey>
<button hc-button buttonStyle="primary" (click)="survey.open()">
Open Survey
</button>
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ <h4>Applications</h4>
<div class="apps">
<div class="app" *ngFor="let app of applications">
<a class="thumbnail" [title]="app.Description" [href]="app.ServiceUrl" target="_blank">
<img class="thumbnail-img" [src]="app.Icon">
<img class="thumbnail-img" [height]="iconHeight" [src]="app.Icon">
<div class="title">{{app?.FriendlyName | ellipsis:18}}</div>
</a>
</div>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -30,10 +30,12 @@
& > a {
padding: 10px;
text-decoration: none;
display: flex;
flex-direction: column;
align-items: center;

& > .thumbnail-img {
width: 100px;
height: 100px;
width: auto;
}
}

Expand Down
11 changes: 11 additions & 0 deletions projects/cashmere/src/lib/app-switcher/app-switcher.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -13,9 +13,20 @@ export class AppSwitcherComponent implements OnInit, OnDestroy {
public applications: IDiscoveryApplication[];
public subscription: Subscription;
public brandBg = 'brand';
private _iconHeight: Number = 100;

private ngUnsubscribe: any = new Subject();

/** Sets the height of the app thumbnail icons, width is auto (defaults to 100px) */
@Input()
get iconHeight(): Number {
return this._iconHeight;
}

set iconHeight(heightVal: Number) {
this._iconHeight = heightVal;
}

constructor(@Inject(APP_SWITCHER_SERVICE) public appSwitcherService: IAppSwitcherService) {}

ngOnInit() {
Expand Down
2 changes: 0 additions & 2 deletions projects/cashmere/src/lib/drawer/drawer.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -234,8 +234,6 @@ export class Drawer implements AfterContentInit {

/** Toggles the drawer */
toggle(isOpen: boolean = !this.opened): Promise<DrawerPromiseResult> {
this._drawerOpened = isOpen;

if (!this._animationPromise) {
this._drawerOpened = isOpen;

Expand Down
4 changes: 2 additions & 2 deletions projects/cashmere/src/lib/navbar/navbar.md
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@ You may not have all these items available. However, include what you have in th

##### App Switcher

In addition to the help menu, all Heath Catalyst applications should also include the app switcher in their navbar to the left of the help menu. The app switcher allows users to easily switch between the Health Catalyst apps that they have access to.
In addition to the help menu, all Heath Catalyst applications should also include the app switcher in their navbar to the left of the help menu. The app switcher allows users to easily switch between the Health Catalyst apps that they have access to. You may set the height of the icons that appear in the app switcher using the `iconHeight` parameter. The height defaults to 100px, and the width will be set automatically.

```html
<hc-navbar>
Expand All @@ -48,7 +48,7 @@ In addition to the help menu, all Heath Catalyst applications should also includ
<hc-app-switcher-links></hc-app-switcher-links>
</hc-navbar-mobile-menu>
...
<hc-popover-content #appSwitcher><hc-app-switcher></hc-app-switcher></hc-popover-content>
<hc-popover-content #appSwitcher><hc-app-switcher iconHeight="100"></hc-app-switcher></hc-popover-content>
</hc-navbar>
```

Expand Down
175 changes: 164 additions & 11 deletions projects/cashmere/src/lib/radio-button/radio-button.component.spec.ts
Original file line number Diff line number Diff line change
@@ -1,24 +1,177 @@
import {async, ComponentFixture, TestBed} from '@angular/core/testing';
import {RadioButtonComponent} from './radio';
import {RadioButtonComponent, RadioButtonChangeEvent} from './radio';
import {RadioButtonModule} from './radio-button.module';
import {Component, DebugElement} from '@angular/core';
import {By} from '@angular/platform-browser';

@Component({
template: `
<div (click)="parentElementClicked = true" (keyup)="parentElementKeyedUp = true">
<hc-radio-button
[id]="radioId"
[required]="isRequired"
[checked]="isChecked"
[disabled]="isDisabled"
[value]="radioValue"
(change)="onRadioChange($event)"
>
Simple radio button
</hc-radio-button>
</div>
`
})
export class SingleRadioComponent {
isChecked: boolean = false;
isRequired: boolean = false;
isIndeterminate: boolean = false;
isDisabled: boolean = false;
parentElementClicked: boolean = false;
parentElementKeyedUp: boolean = false;
radioId: string | null = 'simple-radio';
radioValue: string = 'single_radio';

onRadioClick: (event?: Event) => void = () => {};
onRadioChange: (event?: RadioButtonChangeEvent) => void = () => {};
}

describe('RadioButtonComponent', () => {
let component: RadioButtonComponent;
let fixture: ComponentFixture<RadioButtonComponent>;
let fixture: ComponentFixture<any>;

beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [RadioButtonModule]
imports: [RadioButtonModule],
declarations: [SingleRadioComponent]
}).compileComponents();
fixture = TestBed.createComponent(RadioButtonComponent);
}));

beforeEach(() => {
fixture = TestBed.createComponent(RadioButtonComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
describe('basic behaviors', () => {
let radioDebugElement: DebugElement;
let radioNativeElement: HTMLElement;
let radioInstance: RadioButtonComponent;
let testComponent: SingleRadioComponent;

let inputElement: HTMLInputElement;

beforeEach(() => {
fixture = TestBed.createComponent(SingleRadioComponent);
fixture.detectChanges();

radioDebugElement = fixture.debugElement.query(By.directive(RadioButtonComponent));
radioNativeElement = radioDebugElement.nativeElement;
radioInstance = radioDebugElement.componentInstance;
testComponent = fixture.debugElement.componentInstance;

inputElement = <HTMLInputElement>radioNativeElement.querySelector('input');

fixture.detectChanges();
});

it('should add and remove checked state', () => {
expect(radioInstance.checked).toBe(false);
expect(inputElement.checked).toBe(false);

testComponent.isChecked = true;
fixture.detectChanges();

expect(radioInstance.checked).toBe(true);
expect(inputElement.checked).toBe(true);

testComponent.isChecked = false;
fixture.detectChanges();

expect(radioInstance.checked).toBe(false);
expect(inputElement.checked).toBe(false);
});

it('should toggle checked state on click', () => {
expect(radioInstance.checked).toBe(false);

inputElement.click();
fixture.detectChanges();

expect(radioInstance.checked).toBe(true);
});

it('should change native element checked when check programmatically', () => {
expect(inputElement.checked).toBe(false);

radioInstance.checked = true;
fixture.detectChanges();

expect(inputElement.checked).toBe(true);
});

it('should add and remove disabled state', () => {
expect(radioInstance.disabled).toBe(false);
expect(inputElement.tabIndex).toBe(0);
expect(inputElement.disabled).toBe(false);

testComponent.isDisabled = true;
fixture.detectChanges();

expect(radioInstance.disabled).toBe(true);
expect(inputElement.disabled).toBe(true);

testComponent.isDisabled = false;
fixture.detectChanges();

expect(radioInstance.disabled).toBe(false);
expect(inputElement.tabIndex).toBe(0);
expect(inputElement.disabled).toBe(false);
});

it('should not toggle `checked` state upon interaction while disabled', () => {
testComponent.isDisabled = true;
fixture.detectChanges();

inputElement.click();
expect(radioInstance.checked).toBe(false);
});

it('should preserve the user-provided id', () => {
expect(radioNativeElement.id).toBe('simple-radio');
expect(inputElement.id).toBe('simple-radio-input');
});

it('should generate a unique id for the radio button input if no id is set', () => {
testComponent.radioId = null;
fixture.detectChanges();

expect(radioInstance._inputId).toMatch(/hc-radio-button-\d+/);
expect(inputElement.id).toBe(radioInstance._inputId);
});

it('should forward the required attribute', () => {
testComponent.isRequired = true;
fixture.detectChanges();

expect(inputElement.required).toBe(true);

testComponent.isRequired = false;
fixture.detectChanges();

expect(inputElement.required).toBe(false);
});

it('should forward the value to input element', () => {
testComponent.radioValue = 'basic_radio';
fixture.detectChanges();

expect(inputElement.value).toBe('basic_radio');
});

it('should emit a change event when clicked', () => {
spyOn(testComponent, 'onRadioChange');

expect(inputElement.checked).toBe(false);

inputElement.click();
fixture.detectChanges();

expect(inputElement.checked).toBe(true);

it('should create', () => {
expect(component).toBeTruthy();
expect(testComponent.onRadioChange).toHaveBeenCalledTimes(1);
});
});
});
Loading

0 comments on commit 5f246d4

Please sign in to comment.