Allen Kim allenhwkim

Father and A Helpful Person In Web Development

allenhwkim / scroll-speed.js

Created November 25, 2017 05:27

get the speed of scroll


	this.prevScroll = {x:0,y:0,time: (new Date()).getTime()};
	function getScrollSpeed(el) {
	let moveX, moveY, speedX, speedY, now = (new Date()).getTime();
	moveX = Math.abs(el.scrollX - (this.prevScroll.x \|\| el.scrollX));
	moveY = Math.abs(el.scrollY - (this.prevScroll.y \|\| el.scrollY));
	speedX = moveX / (now - this.prevScroll.time);
	speedY = moveY / (now - this.prevScroll.time);
	this.prevScroll = {x: el.scrollX, y: el.scrollY, time:(new Date()).getTime()};
	console.log(el.scrollY, moveY,speedY, this.prevScroll);

allenhwkim / app.component.ts

Last active March 5, 2018 05:12

ngx-loading component to show spinner on the top of a section, https://ngx-loading.stackblitz.io/


	import {Component} from '@angular/core';

	@Component({
	selector: 'app',
	template: `
	<h1>ngx-loading test</h1>
	<button (click)="show=!show">toggle show/hide blocker</button>
	<h3>text</h3>
	<ngx-loading [showIf]="show">

allenhwkim / responsive-table.html

Last active March 7, 2018 18:34

	<!DOCTYPE html>
	<html lang="en">

	<head>
	<meta charset='UTF-8'>
	<title>Responsive Table</title>

	<style>
	table.responsive { width: 100%; border-collapse: collapse}
	table.responsive tr { border: 1px solid #ccc;}

allenhwkim / cookie.ts

Last active September 20, 2024 22:39

Cookie Class

allenhwkim / mock.ts

Created March 28, 2018 19:07

Angular5+ test mock

	import {Pipe, PipeTransform, Type, Component, Directive, EventEmitter } from '@angular/core';

	/**
	* Examples:
	* MockPipe('some-pipe');
	* MockPipe('some-pipe', () => 'foo');
	*/
	export function MockPipe(name: string, transform?: any): Pipe {

	class Mock implements PipeTransform {

allenhwkim / commands.md

Created April 6, 2018 16:30

CodeceptJS Commands Table

Command\Helper	WebDriverIO	Puppeteer	Nightmare	Protractor
_addPopupListener		x
_locate	x	x	x	x
_locateCheckable	x	x		x
_locateClickable	x	x		x
_locateFields	x
_getWindowHandle				x
_locateFields		x		x

allenhwkim / app.component.html

Created April 16, 2018 17:13

Angular Virtual List https://stackblitz.com/edit/ngui-in-view-virtual-list

	<div class="pages">
	<h2> Virtual List </h2>
	<hr/>

	<div #pages></div>

	<!--
	the following will add <dyn-page></dyn-page> into <div #pages></div>
	When it's added, it will be pushed down out of view.
	User scrolls down, in view, then it will add dyn-page again

allenhwkim / simple-encoding.js

Created April 18, 2018 18:15

Javascript Simple Encoding

	function simpleEncoding(str, num=10) {
	return str.split('').map(c => String.fromCharCode(c.charCodeAt(0)+num)).join('');
	}

	var encoded = simpleEncoding('hello world'); // 'rovvy*y\|vn'
	simpleEncoding(encoded, -10); // 'hello world'

allenhwkim / ngui-in-view.component.ts

Last active April 18, 2018 21:15

Simple Lazy Loading With Angular

	@Component({
	selector: 'ngui-in-view',
	template: `
	<ng-container *ngIf="inView" [ngTemplateOutlet]="template">
	</ng-container>
	`,
	styles: [':host {display: block;}']
	})
	export class NguiInViewComponent implements OnInit, OnDestroy {
	observer: IntersectionObserver;

allenhwkim / app.component.spec.ts

Last active April 20, 2018 16:04

Angular5+ Jest Unit Text examples

	import { async, TestBed } from '@angular/core/testing';
	import { NO_ERRORS_SCHEMA } from '@angular/core';

	// do not import any other than you test. For others, mock it
	import { AppComponent } from './app.component';
	import { MockComponent } from '../../test/jest-setup';

	describe('AppComponent', () => {
	var fixture, component;

	export const Cookie = {
	set: function(name, value, days?:number) {
	let cookie: any = { [name]: value, path: '/' };

	if (days) {
	let date: Date = new Date();
	date.setTime(date.getTime()+(days2460601000));
	cookie.expires = date.toUTCString();
	}