Add support for responsive built-in Gutenberg embed blocks in Wordpress

Have you had problems with not having responsive embeds in WordPress? Well seems like it is just turned off by default.

Custom taxonomy not showing up in the Gutenberg post editor?

This is just one of those things I keep on forgetting. Almost every single time. When creating a custom taxonomy in Wordpress it will not show up in the Gutenberg editor unless REST support is activated for the taxonomy.

Npm module classnames in PHP

Sometimes you find utilities that you just love, classnames in npm is one such thing. I've made a port of it in PHP.

Request throttle for npm package website-scraper

A throttling plugin for the npm package website-scraper.

Fix jittering / flickering interface when navigating in react-native

I've had an issue in a react-native project where the interface kept jumping around or flickered when navigating between screens with react-navigation. Whenever you press a button on the bottom-tab-navigator or when you navigate to another screen, the whole UI flicker.

Different ways to implement a circular / infinite animation in react-native

I had to implement a simple, infinitely repeating, animation for a project in react-native.

Responsive javascript helper - configurable breakpoints with matchmedia

We're all used to using different breakpoint and response mixins in (s)css, this is an implementation of that same basic idea, but for javascript.

Responsive SASS mixin helpers

Sharing is caring, these are my go-to scss implementations for responsive mixins, i.e. from, to, until, with some basic documentation and usage examples.

Wrapping blocks in WordPress' Gutenberg editor

One of the biggest advantage of using the new Gutenberg editor is that you can repeat blocks. And that you can repeat blocks whilst wrapping them in other blocks. For infinite recursion.

WordPress Gutenberg Quick Start (with useful links)

What is Gutenberg? It's basically the new wysiwyg editor for Wordpress, built with react components, and offering extensions via something called "blocks".

Daily Spending (react native app)

Last year, me and a couple of friends decided that we wanted to make an app or two.

simple-dict-translator: A simple localization module for node/npm

Yet another solution for the localization problem.

SSH Git deploy keys with Linux servers and Bitbucket

How to add your own SSH key for your repository on bitbucket, and how you updated your repository locally so you can push and pull to it.

Simple SASS mixins for generating grids similar to bootstrap

I was recently faced with a problem for a small campaign site, where the site columns were going from 1 column at its smallest up to 5 columns at its largest.

Slack Score Bot

An overengineered solution for a problem that isn't really a problem.

Part 2: CPU intensive javascript computations without blocking the single thread

Two years back I wrote a post about leveraging setTimeout to do a large task in javascript without locking the thread. The last few months I've gotten a couple of comments where people would like to see a more updated version using requestAnimationFrame instead of setTimeout.

Playing around with ES6 Generator

