Skip to content

Commit 3a8244b

Browse files
committed
Demo app
1 parent 5e6f55a commit 3a8244b

25 files changed

+446
-4
lines changed

ngx-numeric-range-form-field/.gitignore

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,3 @@ testem.log
4545
# System Files
4646
.DS_Store
4747
Thumbs.db
48-
49-
50-
# demo
51-
ngx-numeric-range-form-field-demo
Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
2+
# For additional information regarding the format and rule options, please see:
3+
# https://github.com/browserslist/browserslist#queries
4+
5+
# For the full list of supported browsers by the Angular framework, please see:
6+
# https://angular.io/guide/browser-support
7+
8+
# You can see what browsers were selected by your queries by running:
9+
# npx browserslist
10+
11+
last 1 Chrome version
12+
last 1 Firefox version
13+
last 2 Edge major versions
14+
last 2 Safari major versions
15+
last 2 iOS major versions
16+
Firefox ESR
17+
not IE 11 # Angular supports IE 11 only as an opt-in. To opt-in, remove the 'not' prefix on this line.
Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
// @ts-check
2+
// Protractor configuration file, see link for more information
3+
// https://github.com/angular/protractor/blob/master/lib/config.ts
4+
5+
const { SpecReporter, StacktraceOption } = require('jasmine-spec-reporter');
6+
7+
/**
8+
* @type { import("protractor").Config }
9+
*/
10+
exports.config = {
11+
allScriptsTimeout: 11000,
12+
specs: [
13+
'./src/**/*.e2e-spec.ts'
14+
],
15+
capabilities: {
16+
browserName: 'chrome'
17+
},
18+
directConnect: true,
19+
SELENIUM_PROMISE_MANAGER: false,
20+
baseUrl: 'http://localhost:4200/',
21+
framework: 'jasmine',
22+
jasmineNodeOpts: {
23+
showColors: true,
24+
defaultTimeoutInterval: 30000,
25+
print: function() {}
26+
},
27+
onPrepare() {
28+
require('ts-node').register({
29+
project: require('path').join(__dirname, './tsconfig.json')
30+
});
31+
jasmine.getEnv().addReporter(new SpecReporter({
32+
spec: {
33+
displayStacktrace: StacktraceOption.PRETTY
34+
}
35+
}));
36+
}
37+
};
Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
import { browser, logging } from 'protractor';
2+
import { AppPage } from './app.po';
3+
4+
describe('workspace-project App', () => {
5+
let page: AppPage;
6+
7+
beforeEach(() => {
8+
page = new AppPage();
9+
});
10+
11+
it('should display welcome message', async () => {
12+
await page.navigateTo();
13+
expect(await page.getTitleText()).toEqual('ngx-numeric-range-form-field-demo app is running!');
14+
});
15+
16+
afterEach(async () => {
17+
// Assert that there are no errors emitted from the browser
18+
const logs = await browser.manage().logs().get(logging.Type.BROWSER);
19+
expect(logs).not.toContain(jasmine.objectContaining({
20+
level: logging.Level.SEVERE,
21+
} as logging.Entry));
22+
});
23+
});
Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import { browser, by, element } from 'protractor';
2+
3+
export class AppPage {
4+
async navigateTo(): Promise<unknown> {
5+
return browser.get(browser.baseUrl);
6+
}
7+
8+
async getTitleText(): Promise<string> {
9+
return element(by.css('app-root .content span')).getText();
10+
}
11+
}
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
/* To learn more about this file see: https://angular.io/config/tsconfig. */
2+
{
3+
"extends": "../../../tsconfig.json",
4+
"compilerOptions": {
5+
"outDir": "../../../out-tsc/e2e",
6+
"module": "commonjs",
7+
"target": "es2018",
8+
"types": [
9+
"jasmine",
10+
"node"
11+
]
12+
}
13+
}
Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
// Karma configuration file, see link for more information
2+
// https://karma-runner.github.io/1.0/config/configuration-file.html
3+
4+
module.exports = function (config) {
5+
config.set({
6+
basePath: '',
7+
frameworks: ['jasmine', '@angular-devkit/build-angular'],
8+
plugins: [
9+
require('karma-jasmine'),
10+
require('karma-chrome-launcher'),
11+
require('karma-jasmine-html-reporter'),
12+
require('karma-coverage'),
13+
require('@angular-devkit/build-angular/plugins/karma')
14+
],
15+
client: {
16+
jasmine: {
17+
// you can add configuration options for Jasmine here
18+
// the possible options are listed at https://jasmine.github.io/api/edge/Configuration.html
19+
// for example, you can disable the random execution with `random: false`
20+
// or set a specific seed with `seed: 4321`
21+
},
22+
clearContext: false // leave Jasmine Spec Runner output visible in browser
23+
},
24+
jasmineHtmlReporter: {
25+
suppressAll: true // removes the duplicated traces
26+
},
27+
coverageReporter: {
28+
dir: require('path').join(__dirname, '../../coverage/ngx-numeric-range-form-field-demo'),
29+
subdir: '.',
30+
reporters: [
31+
{ type: 'html' },
32+
{ type: 'text-summary' }
33+
]
34+
},
35+
reporters: ['progress', 'kjhtml'],
36+
port: 9876,
37+
colors: true,
38+
logLevel: config.LOG_INFO,
39+
autoWatch: true,
40+
browsers: ['Chrome'],
41+
singleRun: false,
42+
restartOnFileChange: true
43+
});
44+
};
Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
<ngx-numeric-range-form-field
2+
[formControl]="rangeControl"
3+
label="Numeric range"
4+
(blurred)="onBlur()"
5+
(enterPressed)="onEnter()"
6+
(numericRangeChanged)="onValueChange($event)"
7+
></ngx-numeric-range-form-field>
8+
9+
<button>DINOO</button>

