Skip to content

Instantly share code, notes, and snippets.

@chaosmonster
chaosmonster / barcode-example.html
Created December 10, 2020 07:51
example for testing the BarcodeDetector API in Chromium based browsers
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>QR native test</title>
<style>
#scanner {
height: 400px;
border: 1px solid red;
}
const dataArray = [1, 2, 3, 4, 5];
let average = 0;
let counter = 1;
for(let i = 0; i < dataArray.length; i++) {
average = average + (dataArray[i] - average)/counter;
counter++;
}
console.log(average);
What would Google Search think about this? Semantic content uses slots and styling/ types can be done via attributes.
<my-teaser some-styling="red">
<h2>A headline used within the web component</h2>
<img src="path/to/image.jpg" />
<p>
Some text used in the component
</p>
</my-teaser>
export const onInit = <T extends Constructor>(base: T = class {} as T) =>
class OnInitSubject extends base implements OnInit, AfterViewInit {
private _init = new BehaviorSubject<void>(null);
onInit$ = this._init.asObservable();
ngOnInit(): void {
this._init.next();
// tslint:disable-next-line:no-unused-expression
super['ngOnInit'] && super['ngOnInit']();
const viewPort = document.createElement('meta');
viewPort.setAttribute('name', 'viewport');
viewPort.setAttribute('content', 'width=device-width, initial-scale=1');
document.getElementsByTagName('head')[0].appendChild(viewPort);
@chaosmonster
chaosmonster / router-as-ssot-ngrx.ts
Last active February 21, 2018 18:18
This is a simplified version of how I use the router as SSoT
export class RouteChange implements Action {
readonly type = '[Router] Route Change';
constructor(public payload: { params: any, path: string, queryParams: any }) {}
}
const parseActivatedRouteToUriArray = (routeSnapshot: ActivatedRouteSnapshot): string[] => {
let uri = [];
if (!isUndefinedOrNull(routeSnapshot) && !isUndefinedOrNull(routeSnapshot.routeConfig)) {
@chaosmonster
chaosmonster / angular-component-composition-with-mixin.ts
Last active January 1, 2019 16:44
Experiment to use mixins to make composition possible for angular components
import {Component} from '@angular/core';
export function sayHi() {
return 'Hi';
}
export function echo(msg) {
return 'Echo:' + msg;
}
@chaosmonster
chaosmonster / schema-example.ts
Created June 11, 2017 15:01
CUSTOM_ELEMENTS_SCHEMA and behaviour
@Component({
selector: 'existing-element',
template: `hello World`
})
export class ExistingElementComponent {
}
@Component({
selector: 'root',
template: `
/**
*
* Run the following code with `ng test`
* Is this a jasmine, typescript, angular or stupid developer bug?
**/
import {
ComponentFactory,
ComponentRef,
ElementRef,
@chaosmonster
chaosmonster / weird-jasmine-behaviour.md
Created May 24, 2017 16:22
Weird jasmine/ typescript behaviour

I am mocking a ViewContainerRef for a jasmine test. The code to be testes does at one point this: viewRef.element.nativeElement.scrollTop = 5

So I wrote a ViewContainerRefMock

export class ViewContainerRefMock extends ViewContainerRef {

  constructor() {
 super();