Merge pull request #810 from keymanapp/developer-restrict-modifiers-to-common-in-layout-builder-744

[developer] Restrict modifier options to a small set by default in touch layout editor
This commit is contained in:
Marc Durdin 2018-05-03 15:53:55 +07:00 committed by GitHub
commit 39389921bb
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 103 additions and 27 deletions

View file

@ -350,6 +350,15 @@ $(function () {
this.modifierCodes.SHIFT | this.modifierCodes.CTRL | this.modifierCodes.ALT
];
this.minimalModifierCombinations = [
0,
this.modifierCodes.RALT,
this.modifierCodes.SHIFT,
this.modifierCodes.RALT | this.modifierCodes.SHIFT
];
this.showAllModifierCombinations = false;
// Add CAPS and NO_CAPS variants for all of the above
(function(c, codes) {
var i, n = c.length;
@ -399,6 +408,12 @@ $(function () {
builder.selectSubKey(null);
builder.prepareLayer();
});
$('#chkShowAllModifierOptions').click(function () {
builder.showAllModifierCombinations = $('#chkShowAllModifierOptions')[0].checked;
builder.fillModifierSelect();
builder.prepareKey();
});
this.preparePlatforms = function () {
var firstPlatform = null;
@ -454,12 +469,15 @@ $(function () {
}
this.prepareLayers = function () {
this.fillLayerSelect();
this.fillModifierSelect();
};
this.fillLayerSelect = function() {
$('#selLayer option').remove();
$('#selKeyNextLayer option').remove();
$('#selSubKeyNextLayer option').remove();
$('#selKeyLayerOverride option').remove();
$('#selSubKeyLayerOverride option').remove();
opt = document.createElement('option');
$(opt).attr('value', '').text('(none)');
$('#selKeyNextLayer').append(opt);
@ -468,14 +486,6 @@ $(function () {
$(opt).attr('value', '').text('(none)');
$('#selSubKeyNextLayer').append(opt);
opt = document.createElement('option');
$(opt).attr('value', '').text('(layer default)');
$('#selKeyLayerOverride').append(opt);
opt = document.createElement('option');
$(opt).attr('value', '').text('(layer default)');
$('#selSubKeyLayerOverride').append(opt);
for (var layer in KVKL[builder.lastPlatform].layer) {
var opt = document.createElement('option');
$(opt).attr('value', layer)
@ -490,21 +500,86 @@ $(function () {
$(opt).append(KVKL[builder.lastPlatform].layer[layer].id);
$('#selSubKeyNextLayer').append(opt);
}
for (var modifier = 0; modifier < this.validModifierCombinations.length; modifier++) {
var name = this.getModifierCombinationName(this.validModifierCombinations[modifier]);
opt = document.createElement('option');
$(opt).append(name);
$('#selKeyLayerOverride').append(opt);
opt = document.createElement('option');
$(opt).append(name);
$('#selSubKeyLayerOverride').append(opt);
};
this.fillModifierSelect = function() {
var modifiers = this.showAllModifierCombinations ? this.validModifierCombinations : this.minimalModifierCombinations;
var
$selKeyLayerOverride = $('#selKeyLayerOverride'),
$selSubKeyLayerOverride = $('#selSubKeyLayerOverride'),
$addLayerList = $('#addLayerList');
opt = document.createElement('option');
$(opt).append(name);
$('#addLayerList').append(opt);
var add = function(e, val, text) {
var opt = document.createElement('option');
if(typeof text != 'undefined') {
$(opt).attr('value', val);
$(opt).text(text);
} else {
$(opt).text(val);
}
e.append(opt);
};
$('#selKeyLayerOverride option').remove();
$('#selSubKeyLayerOverride option').remove();
$('#addLayerList option').remove();
add($selKeyLayerOverride, '', '(layer default)');
add($selSubKeyLayerOverride, '', '(layer default)');
add($addLayerList, '', '(custom)');
for (var modifier = 0; modifier < modifiers.length; modifier++) {
var name = this.getModifierCombinationName(modifiers[modifier]);
add($selKeyLayerOverride, name);
add($selSubKeyLayerOverride, name);
add($addLayerList, name);
}
}
var alreadyAdded = function(modifier) {
return builder.minimalModifierCombinations.indexOf(modifier) >= 0;
};
// check all keys for modifier usage
var modifierNames = [];
for(var i = 0; i < KVKL[builder.lastPlatform].layer.length; i++) {
var layer = KVKL[builder.lastPlatform].layer[i];
for(var j = 0; j < layer.row.length; j++) {
var row = layer.row[j];
for(var k = 0; k < row.key.length; k++) {
if(typeof row.key[k].layer != 'undefined' && modifierNames.indexOf(row.key[k].layer) < 0) {
modifierNames.push(row.key[k].layer);
}
if(typeof row.key[k].sk != 'undefined') {
for(var l = 0; l < row.key[k].sk.length; l++) {
if(typeof row.key[k].sk[l].layer != 'undefined' && modifierNames.indexOf(row.key[k].sk[l].layer) < 0) {
modifierNames.push(row.key[k].sk[l].layer);
}
}
}
}
}
}
var isUsed = function(modifierName) {
return modifierNames.indexOf(modifierName) >= 0;
};
if(!this.showAllModifierCombinations) {
// Add any layer names that are already referenced
for(modifier = 0; modifier < this.validModifierCombinations.length; modifier++) {
var name = this.getModifierCombinationName(this.validModifierCombinations[modifier]);
if(!alreadyAdded(this.validModifierCombinations[modifier]) && isUsed(name)) {
add($selKeyLayerOverride, name);
add($selSubKeyLayerOverride, name);
}
}
}
};
this.prepareLayer = function () {
var layer = KVKL[builder.lastPlatform].layer[builder.lastLayerIndex];

View file

@ -39,6 +39,7 @@
<button id='btnDelLayer'>Del</button>
<button id='btnEditLayer'>Edit</button>
Presentation: <select id='selPlatformPresentation'></select>
<input type='checkbox' id='chkShowAllModifierOptions'/> <label for='chkShowAllModifierOptions'>Show all modifier options</label>
</div>
<br class='clear' />
</div>
@ -52,7 +53,7 @@
<option value='9'>Blank</option>
<option value='10'>Spacer</option>
</select>
<label for='selKeyLayerOverride'>Shift:</label> <select id='selKeyLayerOverride'></select>
<label for='selKeyLayerOverride'>Modifier:</label> <select id='selKeyLayerOverride'></select>
<label for='inpKeyName'>Code:</label> <input id='inpKeyName' type='text' size='16' maxlength='64' />
<input id='inpKeyCap' type='text' size='8' maxlength='16' />
<label for='inpKeyPadding'>Padding Left:</label>
@ -79,7 +80,7 @@
<option value='9'>Blank</option>
<option value='10'>Spacer</option>
</select>
<label for='selSubKeyLayerOverride'>Shift:</label> <select id='selSubKeyLayerOverride'></select>
<label for='selSubKeyLayerOverride'>Modifier:</label> <select id='selSubKeyLayerOverride'></select>
<label for='inpSubKeyName'>Code:</label> <input id='inpSubKeyName' type='text' size='16' maxlength='64' />
<input id='inpSubKeyCap' type='text' size='8' maxlength='16' />
<label for='selSubKeyNextLayer'>Next Layer:</label> <select id='selSubKeyNextLayer'></select>
@ -96,7 +97,7 @@
<div id='addLayerDialog' title='Add layer'>
<form>
<fieldset>
<label for='addLayerList'>Modifier-based layer:</label> <select id='addLayerList'><option>(custom)</option></select><br />
<label for='addLayerList'>Modifier-based layer:</label> <select id='addLayerList'></select><br />
</fieldset>
<fieldset>
<label for='addLayerName'>Name:</label> <input type='text' id='addLayerName' size='16' maxlength='64' /><br/>