Jake Paris

Tagged: Javascript

Debounce an input using select hook in WordPress/Gutenberg

I was building a component for the block editor which accepts user input (i.e. a text search) and searches for matching posts. For various reasons I couldn’t use the <URLInput> component and needed to roll something more custom. I got stuck on this because when using the useSelect hook triggered by changes from a text […]

Using a Vue app within a WordPress plugin

Creating a full-fledged Vue.js application inside a WordPress plugin takes a little bit of special setup to the two code libraries working together. Here I’ll show the way I’ve been solving this, though I’m sure it’s not the only way. I’m going to skip a number of prerequisites: I’ll assume you already have the vue-cli […]

Soma FM player

I often listen to Soma FM internet radio while at work, but I do not like their radio UI. So this seemed like a good opportunity to stretch my Vue.js muscles. This is a project I’ve been working on little by little for some time. I invite you to try it out and let me […]

Transforming shortcodes to “blocks”

Check out my latest article series on the Bates Web Technologies site:

Fill form fields based on url query parameters

Based on this code I did earlier, I created this function which fill out form fields based on the query parameter values. There are three optional parameters. Using with no parameters will automatically try to match the parameter names in the url with form field names. Maybe dangerous? fillFieldsFromParams() The first parameter specifies which form […]

Tags —

Getting NPM build scripts to run-on-save in SublimeText

Today I finally got my es2015 javascript to compile to es5 javascript automatically upon save. First, I set up my project using npm. I setup the following dev dependencies: babel-cli babel-core babel-preset-es2015 In the package.json file, I’ve got the following scripts setup … “scripts”: { “build-js”: “babel scripts.pre.js –out-file scripts.js”, “build”: “npm run build-js” … […]

Fade-in text: jQuery plugin

This is a basic plugin for jQuery which adds an effect for slowly fading in text. There may be other plugins out there that have similar functionality, but this was an attempt to try building such a thing. Demo The Code

GET Query Params with Javascript

Update April 2018 Sigh, the things we learn as we go… This is actually way easier than I made it before. In fact, it’s so easy it doesn’t really need these wrapper functions around the URLSearchParams() family of things. However in the interest of making a transition from the earlier code, here you are: var […]

Helper function (in vanilla js) to find a GET query parameter

var parseQueryParameters = function(){ var queryString = window.location.search; var queries = {}; if(queryString==”) return queries; var q = queryString.replace(‘?’,”).split(‘&’); q.forEach(function(pair){ var a = pair.split(‘=’); if(typeof a[1]===’undefined’) a.push(”); queries[a[0]] = a[1]; }); return queries; }; var getQueryStringValue = function(param){ var queries = parseQueryParameters(); if(typeof queries[param] == ‘undefined’) return false; else return queries[param]; };

Using AJAX in WordPress

Most of the work of setting up an ajax action in the WordPress environment happens in php-land. The PHP File Register & enqueue your script. In this example, I’ll assume the script has already been registered. wp_enqueue_script( ‘myscript’ ); *I’ve had trouble when I’ve tried to enqueue the script at the wp_enqueue_scripts action and added […]