notionparallax/explanation.md

## explanation.md

      
    Raw
  

              explanation.md
            
          
    I've just got my first mechanical keyboard. I want to set it up so that it has the same layout as my android keyboard, the theory being that it's probably easier to learn, even if it does seem a bit odd.
I've been using keyboard-layout-editor.com to fiddle with the planned layout, here but then when it comes to actually programming the keyboard it looks pretty manual.
I started a quick stab at something to help speed it up, but I wondered if I was reinventing the wheel. Has anyone already been down this road?

  
## keyMapConverter.js
var layout = [
    [{
            "c": "#cf2525",
            "fa": [
                0,
                0,
                0,
                0,
                0,
                0,
                4
            ]
        },
        "\n\n<i class='fa fa-lock'></i>\n\nEsc\n\nEsc", {
            "c": "#cccccc",
            "t": "#0a16f7\n\n#0af73e\n\n#575757\n\n\n\n\n\n#cc00ff",
            "fa": [
                4,
                0,
                4,
                0,
                0,
                0,
                4,
                0,
                0,
                0,
                2
            ]
        },
        "1\n\n~\n\nQ\n\n\n\n\n\nf1",
        "2\n\n`\n\nW\n\n\n\n\n\nf2",
        "3\n\n|\n\nE\n\n\n\n\n\nf3",
        "4\n\n&bull;\n\nR\n\n\n\n\n\nf4",
        "5\n\n&radic;\n\nT\n\n\n\n\n\nf5",
        "6\n\n&pi;\n\nY\n\n\n\n\n\nf6",
        "7\n\n&divide;\n\nU\n\n\n\n\n\nf7",
        "8\n\n&times;\n\nI\n\n\n\n\n\nf8",
        "9\n\n&para;\n\nO\n\n\n\n\n\nf9",
        "0\n\n&Delta;\n\nP\n\n\n\n\n\nf11",
        "del\n\n<i class='fa fa-bars'></i>\n\nBackspace\n\n\n\n\n\nf12"
    ],
    [{
            "t": "#0a16f7\n\n\n\n#575757",
            "a": 7
        },
        "\n\n\n\nTab", {
            "t": "#0a16f7\n\n#0af73e\n\n#575757\n\n\n\n\n\n#cc00ff",
            "a": 4
        },
        "@\n\n&pound;\n\nA\n\n\n\n\n\n&infin;",
        "#\n\n&cent;\n\nS\n\n\n\n\n\n&exist;",
        "$\n\n&euro;\n\nD\n\n\n\n\n\n&empty;",
        "_\n\n&yen;\n\nF\n\n\n\n\n\n&isin;",
        "&\n\n^\n\nG\n\n\n\n\n\n&notin;",
        "-\n\n&deg;\n\nH\n\n\n\n\n\n&sum;",
        "+\n\n=\n\nJ\n\n\n\n\n\n&ang;",
        "(\n\n{\n\nK\n\n\n\n\n\n&cap;",
        ")\n\n}\n\nL\n\n\n\n\n\n&cup;", {
            "w": 1.75
        },
        "/\n\n\\\n\nEnter\n\n\n\n\n\n¯\\_(ツ)_/¯"
    ],
    [{
            "t": "#0a16f7\n\n\n\n#575757",
            "a": 7,
            "w": 1.75
        },
        "\n\n\n\nshift", {
            "t": "#0a16f7\n\n#0af73e\n\n#575757\n\n\n\n\n\n#cc00ff",
            "a": 4
        },
        "*\n\n%\n\nZ\n\n\n\n\n\n<i class='kb kb-Multimedia-Mute-2'></i>",
        "\"\n\n&copy;\n\nX\n\n\n\n\n\n<i class='kb kb-Multimedia-Volume-Down-1'></i>",
        "'\n\n&reg;\n\nC\n\n\n\n\n\n<i class='kb kb-Multimedia-Volume-Up-1'></i>",
        ":\n\n&trade;\n\nV\n\n\n\n\n\n&#9788;",
        ";\n\n&#8453;\n\nB\n\n\n\n\n\n&#9728;",
        "!\n\n[\n\nN\n\n\n\n\n\n<i class='fa fa-terminal'></i>",
        "?\n\n]\n\nM\n\n\n\n\n\n<i class='fa fa-television '></i>",
        ",\n\n&sup2;\n\n.\n\n\n\n\n\n<i class='kb kb-Unicode-PrintScreen-2'></i>", {
            "t": "#0a16f7\n\n\n\n#575757",
            "f": 3
        },
        "pg up\n\n\n\n&uarr;", {
            "x": 0.25,
            "a": 7
        },
        "\n\n\n\nShift"
    ],
    [{
            "x": 0.1
        },
        "\n\n\n\nCtrl", {
            "x": 0.1499999999999999,
            "c": "#00ff38",
            "t": "#0a16f7"
        },
        "", {
            "x": 0.25,
            "c": "#cccccc",
            "t": "#0a16f7\n\n\n\n#575757"
        },
        "\n\n\n\nAlt", {
            "x": 0.25,
            "c": "#0039ff",
            "t": "#0a16f7",
            "w": 2.25
        },
        "", {
            "c": "#cccccc",
            "t": "#0a16f7\n\n\n\n#575757",
            "w": 2.5
        },
        "\n\n\n\nspace", {
            "a": 4,
            "f": 3
        },
        "home\n\n\n\n&larr;", {
            "x": 0.1999999999999993,
            "f": 3
        },
        "pg dn\n\n\n\n&darr;", {
            "x": 0.1999999999999993,
            "f": 3
        },
        "end\n\n\n\n&rarr;"
    ]
];


