Skip to content

Instantly share code, notes, and snippets.

Avatar
🏠
Working from home

Duarte Monteiro du5rte

🏠
Working from home
View GitHub Profile
View use-hover-alt-example.js
import { useState, useCallback, useRef } from "react";
// Usage
function App() {
const [hoverRef, isHovered] = useHover();
return (
<div ref={hoverRef}>
{isHovered ? '😁' : '☹️'}
</div>
View [React] forwardRef + useRef
const Button = forwardRef<CoralButton, ButtonProps>((props, ref) => {
const { children, onClick, title, ...coralButtonProps } = props;
const buttonRef = useRef<CoralButton>(null);
useLayoutEffect(() => {
if (ref) {
if (isFunction(ref)) {
ref(buttonRef.current);
} else {
@bittner
bittner / keyboard-keys.md
Created Feb 28, 2019
Keyboard keys markup in MarkDown
View keyboard-keys.md

Ctrl + Alt + Space

@branneman
branneman / salt-hash-password.js
Last active Jul 10, 2021
Node.js: Create salted hashed password
View salt-hash-password.js
const crypto = require('crypto')
const { promisify } = require('util')
const pbkdf2 = promisify(crypto.pbkdf2)
module.exports = { createHashPasswordFn, isPasswordCorrect }
/**
* @typedef {Object} HashPassword
* @property {String} hash
* @property {String} salt
@primaryobjects
primaryobjects / m3u8.md
Last active Dec 5, 2021
How to download m3u8 and ts video movie streams.
View m3u8.md

m3u8 Downloading

  1. Open Chrome Developer tools and click the Network tab.
  2. Navigate to the page with the video and get it to start playing.
  3. Filter the list of files to "m3u8".
  4. Find master.m3u8 or index.m3u8 and click on it.
  5. Save the file to disk and look inside it.
  6. If the file contains a single m3u8 master url, copy that one instead.
  7. Run the program m3u8x.
  8. Paste the same m3u8 url in both textboxes (URL and Quality URL) and click "Headers" and set the referral url and user-agent from the request as found in Chrome.
@laem
laem / HoverDecorator.jsx
Last active May 8, 2017
React Hover Component Decorator
View HoverDecorator.jsx
import React, {Component} from 'react'
export default DecoratedComponent =>
class extends Component {
state = {
hover: false,
}
toggleHover = () =>
this.setState({hover: !this.state.hover})
render() {
@lopspower
lopspower / README.md
Last active Dec 4, 2021
Hexadecimal color code for transparency
View README.md

Hexadecimal color code for transparency

Twitter

How to set transparency with hex value ?

For example, you want to set 40% alpha transparence to #000000 (black color), you need to add 66 like this #66000000.

Download This sample on Google Play Store

@miracle2k
miracle2k / example.js
Created Sep 26, 2015
Simplify relay using decorators
View example.js
@relayRoot
@relayContainer({
client: () => Relay.QL`
fragment on Client {
id,
menuitems(first: 50) {
}
}
`
})
@svnlto
svnlto / index.js
Created Jun 4, 2015
FileReader Promise Helper
View index.js
const readFile = (file) => {
let reader = new global.FileReader();
return new Promise((resolve, reject) => {
reader.onload = (event) => {
file.data = event.target. result;
resolve(file);
};
reader.onerror = () => {
@jrtaylor-com
jrtaylor-com / youtubeDurationToSeconds
Created May 1, 2015
Parse Youtube v3 API Duration to seconds with Javascript
View youtubeDurationToSeconds
function youtubeDurationToSeconds(duration) {
var hours = 0;
var minutes = 0;
var seconds = 0;
// Remove PT from string ref: https://developers.google.com/youtube/v3/docs/videos#contentDetails.duration
duration = duration.replace('PT','');
// If the string contains hours parse it and remove it from our duration string
if (duration.indexOf('H') > -1) {