NathanWalker’s gists

NathanWalker / gist:1317118

Created October 26, 2011 17:45

global.css

	/* GLOBAL FONT DEFINITIONS
	************************************/
	@font-face {
	font-family: 'OptionSansMediumRegular';
	src: url('fonts/optionsansmedium-webfont.eot');
	src: local('☺'), url('fonts/optionsansmedium-webfont.woff') format('woff'), url('fonts/optionsansmedium-webfont.ttf') format('truetype'), url('fonts/optionsansmedium-webfont.svg#webfontAy7aGrJL') format('svg');
	font-weight: normal;
	font-style: normal;
	}

NathanWalker / gist:7881918

Created December 9, 2013 22:11

IE 8 / 9 support for vertical pages and infowrap login.

	<!--[if (IE 8)\|(IE 9)]>

	if(isProduction) {
	<script src="/components/infowrap-xdomain/dist/0.5/xdomain.min.js" data-slave="https://api.infowrap.com/compatibility/proxy.html"></script>
	} else if(isStaging) {
	<script src="/components/infowrap-xdomain/dist/0.5/xdomain.min.js" data-slave="https://api-staging.infowrap.com/compatibility/proxy-staging.html"></script>
	}

	<![endif]-->

NathanWalker / app.component.ts

Last active December 13, 2017 15:54

NativeScript: Wire up RadSideDrawer from 'nativescript-telerik-ui' with Angular2 taking full advantage of Router

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

	@Component({
	moduleId: module.id,
	selector: 'app',
	template: `
	<StackLayout>
	<page-router-outlet></page-router-outlet>
	</StackLayout>

NathanWalker / base.component.ts

Created August 30, 2016 16:04

An Angular 2 custom Component decorator which sets ViewEncapsulation.None to all components that use it.

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

	declare var Reflect: any;
	const _reflect: any = Reflect;

	// Usage:
	// @BaseComponent({ etc... })

	export function BaseComponent(metadata: any = {}) {

NathanWalker / listview-directives.js

Last active June 1, 2018 14:32

Use nativescript-telerik-ui with Angular rc.6: After `npm i` in your project, replace `node_modules/nativescript-telerik-ui/listview/angular/listview-directives.js` and `node_modules/nativescript-telerik-ui/sidedrawer/angular/side-drawer-directives.js` with the following...

	var core_1 = require('@angular/core');
	var elementRegistry = require('nativescript-angular/element-registry');
	var _1 = require('./../');
	var layout_base_1 = require('ui/layouts/layout-base');
	var observable_array_1 = require('data/observable-array');
	var ListItemContext = (function (_super) {
	__extends(ListItemContext, _super);
	function ListItemContext($implicit, item, index, even, odd) {
	_super.call(this, item);
	this.$implicit = $implicit;

NathanWalker / animate.directive.ts

Last active January 21, 2019 01:09

NativeScript for Angular animate directive for silky smooth mobile (iOS/Android) animations anytime, anywhere and on anything.

	/**
	* Add this to your app's SharedModule declarations
	*/

	import { Directive, ElementRef, Input } from '@angular/core';

	// nativescript
	import { View } from 'tns-core-modules/ui/core/view';
	import { Animation, AnimationDefinition } from 'tns-core-modules/ui/animation';

NathanWalker / platform.ts

Created March 21, 2018 18:01

NativeScript utility: isIPhoneX detection

	import { isIOS } from 'tns-core-modules/platform';

	let iPhoneX;

	export function isIPhoneX() {
	if (isIOS) {
	if (typeof iPhoneX === 'undefined') {
	const _SYS_NAMELEN: number = 256;

	const buffer: any = interop.alloc(5 * _SYS_NAMELEN);

NathanWalker / fixAndroidScrollMomentum

Created April 21, 2020 01:36

Invert NativeScript ListView trick to feed chat items in from bottom up (Android workaround for proper momentum scroll on API level 28)

	export function fixAndroidScrollMomentum(listview: ListView) {
	if (android.os.Build.VERSION.SDK_INT !== 28) {
	return;
	}
	// suppress the default momentum behaviour
	listview.android.setVelocityScale(0);
	// stores the last 5 move events in this array
	let lastMoveEvents = [];
	(<any>listview).on(GestureTypes.touch, (args, b) => {
	if (args.action === 'up') {

NathanWalker / core.module.ts

Last active June 6, 2020 15:31

xplat storage service which uses localStorage on the web and ApplicationSettings on mobile.

	// /xplat/nativescript/core/core.module.ts

	import { MobileStorageService } from './services/mobile-storage.service';
	// Add this to providers, for example:

	@NgModule({
	imports: [
	NativeScriptModule,
	...
	CoreModule.forRoot([

NathanWalker / webpack.config.js

Last active June 28, 2020 01:44

webpack to work with @nativescript/core and alias tns-core-modules

	const { join, relative, resolve, sep, dirname } = require('path');

	const webpack = require('webpack');
	const nsWebpack = require('nativescript-dev-webpack');
	const nativescriptTarget = require('nativescript-dev-webpack/nativescript-target');
	const {
	nsReplaceBootstrap
	} = require('nativescript-dev-webpack/transformers/ns-replace-bootstrap');
	const {
	nsReplaceLazyLoader

Nathan Walker NathanWalker