var mainLayer = [];
var greenLayer= [];
var blueLayer = [];
var pinkLayer = [];

var main = 4;
var green= 2;
var blue = 0;
var pink = 10;

for (var j = 0; j < layout.length; j++) {
    var row = layout[j];

    mainLayer[j] = [];
    greenLayer[j]= [];
    blueLayer[j] = [];
    pinkLayer[j] = [];

    for (var i = 0; i < row.length; i++) {
        var key = row[i];
        if (typeof(key) == "string") {
            keyVals = key.split("\n");
            mainLayer[j].push(keyVals[main]);
            greenLayer[j].push(keyVals[green]);
            blueLayer[j].push(keyVals[blue]);
            pinkLayer[j].push(keyVals[pink]);
        }
    }
}

var layers = [{layer: mainLayer,  name:"main Layer"},
              {layer: greenLayer, name:"green Layer"},
              {layer: blueLayer,  name:"blue Layer"},
              {layer: pinkLayer,  name:"pink Layer"}
              ];

for (var k = 0; k < layers.length; k++) {
    var layer = layers[k].layer;
    var name  = layers[k].name;
    var boardRepresentation = "";
    var keymap_c = "KEYMAP(\n";

    for (var i = 0; i < layer.length; i++) {
        var repKey, cKey;
        var row = layer[i];
        var rowText = "|"
        var keymapText = "      "
        for (var j = 0; j < row.length; j++) {
          var key = row[j]
            if (key == undefined || key == "") {
              repKey = " ";   cKey   = "TRNS";
            } else {
              repKey = key;   cKey   = key;
            }
            rowText    += (" " + repKey + " |");
            keymapText += (cKey + ",  ");
        }

        var divider = new Array(rowText.length + 1).join("-");
        if (i == 0) {
            boardRepresentation += divider+"\n";
        }
        boardRepresentation += rowText+"\n";
        boardRepresentation += divider+"\n";

        keymap_c += keymapText += "\\\n"
    }
    console.log("******\n"+name+"\n");
    console.log(boardRepresentation+"\n");
    console.log(keymap_c += ")\n******\n");
}

## output.txt
******
main Layer

-----------------------------------------------------------
| Esc | Q | W | E | R | T | Y | U | I | O | P | Backspace |
-----------------------------------------------------------
| Tab | A | S | D | F | G | H | J | K | L | Enter |
---------------------------------------------------
| shift | Z | X | C | V | B | N | M | . | &uarr; | Shift |
----------------------------------------------------------
| Ctrl |   | Alt |   | space | &larr; | &darr; | &rarr; |
---------------------------------------------------------