I've heard a lot of people talking about the new ES6 feature generators. I've read a couple of post about them, but none have really talked about what they are really good for (or at least I haven't found any really good examples)

My Screeps AI

Last week I was presented with a new game, Screeps. The game is fairly simple to understand, it all boils down to harvesting energy, harvest as much as possible, use the energy to build units which in turn can be used to harvest even more energy.

Creating the game "Snake" with Phaser

I implement the classic Nokia game Snake with the javascript game engine Phaser

How to properly add a vignette to an image with CSS

In photography and optics, vignetting (/vɪnˈjɛtɪŋ/; French: "vignette") is a reduction of an image's brightness or saturation at the periphery compared to the image center.

Improving transient cache in WordPress

Anybody that has ever used WordPress has probably come in contact with the Transient API. While it is simple to use, I feel many times it leaves one to wish for more. Lately I’ve been using Laravel for a couple of projects, and the built in Laravel cache API is similar to the WordPress transient API — but better.

Fetch all tags for a specific tumblr blog

In a client project I was tasked to build a theme in tumblr. One of the requirements was to list all the tags used in the blog. Because in all of my infinite wisdom I knew that one thing a blog provider should provide is a way to list all the tags used.

How to implement infinite scroll

I'm working on a side project, where I wanted to implement infinite scroll. There's a lot of plugins out there that one can use, but usually when I'm building something of my own, I reinvent the wheel, why? Because I like building things.

Make a grid of images similar to the flickr feed page.

If your some what like me, you should be intrigued on how flickr generates their grid of images on the feed page. How they render all the images, in their correct aspect ratio without breaking the grid nor cropping the images.

Setting CORS (cross-origin resource sharing) on Apache with correct response headers allowing everything through

Once in a while you need to make a cross-domain request from Javascript, this is something the browser very much dislike.

One development virtualhost config to rule them all (for apache2)

I've run virtualized Linux machines as primary development platforms for a long time, and every time I needed to setup a new site for development I had to, among a lot of stuff, create a new virtualhost config for Apache, enabled it, and restart the server.

Parse EXIF data when uploading images to WordPress

I decided that I wanted to build a plugin for WordPress that parses the EXIF data and save it on an image-object as meta-data.

Images animating into view whilst scrolling the browser window

The basic gist was, the images should animate in to their end-location when the user scrolls down and the images are in view. Once the image is in it’s end-location it should stay there until the user scrolls back up. When the user scrolls down again, the animation should be repeated.

Motion detection with Javascript and a web camera

A basic motion detector/follower written in javascript. It tracks movement with the red square.

Extracting thumbnails from camera RAW files (.CR2 and .NEF) with PHP

m working on a small project where I need to process a butt-load of camera raw files. Most of the images that I have are from Canon systems, i.e. .CR2 files. A camera RAW file is a file that contains the raw sensor data from the camera

Content security policy, what it is, what it does, and how to implement it

Ever wondered what CSP or content security is? Maybe you've spent a lot of time understanding on how to implement it? I try to explain both what it is, and how to use it with Apache and PHP

Wordpress visual editor not visible (because of user-agent sniffing)

We had this one problem where the visual editor in wordpress wouldn't work. And when I say it didn't work, I mean it wasn't even rendered out.

Touchstart performance issues in Google Chrome

After hours of troubleshooting a weird problem with a javascript app that I'm building, I finally found the bug, which was totally unexpected. I don't think I would've found it if I hadn't started to checkout older commits so I could pin point when the problem started to occur.

CPU intensive javascript computations without blocking the single thread

Lately I've been working on a javascript heavy application, this is a solution:ish for doing large computations, without locking the single thread.

Monorun for Windows Phone

When we started developing the web-version, we didn't have any plans of taking the game any further. But when a friend of mine asked for permission if he could port the game to Android (Java), it hit me. I wanted to port the game to Windows Phone.

LAMP development setup with Vagrant and Puppet

I’ve known for quite sometime that a coworker uses Vagrant for his dev-setup, but I’ve been avoiding it because I don’t really like virtualbox, but this weekend I felt I had to try it out, and I’m convinced that this is the most appropriate way to setup a local dev environment.

monorun!

So what is monorun? It's a simple game, you're a positive particle, trying to escape the negative ones. You control the game with either your mouse or your finger (if you have a touch device). The longer you last positively, the longer you will be represented on the high score list.

Apache reverse proxy

How to setup and configure a reverse proxy using apache. Perfect for when you want to expose your dev-environments for external devices whilst still using the correct domain names.

Pixel accurate collision detection with Javascript and Canvas

The main principle of the box model is that all objects are treated as squares, and if one square overlaps another, it’s treated as a collision. This is usually all that you need in a simple game. But because I’ve implemented this model so many times before, I decided to go a bit deeper and more accurate.

SourceTree for Windows with SSH key files

I've generally avoided SSH key pairs, and I've been able to do so for quite a while, until now.

Related posts on tags

This is a small wordpress plugin that adds the capability of fetching posts that have the same or some of the same tags as the ones you send in through ajax as a JSON array.

Tristr.am Status Notificator

I've finally released a public "beta" of my first C# application and I've also uploaded all the source code to github.

Social networks aggregator for wordpress

First off is a social updates aggregator, it's pretty much the same thing that I use today on my front-page, but instead of relying on the user to load the data form the different sources I'll instead fetch them and save them as custom posts in wordpress.

More realistic drop shadows with CSS

When using the traditional box-shadow CSS attribute, the result is often quite flat, making it look anything but realistic. In a recent project I had a design where the elements where dropping slightly tilted shadows.

Save Christmas with Bazooka

A 2d platform game is probably one of the easiest games to get working, at least as a prototype. you generally need only a few things to get it to work.

Changing domains, Wordpress

Multiple ways on how to update/change your domain for your WordPress installation

Github

I've worked a lot with SVN at devotia, but at bazooka we're moving more and more towards using git. Git is in no way a new thing, it's been around for at least 7 years now and is the preferred way for source control in the open source community.

Canvas drawer

A drawing application made with javascript and the canvas object

CSS Transform

I saw this one site last week which had an animated Ipad that would transform on mouseover. I played with it and was quite impressed on how nice it looked, so I decided to do my own implementation.

Javascript template engine

Did some research on what the most efficient way of creating nodes with javascript is, and to my surprise I found out that writing out html to the innerHTML of a parent object is more efficient than using document.createElement/appendChild.

Javascript select parser, Part II

I thought I'd give you a better example of the select parser than the one I gave you yesterday.

Javascript select parser

I wanted to be able to modify and design a <select> element without breaking it for users without javascript

Object picking

After a good nights sleep I got an idea on how to improve the effiency of my object picking, don’t get me wrong, it’s still very CPU expensive, but a little cheaper with my new rendering.

Local client side SQL

As promised on twitter yesterday I'll release a small SQL "handler" for local client side databases.

Javascript RSS parser

When you want to feed something to your site, you usually end up using the other sites RSS feed.

Solar Eclipse CSS3

Playing around with some CSS3 effects.

Canvas diagram with animation, HTML5 and Javascript

I think I've already presented one canvas diagram class here on this page, but I've created a new and improved one, based on the first. This one has a little more options, and is a little cooler.

Parallax scrolling with dof

Simple, animated parallax effect with javascript.

Batch renaming

Simple batch script for renaming multiple files in a new sequential order.

Using tab with textarea

Implementing tab-support in a textarea for bbcode support.

Detection (Game)

I wanted to see how hard it was to create a pacman like game, where the player is forced to move inside a set of walls. I later added a simple AI with simple path finding, the AI's role is to hunt you down.

Image transition (Animation)

A javascript solution for making an image gallery/carousel with css effects.

Redsquare (Game)

After I stumbled upon (what looked like) an old game, I decided to recreate the game.

Staple Diagrams

Rendering out fake 3d staple diagrams.

Expanding box (Animation)

A javascript implementation of an animated box element.