John Cox

Blogs · @wyome · Now · Shelf

Interesting

What Are Packaged Apps? - Google Chrome

Google's developer overview pitches Chrome Apps, built with HTML5, CSS, and JavaScript, as a way to get near-native app experiences while reaching Windows, OS X, Linux, mobile (via Cordova), and Chromebooks, where it claims a Chrome App is the only way to install software. It argues they go beyond ordinary web apps by running without the browser's address bar and tab strip, appearing in the Chrome App Launcher and Spotlight, and accessing the file system and hardware such as USB and Bluetooth. It singles out device manufacturers, educators, and health care providers as the most natural audiences, citing Google Classroom and a pediatric service that saved tens of thousands of dollars.

Permalink

Leaflet - a JavaScript library for mobile-friendly maps

This is the Leaflet homepage, pitching it as a lightweight (about 42 KB), dependency-free open-source JavaScript library for mobile-friendly interactive maps. It includes a short working example (a map centered on London with OpenStreetMap tiles and a marker with a popup) and a feature rundown covering layers, touch and mouse interaction, animation, CSS-based customization, mobile performance tuning, and browser support back to IE 9 and Safari 5. Its stated philosophy is to do the basics perfectly rather than everything, leaving the rest to plugins, and it closes with a call for community involvement through bug reports, docs, Q&A help, and pull requests, noting that Volodymyr Agafonkin started it but a broad contributor base now maintains it.

Permalink

Making it Work: Flat Design and Color Trends - Designmodo

A Designmodo guide to choosing colors for flat design, the style that drops shadows, bevels, and gradients. It argues that flat palettes break traditional color-pairing rules and use more hues, as long as the colors match in tone and saturation. It then sorts the options into three schemes: bright, fully saturated colors that pop on light or dark backgrounds; muted retro palettes heavy on orange, yellow, and dark blue; and monotone palettes built from one base color plus tints (100, 50, 20, and 8 percent). Along the way it points to FlatUIColors.com and Designmodo's own free Flat UI kit as starting points.

Permalink

The Biggest Price-Fixing Scandal Ever - Politics News

Matt Taibbi argues that the Libor scandal was not an isolated event but a sign of a systemic flaw: benchmark prices set from unverified, voluntarily submitted data by the same banks that profit from them. He ties Libor to a newer investigation of ICAP and up to 15 big banks over ISDAfix, the benchmark for a $379 trillion interest-rate swap market, including possible delays in publishing swap prices by a small New Jersey desk nicknamed "Treasure Island". He also covers probes into gold and silver pricing, and the March 2013 dismissal of a major Libor class action, in which the banks' lawyers won by arguing that Libor was never a competitive process. Together with the lenient settlements and the Justice Department's reluctance to prosecute, he says this leaves manipulation largely unchecked and likely to spread to other markets.

Permalink

Fullscreen Layout with Page Transitions

This is a Codrops demo page for a responsive layout that starts as a grid of four boxes. Clicking a box expands it to fullscreen while the others scale down and fade out. The work section tries a different transition, where a panel rises from the bottom as the current one scales back, and you see it by opening a portfolio item and navigating through the others. The rest of the page is placeholder hipster-ipsum text for the blog, contact and portfolio sections, with illustrations credited to Isaac Montemayor, so what's worth keeping is the layout and transition technique, not the content.

Permalink

List of Pseudo-Elements to Style Form Controls - TJ VanToll - Tutorials, Thoughts, and Ramblings on Front End Development

A 2013 reference catalogue of the vendor-prefixed pseudo-elements that let you style native form controls in Trident (IE10), Gecko (Firefox) and WebKit/Blink, organized by input type and element (date, file, range, progress, meter, select, textarea, placeholder and so on). Each entry gives the pseudo-element names, a short CSS example and a screenshot, along with practical gotchas: WebKit often needs `-webkit-appearance: none` before styling takes effect, Gecko's default `::-moz-focus-inner` padding causes button inconsistencies, and the WebKit validation-bubble hooks were removed in Chrome 28. Worth keeping as a lookup for what each engine exposed, though the browser versions and coverage are dated.

Permalink

Tooltipster - The jQuery Tooltip Plugin

