Creating an email censoring filter in Vuejs

This is a neat little function you can use as a filter in Vuejs to partially censor emails so for instance myemail@example.com will show as m****l@e*********m. In other words, show the first and last letter before and after the @ delimiter.

filters: {
    censorEmail(val) {
        try {
            let arr = val.split("@");
            let wrd = arr[0][0] + "*".repeat(arr[0].length-2) + arr[0].slice(-1);
            let wrd2 = arr[1][0] + "*".repeat(arr[1].length-2) + arr[1].slice(-1);
            return wrd + "@" + wrd2;   
        } catch (error) {
            return "Not a valid email";
        }
    }
}

There’s not really any validation for a proper email address happening, we just check if the input value contains a @. If not, it simply returns “Not a valid email”.

v-model in child components

If you’re having trouble using v-model for input elements in child components then welcome to the club. Here’s a quick way to solve it by using $emit to pass data back to parent:

App.vue:

<ChildComponent 
    v-bind:myvar="myvar"
    @myfunction="myfunction"
/>

<script>
export default {
    name: "App",
    components: {
        ChildComponent,
    },
    data: function() {
        return {
            myvar: "foo"
        }
    },
    methods: {
        myfunction(val) {
            this.myvar = val;
        }
    }
};
</script>

ChildComponent.vue:

<template>
    <input :value="myvar" @input="$emit('myfunction', $event.target.value)">
</template>

<script>
export default {
    name: 'ChildComponent',
    props: {
        myvar: String,
    }
};
</script>

Format number in Javascript for Integer and Float types

I was stuck trying to format a Number variable when creating an output filter in Vuejs.

Originally I used

filters: {
    filterNumber(val) {
        if(typeof(val) == "number") {
            return new Intl.NumberFormat().format(val);
        }
        return val;
    }
}

That will output a number like “123456” as “123 456”. But I also want it to skip decimals. Using .toFixed(0) doesn’t work as that only accept Float variables. Casting the Intl variable to Float using parseFloat() around it didn’t work either.

The solution was to use .toLocaleString() instead, like this:

filters: {
    filterNumber(val) {
        if(typeof(val) == "number") {
            return val.toLocaleString('US', {minimumFractionDigits: 0, maximumFractionDigits: 0});
        }
        return val;
    }
}

Consuming a REST API in C# WPF

When consuming REST APIs in C# I like to use the Newtonsoft.Json library which is available as a NuGet package.

Start by adding the package to your library. Right-click on your project in the Solution Explorer (if using Visual Studio) and click on “Manage NuGet Packages…”

Search for Json and add Newtonsoft.Json.

Add a reference by typing using Newtonsoft.Json.Linq;

For connecting to the API you can use many options. To keep it simple we’ll use System.Net.WebClient. Ref example code below:

var apiUrl = "https://example.com/api/v1/helloworld";
using WebClient wc = new WebClient();
var jsondata = wc.DownloadString(apiUrl);
JArray jsonarray = JArray.Parse(jsondata);
foreach (var item in jsonarray)
{
    JObject jsonobject = JObject.Parse(item.ToString());
    Debug.WriteLine(jsonobject);
}

Another example without looping through the items and using WebClient in another way:

var apiUrl = "https://example.com/api/v1/helloworld";
using (WebClient wc = new WebClient())
{
    var jsondata = wc.DownloadString(apiUrl);
    JObject jsonobject = JObject.Parse(jsondata.ToString());
    Debug.WriteLine(jsonobject);
}

Show complete URL in Brave browser

I’m currently playing around with the Brave browser and so far I like it a lot. However I’m not fond of the trend of hiding parts of the URL which some browsers do. I prefer simply reading the URL scheme myself instead of depending on some vague SSL lock icons or whatever. Here’s a quick tutorial for showing the complete URL bar in Brave.

Open a new tab and enter brave://flags or chrome://flags (doesn’t matter which, both work since both are based on the Chromium project).

In the filter/search bar, enter “hide”, this will bring up the relevant flags you need to edit.

Change the following flags to Disabled

Omnibox UI Hide Steady-State URL Scheme
Omnibox UI Steady-State URL Trivial Subdomains
Omnibox UI Hide Steady-State URL Path, Query and Ref

You can also use the following link shortcuts:

brave://flags/#omnibox-ui-hide-steady-state-url-scheme

brave://flags/#omnibox-ui-hide-steady-state-url-trivial-subdomains

brave://flags/#omnibox-ui-hide-steady-state-url-path-query-and-ref

See image below for your reference:

Argument list too long

Apparantly this stems from a limitation in the kernel regarding the size of command arguments. The Argument list is too long error message is typically shown if you try to run a command on a large filelist (for instance targeting files in a huge directory using wildcards), because the Linux kernel will split every target file found as separate arguments.

Say you have a directory containing three files; file1.txt, file2.txt, file3.txt. Running the command rm * in this directory will actually be interpreted as rm file1.txt file2.txt file3.txt by the kernel.

Two quick solutions comes to mind.

Using a for loop:

for f in /home/itdb/deleteme/*; do rm "$f"; done

Using the find command:

find /home/itdb/deleteme -name "*" -delete

For more information, check out this stackoverflow question:
https://stackoverflow.com/questions/11289551/argument-list-too-long-error-for-rm-cp-mv-commands

Simple trick for remembering tar parameters

You have probably looked up the parameters for tar more than you’ve changed socks. And what if the scenario from xkcd ever became real? Could you really run a valid tar command without googling first?

XKCD: “I don’t know what’s worse–the fact that after 15 years of using tar I still can’t keep the flags straight, or that after 15 years of technological advancement I’m still mucking with tar flags that were 15 years old when I started.”

Here’s a few tricks to help you remember how to use tar if you want to extract files from an archive, either .tar , .gz or tar.bz2

-xextract
-ffile

That’s it! All you need is tar -xf <filename>

Many guides will use -xvfz (or -xfzv or -xfvz or whatever), but -v and -z are not actually necessary.

-z is only used to tell tar it’s a .gz file, but for the last 15 years or so tar have been able to automatically detect this itself.

The other parameter, -v, is not necessary either, but it can be quite useful as it simply means verbose (extended/detailed) output in the terminal window.

So you if you want to see the progress of the file operation, include -v as well, so the final command becomes:

tar -xvf <filename>

Remember it by saying out loud: tar eXtract Verbose File <filename>

Or, as mentioned, simply use: tar -xf <filename> (tar eXtract File <filename>)

How to restart KDE Plasma shell if it freezes

If your KDE Plasma environment is hanging or freezing you don’t necessarily have to logout and login. Open the Search/Run prompt by pressing ALT+F2 and enter konsole to open your terminal.



Then simply issue the necessary command to restart plasma shell.

For KDE4:

killall plasma-desktop
kstart plasma-desktop


KDE5:

killall plasmashell
kstart plasmashell


KDE5.10 and above:

kquitapp5 plasmashell
kstart5 plasmashell

Credits goes out to Korcia at this AskUbuntu thread.

Get the current weather (with graphics!) in your terminal

Developer @igor_chubin has created a new awesome tool for displaying the current weather in beautiful graphs right inside your terminal.

All you have to do is curl the website, wttr.in

If your distro don’t include cURL already, install it (for Debian/Ubuntu-based distros) by running

sudo apt install curl

Then you can simply run

curl wttr.in

to see the weather come to life!