ngx-numeric-range-form-field/projects/ngx-numeric-range-form-field-demo/src/app/app.component.scss

Whitespace-only changes.
Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
import { TestBed } from '@angular/core/testing';
2+
import { AppComponent } from './app.component';
3+
4+
describe('AppComponent', () => {
5+
beforeEach(async () => {
6+
await TestBed.configureTestingModule({
7+
declarations: [
8+
AppComponent
9+
],
10+
}).compileComponents();
11+
});
12+
13+
it('should create the app', () => {
14+
const fixture = TestBed.createComponent(AppComponent);
15+
const app = fixture.componentInstance;
16+
expect(app).toBeTruthy();
17+
});
18+
19+
it(`should have as title 'ngx-numeric-range-form-field-demo'`, () => {
20+
const fixture = TestBed.createComponent(AppComponent);
21+
const app = fixture.componentInstance;
22+
expect(app.title).toEqual('ngx-numeric-range-form-field-demo');
23+
});
24+
25+
it('should render title', () => {
26+
const fixture = TestBed.createComponent(AppComponent);
27+
fixture.detectChanges();
28+
const compiled = fixture.nativeElement;
29+
expect(compiled.querySelector('.content span').textContent).toContain('ngx-numeric-range-form-field-demo app is running!');
30+
});
31+
});
Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
import { Component } from '@angular/core';
2+
import { FormControl, FormGroup, Validators } from '@angular/forms';
3+
import { INumericRange } from 'projects/ngx-numeric-range-form-field/src/lib/form/model/numeric-range-field.model';
4+
5+
@Component({
6+
selector: 'app-root',
7+
templateUrl: './app.component.html',
8+
styleUrls: ['./app.component.scss'],
9+
})
10+
export class AppComponent {
11+
form: FormGroup;
12+
13+
constructor() {
14+
this.form = new FormGroup({
15+
range: new FormControl(10, [
16+
Validators.required,
17+
Validators.min(10),
18+
Validators.max(100),
19+
]),
20+
});
21+
}
22+
23+
get rangeControl(): FormControl {
24+
return this.form.get('range') as FormControl;
25+
}
26+
27+
onBlur(): void {
28+
console.log('Value', this.rangeControl.value);
29+
}
30+
31+
onEnter(): void {
32+
console.log('Enter pressed!');
33+
this.rangeControl.disable();
34+
}
35+
36+
onValueChange(value: INumericRange): void {
37+
console.log(
38+
'Changed value: ',
39+
value,
40+
this.rangeControl.hasError('notValidRange')
41+
);
42+
43+
//this.rangeControl.updateValueAndValidity();
44+
console.log('RANGE CONTROL', this.rangeControl);
45+
}
46+
}
Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
import { NgModule } from '@angular/core';
2+
import { ReactiveFormsModule } from '@angular/forms';
3+
import { BrowserModule } from '@angular/platform-browser';
4+
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
5+
import { AppComponent } from './app.component';
6+
import { MatFormFieldModule } from '@angular/material/form-field';
7+
import { MatIconModule } from '@angular/material/icon';
8+
import { MatInputModule } from '@angular/material/input';
9+
import { NgxNumericRangeFormFieldModule } from 'projects/ngx-numeric-range-form-field/src/lib/ngx-numeric-range-form-field.module';
10+
11+
@NgModule({
12+
declarations: [AppComponent],
13+
imports: [
14+
BrowserModule,
15+
NgxNumericRangeFormFieldModule,
16+
ReactiveFormsModule,
17+
BrowserAnimationsModule,
18+
MatFormFieldModule,
19+
MatInputModule,
20+
MatIconModule,
21+
],
22+
providers: [],
23+
bootstrap: [AppComponent],
24+
})
25+
export class AppModule {}