KEYMAP(
      Esc,  Q,  W,  E,  R,  T,  Y,  U,  I,  O,  P,  Backspace,  \
      Tab,  A,  S,  D,  F,  G,  H,  J,  K,  L,  Enter,  \
      shift,  Z,  X,  C,  V,  B,  N,  M,  .,  &uarr;,  Shift,  \
      Ctrl,  TRNS,  Alt,  TRNS,  space,  &larr;,  &darr;,  &rarr;,  \
)
******

******
green Layer

-----------------------------------------------------------------------------------------------------------------------------------------
| <i class='fa fa-lock'></i> | ~ | ` | | | &bull; | &radic; | &pi; | &divide; | &times; | &para; | &Delta; | <i class='fa fa-bars'></i> |
-----------------------------------------------------------------------------------------------------------------------------------------
|   | &pound; | &cent; | &euro; | &yen; | ^ | &deg; | = | { | } | \ |
---------------------------------------------------------------------
|   | % | &copy; | &reg; | &trade; | &#8453; | [ | ] | &sup2; |   |   |
-----------------------------------------------------------------------
|   |   |   |   |   |   |   |   |
---------------------------------


KEYMAP(
      <i class='fa fa-lock'></i>,  ~,  `,  |,  &bull;,  &radic;,  &pi;,  &divide;,  &times;,  &para;,  &Delta;,  <i class='fa fa-bars'></i>,  \
      TRNS,  &pound;,  &cent;,  &euro;,  &yen;,  ^,  &deg;,  =,  {,  },  \,  \
      TRNS,  %,  &copy;,  &reg;,  &trade;,  &#8453;,  [,  ],  &sup2;,  TRNS,  TRNS,  \
      TRNS,  TRNS,  TRNS,  TRNS,  TRNS,  TRNS,  TRNS,  TRNS,  \
)
******

******
blue Layer

---------------------------------------------------
|   | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 0 | del |
---------------------------------------------------
|   | @ | # | $ | _ | & | - | + | ( | ) | / |
---------------------------------------------
|   | * | " | ' | : | ; | ! | ? | , | pg up |   |
-------------------------------------------------
|   |   |   |   |   | home | pg dn | end |
------------------------------------------


