Template:ImageCrop

/***
    USAGE:

    ImageCrop(file)

    ImageCrop(file, page)

    ImageCrop(file, page, width, height)

    ImageCrop(file, _, width, height)

***/

var width = $width ?? 80;
var height= $height ?? 80;


var file;
if ($file) {
    if($file is map) {
        let file = $file;
    } else {
        var pg = $page ? ($page is map ? $page : wiki.getpage($page)) : page;
        let file = pg.files[$file];
    }
    if(file.imageheight) {
        var prop = width / height;  //comment    
        <div class="img-wrap" style=("width:"..width.."px;height:"..height.."px;border:1px solid #000;overflow:hidden;")>
            var iwidth = file.imagewidth;
            var iheight = file.imageheight;
            var iprop = iwidth/iheight;
            var isize= "?size=thumb";
            var osmargin=0;
    
            if (prop>iprop) {
                if (height>160){let isize='?size=webview'}
                if (height>550){let isize=''}
                let osmargin = (height-((iheight * width)/iwidth))/2; //calculate the offset margin so it can be centered;
                <img src=(file.uri..isize) class="img-tall" style=("width:"..width.."px;margin-top:"..osmargin.."px;")/>
            }
            if (prop<iprop) {
                if (width>160){let isize='?size=webview'}
                if (width>550){let isize=''}
                let osmargin = (width-((iwidth * height)/iheight))/2; //calculate the offset margin so it can be centered;
                <img src=(file.uri..isize) class="img-wide" style=("height:"..height.."px;margin-left:"..osmargin.."px;")/>    
            }
            if (prop==iprop) {
                if (height>160){let isize='?size=webview'}
                if (height>550){let isize=''}        
                <img src=(file.uri..isize) class="img-square" style=("width:"..width.."px;height:"..height.."px;")/>
            }
        </div>
    } else {
        <div class="file-not-img">"(The file is not an image)"</div>
    }
} else {
    <div class="file-missing">"error: missing FILE parameter"</div>
}