How to Open a Tor Brave Window from Command Line / / No Comments I love the Brave web browser for many reasons: ad blocking, Brave rewards, crypto integration, and even a Tor tab feature. I’ll often use the Tor feature but wanted to know how I could automated opening Tor windows from command line. To open a Brave Tor tab, you can use the following command: open -a "Brave Browser" --args --incognito --tor Any time I want to remotely open a Tor tab, I can do so via a shell script. Commands are such an underused but valuable utility for apps! The post How to Open a Tor Brave Window from Command Line appeared first on David Walsh Blog. David Walsh Blog… more → Posted in: JavaScript Tagged with: Brave, Command, from, line, open, Window
Another Update to my Slideshow Web Component – JavaScript Support / / No Comments Last month I shared a simple web component I built to embed slideshows onto web pages. If you didn’t get a chance to read that, you can see it in action in this CodePen below: See the Pen Slideshow Web Component by Raymond Camden (@cfjedimaster) on CodePen. After I wrote this, Šime Vidas shared an excellent update to my component with some great modifications. I talked about this version in a blog post, and it’s the version I’ll be using for my post today. What am I covering today? When I demonstrated how to use my web component, it was done via a script include (well, it’s on CodePen, but you get the idea), and then a bit of HTML. Here’s an example. (And... more → Posted in: JavaScript Tagged with: Another, Component, JavaScript, Slideshow, Support, update
How to Create a Diff of Two Images / / No Comments When I was a child, I loved looking for Waldo in the “Where’s Waldo?” book series. These days I’m a sucker for TMZ’s “What’s the Big Frigin Difference” images, where TMZ slightly changes an image and you have to spot the differences between the two. That got me to thinking — how easily could I automate diff’ing two images? This StackOverflow post was gold. To create a diff of two similar images, we’ll use ImageMagick’s convert command line utility with a large host of configurations: convert '(' image1.png -flatten -grayscale Rec709Luminance ')' '(' image2.png -flatten -grayscale Rec709Luminance ')' ... more → Posted in: JavaScript Tagged with: create, Diff, images
How to Open an App from Anywhere on Mac Command Line / / No Comments Many engineers like myself live in the command line, and perform actions from command line that most others would click an icon for. I’ve always found opening apps from command line on Macs painful. You need to references the Applications directory, add .app to the name, etc. I just want to open apps by name. To open an app from any directory by its simple name, you can use the -a argument to open: open -a Cyberduck # Works regardless of case as well open -a CyBeRdUcK I love -a for a command like open. Being able to open any app by name is exactly what I want! The post How to Open an App from Anywhere on Mac Command Line appeared first on David Walsh Blog. David Walsh Blog… more → Posted in: JavaScript Tagged with: Anywhere, Command, from, line, open
Customizing HTML Form Validation / / No Comments Form validation has always been my least favorite part of web development. You need to duplicate validation on both client and server sides, handle loads of events, and worry about form element styling. To aid form validation, the HTML spec added some new form attributes like required and pattern to act as very basic validation. Did you know, however, that you can control native form validation using JavaScript? validity Each form element (input, for example) provides a validity property which represents a ValidityState. ValidityState looks something like this: // input.validity { badInput: false, customError: true, patternMismatch: false, rangeOverflow: false, rangeUnderflow: false,... more → Posted in: JavaScript Tagged with: Customizing, form, HTML, Validation
5 Web Design Trends for 2023 That You Should Pay Attention To (Sponsored) / / No Comments The start of a new year is usually a time when we start looking for ways to make something a little better. That something could be our life, work, or what we produce. Web designers, for example, might look for ways to make their designs more interesting or effective. In this post we will focus on 5 web design trends that are designed to help users get the most from the websites they visit and we will use 10 pre-built websites from BeTheme to demonstrate how best to implement those trends . BeTheme is one of the world’s most popular and highly-rated WordPress Themes with 268,000+ sales and a 4.83/5 star-rating. 5 new web design trends for 2023 To improve anything, you have to know what it does... more → Posted in: JavaScript Tagged with: 2023, Attention, design, should, Sponsored, Trends
A Simple Slideshow Web Component / / No Comments As I continue to play around with and learn more about web components, I thought I’d build a simple component to make it easier to add a slideshow. By that, I mean something that renders one picture but provides controls to go to more images. I’ve probably built this many times in the past, both in JavaScript and server-side code, and I thought it would be a nice candidate for a component. As with most of my demos so far, there’s a lot more that could be done with it, but I thought I’d share what I have so far. Once again I want to give a shout-out to Simon MacDonald for helping me get this code working. (At the end of the post, I’ll share the mistake I made, as... more → Posted in: JavaScript Tagged with: Component, simple, Slideshow
fetch with Timeout / / No Comments A few years back I wrote a blog post about how write a fetch Promise that times out. The function was effective but the code wasn’t great, mostly because AbortController , which allows you to cancel a fetch Promise, did not yet exist. With AbortController and AbortSignal available, let’s create a better JavaScript function for fetching with a timeout: Much like the original function, we’ll use setTimeout to time to the cancellation but we’ll use the signal with the fetch request: async function fetchWithTimeout(url, opts = {}, timeout = 5000) { // Create the AbortController instance, get AbortSignal const abortController = new AbortController(); const { signal }... more → Posted in: JavaScript Tagged with: fetch, Timeout