KEYMAP(
      TRNS,  1,  2,  3,  4,  5,  6,  7,  8,  9,  0,  del,  \
      TRNS,  @,  #,  $,  _,  &,  -,  +,  (,  ),  /,  \
      TRNS,  *,  ",  ',  :,  ;,  !,  ?,  ,,  pg up,  TRNS,  \
      TRNS,  TRNS,  TRNS,  TRNS,  TRNS,  home,  pg dn,  end,  \
)
******

******
pink Layer

--------------------------------------------------------------
|   | f1 | f2 | f3 | f4 | f5 | f6 | f7 | f8 | f9 | f11 | f12 |
--------------------------------------------------------------
|   | &infin; | &exist; | &empty; | &isin; | &notin; | &sum; | &ang; | &cap; | &cup; | ¯\_(ツ)_/¯ |
--------------------------------------------------------------------------------------------------
|   | <i class='kb kb-Multimedia-Mute-2'></i> | <i class='kb kb-Multimedia-Volume-Down-1'></i> | <i class='kb kb-Multimedia-Volume-Up-1'></i> | &#9788; | &#9728; | <i class='fa fa-terminal'></i> | <i class='fa fa-television '></i> | <i class='kb kb-Unicode-PrintScreen-2'></i> |   |   |
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
|   |   |   |   |   |   |   |   |
---------------------------------


KEYMAP(
      TRNS,  f1,  f2,  f3,  f4,  f5,  f6,  f7,  f8,  f9,  f11,  f12,  \
      TRNS,  &infin;,  &exist;,  &empty;,  &isin;,  &notin;,  &sum;,  &ang;,  &cap;,  &cup;,  ¯\_(ツ)_/¯,  \
      TRNS,  <i class='kb kb-Multimedia-Mute-2'></i>,  <i class='kb kb-Multimedia-Volume-Down-1'></i>,  <i class='kb kb-Multimedia-Volume-Up-1'></i>,  &#9788;,  &#9728;,  <i class='fa fa-terminal'></i>,  <i class='fa fa-television '></i>,  <i class='kb kb-Unicode-PrintScreen-2'></i>,  TRNS,  TRNS,  \
      TRNS,  TRNS,  TRNS,  TRNS,  TRNS,  TRNS,  TRNS,  TRNS,  \
)
******

[Finished in 0.1s]
	var layout = [
	[{
	"c": "#cf2525",
	"fa": [
	0,
	0,
	0,
	0,
	0,
	0,
	4
	]
	},
	"\n\n<i class='fa fa-lock'></i>\n\nEsc\n\nEsc", {
	"c": "#cccccc",
	"t": "#0a16f7\n\n#0af73e\n\n#575757\n\n\n\n\n\n#cc00ff",
	"fa": [
	4,
	0,
	4,
	0,
	0,
	0,
	4,
	0,
	0,
	0,
	2
	]
	},
	"1\n\n~\n\nQ\n\n\n\n\n\nf1",
	"2\n\n`\n\nW\n\n\n\n\n\nf2",
	"3\n\n\|\n\nE\n\n\n\n\n\nf3",
	"4\n\n•\n\nR\n\n\n\n\n\nf4",
	"5\n\n√\n\nT\n\n\n\n\n\nf5",
	"6\n\nπ\n\nY\n\n\n\n\n\nf6",
	"7\n\n÷\n\nU\n\n\n\n\n\nf7",
	"8\n\n×\n\nI\n\n\n\n\n\nf8",
	"9\n\n¶\n\nO\n\n\n\n\n\nf9",
	"0\n\nΔ\n\nP\n\n\n\n\n\nf11",
	"del\n\n<i class='fa fa-bars'></i>\n\nBackspace\n\n\n\n\n\nf12"
	],
	[{
	"t": "#0a16f7\n\n\n\n#575757",
	"a": 7
	},
	"\n\n\n\nTab", {
	"t": "#0a16f7\n\n#0af73e\n\n#575757\n\n\n\n\n\n#cc00ff",
	"a": 4
	},
	"@\n\n£\n\nA\n\n\n\n\n\n∞",
	"#\n\n¢\n\nS\n\n\n\n\n\n∃",
	"$\n\n€\n\nD\n\n\n\n\n\n∅",
	"_\n\n¥\n\nF\n\n\n\n\n\n∈",
	"&\n\n^\n\nG\n\n\n\n\n\n∉",
	"-\n\n°\n\nH\n\n\n\n\n\n∑",
	"+\n\n=\n\nJ\n\n\n\n\n\n&ang;",
	"(\n\n{\n\nK\n\n\n\n\n\n∩",
	")\n\n}\n\nL\n\n\n\n\n\n∪", {
	"w": 1.75
	},
	"/\n\n\\\n\nEnter\n\n\n\n\n\n¯\\_(ツ)_/¯"
	],
	[{
	"t": "#0a16f7\n\n\n\n#575757",
	"a": 7,
	"w": 1.75
	},
	"\n\n\n\nshift", {
	"t": "#0a16f7\n\n#0af73e\n\n#575757\n\n\n\n\n\n#cc00ff",
	"a": 4
	},
	"*\n\n%\n\nZ\n\n\n\n\n\n<i class='kb kb-Multimedia-Mute-2'></i>",
	"\"\n\n©\n\nX\n\n\n\n\n\n<i class='kb kb-Multimedia-Volume-Down-1'></i>",
	"'\n\n®\n\nC\n\n\n\n\n\n<i class='kb kb-Multimedia-Volume-Up-1'></i>",
	":\n\n™\n\nV\n\n\n\n\n\n☼",
	";\n\n℅\n\nB\n\n\n\n\n\n☀",
	"!\n\n[\n\nN\n\n\n\n\n\n<i class='fa fa-terminal'></i>",
	"?\n\n]\n\nM\n\n\n\n\n\n<i class='fa fa-television '></i>",
	",\n\n²\n\n.\n\n\n\n\n\n<i class='kb kb-Unicode-PrintScreen-2'></i>", {
	"t": "#0a16f7\n\n\n\n#575757",
	"f": 3
	},
	"pg up\n\n\n\n↑", {
	"x": 0.25,
	"a": 7
	},
	"\n\n\n\nShift"
	],
	[{
	"x": 0.1
	},
	"\n\n\n\nCtrl", {
	"x": 0.1499999999999999,
	"c": "#00ff38",
	"t": "#0a16f7"
	},
	"", {
	"x": 0.25,
	"c": "#cccccc",
	"t": "#0a16f7\n\n\n\n#575757"
	},
	"\n\n\n\nAlt", {
	"x": 0.25,
	"c": "#0039ff",
	"t": "#0a16f7",
	"w": 2.25
	},
	"", {
	"c": "#cccccc",
	"t": "#0a16f7\n\n\n\n#575757",
	"w": 2.5
	},
	"\n\n\n\nspace", {
	"a": 4,
	"f": 3
	},
	"home\n\n\n\n←", {
	"x": 0.1999999999999993,
	"f": 3
	},
	"pg dn\n\n\n\n↓", {
	"x": 0.1999999999999993,
	"f": 3
	},
	"end\n\n\n\n→"
	]
	];


	var mainLayer = [];
	var greenLayer= [];
	var blueLayer = [];
	var pinkLayer = [];

	var main = 4;
	var green= 2;
	var blue = 0;
	var pink = 10;

	for (var j = 0; j < layout.length; j++) {
	var row = layout[j];

	mainLayer[j] = [];
	greenLayer[j]= [];
	blueLayer[j] = [];
	pinkLayer[j] = [];

	for (var i = 0; i < row.length; i++) {
	var key = row[i];
	if (typeof(key) == "string") {
	keyVals = key.split("\n");
	mainLayer[j].push(keyVals[main]);
	greenLayer[j].push(keyVals[green]);
	blueLayer[j].push(keyVals[blue]);
	pinkLayer[j].push(keyVals[pink]);
	}
	}
	}

	var layers = [{layer: mainLayer, name:"main Layer"},
	{layer: greenLayer, name:"green Layer"},
	{layer: blueLayer, name:"blue Layer"},
	{layer: pinkLayer, name:"pink Layer"}
	];

	for (var k = 0; k < layers.length; k++) {
	var layer = layers[k].layer;
	var name = layers[k].name;
	var boardRepresentation = "";
	var keymap_c = "KEYMAP(\n";

	for (var i = 0; i < layer.length; i++) {
	var repKey, cKey;
	var row = layer[i];
	var rowText = "\|"
	var keymapText = " "
	for (var j = 0; j < row.length; j++) {
	var key = row[j]
	if (key == undefined \|\| key == "") {
	repKey = " "; cKey = "TRNS";
	} else {
	repKey = key; cKey = key;
	}
	rowText += (" " + repKey + " \|");
	keymapText += (cKey + ", ");
	}

	var divider = new Array(rowText.length + 1).join("-");
	if (i == 0) {
	boardRepresentation += divider+"\n";
	}
	boardRepresentation += rowText+"\n";
	boardRepresentation += divider+"\n";

	keymap_c += keymapText += "\\\n"
	}
	console.log("******\n"+name+"\n");
	console.log(boardRepresentation+"\n");
	console.log(keymap_c += ")\n******\n");
	}
	******
	main Layer

	-----------------------------------------------------------
	\| Esc \| Q \| W \| E \| R \| T \| Y \| U \| I \| O \| P \| Backspace \|
	-----------------------------------------------------------
	\| Tab \| A \| S \| D \| F \| G \| H \| J \| K \| L \| Enter \|
	---------------------------------------------------
	\| shift \| Z \| X \| C \| V \| B \| N \| M \| . \| ↑ \| Shift \|
	----------------------------------------------------------
	\| Ctrl \| \| Alt \| \| space \| ← \| ↓ \| → \|
	---------------------------------------------------------


	KEYMAP(
	Esc, Q, W, E, R, T, Y, U, I, O, P, Backspace, \
	Tab, A, S, D, F, G, H, J, K, L, Enter, \
	shift, Z, X, C, V, B, N, M, ., ↑, Shift, \
	Ctrl, TRNS, Alt, TRNS, space, ←, ↓, →, \
	)
	******

	******
	green Layer

	-----------------------------------------------------------------------------------------------------------------------------------------
	\| <i class='fa fa-lock'></i> \| ~ \| ` \| \| \| • \| √ \| π \| ÷ \| × \| ¶ \| Δ \| <i class='fa fa-bars'></i> \|
	-----------------------------------------------------------------------------------------------------------------------------------------
	\| \| £ \| ¢ \| € \| ¥ \| ^ \| ° \| = \| { \| } \| \ \|
	---------------------------------------------------------------------
	\| \| % \| © \| ® \| ™ \| ℅ \| [ \| ] \| ² \| \| \|
	-----------------------------------------------------------------------
	\| \| \| \| \| \| \| \| \|
	---------------------------------


	KEYMAP(
	<i class='fa fa-lock'></i>, ~, `, \|, •, √, π, ÷, ×, ¶, Δ, <i class='fa fa-bars'></i>, \
	TRNS, £, ¢, €, ¥, ^, °, =, {, }, \, \
	TRNS, %, ©, ®, ™, ℅, [, ], ², TRNS, TRNS, \
	TRNS, TRNS, TRNS, TRNS, TRNS, TRNS, TRNS, TRNS, \
	)
	******

	******
	blue Layer

	---------------------------------------------------
	\| \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 0 \| del \|
	---------------------------------------------------
	\| \| @ \| # \| $ \| _ \| & \| - \| + \| ( \| ) \| / \|
	---------------------------------------------
	\| \| * \| " \| ' \| : \| ; \| ! \| ? \| , \| pg up \| \|
	-------------------------------------------------
	\| \| \| \| \| \| home \| pg dn \| end \|
	------------------------------------------


	KEYMAP(
	TRNS, 1, 2, 3, 4, 5, 6, 7, 8, 9, 0, del, \
	TRNS, @, #, $, _, &, -, +, (, ), /, \
	TRNS, *, ", ', :, ;, !, ?, ,, pg up, TRNS, \
	TRNS, TRNS, TRNS, TRNS, TRNS, home, pg dn, end, \
	)
	******

	******
	pink Layer

	--------------------------------------------------------------
	\| \| f1 \| f2 \| f3 \| f4 \| f5 \| f6 \| f7 \| f8 \| f9 \| f11 \| f12 \|
	--------------------------------------------------------------
	\| \| ∞ \| ∃ \| ∅ \| ∈ \| ∉ \| ∑ \| &ang; \| ∩ \| ∪ \| ¯\_(ツ)_/¯ \|
	--------------------------------------------------------------------------------------------------
	\| \| <i class='kb kb-Multimedia-Mute-2'></i> \| <i class='kb kb-Multimedia-Volume-Down-1'></i> \| <i class='kb kb-Multimedia-Volume-Up-1'></i> \| ☼ \| ☀ \| <i class='fa fa-terminal'></i> \| <i class='fa fa-television '></i> \| <i class='kb kb-Unicode-PrintScreen-2'></i> \| \| \|
	----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
	\| \| \| \| \| \| \| \| \|
	---------------------------------


	KEYMAP(
	TRNS, f1, f2, f3, f4, f5, f6, f7, f8, f9, f11, f12, \
	TRNS, ∞, ∃, ∅, ∈, ∉, ∑, &ang;, ∩, ∪, ¯\_(ツ)_/¯, \
	TRNS, <i class='kb kb-Multimedia-Mute-2'></i>, <i class='kb kb-Multimedia-Volume-Down-1'></i>, <i class='kb kb-Multimedia-Volume-Up-1'></i>, ☼, ☀, <i class='fa fa-terminal'></i>, <i class='fa fa-television '></i>, <i class='kb kb-Unicode-PrintScreen-2'></i>, TRNS, TRNS, \
	TRNS, TRNS, TRNS, TRNS, TRNS, TRNS, TRNS, TRNS, \
	)
	******

	[Finished in 0.1s]