Skip to content

Instantly share code, notes, and snippets.

@ryansutc
ryansutc / CustomPngLayer.js
Last active July 22, 2022 17:10
A Snippet of a Custom BaseTileLayer rendering, serverside, a png layer
let CustomTileLayer = BaseTileLayer.createSubclass({
properties: {
urlTemplate: null,
},
getTileUrl: function (level, row, col) {
return this.urlTemplate
.replace("{z}", level)
.replace("{x}", col)
.replace("{y}", row);
},
@ryansutc
ryansutc / readme.md
Created January 10, 2022 19:52
Layer Load Slow

Set your source to a point layer with millions of points Set the center of the map to where data exists Load the map.

@ryansutc
ryansutc / precommit.sh
Last active June 25, 2021 20:24
This is a template [git hook](https://git-scm.com/book/en/v2/Customizing-Git-Git-Hooks) for Motionary (or any javascript repo). The below file is intended as a client-side pre-commit hook that will prevent you from accidentally committing code with prohibited keywords: `debugger` <-- never worry about accidentally committing a file with this aga…
#!/bin/sh
#
# An example hook script to verify what is about to be committed.
# Called by "git commit" with no arguments. The hook should
# exit with non-zero status after issuing an appropriate message if
# it wants to stop the commit.
#
# To enable this hook, rename this file to "pre-commit".
if git rev-parse --verify HEAD >/dev/null 2>&1
@ryansutc
ryansutc / DateTimeFormatter.js
Created December 22, 2020 19:23
A good datetime formatter Curry Example
// Helper function to curry 2 arg functions
const curry = f => b => a => f(a,b);
// oh look, a 2 arg function!
function formatDateForLabeling(dateString, format='yyyymmdd') {
let d = new Date(0);
d.setUTCSeconds(dateString);
if(format === 'mmddyyyy') {
return new Intl.DateTimeFormat('en-US', {timeZone: 'UTC'}).format(d);
}
@ryansutc
ryansutc / HelloWorld.tsx
Last active January 4, 2020 22:02
An Old ESRI Widget Hello World Sample
/// <amd-dependency path="esri/core/tsSupport/declareExtendsHelper" name="__extends" />
/// <amd-dependency path="esri/core/tsSupport/decorateHelper" name="__decorate" />
import { subclass, declared, property } from "esri/core/accessorSupport/decorators";
import Widget from "esri/widgets/Widget";
import { renderable, tsx } from "esri/widgets/support/widget";
tsx; // Reference tsx here, this will be used after compilation to JavaScript
const CSS = {
base: "esri-hello-world",
@ryansutc
ryansutc / docker_quick_ref.md
Last active November 11, 2019 06:15
Docker Quick Reference

Docker Quick Reference

Docker CLI client

the docker cli client lets you manage your images & containers via a wrapper on api:

Get docker comfiguration:

docker system info

Create a docker image tagged w. a name w. docker build:

@ryansutc
ryansutc / UnixShellReference.md
Last active August 25, 2019 02:38
Unix Shell Commands Quick Reference

Quick Guide to Common Commands for Digital Ocean Ubuntu Management

SSH Connections and File Transfer:

(requires PuTTy on Windows)

pscp -i [your ppk key exported from Putty] [path/to/local/file] [user@ipaddress:/path/to/server/file]

upload files to server via ssh in terminal

@ryansutc
ryansutc / vscode_react_setup.md
Last active January 4, 2020 22:04
How to Set up VSCode Remote Debugging with a React App

Break and Step-through App in VSCode with Chrome Dev Tools

Sometimes it's nice to be able to step through code directly in VSCode, setting breakpoints and watching variables. Here's tentatively how you can do it with our React app:

  1. Install VSCode Extension Debugger for Chrome.

  2. Add Configuration to your Launch.json as per below to launch Chrome [Source]

  3. Add argument for "runtimeArgs" as per github suggestion here to get your Redux extension running in the VSCode Chrome browser.

@ryansutc
ryansutc / material-ui-notes.md
Last active July 29, 2019 05:14
Material UI Notes

React Material UI Notes & Links

Material UI Elements:

  • : The most basic UI element. Centers content horizontally.
  • : An element that isolates/wraps css styles.
  • : allows page layout grid control on 12-column grid layout. e.g.: <Grid item xs={12} sm={6}><Paper className={classes.paper}>Test</Paper>

Material UI Properties:

item: pass the item property to components inside a container component so that they become items.