Skip to content

Instantly share code, notes, and snippets.

View barneycarroll's full-sized avatar
🛠️
Working on Mithril type stuff

Barney Carroll barneycarroll

🛠️
Working on Mithril type stuff
View GitHub Profile
@barneycarroll
barneycarroll / disable-zoom.js
Created April 3, 2024 06:17
Selectively disable mobile browser zoom on input focus
// Disable mobile zoom on focus
{
// Customise the selector value as necessary
const selector = '[data-nozoom]'
const $viewport =
document.querySelector('meta[name=viewport]')
??
Object.assign(document.createElement('meta'), {name: 'viewport'})
const $scale0 = Object.assign($viewport.cloneNode(), {content: 'user-scalable=0'})
@barneycarroll
barneycarroll / grid-tables-reset.css
Last active March 18, 2024 10:24
Grid tables reset
@property --columns {
syntax: '<integer>';
inherits: false;
initial-value: 1;
}
table {
display: grid;
grid-template-columns: repeat(var(--columns, 1), auto);
}
@barneycarroll
barneycarroll / inline-separators.css
Last active February 27, 2023 15:01
Inline separators
.inline-separators {
--separator : ' | ';
--size : .75em;
clip-path : inset(-100vh -100vw -100vh 0);
}
.inline-separators:dir(rtl) {
clip-path : inset(0 -100vh -100vw -100vh);
}
@barneycarroll
barneycarroll / rest_spread.js
Created November 24, 2022 19:23
WIP for a little demonstration of the various functions of ... operators in Javascript
const object = {a: 1, b: 2}
const array = [3,4]
// Value expression
const foo = {...object, c: 3} // == {a: 1, b: 2, c: 3}
const bar = [...array, 5, 6] // == [3, 4, 5, 6]
// Destructuring assignment
{
const {a, ...rest} = foo // a == {a: 1}; rest == {b: 2, c: 3}

THE DRAWING IN INDIA INK

Hjalmar Söderberg translated by Charles Wharton Stork

One day in April many years ago, in the time when I still wondered about the meaning of life, I went into a little cigar booth on a back street to buy a cigar. I selected a dark and angular El Zelo, stuffed it into my case, paid for it, and made ready to go. But at that moment it occurred to me to show the young girl who stood in the booth, and of whom I used often to buy my cigars, a little sketch in India ink, which I happened to have lying in a portfolio. I had got it from a young artist, and to my thinking it was very fine. “Look here,” said I, handing it to her. “What do you think of that?” She took it in her hand with interested curiosity and looked at it very long and closely. She turned it in various directions, and her face took on an expression of strained mental activity. “Well, what does it mean?” she asked finally with an inquisitive glance. I was a little surprised.

@barneycarroll
barneycarroll / .js
Created July 27, 2022 10:55
Using modules not components for associated functionalities, with state management left to application space
import {ordinals, defaultRange, rangeFromOrdinal, Calendar} from './DateRange.js'
const state = {
...rangeFromOrdinal('Today'),
showCalendar : false,
}
m.mount(document.body, {
view: () => [
m('form',
@barneycarroll
barneycarroll / perception-color.js
Created July 11, 2022 07:30
The iterative colour picker script from the Perception Census 2022 'Fundamentals of Perception' at https://perceptioncensus.dreamachine.world/
function addClick(){
colorPickerStatus.nClicks = colorPickerStatus.nClicks + 1;
}
function restartClicks() {
colorPickerStatus.nClicks = 0;
}
function restartPicker() {
colorPickerStatus.nClicks = 0;
@barneycarroll
barneycarroll / AutoGrid.js
Last active July 7, 2022 14:59
A component that consumes a populated CSS grid container and applies column styles according to bin packing optimisation
import m from 'mithril'
import O from 'mergerino'
import {viewOf} from 'mithril-machine-tools'
export default Simple
export function Simple(){
let size = 0
let column = 0
let slot
@barneycarroll
barneycarroll / bootstrap.forms.extra.css
Created July 4, 2022 06:15
Bootstrap form extensions 🫠
/* Default style extends .5em of empty space */
.form-switch {
padding-left: 2em;
}
.form-switch .form-check-input {
margin-left: -2em;
}
/* Bootstrap default switch input assumes extra valence in on state */
.form-switch .form-check-input:checked {
export default generator =>
new Proxy(generator, {apply(){
return recorder(
generator, this, arguments
)
}})
function recorder([generator, context, args], ...records){
const iterator = generator.apply(context, args)