JSFiddle - React, Tailwind, and code Playground

by dhoerster

HTML

<div id='result'></div>

JavaScript

var a = 8, //change this value for the base permission (1=VIEW, 8=ADMIN, 64=EDIT, 512=INDEX)
    andAbove = 1,
    andBelow = 2,
    self = 0;

$(function(){
    $('#result')
        .append('<div><span>SELF </span>' + (a << self) + '</div>')
        .append('<div><span>ABOVE </span>' + (a << andAbove) + '</div>')
        .append('<div><span>BELOW </span>' + (a << andBelow) + '</div>')
        .append('<div><span>A & B </span>' + (a | (a << andBelow) | (a << andAbove)) + '</div>');
    
    determinePermissionDirection(a, (a << andAbove));
    determinePermissionDirection(a, (a << andBelow));
    determinePermissionDirection(a, (a | (a << andAbove) | (a << andBelow)));
    determinePermissionDirection(a, a);
    determinePermissionDirection(a, ((a << andBelow) | 128));
    determinePermissionDirection(a, 131072);
    
    $('#result')
        .append('<div><span>SELF </span>' + generateOpCode(a, self) + '</div>')
        .append('<div><span>ABOVE </span>' + generateOpCode(a, andAbove) + '</div>')
        .append('<div><span>BELOW </span>' + generateOpCode(a, andBelow) + '</div>')
        .append('<div><span>A & B </span>' + generateOpCode(a, andAbove + andBelow) + '</div>');
});

function determinePermissionDirection(basePermission, permissionToCheck){
    var isAbove = ((basePermission << andAbove) & permissionToCheck) == (basePermission << andAbove),
        isBelow = ((basePermission << andBelow) & permissionToCheck) == (basePermission << andBelow),
        isAboveAndBelow = isAbove && isBelow,
        isSelf = (basePermission & permissionToCheck) == basePermission,
        message;
    
    if(isAboveAndBelow) {
        message = $('<div><span>IS A & B!! </span>' + permissionToCheck + ' ~~ ' + basePermission + '</div>');
    } else if (isAbove) {
        message = $('<div><span>IS ABOVE!! </span>' + permissionToCheck + ' ~~ ' + basePermission + '</div>');
    } else if (isBelow) {
        message = $('<div><span>IS BELOW!! </span>' + permissionToCheck + ' ~~...