Skip to content

Instantly share code, notes, and snippets.

View monbang's full-sized avatar
🌴
On vacation

monbang

🌴
On vacation
2 followers · 7 following
View GitHub Profile
@monbang
monbang / photo upload preview on form
Created March 22, 2020 04:46
Photo upload preview on form
function readURL(input) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function(e) {
$('#blah').attr('src', e.target.result);
}
reader.readAsDataURL(input.files[0]);
}
@monbang
monbang / .vimrc
Created March 22, 2020 09:36
set nocp
call plug#begin()
Plug 'tpope/vim-sensible'
Plug 'editorconfig/editorconfig-vim'
Plug 'qpkorr/vim-bufkill'
Plug 'justinmk/vim-sneak'
Plug 'sheerun/vim-polyglot'
Plug 'ctrlpvim/ctrlp.vim'
@monbang
monbang / gist:6680b2b00ffba0400e82cce0fdcabf74
Last active March 25, 2020 18:46
js-addEventListener
window.addEventListener('keydown', (e) => {
const audio = document.querySelector(`audio[data-key="${e.keyCode}"]`);
const key = document.querySelector(`.key[data-key="${e.keyCode}"]`);
if (!audio) return;
audio.currentTime = 0;
audio.play();
key.classList.add('playing');
key.classList.remove('playing');
key.classList.toggle('playing');
key.classList.contains('playing');
@monbang
monbang / gist:063dd1b38c5924f90aedfdc69719e408
Last active March 25, 2020 16:21
js-update css variables
const inputs = document.querySelectorAll('.controls input');
function handleUpdate() {
const suffix = this.dataset.sizing || ''; // data-sizing='something'
document.documentElement.style.setProperty(`--${this.name}`, this.value); // css variable
}
inputs.forEach(input => input.addEventListener('change', handleUpdate));
inputs.forEach(input => input.addEventListener('mousemove', handleUpdate));
@monbang
monbang / js array func
Created March 25, 2020 17:11
js array functions
// filter active items
const filtered = items.filter(item => item.isActive == 10);
// map name and title
const mapped = items.map(item => `${item.name} ${item.title}`);
// sort the item by year, oldest to yongest
const sorted = items.sort((a, b) => a.year > b.year ? 1 : -1);
// calculate total
@monbang
monbang / eloquent 1
Last active March 27, 2020 15:05
eloquent 1
<?php
Schema::create('users', function(Blueprint $table) {
$table->bigIncrements('id');
$table->username('string')->unique();
$table->password();
});
Schema::create('articles', function(Blueprint $table) {
$table->bigIncrements('id');
@monbang
monbang / example.html
Created March 27, 2020 17:16 — forked from JeffreyWay/example.html
Floating navigation bar example using the Intersection Observer API https://laracasts.com/series/how-do-i/episodes/25
<!DOCTYPE html>
<html>
<head>
<title>Floating Navigation</title>
<link href="https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css" rel="stylesheet">
<style>
@keyframes slide-nav-down {
100% {
transform: translateY(0);
}
@monbang
monbang / alpine-1
Created March 31, 2020 11:14
alpine-1
<div x-data="{ count: 0 }">
<button @click="count++">+</button>
<button @click="count--">-</button>
<span x-text="count"></span>
</div>
let dataString = document.querySelector('[x-data]').getAttribute('x-data');
let data = eval(`(${dataString})`)
@monbang
monbang / formbutton php
Created March 31, 2020 11:17
formbutton-php
<form action="{{ $action }}" method="post">
@csrf
@method($method ?? 'post')
<button type="submit">{{ $slot }}</button>
</form>
<x-form-button :action="route('doSomething')">
Do something
<x-form-button />
@monbang
monbang / SOLID laracast
Last active March 31, 2020 14:57
SOLID-laracast
<?php
namespace Acme\Reporting;
use Auth, DB, Exception;
class SalesReporter
{
public functon between($startDate, $endDate) {