SPThumbnailPathGenerator.ts

class SPThumbnailPathGenerator {
    _SPThumbnailPath: string;
    constructor(path: string) {
        this._SPThumbnailPath = path;
    }

    SPThumbnailPath_W ()
    {
        let imgPath = this._SPThumbnailPath;
        let pathWithOutFileName = imgPath.substring(0, imgPath.lastIndexOf("/") + 1);
        let fileName = imgPath.substring(imgPath.lastIndexOf("/") + 1);        
        fileName = fileName.replace('.', '_');
        imgPath = `${pathWithOutFileName}_w/${fileName}`
        if (imgPath.includes('?'))
        {
            return imgPath.replace("?", ".jpg?");
        }
        else
        {
            return`${imgPath}.jpg`            
        }        
    }

    SPThumbnailPath_T ()
    {
        let imgPath = this._SPThumbnailPath;
        let pathWithOutFileName = imgPath.substring(0, imgPath.lastIndexOf("/") + 1);
        let fileName = imgPath.substring(imgPath.lastIndexOf("/") + 1);        
        fileName = fileName.replace('.', '_');
        imgPath = `${pathWithOutFileName}_t/${fileName}`
        if (imgPath.includes('?'))
        {
            return imgPath.replace("?", ".jpg?");
        }
        else
        {
            return`${imgPath}.jpg`            
        }        
    }
}


let spthumbnailPathGenerator = new SPThumbnailPathGenerator("https://www.somesite.com/sites/sitename/listname/imagename.jpg");

let thumbNailButton = document.createElement('button');
let wideImageButton = document.createElement('button');

thumbNailButton.textContent = "Get Thumbnail Path";
wideImageButton.textContent = "Get bigger image Path";
thumbNailButton.onclick = function() {
    alert(spthumbnailPathGenerator.SPThumbnailPath_T());
}
wideImageButton.onclick = function() {
    alert(spthumbnailPathGenerator.SPThumbnailPath_W());
}
document.body.appendChild(thumbNailButton);
document.body.appendChild(wideImageButton);