Skip to main content

Peter Marshall

Create react app starter

1 min read

I had not don ethis in a while. Here it is recorded.

Assumes you have npm.

create direcctory (mkdir whatever)

cd whatever

npm init whatever

npm install --save-dev create-react-app

npx create-react-app whatever

cd whatever

npm start

---- it should run

start a new command window --- I use conemu

go to the directory you just created

if you have vscode installed type code .

thats code (dot)

update the code. refresh browser bingo...



Peter Marshall

Using Base64EncodedStrings for images

3 min read

The images are in a legacy system ( aspx pages). Some are generated dynamicly by that system (bar codes). The new system, mobile freindly, angualar, asp,net mvc requires to print docuements with these images in. So I get the content for the documents to be printed, and find it has img tags in it and these point to the relative path in the aspx application. 

I extract the relative path from the image tags, nice regex here. 

string imgTagSelectionPattern = @"<img.*?src=""(?<url>.*?)"".*?>";

Get the image and convert it to a base64encoded string

private string GetImageContentAsBase64EncodedString(Uri url)
    var content = string.Empty;
        var request = (HttpWebRequest)WebRequest.Create(url);
        using (var response = (HttpWebResponse)request.GetResponse())
            if (response.StatusCode == HttpStatusCode.OK)
                var receiveStream = response.GetResponseStream();
                if (receiveStream != null)
     byte[] outData;
     var tempMemStream = new MemoryStream();
     outData = tempMemStream.ToArray();
     content = Convert.ToBase64String(outData);
}                  content = Convert.ToBase64String(outData);                 }             }         }     }     catch     {         //this is the base64 encoding of an 'image not found' image         content = "iVBORw0KGgoAAAANSUhEUgAAAJYAAAAaCAIAAADaETIWAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAG+SURBVGhD7ZbrdYMwDIUzFwMxD9OwTIZJLT+kK4NSTsGhavX9smW9b06SxytwTkjonpDQPSGhe/65hM9lehDT8qyWq1nngckzpyRM7T3mtV5+MSTUbp8fGCAkvIR3Eg7eryMJ05ZSp2TIJGv7jsIJ2IbSc1ChPOx6VooiHIYbgrBtItu11diGV6P0IJIU+14bkmZaFk8Spo7V1uRSZ1jnNowythMZazZIDMdGyS/x7T3bmy9eILNGiiescB2t+7XaaFnJDCWGcKWEPKe6gJPAHujK2+EDoZJltIWde0fJsk1RwUJmuFHuYBtYYgwflZDsQjHKiOJIJwUnyxi7g0IZcdMBgBR/E26UO9gGlhjDByXE2dR+mPb6zdjG7rQZs/QvDBYyw41yB9vAEmO4R0I6spE9BXDd4d1O+YEubXd4VkhswgyXbrILlttrg9zB5W/9FtIxk/+o9UaCpy3DV7odWLsrlwYGtWz9MlVswggXe/4HWp/sNqT5eU3nvurFnJLwPDQsTNivNDjAzRLSx1s+yZ2gwSFulhC/dBKh3w+4XcLgLCGhe0JC94SE7gkJ3RMSuickdE9I6J6Q0Dmv1xcjhYT1jnd5CwAAAABJRU5ErkJggg==";     }     return content; }

Then prepend it with the following "data:image/png;base64," replace the original src string with the new string and deliver all that client side in the new application.

Peter Marshall

Pass an array of int to ASP.NET WEBAPI C#

3 min read

Today I had to provide an endpoint that accepts an array of integers. As it happens this was for a DELETE operation. So an existing edpoint api/link/{id}  exists. The problem was I could not find any guidance for a RESTFUL url for delete a whole bunch of links. Initialy I proposed passing the array in the body, this was rejected as angular was not able to call the DELETE and pass a body.

So, the url is going to look like api/link/2,4,67,4


Create a Model to contain the passed in list of int.

public class LinkIds {     public List<int> Ids { getset; }     public List<KeyValuePair<int,bool>> Results { getset; } }

You need to create a model binder that inherits from IModelBinder.

public class LinkIdModelBinder : IModelBinder

And that requires a BindModel method.

public bool BindModel(HttpActionContext actionContext, ModelBindingContext bindingContext) {   

Within the BindModel method we can validate that the type is correct

if (bindingContext.ModelType != typeof(LinkIds)) {     return false; }

Validate the name.

var val = bindingContext.ValueProvider.GetValue(bindingContext.ModelName); if (val == null) {     return false; }

Validate that we have got a vlaue.

var key = val.RawValue as string; if (key == null) {     bindingContext.ModelState.AddModelError(bindingContext.ModelName, "Wrong value type");     return false; }

check we have integers.

var values = val.AttemptedValue.Split(','); var ids = new List<int>(); foreach (var value in values) {     int intValue;     int.TryParse(value.Trim(), out intValue);     if (intValue > 0)     {         ids.Add(intValue);     } }

Get the passed value into our bindingContext, and return everything fine.

if (ids.Count > 0) {     var result = new LinkIds     {         Ids = ids     };     bindingContext.Model = result;     return true; }

Or if there is an issue report it.

bindingContext.ModelState.AddModelError(     bindingContext.ModelName, "Cannot convert value to list of int."); return false;


Now we can create the endpoint in the controller as follows


[VersionRoute("{linkIds}", 1, true)]

[ResponseType(typeof(bool))] public async Task<IHttpActionResult> DeleteAllAsync([ModelBinder(typeof(LinkIdModelBinder))] LinkIds linkIds) {

And that works

linkIds.Ids can be processed as a list.


Peter Marshall

Driver A light-weight, no-dependency, vanilla JavaScript engine to drive the user's focus across the page

A light-weight, no-dependency, vanilla JavaScript engine to drive the user's focus across the page

Peter Marshall

Peter Marshall

Peter Marshall

Peter Marshall

Peter Marshall

Peter Marshall