Shikiryu
/
motsmeles
mirror of https://github.com/Chouchen/motsmeles.git
1
0
Fork 0
Code Issues Releases Wiki Activity

Better event managment, needs a lot of work tho'

This commit is contained in:
Shikiryu 2015-02-15 23:42:03 +01:00
parent e634521128
commit b7322214b3
1 changed files with 50 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

81
src/generator.html
View File

@ -11,19 +11,28 @@
</style> </style>
</head> </head>
<body> <body>
<aside id="generator-options"> <h3>Current mode : <span id="currentMode">nothing</span></h3>
<label for="grid-width"><input type="number" id="grid-width" min="1" max="20" step="1" name="grid-width" value="1"/></label> <aside id="generator-options">
<label for="grid-height"><input type="number" id="grid-height" min="1" max="20" step="1" name="grid-height" value="1"/></label> <label for="grid-width"><input type="number" id="grid-width" min="1" max="20" step="1" name="grid-width" value="1"/></label>
</aside> <label for="grid-height"><input type="number" id="grid-height" min="1" max="20" step="1" name="grid-height" value="1"/></label>
<section id="generator-grid"></section> </aside>
<section id="generator-grid"></section>
</body> </body>
<script> <script>
var grid = []; var grid = [];
var width = 1; var width = 1;
var height= 1; var height= 1;
var current = { word : '', start: [], end: [] }; var current = { word : '', start: [], end: [] };
// left = 37
// up = 38
// right = 39
// down = 40
var sens; var sens;
var senses = [37,38,39,40];
var isChoosingSens = false; var isChoosingSens = false;
var currentModeText = document.getElementById('currentMode');
var isTypingWord = function() { return !isChoosingSens && sens !== undefined; };
var isNavigating = function() { return !isChoosingSens && sens === undefined; };
var inputGrid = document.getElementById('generator-grid'); var inputGrid = document.getElementById('generator-grid');
var modifyGridSize = function modifyGridSize() { var modifyGridSize = function modifyGridSize() {
@ -33,7 +42,7 @@
var iHtml = ''; var iHtml = '';
for(var i = 0,l = currentHeight; i <l ; i++) { for(var i = 0,l = currentHeight; i <l ; i++) {
for (var j = 0, m = currentWidth; j<m; j++) { for (var j = 0, m = currentWidth; j<m; j++) {
iHtml += '<input type="text" class="inputGrid" maxlength="1"/>'; iHtml += '<input type="text" class="inputGrid" data-x="'+j+'" data-y="'+i+'" maxlength="1"/>';
} }
iHtml += '<div class="clearboth"></div>'; iHtml += '<div class="clearboth"></div>';
} }
@ -49,23 +58,6 @@
modifyGridSize(); modifyGridSize();
}, false); }, false);
document.body.addEventListener("keydown", function(evt) {
// left = 37
// up = 38
// right = 39
// down = 40
var senses = [37,38,39,40];
if (isChoosingSens && senses.indexOf(evt.keyCode) !== -1 ) {
sens = evt.keyCode;
console.log("sens is " + sens);
}
}, false);
var chooseSens = function chooseSens() {
isChoosingSens = true;
console.log('choose a sens !');
};
var validWord = function validWord() { var validWord = function validWord() {
console.log('todo validword'); console.log('todo validword');
}; };
@ -74,11 +66,11 @@
console.log('todo gotonext'); console.log('todo gotonext');
}; };
var gridFocus = function gridFocus(evt) { /*var gridFocus = function gridFocus(evt) {
if(sens == undefined && !isChoosingSens) { if(sens == undefined && !isChoosingSens) {
chooseSens(); chooseSens();
} }
}; };*/
var gridKeydown = function gridKeydown(evt) { var gridKeydown = function gridKeydown(evt) {
var typedKey = evt.keyCode; var typedKey = evt.keyCode;
@ -87,17 +79,44 @@
// right = 39 // right = 39
// down = 40 // down = 40
var senses = [37,38,39,40]; var senses = [37,38,39,40];
if (isChoosingSens && senses.indexOf(evt.keyCode) !== -1 ) { if (isChoosingSens && senses.indexOf(typedKey) !== -1) {
sens = evt.keyCode; // chosing sens
console.log('current Mode : sens chosen!');
currentModeText.innerHTML = 'choosing sens';
sens = typedKey;
isChoosingSens = false; isChoosingSens = false;
console.log("sens is " + sens); console.log("sens is " + sens);
} else if (typedKey === 13) { } else if(isNavigating() && senses.indexOf(typedKey) !== -1) {
// navigating
console.log('current Mode : navigating');
currentModeText.innerHTML = 'navigating';
var x = document.activeElement.getAttribute('data-x');
var y = document.activeElement.getAttribute('data-y');
var newX = typedKey === 37 ? +x-1 : typedKey === 39 ? +x+1 : +x;
var newY = typedKey === 38 ? +y-1 : typedKey === 40 ? +y+1 : +y;
var next = document.querySelector('.inputGrid[data-x="'+newX+'"][data-y="'+newY+'"]');
if(next) next.focus();
} else if (isTypingWord() && typedKey === 13) {
console.log('current Mode : validate word');
currentModeText.innerHTML = 'word validated';
// validate a word
validWord(); validWord();
sens = void 0; sens = void 0;
current.word = ''; current.word = '';
} else { } else if (isTypingWord()){
console.log('current Mode : typing word');
currentModeText.innerHTML = 'typing a word';
// type a letter
current.word += typedKey; current.word += typedKey;
goToNextCase(); goToNextCase();
} else if(isNavigating() && typedKey === 13) {
console.log('current Mode : choosing sens');
currentModeText.innerHTML = 'choosing sens';
isChoosingSens = true;
} else {
// nothing from above
currentModeText.innerHTML = 'nothing';
console.log('nope');
} }
}; };
@ -106,10 +125,10 @@
var inputsLength = inputs.length; var inputsLength = inputs.length;
for (var i = 0; i < inputsLength; i++) { for (var i = 0; i < inputsLength; i++) {
var input = inputs[i]; var input = inputs[i];
input.removeEventListener("focus",gridFocus); // input.removeEventListener("focus",gridFocus);
input.removeEventListener("keydown",gridKeydown); input.removeEventListener("keydown",gridKeydown);
input.addEventListener("focus", gridFocus.bind(this), false); // input.addEventListener("focus", gridFocus.bind(this), false);
input.addEventListener("keydown", gridKeydown.bind(this), false); input.addEventListener("keydown", gridKeydown.bind(this), false);
} }
}; };