Skip to content

Instantly share code, notes, and snippets.

View fabiobiondi's full-sized avatar

Fabio Biondi fabiobiondi

View GitHub Profile
@fabiobiondi
fabiobiondi / AAA
Last active November 24, 2022 00:56
• [title](url)
@fabiobiondi
fabiobiondi / ngrx-cdk-drag-utils.ts
Last active December 11, 2020 02:57
Angular CDK drag-utils: rewritten to work with NGRX & Immutability
// Angular CDK Drag Utils source: https://github.com/angular/components/blob/master/src/cdk/drag-drop/drag-utils.ts
/**
* Moves an item one index in an array to another.
* @param arraySource Array in which to move the item.
* @param fromIndex Starting index of the item.
* @param toIndex Index to which the item should be moved.
*/
export function moveItemInArray<T = any>(arraySource: T[], fromIndex: number, toIndex: number): T[] {
const array = JSON.parse(JSON.stringify(arraySource));
@fabiobiondi
fabiobiondi / app.component.ts
Created June 2, 2019 20:20
Angular 8: Custom Form Control (stars) with Control Value Accessor
import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
@Component({
selector: 'app-demo',
template: `
<form [formGroup]="form">
<input type="text" formControlName="yourname">
<app-stars formControlName="stars"></app-stars>
</form>
@fabiobiondi
fabiobiondi / 1. highcharts.component.ts
Last active May 17, 2018 16:00
Simple HighChart component in Angular 5
import { AfterViewInit, Component, ElementRef, Input, OnChanges, SimpleChanges, ViewChild } from '@angular/core';
import { HighChartService } from './highchart.service';
@Component({
selector: 'fb-highchart',
template: '<div *ngIf="config"></div>',
providers: [HighChartService]
})
export class HighChartComponent implements OnChanges, AfterViewInit {
@Input() config: any;
@fabiobiondi
fabiobiondi / gist:1938e555a36179f858018a1878b459b0
Created July 21, 2017 22:54
ES6 - Class - Preserving context with arrow syntax
class MyClass {
text = 'Mario';
constructor() {
setTimeout(() => console.log(this.text), 1000);
}
}
var a = new MyClass();
@fabiobiondi
fabiobiondi / hello-panel.component.js
Last active September 19, 2016 14:35
Angular 1.5 Component Test
'use strict';
angular.module('myHelloModule', [])
.component('helloPanel', {
bindings: {
title: '@',
body: '<'
},
templateUrl: 'app/hello-panel.tpl.html',
controller: function() {
@fabiobiondi
fabiobiondi / App.js
Last active April 14, 2019 17:21
EaselJS and HTML5 Canvas - ES6 Custom Display Objects (based on ES5 version: http://www.createjs.com/tutorials/Inheritance/)
import CircleButton from './CircleButton';
// Init stage
const stage = new createjs.Stage("demo");
// Button black
const btn = new CircleButton('Hi');
btn.x = 50; btn.y = 50;
stage.addChild(btn);
@fabiobiondi
fabiobiondi / MyButton.js
Last active January 3, 2016 16:23
EaselJS Custom Display Object in ES6 - v.0.0.2 - DOESN'T WORK (to delete in feb 2016)
class MyButton extends createjs.Container{
constructor(color) {
super();
this.radius = 40;
this.color = color || 'grey';
}
// NOTE: draw is never invoked! :(
draw() {
@fabiobiondi
fabiobiondi / App.js
Last active January 2, 2016 22:16
EaselJS Custom Display Object in ES6 - v.0.0.1
import MyButton from './MyButton.js';
const stage = new createjs.Stage("demo");
const btn = new MyButton('red');
stage.addChild(btn);
btn.x = 100;
btn.y = 100;
stage.update();
@fabiobiondi
fabiobiondi / index.html
Last active August 29, 2015 14:07
D3 SVG displayy
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://d3js.org/d3.v3.min.js"></script>
</head>
<body>
<script type="text/javascript">