ngx-numeric-range-form-field/projects/ngx-numeric-range-form-field-demo/src/assets/.gitkeep

Whitespace-only changes.
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
export const environment = {
2+
production: false,
3+
};
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
export const environment = {
2+
production: true
3+
};
Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
// This file can be replaced during build by using the `fileReplacements` array.
2+
// `ng build --prod` replaces `environment.ts` with `environment.prod.ts`.
3+
// The list of file replacements can be found in `angular.json`.
4+
5+
export const environment = {
6+
production: false
7+
};
8+
9+
/*
10+
* For easier debugging in development mode, you can import the following file
11+
* to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`.
12+
*
13+
* This import should be commented out in production mode because it will have a negative impact
14+
* on performance if an error is thrown.
15+
*/
16+
// import 'zone.js/plugins/zone-error'; // Included with Angular CLI.
Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<title>Numeric Range Form Field Demo</title>
6+
<base href="/" />
7+
<meta name="viewport" content="width=device-width, initial-scale=1" />
8+
<link rel="icon" type="image/x-icon" href="favicon.ico" />
9+
<link
10+
href="https://fonts.googleapis.com/css?family=Roboto:300,400,500&display=swap"
11+
rel="stylesheet"
12+
/>
13+
<link
14+
href="https://fonts.googleapis.com/icon?family=Material+Icons"
15+
rel="stylesheet"
16+
/>
17+
<link
18+
href="https://fonts.googleapis.com/css?family=Material+Icons|Material+Icons+Outlined|Material+Icons+Two+Tone|Material+Icons+Round|Material+Icons+Sharp"
19+
rel="stylesheet"
20+
/>
21+
</head>
22+
<body>
23+
<app-root></app-root>
24+
</body>
25+
</html>
Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
import { enableProdMode } from '@angular/core';
2+
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
3+
4+
import { AppModule } from './app/app.module';
5+
import { environment } from './environments/environment';
6+
7+
if (environment.production) {
8+
enableProdMode();
9+
}
10+
11+
platformBrowserDynamic().bootstrapModule(AppModule)
12+
.catch(err => console.error(err));
Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
/**
2+
* This file includes polyfills needed by Angular and is loaded before the app.
3+
* You can add your own extra polyfills to this file.
4+
*
5+
* This file is divided into 2 sections:
6+
* 1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers.
7+
* 2. Application imports. Files imported after ZoneJS that should be loaded before your main
8+
* file.
9+
*
10+
* The current setup is for so-called "evergreen" browsers; the last versions of browsers that
11+
* automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera),
12+
* Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile.
13+
*
14+
* Learn more in https://angular.io/guide/browser-support
15+
*/
16+
17+
/***************************************************************************************************
18+
* BROWSER POLYFILLS
19+
*/
20+
21+
/**
22+
* By default, zone.js will patch all possible macroTask and DomEvents
23+
* user can disable parts of macroTask/DomEvents patch by setting following flags
24+
* because those flags need to be set before `zone.js` being loaded, and webpack
25+
* will put import in the top of bundle, so user need to create a separate file
26+
* in this directory (for example: zone-flags.ts), and put the following flags
27+
* into that file, and then add the following code before importing zone.js.
28+
* import './zone-flags';
29+
*
30+
* The flags allowed in zone-flags.ts are listed here.
31+
*
32+
* The following flags will work for all browsers.
33+
*
34+
* (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame
35+
* (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick
36+
* (window as any).__zone_symbol__UNPATCHED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames
37+
*
38+
* in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js
39+
* with the following flag, it will bypass `zone.js` patch for IE/Edge
40+
*
41+
* (window as any).__Zone_enable_cross_context_check = true;
42+
*
43+
*/
44+
45+
/***************************************************************************************************
46+
* Zone JS is required by default for Angular itself.
47+
*/
48+
import 'zone.js'; // Included with Angular CLI.
49+
50+
51+
/***************************************************************************************************
52+
* APPLICATION IMPORTS
53+
*/
Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
@import "@angular/material/prebuilt-themes/indigo-pink.css"; /* You can add global styles to this file, and also import other style files */

0 commit comments

Comments
 (0)