Forem: Jamie Mc Manus

Creating a Custom URL Protocol in .NET

Jamie Mc Manus — Sat, 12 Aug 2023 13:11:11 +0000

You open a Teams link and it prompts you to open the Teams Desktop Application, and you sit back and wonder how this works.

Well wonder no more ! This process is possible because of URL protocols - similar to how Windows sets the default web browser or the default email app. You have probably seen it in actions a few times from apps like Teams or Zoom. Windows has a few of these built in, but we can create our own custom protocols too.

You can create these by manually adding a Reg Key but we'll do this via .NET.

We'll create a simple app, and a custom protocol that will open this app when a user clicks on a URL with the protocol.

Lets go !

Setup

Lets start with creating a desktop application - for simplicity I've chosen a WPF app. Open Visual Studio with Administrator privilege's ( I'll explain later ) and create a new WPF project.

App Startup

In the App.xaml.cs file create a new method called RegisterProtocol() . We'll run this on startup to create our protocol.

We'll need to do check if the protocol exists, and if not then create it.

We set the name of our protocol and assign to a variable.



string customProtocol = "CustomProtocol";

Then add we check if a Registry Key exists for this value :



RegistryKey key = Registry.ClassesRoot.OpenSubKey(customProtocol);
if (key == null){
...
}

If the key is null then we will have to create one.



if (key == null) {
    key = Registry.ClassesRoot.CreateSubKey(customProtocol);
    key.SetValue(string.Empty, "URL: " + customProtocol);
    key.SetValue("URL Protocol", string.Empty);

    key = key.CreateSubKey(@"shell\open\command");
    key.SetValue(string.Empty, applicationPath + " " + "%1");    
    key.Close();
}

Now to explain it a bit.

key = Registry.ClassesRoot.CreateSubKey(customProtocol);
This line creates a new subkey in the HKEY_CLASSES_ROOT registry. This is where file associations and protocol handlers are registered.
key.SetValue(string.Empty, "URL: " + customProtocol);
This line sets a value for the subkey we just created. The value's name is an empty string (indicating the default value for the key), and the value's data is a string that specifies the type of URL and the custom protocol name.
key.SetValue("URL Protocol", string.Empty);
This line sets a value named "URL Protocol" within the same subkey.
key = key.CreateSubKey(@"shell\open\command");
This line creates a new subkey within our key. The subkey is named "shell\open\command". This is where you specify the command to be executed when a URL matching our protocol is opened.
key.SetValue(string.Empty, applicationPath + " " + "%1");
This line sets the default value for the shell command key we just created. The data is the filepath to the EXE for our application, and %1 represents any parameters sent.
key.Close();
We simply close the key to finish.

We now have one last thing before the key can be registered. We have to make sure the application has the correct privilege's to edit the registry.

In your app.manifest file ( add one if you dont have one )

Add the below:



<requestedPrivileges xmlns="urn:schemas-microsoft-com:asm.v3">
    <requestedExecutionLevel level="requireAdministrator" />
 </requestedPrivileges>

This will make the application ask the user for admin the privilege's that we need to create the key.

GUI

Next up we'll edit the application to display any arguments that are passed to the app when opened via the custom protocol.
We don't need to do this part, but it will show you that any parameters you sent are indeed working !

In your MainWindow.xaml.cs add the below string to display the arguments passed in.



public string ArgumentsText
    {
        get { return argumentsTextBlock.Text; }
        set { argumentsTextBlock.Text = value; }
 }

And within the MainWindow.xaml file add a textblock to display the string:



<TextBlock x:Name="argumentsTextBlock" Margin="10" />

Next we need to edit the app.xaml.cs to pass the arguments into the MainWindow:

Edit the OnStartup like so:



protected override void OnStartup(StartupEventArgs e)
    {
       base.OnStartup(e);
       RegisterProtocol();

        MainWindow mainWindow = new MainWindow();
        if (e.Args.Length > 0)
        {
           string arguments = string.Join(", ", e.Args);
           mainWindow.ArgumentsText = "Arguments: " + arguments;
       }
        else
        {
            mainWindow.ArgumentsText = "No arguments provided.";
        }

       mainWindow.Show();
   }

We first call our RegisterProtocol method and then check for any arguments passed in on startup before manually creating our main window.

Now you can publish the application and click the EXE to run it.
You should see something like the below image -

This is what we expect - there are no parameters passed when clicking the EXE.

Web

Next we're going to create a simple HTML file to simulate opening our protocol from the web.



<!DOCTYPE html>
<html>
<head>
    <title>Custom Protocol Test</title>
</head>
<body>
    <p>Click the link below to test your custom protocol:</p>

    <a href="CustomProtocol://myargument">Test Custom Protocol</a> 

</body>
</html>

Like I said - pretty simple. The value for the href is the name of your protocol followed by '://' along with any parameters you want to pass - I am passing in the string "myargument" .

In Action

Lets open up the file in browser and try it out.

Click on the link and you should be greeted with a prompt like the below:

Perfect. Click Open and our application should open as expected.

Finishing Up

There we have it - its not a glamourous example but who said programming would be eh ?

You can see the sample application here:

JamieMcManus / CustomProtocolAppExample

Sample Project for a Registering a Custom URL Protocol

Got any improvements ? Then feel free to comment below !

And if you're feeling generous you can buy me a coffee with the link below ( and yes its all for coffee, I drink a copious amount of it while writing ☕ )

Taking a .NET Core Web App Offline ... Gracefully

Jamie Mc Manus — Thu, 28 Jul 2022 07:49:33 +0000

Have you ever had to take a Web App offline for maintenance or a software update? How did you do it ? Many of you will time it for out of business hours so users wont be impacted. But what if there happens to still be someone using it when you take it offline ?

You could end up cutting a process off halfway, and depending on your database setup there could be a series of queries partially executed !

This could be a disaster 💀

Our Savior ... Sort Of

Microsoft has given us the ability to shut down a web app gracefully by halting new requests and issuing a custom maintenance page while giving existing processes time to finish executing - we can even customize the the length of time given for the existing requests to finish before killing them.

The caveat here is that this will only work on a Windows Server where the web app is hosted using IIS - sorry Linux guys 🤷

How To Do It ?

Its actually pretty simple . Create a file called 'app_offline.htm' , and add the desired html to it. Note the file type .htm - this is not a typo, if you name it .html it will not work !! ASP.Net is quite particular about this detail !

Make sure the file is also no larger than 4 GB - for those of you crazy enough to try creating an maintenance page that size it wont work !

Fun fact

The .htm ending is a throwback to the DOS days where file types were limited to 3 characters ! They function entirely the same way as .html files but modern conventions would have you use .html because it is more semantically clear that it is a Hyper Text Markup Language file .

✨ The More You Know✨

Now you are ready to take the app offline. All we need to do it navigate to the root directory of the Web App and copy the file into it. This will take immediate effect and any new requests will get our app offline maintenance page served to them, while existing requests will now have 10 seconds ( the ASP NET default value ) before being killed. If you want to change this default then you need to change the value for shutdownTimeLimit in aspNetCore element of the web.config file. It has a minimum value of 0 and a maximum possible value of 600 seconds.

Example:



<?xml version="1.0" encoding="utf-8"?>
<configuration>
  <location path="." inheritInChildApplications="false">
    <system.webServer>
      <handlers>
        <add name="aspNetCore" path="*" verb="*" modules="AspNetCoreModuleV2" resourceType="Unspecified" />
      </handlers>
      <aspNetCore processPath=".\MyApp.exe"
                  stdoutLogEnabled="false"
                  stdoutLogFile=".\logs\stdout"
                  hostingModel="inprocess"
                  shutdownTimeLimit="60"   />
    </system.webServer>
  </location>
</configuration>

You can find my app offline file here :

JamieMcManus / Examples

Examples for posts

Automated Deployment

For those of you who automate their deployment , you can also deploy the app_offline.htm file at the same time, the key is to add it first , deploy changes , then remove. If you leave the file there your app will never go back online!

You can include the file in your project but rename it - eg x_app_offline . Then in your deployment script rename this file so that it can trigger the IIS app_offline function, then rename it after completion.

Parting Words

As you can see that was pretty easy !

Got any improvements ? Then feel free to comment below !

And if you're feeling generous you can buy me a coffee with the link below ( and yes its all for coffee, I drink a copious amount of it while writing ☕ )

Cover Image: No wifi vector created by storyset - www.freepik.com

Recreating MYSQL's LPAD Function in SQL Server

Jamie Mc Manus — Sun, 05 Jun 2022 14:31:33 +0000

If you've had to write SQL the chances are that you've had to write some queries that utilize some handy platform specific functions. You may use them for so long you even forget that they are platform specific ! Fast forward to a new job and you're no longer using that same flavor of SQL and suddenly some of your favorite functions are gone.

I've encountered a few of these situations during my move from MySQL to SQL Server - ranging from losing the amazing Group_Concat and having to recreate via STUFF ( uggh ) to the much simpler LPAD & RPAD. It can leave you scratching your head and spending an age to recreate the functionality.

Today I decided to just recreate LPAD in SQL Server because it's something I actually use often enough.

What Is LPAD ?

The LPAD function in MySQL is used to add a string to the left side of the input string.
It can be handy in many cases - the most common case I've encountered is padding '0' onto a product id to create a fixed length barcode - e.g. padding '1045' to become '000001045' .

It takes 3 input parameters :

Input String - The unaltered string to add to.
Desired Length - The final length of the string after adding the character(s).
Charachter To Prepend - The character/s to add.

Example:

/*  LPAD( inputString ,  desiredLength , charachterToPrepend )  */
mysql> SELECT LPAD('hi',4,'??');
-> '??hi'
mysql> SELECT LPAD('1045',10,'0');
-> '0000001045'

You can read the official MySQL description here

Requirements

We have just a few requirements as the functionality is pretty simple !

Accept 3 parameters - the character(s) to prepend, the desired length , and the string to prepend to.
If the string length is greater than the desired length we do not prepend anything and we need to truncate the input string from the right.
The function needs to be a Scalar Function type to return a single value.

The Code

Lets break it into bite sized chunks:
These are our input parameters.

 -- This is the string that will be prepended to 
@value NVARCHAR(MAX),
-- This is the desired length of the string after prepending
@length int ,
-- This is the characters that we will prepend
@character NVARCHAR(MAX)

Next we need to declare a few variables that will make things easier to read.

-- Declare our return string 
DECLARE @ReturnValue NVARCHAR(MAX);
-- For clarity get the length of the string 
DECLARE @StrLen int = LEN(@value);
-- For clarity get the target length of the text to prepend 
DECLARE @target int = @length - @StrLen ;

Ok now we're getting somewhere!
Next up we need to create an IF / ELSE statement. In it we will check if the input string length is already greater than the desired length for the return string. If the string is greater then we will truncate it, or if it is equal then just return it unaltered.

-- Check if the String is already  equal to the desired length
IF (@StrLen = @length)
    -- Just return the original if so
    SET @ReturnValue =  @value;
ELSE IF (@StrLen > @length)
    SET @ReturnValue =  SUBSTRING(@value, 1, @length);

Next up is the meat of the logic.
We use the REPEAT function to .. you guessed it , repeat a character/s N amount of times ! To figure out N we just divide the @target variable by the length of the @character variable - if the @character is more than one character we'll need to add + 1 so we don't accidently get a shorter than needed string, and we'll remove any unwanted characters using a SUBSTRING function .
Finally concatenate the @value onto this replicated string.

ELSE 
   SET @ReturnValue = SUBSTRING((  replicate(@character,   ((  @target ) / LEN(@character) ) +1  )), 1, @target   )  + @value

Then just add a return statement and you're done !

Full Code

CREATE FUNCTION [dbo].[LPAD](
                -- This is the string that will be prepended to 
                @value NVARCHAR(MAX),
                -- This is the desired length of the string after prepending
                @length int ,
                -- This is the characters that we will prepend
                @character NVARCHAR(MAX)

)

RETURNS NVARCHAR(MAX)
AS
BEGIN
    -- Declare our return string 
    DECLARE @ReturnValue NVARCHAR(MAX);
    -- For clarity get the length of the string 
    DECLARE @StrLen int = LEN(@value);
    -- For clarity get the target length of the text to prepend 
    DECLARE @target int = @length - @StrLen ; 

    -- Check if the String is already  equal to the desired length
    IF (@StrLen = @length)
        -- Just return the original if so
        SET @ReturnValue =  @value;
    -- Check if the String is already greater than the desired length , if so then we need to truncate it 
    -- But remember that while LPAD will prepend at the left , it truncates from the right ! 
    ELSE IF (@StrLen > @length)
        SET @ReturnValue =  SUBSTRING(@value, 1, @length);
    ELSE 
        SET @ReturnValue = SUBSTRING((  replicate(@character,   ((  @target ) / LEN(@character) ) +1  )), 1, @target   )  + @value  


    RETURN @ReturnValue

END

Parting Words

As you can see that was pretty easy ! You can easily adapt this into an RPAD function if you need to as well !

Got any improvements ? Then feel free to comment below !

And if you're feeling generous you can buy me a coffee with the link below ( and yes its all for coffee, I drink a copious amount of it while writing ☕ )

Note - This is a cross-post

Why Your :hover Selector isn't Working

Jamie Mc Manus — Wed, 11 May 2022 07:05:26 +0000

The post is suitable for anyone with a basic knowledge of CSS

Have you ever tried to use the CSS hover selector but it just doesn't seem to work for you ? Or worse yet it applies to the wrong elements ?!?

If you're like me then it has happened a lot.

And for a long time I was stumped.

That is, until now.

Its in the Details

Lets take a look at an example of a hover effect:

.parent1 :hover{
  background-color:red;
}
```
{% endraw %}


You'd guess that class would change the background colour of the parent1 class to red on hover right ? 

Well you'd be wrong. 

Now take a look at this one :
{% raw %}

````css
.parent1:hover{
  background-color:red;
}
```
{% endraw %}


Would you believe that this one would change the background colour of the parent1 class to red ? 

If so, you'd be correct.

But what is the difference ?  You'd be forgiven if you can't  tell the difference - I know I didn't at first. 

It's the *space* character before the {% raw %}`:hover`. 

The space character in CSS is a [descendant combinator](https://developer.mozilla.org/en-US/docs/Web/CSS/Descendant_combinator) ,which in this case means it will apply the hover effect to all the child elements of the element - not the element itself. 

That's a pretty big difference for such a seemingly innocuous space. 

### **Comparison**  
Take a look at the below examples to see what I mean. 

{% jsfiddle https://jsfiddle.net/nu9h2gvd/3/ result,html,css %}
The Moral of the Story ? 

**Mind The Gap !**

#### Slán go fóill
I hope this has cleared up any confusion about why your hover effects weren't working for you ! 

Feel free to ask questions, comment or contribute below!

And if you're feeling generous you can buy me a coffee with the link below ( and yes its all for coffee,  I drink a copious amount of it while writing ☕ )  


[![Buy Me A Coffee](https://cdn.buymeacoffee.com/buttons/default-black.png)](https://www.buymeacoffee.com/SUKaQp9)

Using getElementsByName Method in Javascript

Jamie Mc Manus — Tue, 22 Feb 2022 10:14:50 +0000

Image by Tudor Baciu on Unsplash

HTML Name attribute

This is an attribute for a HTML element that is used to identify the element by assigning it a name.

One of the most common uses of the name attribute would be to use it to identify the form inputs submitted to the server ( this is opposed to using the Id attribute which would be the most common way to identify an element on the Clientside - which cannot be used because the Id attribute does not get passed to the server on form Submit ).

Example of name attribute :


<input name="firstname" Placeholder="Enter Your First Name"/>

<input name="lastname" Placeholder="Enter Your Last Name"/>

Accessing via Javascript

To access a HTML element/s by the name attribute we use getElementsByName which returns a NodeList of all elements that have the given name attribute

eg:


getElementsByTagName('attributename')

The NodeList is an array like object - this means that it is missing some array features like push , pop etc .

Example:


<div id="surveyitems">



  <button name="survey" >JS Rocks</button>

  <button name="survey" >JS Doesn't Rock</button>

  <button name="survey" >I don't know what JS is</button>



</div>


let survey = document.getElementsByName('survey')

for (let item of survey) {

    console.log(item.innerText);

}



for (var i = 0; i < survey.length; i++) {

    console.log(list[i].innerText);

}



survey.forEach(element => {

    console.log(element.innerText)

});

Also remember that getElementsByName also returns a Live nodelist as opposed to a static one like one returned by querySelectorAll , so even valid elements created after the point that you assign it to a variable will appear in your list.

See the below example -

Notice how the count incremented yet we never updated the surveylist variable ? This is because the NodeList is Live , so make sure you don't get caught out by this !

Slán go fóill

Feel free to ask questions, comment or contribute below!

And if you're feeling generous you can buy me a coffee with the link below ( and yes its all for coffee, I drink a copious amount of it while writing ☕ )

4 Ways To Check if an Object Key Exists

Jamie Mc Manus — Fri, 04 Feb 2022 09:34:17 +0000

1. hasOwnProperty

This will return a boolean value depending on whether the object on which you are calling it has a property with given name as an argument e.g. obj.hasOwnProperty('keyname')

Full Example:

class Employee {
    constructor(firstName, lastName) {
        this.firstName = firstName;
        this.lastName = lastName;
  }
}

class Engineer extends Employee {
    constructor(firstName, lastName, qualification) {
        super(firstName, lastName);
        this.qualification = qualification;
    }
}

let eng = new Engineer("John","Doe","BSC")

console.group("hasOwnProperty");
console.log(eng.hasOwnProperty('firstName'))      // Output: true
console.log(eng.hasOwnProperty('qualification'))  // Output: true
console.log(eng.hasOwnProperty('nonexistantkey')) // Output: false
console.groupEnd();

2. Object.keys

Object.keys will return an array of all the keys belonging to the given object.

You can then check the array to see if a particular key exists. It is the longest of all the methods.

class Employee {
    constructor(firstName, lastName) {
        this.firstName = firstName;
        this.lastName = lastName;
  }
}

class Engineer extends Employee {
    constructor(firstName, lastName, qualification) {
        super(firstName, lastName);
        this.qualification = qualification;
    }
}

let eng = new Engineer("John","Doe","BSC")

console.group("iteration");
for (const key of Object.keys(eng)) {
   console.log(key)
   //Perform Other Check ..
}

/* Results:
"firstName"
"lastName"
"qualification"
*/

console.groupEnd();

// Or

Object.keys(eng).filter(x => x.includes("keyname"));

3. in operator

The in operator returns true if the property is in the object

class Employee {
    constructor(firstName, lastName) {
        this.firstName = firstName;
        this.lastName = lastName;
  }
}

class Engineer extends Employee {
    constructor(firstName, lastName, qualification) {
        super(firstName, lastName);
        this.qualification = qualification;
    }
}
let eng = new Engineer("John","Doe","BSC")

console.group("in operator");
console.log('firstName' in eng)      // Output: true
console.log('qualification' in eng)  // Output: true
console.log('nonexistantkey' in eng) // Output: false
console.groupEnd();

4. Reflect.has()

Reflection is the ability of a process to examine, introspect, and modify its own structure and behavior.

Therefore using the Reflect api you can check and/or manipulate an Objects properties, methods and variables.

You can use Reflect.has(targetObject, propertyKey) method to check if the key exists.

Full Example

class Employee {
    constructor(firstName, lastName) {
        this.firstName = firstName;
        this.lastName = lastName;
  }
}

class Engineer extends Employee {
    constructor(firstName, lastName, qualification) {
        super(firstName, lastName);
        this.qualification = qualification;
    }
}

let eng = new Engineer("John","Doe","BSC")
console.group("Reflect.has");
console.log(Reflect.has(eng,'firstName'))       // Output: true
console.log(Reflect.has(eng,'qualification'))   // Output: true
console.log(Reflect.has(eng,'nonexistantkey'))  // Output: false
console.groupEnd();

Slán go fóill

Well that's it, each is simple enough and you can choose whichever to do the task.

Feel free to ask questions, comment or contribute below!

And if you're feeling generous you can buy me a coffee with the link below ( and yes its all for coffee, I drink a copious amount of it while writing ☕ )

C# Stacks and Queues

Jamie Mc Manus — Mon, 17 Jan 2022 10:13:08 +0000

In the New Year I've decided that in order to become a better developer I need to expand my knowledge of C# and have begun to trawl through the Microsoft Documentation to help me do so.
I believe this should improve my problem solving abilities and provide me with new tools and ways of thinking. It seems like a no-brainer.
During my searching I've recently "discovered" a few things I had never seen before.
I say discovered but its not like they were exactly hidden - I'd just never needed these things before. Those things are Stack and Queue.

What are they ?

Simply put they're both types of Collections, they're just more limited in how you access the elements in them, we'll see both below :

Stack

Stack is a type of Collection that stores objects on a basis of last in first out (LIFO).

You can only retrieve and / or remove items at the end of the stack, and items added will be added at the end.

No exceptions.

It is recommended to use the generic Stack from System.Collection.Generic namespace. rather than non-generic type.

Methods

Clear - Remove all objects from the Stack.
Contains - Used to check if an item is in the Stack.
Push - Adds an item to the end of the Stack.
Pop - Removes an item from the end of the Stack. If the Stack is empty it will throw an error.
Peek - Returns the item at the end of the Stack without removing it .

This method list is not complete, just the most relevant in my opinion - there are others like ToArray() , ToString() etc but these are common to other Collection types as well so theres no need to go into detail.


//Initialize

Stack<int> example = new Stack<int>();

//Add to Stack

example.Push(1);

example.Push(2);

example.Push(3);

//View last added element in Stack

int p1 = example.Peak();

//Get and remove the last added item from the Stack

int p2 =  example.Pop();

Queue

Queue is the opposite of this - it operates on the basis of first in first out (FIFO).

You can think of it like people queuing for tickets - only those at the front can buy and leave the queue,

while anyone added to the queue is adde to the end.

It is recommended to use the generic Queue from System.Collection.Generic namespace. rather than non-generic type.

Methods

Clear - Remove all objects from the
Contains - Used to check if an item is in the Queue
Dequeue - Removes an item from the begining of the Queue
Enqueue - Adds an item to the end of the Queue
Peek - Returns the item at the start of the Queue without removing it .


//Initialize Queue

Queue<int> example = new Queue<int>();

//Add to Queue

example.Enqueue(1);

example.Enqueue(2);

example.Enqueue(3);

//View first element in Queue

int p1 = example.Peak();

//Get and remove the first element in the Queue

int p2 =  example.Dequeue();

Ok now what ?

Now I know what you're thinking after reading the above

"Why can't I just use a List anyway"

Well you can if you want, and there's nothing wrong with it. But using Stacks and Queues both limits the access direction and I think most importantly it displays the intent of how the collection should be used to your fellow programmers.

That intent I think is the real gem here.

Adios

Well that's it, they're straight forward enough.

Feel free to ask questions, comment or contribute below!

And if you're feeling generous you can buy me a coffee with the link below ( and yes its all for coffee, I drink a copious amount of it while writing ☕ )

Creating a Server Side Data Annotations CustomValidator

Jamie Mc Manus — Mon, 10 Jan 2022 10:18:03 +0000

This tutorial requires some previous knowledge of the Data Annotations Namespace , along with .NET applications.

Data Annotations , an overview

Data Annotations allow you to configure class models and add various attributes that specify how the property it is applied to should be treated e.g.

Required
MaxLength
MinLength
Display (Name ,Order, Description etc)
Range
RegularExpression
Compare

These are just a few of the options available.
You can read more on Data Annotations Here

Why Write Your Own ?

Well its simple really - while the list of options is expansive we are often required to implement restrictions that don't exist.

Consider a common form to change passwords. It would require your existing password and the new password. Often you see a requirement that the new password is not the same as the current password. Or maybe just that the password is not the same as the Username.
Data Annotations has an option to make sure that two properties are the same using Compare - you could verify a user enters a password and reenters to confirm. But it does not have the opposite to this to prevent two properties being the same.

We will use a CustomValidator to build this option.

Get Started

Create a new class file. Within this import the below namespaces to get started:

using System.Reflection;
using System.ComponentModel.DataAnnotations;

Next create a new class named NotEqualTo and inherit from ValidationAttribute and override the IsValid method with our own. We'll also need to create the constructor that will accept the name of the form property we need to compare to.

   private readonly string _other;
   public NotEqualto (string other)
   {
      // This is the name of the property to compare to 
      _other = other;
   }

 protected override ValidationResult IsValid(object value, ValidationContext validationContext)
        { 
    .... 
}

Now we need to implement the logic in the IsValid method. The method takes two parameters

object value - This is the value entered by the user for that field.
ValidationContext validationContext - This is the instance object for our validation, and we can use this to access the other properties.

The key to all this is the validationContext. We need to use it in conjunction with the string we pass to the constructor.

// Get the Other Property
var otherProperty = validationContext.ObjectType.GetProperty(_other);
//Now use it to get the Value 
var otherValue = otherProperty.GetValue(validationContext.ObjectInstance, null);

Now this is all well and good but we should add in some checks in case the property doesn't exist and return an error message using the ValidationResult like so :

// Get the Other Property
var otherProperty = validationContext.ObjectType.GetProperty(_other);
//Check if it exists
            if (otherProperty == null)
            {
                return new ValidationResult( string.Format("Property {0} not found", _other) );
            }
//Now use it to get the Value 
var otherValue = otherProperty.GetValue(validationContext.ObjectInstance, null);

Then all we need to do is compare the values of the two properties, and if they are equal then set the ValidationResult to return an error.

if (object.Equals(value, otherValue))
            {
                // We can access the Display name like so 
                var otherDisplayAttribute = otherProperty.GetCustomAttribute(typeof(DisplayAttribute)) as DisplayAttribute;
                string otherName = "";
                if (otherDisplayAttribute != null)
                {
                    otherName = otherDisplayAttribute.Name;
                }
                else
                {
                    otherName = otherProperty.Name;
                }
                // Set the Error Message if the two values are the same.
                this.ErrorMessage = $"{validationContext.DisplayName} cannot be the same as {otherName}";
                return new ValidationResult(this.ErrorMessage);
            }

Simple enough.

Apply the Validator

You can apply the Custom validator like you would any other Data Annotation ! e.g. [NotEqualto("name_of_other_property")] . The name of the property to compare to must be passed in as well.

A more detailed example :

public class PasswordForm
{
[Required]
[Display(Name = "Current Password")]  
public string Password{get;set;}

[Required]
[NotEqualto("Password")]
[Display(Name = "New Password")] 
public string NewPassword{get;set;}

}

The Final Code

By now you should have something similar to the below:

using System.Reflection;
using System.ComponentModel.DataAnnotations;

namespace SampleProject.NotEqualsValidation
{

    public class NotEqualto : ValidationAttribute
    {
        private readonly string _other;
        public NotEqualto (string other)
        {
            // This is the name of the property to compare to 
            _other = other;
        }

        protected override ValidationResult IsValid(object value, ValidationContext validationContext)
        {
            var otherProperty = validationContext.ObjectType.GetProperty(_other);
            if (otherProperty == null)
            {
                return new ValidationResult( string.Format("Property {0} not found", _other) );
            }
            var otherValue = otherProperty.GetValue(validationContext.ObjectInstance, null);

            if (object.Equals(value, otherValue))
            {
                var otherDisplayAttribute = otherProperty.GetCustomAttribute(typeof(DisplayAttribute)) as DisplayAttribute;
                string otherName = "";
                if (otherDisplayAttribute != null)
                {
                    otherName = otherDisplayAttribute.Name;
                }
                else
                {
                    otherName = otherProperty.Name;
                }
                this.ErrorMessage = $"{validationContext.DisplayName} cannot be the same as {otherName}";
                return new ValidationResult(this.ErrorMessage);
            }
            return null;
        }
    }
}

Finito

I hope you've found this useful and that it gets you out of any binds you may find yourself in !
See a full example Git project below

JamieMcManus / CustomValidator

Example of a custom server side validator for data annotations

If you feel generous enough feel free to

Using the Params Keyword in C#

Jamie Mc Manus — Wed, 29 Dec 2021 13:16:58 +0000

The article is suitable for anyone and everyone as long as you know what a method and an array is in C# !

Outcomes

After reading this you should have a fairly good grasp on the Where, When and Why on using the params keyword for a method parameter, and possibly by the end of this it should have skyrocketed into your top 3 favorite method parameter types.

Happy reading ! 📚📚

What is it? ❔

The params keyword is , simply put, a method parameter that can take a variable number of arguments - you can pass in anything from one to infinity or even none at all !! It doesn't matter !!

Why would we need to do this ? 🤔

Sometimes we just don't know the answers in life, and this can apply to the number of arguments in a method.

Using the params keyword we can pass in multiple or none depending on our needs at the time. With this we can avoid having to write multiple overloads for our methods like the below example.

// Multiple Overloads
static int AddAll(int a, int b)
{
  return a + b;
}

static int AddAll(int a, int b, int c)
{
  return a + b + c;
}

static int AddAll(int a, int b, int c, int d)
{
  return a + b + c + d;
}

When using the params keyword you can just write

// Method 
static int AddAll(params int[] list)
    {
        int total = 0;
        for (int i = 0; i < list.Length; i++)
        {
            total += list[i];
        }
        return total;
}

// Method Call 
int sum0 = AddAll();
int sum2 = AddAll(2,5);
int sum3 = AddAll(2,5,7);

// Or Declare the array and pass it in
int[] nums = { 1,3,4,8 };
int sum4 = AddAll(nums);

As you can see this gives us the option to pass in none, and is also much more concise and clean than overloading.

How Does it Work ? 🔨

To start off you just set the method parameter like

static int AddAll(params int[] list){....}

Calling it is pretty simple really - there are two options:

Pass values in separated by commas e.g.

int sum3 = AddAll(2,5,7);

These will then be converted into a temporary array by the compiler, and if no arguments are given an empty array will still be created anyway.

Create an array and then pass that into the method.

int[] nums = { 1,3,4,8 };
int sum4 = AddAll(nums);

There are some quirks however that you should be aware of -

There can only be one parameter of param type per method.
The param type must be the last parameter. e.g.

static int AddAll(string name, params int[] list)

This will work because the params is the last argument.
However if we reverse this like so

static int AddAll(params int[] list, string name)

This will not work.

Optional parameters and the params type will not work together.
The params must take single-dimensional array - a multi-dimensional one will throw an error.

Farewell Speech 👋🎺

So that's all folks, I hope this has cleared up any doubts you may have had about the params keyword.

You can read the Microsoft docs here

Feel free to ask questions, comment or contribute below!

And if you're feeling generous you can buy me a coffee with the link below ( and yes its all for coffee, I drink a copius amount of it while writing ☕ )

Beware the Performance Dangers of MySQL Views

Jamie Mc Manus — Tue, 17 Aug 2021 18:29:18 +0000

This article is relevant to MYSQL. Other flavours of SQL (eg SQL Server , PostgreSQL , SQLite) may be slightly different, SQL Server in particular has Indexed Views which can improve performance.

Recently I have had the opportunity to trial several third party BI tools which integrate with my database. I tend to err on the side of caution and do not want to expose my table structure to these applications.

Some of these BI tools also allow users to create their own "Queries" with the tables, which can be confusing as they wont know the schema.

The common solution across their documentation for both issues is to create Views to simplify tables, hide joins etc.
While this sounds great it can be an absolute disaster performance-wise for your database.

What is a View ?

First off what exactly is a Database View ?
It is the result set of a stored query in the database server that can then be queried like a table.
Consider this example query to return actors and films they are in ( using the Sakilla sample Database ).



select 
    first_name , last_name, title,description,release_year
from actor a
inner join film_actor fa on fa.actor_id = a.actor_id
inner join film f on f.film_id = fa.film_id;

We can create a View from this Query by adding Create View 'View_name' as to the start of the query like the below.



CREATE VIEW `actor_films` AS
select 
    first_name , last_name, title,description,release_year
from actor a
inner join film_actor fa on fa.actor_id = a.actor_id
inner join film f on f.film_id = fa.film_id;

We can then query this like we would a table like



select * from actor_films ;

Seems pretty straight forward so far right ?

Types of Processing Algorithms

There is an additional optional clause for the Create View statement - the Algorithm. There are three possible values for this - Merge , Temptable and Undefined. This clause defines how MySQL will process the view query, and this is where your performance can be hit as hard as if hit by the hammer of Thor.

Merge

Lets say you need to need to query our new view - how exactly will MySQL do this ? With the merge algorithm it will simply merge your query with the query that creates the view.
Example - we add a where condition to query our view:



select * 
from actor_films
where release_year > 2006 ;

This will be combined with the View Query as:



CREATE VIEW `actor_films` AS
select 
    first_name , last_name, title,description,release_year
from actor a
inner join film_actor fa on fa.actor_id = a.actor_id
inner join film f on f.film_id = fa.film_id
where release_year > 2006

One thing to be away of is that you cannot use the merge algorithm if you have any of the following in your View Query:
1.Aggregate functions (SUM(), MIN(), MAX(), COUNT(), and so forth)
2.DISTINCT
3.GROUP BY
4.HAVING
5.LIMIT
6.UNION or UNION ALL
7.Subquery in the select list
8.Assignment to user variables

Trying to use any of these will force MySQL to use the below Temptable Algorithm.
So when using the Merge algorithm, the performance of your View is only as good as the query that creates it.

Temptable

With the Temptable option MySQL will run the View Query and store the results in a temporary table. Your query will then be run against this table.
This can be absolutely dire for performance if you don't have a where clause that significantly narrows down the result set in the View Query.
Consider an example view that contains Customer Orders and Details. Without a date clause limiting the results to eg the most recent 2years worth of orders , you will get all orders for all time. If you then try to add a few clauses when querying this view you will essentially be running the query twice - once where the temporary table is created and then again when your query is used against it.
This can be a disaster when using large datasets.

Undefined

This is the default option set when the Algorithm hasn't been set in the create statement. It allows MySQL to automatically select the best of the Merge and Temptable options with a preference to use the Merge option.

What ? more dangers ?!

So what happens when users start to join various Views together into new Views ? If they use the Merge algorythmn then not much, but if they use Temptable then you will start to take a hit again with performance as your performance issue begins to cascade.
And it gets worse. and worse. and worse.

Le Solutions

Plan the Views correctly and avoid any queries that will use the Temptable algorithm.
If you can, use aggregate functions when querying the View rather than in the Create View Statement.
Add Where conditions that will reduce the View result set.

And if you're feeling generous you can buy me a coffee with the link below ( and yes its all for coffee, I drink a copius amount of it while writing ☕ )

Creating a Sticky Table Column

Jamie Mc Manus — Wed, 14 Jul 2021 22:16:58 +0000

In this article I will show you how to create a sticky column on table scroll.

Image credit C messier

But Why ? 🤔🏛️

This is a question that led the Ancient Greek Philosopher Socrates to his eventual death , some say when he questioned why you would use a non responsive html table in our mobile centric world and then complain that it was not user friendly.
But seriously - sometimes using tables just makes sense, or is unavoidable. On mobile or just smaller screens in general a lot of the information in a table can end up being cut off because of our limited screen width , and scrolling horizontally could make other usefully identifying columns disappear from view leaving us in a bind. One solution is to make the identifying column stick in place on scroll.

What we'll build 👷

Postition:sticky

The key to this solution is using the CSS position:sticky. Applying this to say a div element will make it stick to its parent element. The good news is that this will also work for Table Cells !
( Word to the wise though , position sticky cannot be used on tr & thead elements )

Starting Out

Create a container div element , and within this you can create a good ol' fashioned HTML table with enough columns so that we'll be required to scroll horizontally.
Next we need to limit the width of the table parent to ensure scrolling. We can do this by adding a width and setting the overflow like below:



.films-container{
width:600px;
overflow:auto;
}

This a table that has most of the information cut off.. which is perfect !

The Meat 🍖

We need to create a CSS class with the postion:sticky and the location it is going to stick when scrolling starts and the element gets to. We'll also set the z-index and background-color to ensure that it appears over any of the other elements and remains visible.



.stick-column{
position: -webkit-sticky;
position: sticky;
left: 0;
background: #ffff !important;
z-index:9;
}

Now all we need to do is add this class to every td in the column want to stay in view.

Now that is all well and good but we can go one step further ( or not ) and apply this class when the user clicks on the column header so that column will stay visible. This gives the user the choice , which they always love.

Adding JavaScript

What we need to do is add an on click event to the headers which will let us add ( or remove ) the stick-column css class to all the td in the column.
The easiest way to achieve this is to use a combination of the html cellIndex property of our clicked header and the CSS nth-child selector.
Note that cellIndex starts at 0 , while nth-child starts at 1 , so we'll need to simply + 1 to match these.
We can then get all the td using the above and querySelectorAll. When we have these we can add our class , but first we need to remove the class from any other column that may have it as well because it will interfere with the current one.



function ClickColumn(){
  var index = this.cellIndex

  var selector = 'td:nth-child('+(index+1)+')'
  var cells = document.querySelectorAll(selector);

  // Check if trying to unclick the same column
  // If not then proceed , as we want to be able to unclick the functionality 
  if(!cells[0].classList.contains('stick-column')){
    // Get the Previous Clicked Element and remove Class 
    var previous = document.getElementsByClassName('stick-column');
    while(previous[0]) {
        previous[0].classList.remove('stick-column');
    }
  }

  for(var i = 0 ; i < cells.length ; i++) {
     if(cells[i].classList.contains('stick-column') ){
          cells[i].classList.remove('stick-column');
     }
     else{
         cells[i].classList.add('stick-column');
     }
  }
}

now all thats left is to add this event to the table headers - you can do this inline individually if you wish , or all at once via JavaScript like below



document.querySelectorAll('#film-tbl thead td')
.forEach(e => e.addEventListener("click", ClickColumn )
);

The Finished Product 🏁

And there we have it - click one of the headers and scroll away ! Of course there's plenty of room for improvement - we could allow multiple columns to stick or add some more CSS to highlight the sticky column .. but I'll leave that to you !

So until next time - Arrivederci ! 🎉

And if you're feeling generous you can buy me a coffee with the link below ( and yes its all for coffee, I drink a copius amount of it while writing ☕ )

Spruce up Link Tags with Retrieved Favicons

Jamie Mc Manus — Fri, 14 May 2021 20:38:37 +0000

So everybody loves links right? They take us to places we want to go.

Who wouldn't like them!

But they can be boring.🥱💤

Sure you can style them or manually get an image to show what the site is but why not get the websites own logo by using the Favicon from the link site and display it as well using the same url as the link? This would be pretty handy if we were creating links dynamically from a list eg [link1,link2,link3] ...

What is a Favicon anyway ?

The favicon is a small typically 16×16 pixel icon that serves as branding for websites. It is found in browser tab and within the browser address bar.
TLDR Its a tiny site logo.

Our Example

We'll create a sample using a hardcoded value - 'https://dev.to/', but you can iterate over list of urls if you want. The only difference will be that you will be injecting the link.

We need to create two elements within the a tag - one for the image , the other for the link text. You can see the HTML needed below.

 <a  class="link-item" href="https://dev.to/" > 
       <span class="link-image">
             <img src=""  width="25" height="25" />
       </span> 
       <span class="link-text">
               www.dev.to
       </span>
</a>

For the image source we can try two things:
1.Set the source as 'https://dev.to/favicon.ico' - the favicon can typically be found at the site root.
2.We can use Googleusercontent.com, which is a site that Google is using for a few things ,including storing website favicons visited by the search engine. Just use this as the source, set the domain value with the website url 'https://s2.googleusercontent.com/s2/favicons?domain=www.dev.to'

Either of these options are fine , but we could combine them using one as a fallback if the other fails using the javascript onerror event.

We can do that with the below:

<img src="https://dev.to/favicon.ico" 
     onerror="this.onerror=null; this.src='https://s2.googleusercontent.com/s2/favicons?domain=www.dev.to'" 
     alt="Dev.to" width="25" height="25"
/>

The purpose of adding this.onerror=null; within the onerror event is to prevent an endless loop of errors if both fail.

That's it , its pretty simple !! Go congratulate yourself because your links look better already 🎉🎉

You can see a JSFiddle demo here

And if you're feeling generous you can buy me a coffee with the link below ( and yes its all for coffee, I drink a copius amount of it while writing ☕ )