When using the Handlebars.js templating system, a common need is to be able to iterate through an array of JavaScript objects in order to build an HTML list. This is useful for ‘Atomic’ web programming, where a component is defined, and you may have a dynamic number of such components in your database. For example, … Continue reading Handlebars: How to iterate through an array of objects
Author: Chris Nielsen
jQuery: How to launch a file upload dialog from a text field
I have a text field with placeholder text that says “No file chosen”. I wanted to add functionality to this so that if the text field is clicked it launches a file upload dialog. Then when a file is chosen, I want the name of the chosen file to appear in the text field. This … Continue reading jQuery: How to launch a file upload dialog from a text field
Python: How to play a video (with sound) in Pygame
When creating a game in Pygame, the trick to getting a video with sound to play is to place pygame.mixer.quit() right after pygame.init(). This is because pygame.mixer doesn’t play well with pygame.movie. For example: pygame.init() pygame.mixer.quit() Here is what that looks like in the context of a larger block of code: import pygame FPS = … Continue reading Python: How to play a video (with sound) in Pygame
Git: How to create and use a .gitignore file on Windows
If you have a project that you have git enabled, but you don’t want git to track all of the files in the project folder (perhaps because you don’t want all files to be uploaded to github), you can tell Git to ignore certain files, file types, or sub-directories by creating a “.gitignore” file in … Continue reading Git: How to create and use a .gitignore file on Windows
jQuery: How to create a textarea character countdown for Twitter
Twitter has a 280 character limit for tweets. If you need to build an input form that will remotely post tweets to Twitter, you will need to make sure that the messages are not too long. In this article I will show how to build a textarea that has a text counter attached to it … Continue reading jQuery: How to create a textarea character countdown for Twitter
HTML: How to make a combo box using datalist
A combo box is a combination text box and select menu, rolled into one. It uses a little known HTML5 element called “datalist”, which is supported by all of the modern browsers, but was never supported by Safari or late versions of Internet Explorer. To set up an HTML5 combo box, start by creating a … Continue reading HTML: How to make a combo box using datalist
HTML & CSS: How to create a circular bio portrait between two divs
Let’s say you are creating a bio page and want to use a circular bio photo and place it between two divs with different color backgrounds on the page. For example: The technique to accomplish this is to use an outer div with a span and an inner div inside. The outer div is like … Continue reading HTML & CSS: How to create a circular bio portrait between two divs
Python: How to implement a LIFO stack
Stacks are a computer science data structure useful for special types of computation where you essentially add information to the top of the ‘stack’ and also remove information only from the top of the stack. LIFO stands for Last-In-First-Out, which is an acronym that aids in remembering what is going on in a stack, i.e. … Continue reading Python: How to implement a LIFO stack
JavaScript: How to create a looping tabindex cycle
Let’s say you have a modal with a form in it and you want to have tighter control over what happens when the user uses the Tab button on their keyboard. Without setting controls, it is possible for the user to tab through the text boxes in the modal and change the focus to other … Continue reading JavaScript: How to create a looping tabindex cycle
WordPress: How to add an email subscription page
One thing that was missing from my blog was the ability for people to “Subscribe” to my blog to get email updates when I write new articles. In order to enable this, I searched for WP Plugins that would enable this with a shortcode so that I can make a special menu button for a … Continue reading WordPress: How to add an email subscription page