| import React from "react"; | |
| /** | |
| * Hide loading states from the user unless they exceed a minimum of `wait` ms, and | |
| * once shown, display them for a minimum of `minLength` ms. | |
| */ | |
| export function usePending(loading: boolean, wait = 0, minLength: number = 0) { | |
| let [, forceRender] = React.useState<any>(); | |
| // The buffered loading value |
Make web workers fun!
This tiny library allows you use web workers via asynchronous proxy functions! No more struggling with mesages and event handlers - all this is done automatically. Exposed worker functions return promises resolving with their results.
| import "./styles.css"; | |
| import { useMemo, createElement } from "react"; | |
| import { parse, TextNode, ElementNode, RootNode } from "svg-parser"; | |
| import { | |
| Document, | |
| Page, | |
| PDFDownloadLink, |
I've made some changes to this to improve performance. Running prepare.sh takes too long on my CloudKey Gen 2, so I installed the qemu libraries to run it on my desktop where I will be extracting videos. The author of the remux utility has instructions for how to do this on the README.
I'm running seven total cameras and will synchronize all of the data to my Synology NAS, and from there I'll run the remux utility to extract videos. This is still a work in progress but I will eventually have all of this documented under my Unifi Protect Extract repository.
Requirements:
sync.sh saved to the user's home.Fill out the variables in the sync.sh script and run it. It will only pull the standard ubv files that are written by Protect and skip timelapse and others. I found it easier to just synchronize the whole hierarchy than ha
| import _ from 'lodash' | |
| import qs from 'qs' | |
| // @see https://www.contentful.com/developers/docs/references/images-api/#/reference/resizing-&-cropping/specify-width-&-height | |
| const CONTENTFUL_IMAGE_MAX_SIZE = 4000 | |
| const isImage = image => | |
| _.includes( | |
| [`image/jpeg`, `image/jpg`, `image/png`, `image/webp`, `image/gif`], | |
| _.get(image, `file.contentType`) | |
| ) |
| MAILCHIMP_API_KEY="...-us19" | |
| MAILCHIMP_LIST_ID="..." |
⚠️ Note 2023-01-21
Some things have changed since I originally wrote this in 2016. I have updated a few minor details, and the advice is still broadly the same, but there are some new Cloudflare features you can (and should) take advantage of. In particular, pay attention to Trevor Stevens' comment here from 22 January 2022, and Matt Stenson's useful caching advice. In addition, Backblaze, with whom Cloudflare are a Bandwidth Alliance partner, have published their own guide detailing how to use Cloudflare's Web Workers to cache content from B2 private buckets. That is worth reading,
| // React SSR renders out <meta tags with URL-encoded values. | |
| // That's bad if you need query parameters in your URLs. | |
| // Before: <meta property="og:image" | |
| // content="https://makelight-prismic-images.imgix.net/7f97d951970bbb15a8b3744e4c69499ffe969d66_img_1010.jpg?w=1200&h=630&fit=crop&crop=entropy&auto=format&ixlib=js-1.1.1" class="next-head"/> | |
| // (Notice the &s in the URL) | |
| // | |
| // After: <meta property="og:image" | |
| // content="https://makelight-prismic-images.imgix.net/cfb3a074bfcab5793eded64ef077dd6260d6d89b_img_0578.jpg?w=1200&h=630&fit=crop&crop=entropy&auto=format&ixlib=js-1.1.1" class="next-head"/> | |
| // (Notice & is now correctly & | |
| // |
| import React from 'react'; | |
| import ListMovementMixin from 'react-widgets/lib/mixins/ListMovementMixin'; | |
| import List from 'react-widgets/lib/List'; | |
| import ListOption from 'react-widgets/lib/ListOption'; | |
| import { dataText } from 'react-widgets/lib/util/dataHelpers'; | |
| import cn from 'classnames'; | |
| import BaseVirtualList from 'react-list'; | |
| let VirtualList = React.createClass({ |
| // General hints on defining types with constraints or invariants | |
| // | |
| // Just as in C#, use a private constructor | |
| // and expose "factory" methods that enforce the constraints | |
| // | |
| // In F#, only classes can have private constructors with public members. | |
| // | |
| // If you want to use the record and DU types, the whole type becomes | |
| // private, which means that you also need to provide: | |
| // * a constructor function ("create"). |
