Added learning cost

Author: navmed

ArsoniteLayout v1.psd

@@ -22,6 +22,13 @@ <h2>
 Arsonite is an efficient keyboard layout with minimal changes from QWERTY and almost all
 changes are symmetrical swaps, making it very easy to learn.
 </h2>
+<h3>Design Goals</h3>
+<ul>
+    <li><strong>Efficency:</strong> Keep most frequently used letters on the home row</li>
+    <li><strong>Minimal Changes:</strong> Change as less as possible, to make the layout easy to learn and minimize shortcut changes</li>
+    <li><strong>Easy learning:</strong> Swap keys, instead of moving them around. if you make a
+        mistake, all you have to do is use the key that you got to get the key you want. </li>
+</ul>
 
 <div id="downloads">
     <span>Windows</span>
@@ -70,6 +77,10 @@ <h2>
 <div id="layouts-all">
     <div id="layout-template" class="layout" style="display: none">
         <h3></h3>
+        <div>
+            <span>Learning Cost</span>
+            <span class="learning-cost"></span>
+        </div>
         <div>
             <span>Distance</span>
             <span class="distance"></span>
@@ -122,14 +133,23 @@ <h3></h3>
     K.Stats = [];
     K.AddLayout = function(layoutName, keymap){
         var layout = $("#layout-template").clone().attr("id",layoutName);
-        layout.find("h2").text(layoutName);
+        layout.find("h3").text(layoutName);
         layout.show();
         layout.appendTo($("#layouts-all"));
 
         var stats = new CKeyStats(layoutName, keymap);
         K.Stats.push(stats);
     };
 
+    K.CalculateAllCosts = function(){
+        var text = $("#text").val();
+
+        K.Stats.forEach(function(e, i, a){
+            e.calculate(text);
+            e.displayStats($("#" + e.name));
+        });
+    };
+
     // Qwerty already added as a starting point
 
     K.dvorakMap = [
@@ -157,17 +177,13 @@ <h3></h3>
     ];
 
     K.AddLayout("qwerty");
-    K.AddLayout("dvorak", K.dvorakMap);
     K.AddLayout("arsonite", K.arsoniteMap);
+    K.AddLayout("dvorak", K.dvorakMap);
     K.AddLayout("colemak", K.colemakMap);
+    K.CalculateAllCosts();
 
     $("#process").click(function(){
-        var text = $("#text").val();
-
-        K.Stats.forEach(function(e, i, a){
-            e.calculate(text);
-            e.displayStats($("#" + e.name));
-        });
+        K.CalculateAllCosts();
     });
 
 

ArsoniteLayout.psd

@@ -43,13 +43,15 @@ function CKeyboard(keymap){
    	this.ROWS = 5;
    	this.COLUMNS = 15;
 
-    this.defaultKeyboard =
+    this.learningCost = 0;
+
+    this.qwertyKeymap =
    		[	// lowercase, uppercase
-   		"`1234567890-=\\",   "~!@#$%^&*()_+|" ,
-   		" qwertyuiop[]"  ,   " QWERTYUIOP{}"  ,
-   		" asdfghjkl;'\n" ,   " ASDFGHJKL:\"\n",
-   		"  zxcvbnm,./"   ,   "  ZXCVBNM<>?"   ,
-   		      "  "       ,         ""
+   		"`1234567890-=",   "~!@#$%^&*()_+" ,
+   		" qwertyuiop[]\\", " QWERTYUIOP{}|"  ,
+   		" asdfghjkl;'\n" , " ASDFGHJKL:\"\n",
+   		"  zxcvbnm,./"   , "  ZXCVBNM<>?"   ,
+   		      "  "       , ""
    		];
 
     this.defaultFingering =
@@ -61,6 +63,7 @@ function CKeyboard(keymap){
    		      " 8"
    		];
 
+    this.keymap = this.qwertyKeymap;
     this.charToIndex = {};
     this.keyArea = Array2D(this.ROWS, this.COLUMNS);// area of image
     this.keyFinger = Array2D(this.ROWS, this.COLUMNS);
@@ -133,19 +136,43 @@ CKeyboard.prototype.isSettable = function(row, col) {
 };
 
 CKeyboard.prototype.setDefaultKeys = function() {
-	for (var i=0; i < this.defaultKeyboard.length; i+=2) {
-        this.setRow(i/2,this.LOWERCASE, this.defaultKeyboard[i]);
-        this.setRow(i/2,this.UPPERCASE, this.defaultKeyboard[i+1]);
+	for (var i=0; i < this.qwertyKeymap.length; i+=2) {
+        this.setRow(i/2,this.LOWERCASE, this.qwertyKeymap[i]);
+        this.setRow(i/2,this.UPPERCASE, this.qwertyKeymap[i+1]);
 	}
 };
 
 CKeyboard.prototype.setKeys = function(keymap){
+    this.keymap = keymap;
     for (var i=0; i < keymap.length; i+=2) {
          this.setRow(i/2, this.LOWERCASE, keymap[i]);
          this.setRow(i/2, this.UPPERCASE, keymap[i+1]);
      }
 };
 
+CKeyboard.prototype.calculateLearningCost = function(){
+    this.learningCost = 0;
+    var keymap = this.keymap;
+    var qwertyKeyMap = this.qwertyKeymap;
+    for(var i=0; i<qwertyKeyMap.length; i+=2){
+        var qrow = qwertyKeyMap[i];
+        for(var j=0; j<qrow.length; j++){
+            var q = qrow[j];
+            if(keymap[i][j] != q){
+                // Check for swap
+                var pos = this.locate(q);
+                if(keymap[pos.y*2][pos.x] == q && this.qwertyKeymap[pos.y*2][pos.x] == keymap[i][j]){    // swapped
+                    this.learningCost++;
+                }else{
+                    this.learningCost+=4;
+                }
+            }
+        }
+    }
+
+    return this.learningCost;
+}
+
 CKeyboard.prototype.setupFingers = function() {
 	var i=0;
 	var fingers = [];

index.html

@@ -7,6 +7,7 @@ function CKeyStats(name, keymap){
    	this.sameHandTotal = 0;
    	this.sameFingerTotal = 0;
    	this.keysTotal = 0;
+    this.learningCost = 0;
 
     this.rowTotal = [];// = new int[Keyboard.ROWS];
     this.lhTotal = []; //= new int[5];  //fingers on lh
@@ -22,6 +23,9 @@ CKeyStats.prototype.calculate = function(text){
 	// reset counters
     var keyboard = this.keyboard;
 	this.distanceTotal = this.sameHandTotal = this.sameFingerTotal = this.keysTotal = 0;
+    if(this.name != "qwerty")
+        this.learningCost = keyboard.calculateLearningCost();
+
     var i=0;
 	for (i=0; i < keyboard.ROWS; i++)
     {
@@ -103,6 +107,7 @@ CKeyStats.prototype.displayStats = function(resultsDiv) {
         var i=0;
 
 		resultsDiv.find(".totalKeys").text(this.keysTotal);
+        resultsDiv.find(".learning-cost").text(this.learningCost);
 
 		// row percents
 		//   percent of non-space keys