Getting the WiFi password for a network you’ve connected to on Windows 10

Standard

One more hack/pro-tip for today. I needed to get the WiFi password for a network my PC was connected to because I wanted to add my phone to the same network.

In comes Google to the rescue. One search term and two clicks after, I found a neat trick I’m sure I’ve used before but just couldn’t remember.

So, to help myself out in future and any other person out there who may need it, here’s how you do reveal Network Passwords on a Windows 10 PC (should work on others too, but I can’t be sure).

Open up an instance of Command Prompt and type in:

You’d get a list of networks that you’ve connected to (and saved) in the past.

Next, type in:

be sure to replace <network name> with the name of a network from the previously displayed list. And that’s all!!!

How to set dynamic page titles in Angular 2/4

Standard

I’ve been creating projects using Google’s Angular frameworks for over 3 years now and in that time, I’ve needed to change the document title as the user moved through the app.

In Angular 1.x, I surmounted this challenge by moving my ng-app  declaration to html  tag (instead of the body  tag) and then controlled the page title by using $broadcast and $on  to determine when to change the $rootScope  property that I used to keep track of the page title.

Angular 2/4 has been a different beast entirely and I never gave it (setting dynamic page titles) much thought until I worked on a project that required it. I was fine with having a single page title (usually the application’s name) for the lifetime of the apps I’ve built.

I did a bit of googling and found an article by Todd Moto of the Angular Team that solved the problem in the cleanest way I’ve seen yet.

As I usually do, I’m writing this up here so I don’t go head-scratching at a later date when I need to do this again.

Here’s a link to the Github Gist.

For explanations, please refer to the original post from Todd Moto

 

Using Git Bash with PhpStorm

Standard

 

This morning I felt there should be more to the terminal in JetBrain’s PHPStorm IDE and it turns out I was right.

Full disclosure, I’ve come to prefer the *nix style command line interface to Windows and that’s reflected in my choice to continue using Git Bash on my work PC (it’s a Lenovo Thinkpad with 64-bit Windows 10).

So, back to the subject of this post, I did a bit of googling and full credit to https://bobsguides.com/blog.html/2014/10/23/git-bash-inside-phpstorm/ as I found the fastest way to switch the default terminal used by PhpStorm.

So make the switch, just go to:

Once here, change the “Shell Path” to:

For a 32-bit system, use

or the equivalent path to your git-shell installation.

The -login  switch informs the program to run it’s configuration files and the -i  switch informs the program that you want the interactive mode.

Thankfully, I won’t need to scratch my head searching for this anymore.

Setting up Android SDK on a DigitalOcean Ubuntu droplet

Standard

Setting up a remote build environment for an Android project wasn’t something i thought I’d need to do but as it turned out today, I did need it and after consulting some pages online, it wasn’t so difficult to achieve. I’m documenting this to make my future attempts easier to accomplish and also to help anyone out there with the required information.

The recommended way to install the Android SDK (at the time of this writing) is by installing Android Studio but as I’m using a DigitalOcean droplet, there’s no GUI for me to interact with the installer. Fortunately for us, the official Android Studio download page also has a link (at the bottom of the page) to download just the command-line tools for Android.

Scroll down to the bottom of the page and copy the download link for Linux. Next, from your ssh terminal, create the  /home/android-sdk  directory. From within that directory, do execute:

Replace the url with the one you copied from the downloads page so you have the latest version. Once this is done, unzip the zip archive so that you have the following directory structure:

Setup environment variables:

Next, display a list of available packages by running:

This would show you the list of packages that you can install from a host of different sources. The sdkmanager documentation shows how to use the tool.

To install the platforms and build-tools needed, just run:

And that’s all.

Your Android SDK is setup successfully.

How to create a Radial Gradient in Objective-C (iOS)

Standard

I got bored of working on my PC software project today and decided to dust off my iOS / Objective-C skills again. I’ve not had too many opportunities to sharpen my Objective-C skills and I’m even learning Swift 2 at the moment.