This is the documentation page for Tooltipster, an early jQuery plugin that turns an element's title attribute into a CSS-styled tooltip. It walks through setup (load the CSS and JS, add a class, call `.tooltipster()`), then covers the full options list (animation, position, trigger, interactive, touch and icon settings, fixed and max width, callbacks) and custom themes via CSS classes. The advanced section is the part worth returning to: an API for showing, hiding, disabling, updating and destroying tooltips, plus a recipe for loading and caching tooltip content over AJAX with `functionBefore`.

Permalink

How FriendFeed uses MySQL to store schema-less data - Bret Taylor's blog

FriendFeed explains how it escaped the pain of schema changes and index builds on huge sharded MySQL tables (locks lasting hours, error-prone master/slave swaps) without adopting an immature NoSQL store like CouchDB. It built a schema-less layer on MySQL instead: entities are stored as compressed property bags in one table, and each index lives in its own table that is populated asynchronously by a background "Cleaner" process, with joins done in Python. Consistency is deliberately loosened, so the entity table is canonical, indexes may be stale, and queries re-filter results against the actual entity values, which let the team add or drop indexes within a day and produced a marked, stable drop in page latency.

Permalink

AmplifyJS - A Component Library for jQuery

AmplifyJS is a small JavaScript library that bundles three tools behind simple APIs: amplify.request for abstracting Ajax and other data sources (with optional transformation before the data is used), amplify.publish/subscribe for letting client-side components talk to each other, and amplify.store for persistent browser and mobile storage. The store wraps localStorage and sessionStorage and falls back on non-standard methods in older browsers, so saving data is as simple as amplify.store(key, data). This is the project's home page, announcing the 1.1.0 release on November 8th and offering the library under either the MIT or GPL v2 license, with MIT recommended and commercial use allowed as long as the copyright header stays.

Permalink

Parsley.js

This is the landing page for Parsley, a JavaScript library (v2.9.2) for validating forms on the frontend, pitched mainly on its declarative approach: you state requirements in plain English as attributes on your HTML form tags, so simple validation needs no JavaScript at all. It also watches the DOM and adapts automatically when fields are added, removed, or edited, and it ships with a dozen-plus built-in validators, plus an Ajax validator and community extensions. The page stresses that nearly every default behavior can be overridden for UI/UX purposes, and claims heavy testing and broad browser support, down to IE8.

Permalink

Twelve South

This is a Twelve South product page announcing Gold and Silver finishes for its travel accessories: the AirFly Pro 2 Bluetooth transmitter, the PowerClip power bank, a personalized cactus-leather Luggage Tag, and the 7.5 in. Valet charging organizer. It also promotes a 20% discount on the PowerBug 15W charger, free US shipping on orders over $85, and a two-year warranty. The page is a retail storefront with no real editorial argument, and its brand blurb credits the company's 2009 start to Apple-inspired design and to products like BookBook and BookArc. It is worth keeping mainly as a record of this collection and its offers.

Permalink

10+ JavaScript Shorthand Coding Techniques | jQuery4u

A running list of JavaScript shorthand idioms, each paired with its longhand equivalent, that grew to 19 entries by a May 2013 update. It covers ternaries, `||` defaults, array and object literals, compound assignment operators, regex literals, lookup tables and object maps in place of switch or else-if chains, `1e7` exponents, `while(i--)` loops, `indexOf` for multi-value checks, and the double bitwise NOT as a `Math.floor` substitute. It is a reference catalogue of code-golf-style tricks for saving keystrokes, and some entries, like the null-check example, are not strictly equivalent to the longhand they replace.

Permalink

Cheaters - BrettTerpstra.com

Cheaters is Brett Terpstra's expansion of a Macdrifter idea: a folder of HTML and Markdown cheat sheets served from a local server and shown in a floating Automator or Fluid popup window while you work in other apps. The page covers setup, then how to add sheets (Markdown with JSON metadata for custom IDs, CSS, and multicolumn layout, or plain HTML, or images converted from PDFs) and how to edit the nav list that builds the menu. It also documents the navigation tools: URL-hash deep linking with fuzzy name matching, an "f" fast switcher that doubles as a DuckDuckGo/Stack Overflow/GitHub search launcher, vim-style scrolling keys, and a `Cheaters.switchTo()` JavaScript call for scripting with AppleScript or launchers.

Permalink