JQuery Logo

Animating Number Updates With jQuery

5th December 2021 - 6 minutes read time

I was working on a user dashboard recently and decided to add some more signposting to values being updated.  Users were able to select different parameters in order to produce different values, but I thought that the values being updated weren't clear enough.

I had the idea to add some animation to the number as it was updated. This would show the user what items changed as they updated the dashboard. As the dashboard project had jQuery installed this gave me a nice animation system to use.

The HTML of the dashboard was quite simple and contained a number of div elements that contained numbers. Each of the different numbers had a id so that it could be updated independently.

Python Logo

Conway's Game Of Life With Tkinter In Python

28th November 2021 - 15 minutes read time

Conway's game of life, was devised by John Conway in 1970 and is a way of modelling very simple cell population dynamics. The game takes place on a two dimensional board containing a grid of orthogonal cells. The game is technically a zero player game in that the initial setup of the game dictates the eventual evolution of the board.

The rules of the game (taken from wikipedia) are as follows.

  1. Any live cell with fewer than two live neighbours dies, as if by underpopulation.
  2. Any live cell with two or three live neighbours lives on to the next generation.
  3. Any live cell with more than three live neighbours dies, as if by overpopulation.
  4. Any dead cell with exactly three live neighbours becomes a live cell, as if by reproduction.

For every 'tick' of the game board the rules are evaluated and each cell is kept alive, given life or killed. Through these simple rules a great deal of complexity can be generated.

Drupal Logo

Drupal 9: Removing The Summary From The Body Field

21st November 2021 - 21 minutes read time

I'm not a fan of the summary option on body fields in Drupal. I've never really got on with how users interact with it or the content is produces.

The field type I'm talking about is called "Text (formatted, long, with summary)" and it appears as an add-on summary field to a normal content editor area. It comes as standard on Drupal installs and appears on all body fields. The field type has it's uses, but I often find that the content it produces is unpredictable and doesn't have a great editing experience. I have even written articles in the past about swapping the summary field to a fully fledged wysiwyg area for Drupal 7, which worked on the project I implemented it on.

Let's look at the body summary field in Drupal and see why I have a few problems with it.

#! code Logo

Managing Website Rescue Projects, From Audit To Onboarding

14th November 2021 - 40 minutes read time

I have been a web developer for quite a few years, and one constant that is an unfortunate story in the industry is the rescue project. This is a web project that has been mismanaged by an agency or developer in some way so that the site is at a critical point. Either, the site is unable to launch or it has already been launched and suffers from serious issues. Projects in this state are caused by a variety of factors, and can be challenging and difficult to turn around.

Some agencies, quite understandably, won't go near rescue projects as they can be extremely tricky to manage. The client will have already invested money in getting the site in the first place, so spending money to fix the site can be a little painful for them. This is especially the case for small business sites, clubs or charities without any extra funds.

Python Logo

Using Events With Tkinter Canvas Elements In Python

7th November 2021 - 11 minutes read time

There are lots of ways to draw objects using the Tkinter Canvas element, but making the canvas elements interactable adds a lot to the applications you create. There are a few things to take into account when binding events like what events to trigger on and how to find out what item triggered what event.

In this article I will address how to set events, how to react to their output and how to find out what element triggered the event.

Let's start by creating a very simple application that contains a Canvas element. In that Canvas we create an oval element that we can use for the rest of the examples.

#! code Logo

Vissles LP85 Ultra-Slim Optical-Mechanical Keyboard: A Review

4th November 2021 - 9 minutes read time

Vissles recently sent me their new LP85 keyboard to review, and I've spent a few weeks giving the keyboard a go. I have already reviewed the V84 mechanical keyboard from Vissles just a few months ago and that keyboard has been my daily driver ever since. I was therefore very interested in testing out this new product. The LP85 is a low profile keyboard with optical switches that come in a sleek aluminium chassis. Instead of the usual mechanical switches that make a physical connection, optical switches break a beam of infrared light to activate the key press. As there is no physical switch being clicked this means that optical switches last longer than mechanical ones.

Python Logo

Creating A Simple Calculator Application With Tkinter In Python

31st October 2021 - 12 minutes read time

A calculator is a great application to create when learning how to code as it contains many of the things that most GUI applications will have, including behind the scenes processing of results. Things like triggering events from buttons, accepting user input, and producing output from that input are pretty standard in GUI applications and a calculator has all of them. There are also a couple of features in Python that makes building the application pretty simple. In this article I will look at designing and building the interface using Tkinter, followed by creating the code to process the entered sums into a result.

Python Logo

Drawing Shapes With The Tkinter Canvas Element In Python

24th October 2021 - 16 minutes read time

The Canvas element that comes with Tkinter is quite versatile. Out of the box you can draw simple basic shapes like squares and circles, but also lines and more complex shapes made up of points. You can even add text and images to the canvas.

This article will go through all of the different types of items you can draw using the Tkinter Canvas object.

Before getting into that, it's important to understand how coordinates are used on a canvas object. Drawing items on a canvas requires the use of an x and y coordinate to pinpoint where the item is to be drawn. All points are relative to the top left hand corner, so a coordinate of 0,0 would be right in the top left corner.

Drupal Logo

Drupal 9: Loading All Routes From A Module

17th October 2021 - 14 minutes read time

When creating Drupal modules I like to keep the hard coded components to a minimum. This helps when changing parts of the module in the future as hard coded links and other elements will require manual intervention and slow down maintenance. Sometimes, though, this isn't an option as you just need to have a few routes in your *.routing.yml file that point to controllers or forms within your module.

I had a situation today where I was looking to load all of the routes that are contained in a module. I could then construct a page of links that would handily point to different parts of the module or feed those links into a sitemap. This meant that I wouldn't need to hard code this list into a controller, I just needed to load all the routes and print that list out instead. Especially handy if I ever added or removed a route as that would mean that list would update without me having to do it manually.

Python Logo

Creating A Word Clock With Python And Tkinter

10th October 2021 - 17 minutes read time

I recently saw a design of a physical clock that inspired me to go about creating one using Python and Tkinter. The clock was essentially a wall of letters with lights behind that light up depending on what time it is. Without the lights the clock looks like a jumble of letters, it is only when the light is on that the relevant time is displayed.

The original clock was of a proprietary design so I set about creating one that was based more on an open source clock design that I found. That clock design I found didn't display the AM or PM of the time, so I ended up tweaking that design a little anyway.