marcorinck’s gists

marcorinck / highlight.directive.ts

Last active August 17, 2020 14:23

	import {Directive, HostBinding, Input, OnChanges, SecurityContext, SimpleChanges} from "@angular/core";
	import {DomSanitizer, SafeHtml} from "@angular/platform-browser";

	@Directive({
	selector: "[appHighlight]",
	})
	export class HighlightDirective implements OnChanges {
	@Input()
	searchTerm: string;

marcorinck / example.ts

Last active May 2, 2020 04:01

semi-automatic mock generation in TypeScript (uses Jest as testing framework)

	import {clearMocks, Mock, mockClass, initMocks} from "mockclass";
	import {ErrorService} from "../components/http/error.service";

	describe('MyService', () => {
	//use as a decorator in an empty holder class
	class Mocks extends MockHolder {

	@Mock(ErrorService)
	errorService: ErrorService;
	}

marcorinck / slide-down.transition.ts

Last active October 15, 2022 09:01

custom ionic page transitions: "slide" and "slide-down"

	import {Animation} from "ionic-angular/animations/animation";
	import {isPresent} from "ionic-angular/util/util";
	import {PageTransition} from "ionic-angular/transitions/page-transition";

	const DURATION = 500;
	const TRANSFORM = "transform";
	const MOVED_DOWN = "translateY(100%)";
	const NOT_MOVED = "translateY(0)";
	const ZINDEX = "z-index";
	const OPACITY = "opacity";

marcorinck / animated-item.component.html

Last active February 13, 2018 13:51

An example when you need dynamic properties inside of an angular animation and need to implement the animation in ts code and not in the animation DSL

	<card (click)="clicked()">
	<card-content>
	<card-title [ngStyle]="{'font-size': fontsize}">{{itemDetails.name}}</ion-card-title>
	<icon [svgIcon]="itemDetails.icon" [style.height.px]="iconWidthHeight"
	[style.width.px]="iconWidthHeight" ></icon>
	</card-content>
	</card>

marcorinck / dropshadow.html

Created December 6, 2016 09:14

svg wave with dropshadow

	<svg viewBox="0 0 500 500" preserveAspectRatio="xMinYMin meet">
	<defs xmlns="http://www.w3.org/2000/svg">
	<filter id="dropshadow" height="130%">
	<feGaussianBlur in="SourceAlpha" stdDeviation="3" />
	<feOffset dx="2" dy="2" result="offsetblur" />
	<feComponentTransfer xmlns="http://www.w3.org/2000/svg">
	<feFuncA type="linear" slope="0.4" />
	</feComponentTransfer>
	<feMerge>
	<feMergeNode/>

marcorinck / blueprint

Created August 25, 2013 07:11

AngularJS directive blueprint

	var myModule = angular.module(...);
	myModule.directive('directiveName', function (injectables) {
	return {
	restrict: 'A',
	template: '<div></div>',
	templateUrl: 'directive.html',
	replace: false,
	priority: 0,
	transclude: false,
	scope: false,

Marco Rinck marcorinck