In my PC app, I created a beautiful login screen using a radial-gradient as the background image and I thought: why not recreate something similar using Objective-C. So, I went hunting. StackOverflow and the Apple Developer site led me to the solution below.

To create the radial background, the approach I used was to create a custom UIVew class (obviously, this class extends the UIView class). To do this, from your XCode project, select “File” > “New…” > “File”

Screen Shot 2015-10-27 at 13.58.15

When prompted, select “Cocoa Touch Class” and click “Next”

Screen Shot 2015-10-27 at 13.58.33

Enter the name of your class and make sure that it extends the  UIView  class.

Screen Shot 2015-10-27 at 13.58.33

This done, place the following code in the .m file (the class implementation) for your UIView class.

Make sure to replace  OORadialGradientView  with the name of your own class.

This would give you a class that, by default, adds a radial gradient (from yellow to orange) to any view that it’s attached to. Now, this is all nice and dandy but you won’t see anything yet. To see the effects of your gradient, you need to make use of the class.

Open your storyboard and then do one of two things. Either click directly on the blank space within the default ViewController or, open the Document outline. The document outline button is at the bottom left corner of the Standard Editor. Click this icon and in the Document Outline, select the first “View” element making sure you achieve the following effect:

Screen Shot 2015-10-27 at 14.10.28

This done, move to the identity inspector on the right side of your IDE.

Screen Shot 2015-10-27 at 14.12.24

In the Custom Class field (where “UIView” is written), type in the name of your newly created class. And voila! You’re done.

You can checkout your handiwork by running the project in any simulator of your choice.

Screen Shot 2015-10-27 at 14.15.30

And when rotated in landscape mode:

Screen Shot 2015-10-27 at 14.15.43

Feel free to tweak the numerical values in your Gradient class to adjust the display and colors as you please.

I’ve added this class and would be adding quite a few more to this github project.

 

Using regex to strip specific html tags using JavaScript

Standard

A few weeks back I had to tackle a problem. I’ve been working on a set of JavaScript based eBook readers with not a few constraints involved because of the target market. One of the features I needed to implement was the ability to highlight text using various colors. Sure, this wasn’t a big deal but I had a nightmare because the output wasn’t coming out as expected.

Here’s what I was getting:

Screen Shot 2015-10-13 at 14.41.42

as opposed to this:

Screen Shot 2015-10-13 at 14.42.53

And where was the problem? In the HTML that contained the contents of the page. We have a process in-house that does some nifty stuff and converts our PDF files to HTML, thus, helping us retain paging, number of words per line and lines per page.

What this process does is not so important as its output. Here’s the html that generated the “skippy” highlights:

Screen Shot 2015-10-13 at 14.44.44

Notice how each word on the highlighted line is wrapped by a “span” tag? That’s the issue! The highlight code, in trying not to interfere with the page’s markup just picks words inside tags and wraps them with a tag and adds a custom highlight css class.

Here’s the markup that would generate the “smooth” highlight:

Screen Shot 2015-10-13 at 14.45.43

See the difference?

So, after months of ignoring the problem and reporting to management that it’s a small issue, I finally came around to fixing it and solved it with quite a few lines of CoffeeScript code:

Here’s the JavaScript equivalent:

And voila! My headache was solved! Looks easy but I had to scour StackOverflow for this and I just thought I’d save myself the headache of looking for this all over again at a later time.

Generating Amazon S3 file upload Policy in Node.js

Standard

I recently (by recently, I mean two days ago) had to upload files – images to be precise – to a newly created Amazon S3 bucket. After going through a few documents online and following instructions (at least, I think I did), I had my environment (MEAN – MongoDb, Express, AngularJS and Node.js) setup for the upload.

On trying the upload, Amazon returned an error telling me the policy I was using was not the same as that which they generated. Apparently, I did something wrong somewhere so I sought to right my wrong. I found a valuable script on github (though for the life of me, I can’t seem to remember the name of the project) and here’s what I distilled it down to:

To use this, I just issue a  GET  request of the form:  http://localhost:3000/s3_policy?subFolder=folder_name&mimeType=image/png