haskal
/
asciiflow2
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Updated menu icons etc and added desktop input support

This commit is contained in:
Lewis Hemens 2014-01-20 23:58:33 +00:00
parent 475fef7323
commit 5ab4ce0e85
3 changed files with 114 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
index.html
View File

@ -6,15 +6,10 @@
<title>ASCIIFlow Infinity</title>
<style>
#menu {
margin-left: auto;
margin-right: auto;
position: absolute;
top: 5px;
top: 95px;
left: 0px;
right: 0px;
z-index: 100;
width: 400px;
text-align: center;
}
.dialog {
@ -32,19 +27,19 @@
}
button {
width: 15%;
display: block;
margin: 3px;
width: 60px;
height: 30px;
text-align: center;
cursor: pointer;
border-radius: 5px;
background: #DEF;
background: #F8F8F8;
outline: 0 !important;
border-width: 1px;
border-color: #DDD;
border-color: #444;
}
button.active {
border-color: #444;
background: #D0E0FF;
}
@ -59,9 +54,31 @@ button.active {
height: 100px;
}
#logo {
position: absolute;
top: 0px;
left: 0px;
z-index: 100;
background: #F8F8F8;
border-right: 1px solid #444;
border-bottom: 1px solid #444;
}
#logo pre {
margin: 0px;
}
</style>
</head>
<body>
<div id="logo"><pre>
__ ____ ____ _ _ ____ _____ _ __
/ \ | ___|| ___||_||_| / ___|| | _ | \ __ / /
/ /\ \|_ \ | | _ _ / / | | | | | |\ \/ \/ /
/ __ \_\ \ | |__ | || |/ __| | |_| |_| | \ /
/__/ \__\___||____||_||_|_/ |____|____| \_/\_/
</pre></div>
<div id="menu">
<div id="buttons">
<button id="box-button" class="active">Box</button>
@ -69,7 +86,9 @@ button.active {
<button id="freeform-button">Draw</button>
<button id="erase-button">Erase</button>
<button id="move-button">Resize</button>
<button id="menu-button">Menu</button>
<button id="text-button">Text</button>
<!-- <button id="select-button">Select</button> -->
<!-- <button id="menu-button">Menu</button> -->
</div>
<div id="menu-button-dialog" class="dialog">
<pre id="export-area">BLAH</pre>

22
js-lib/controller.js
View File

@ -153,6 +153,10 @@ ascii.Controller.prototype.installBindings = function() {
$('#buttons > button').click(function(e) {
this.updateButtons(e.target.id);
}.bind(this));
$(window).keypress(function(e) {
this.handleKeyPress(e.keyCode);
}.bind(this));
};
/**
@ -182,4 +186,22 @@ ascii.Controller.prototype.updateButtons = function(id) {
if (id == 'move-button') {
this.drawFunction = new ascii.DrawMove(this.state);
}
if (id == 'text-button') {
this.drawFunction = new ascii.DrawText(this.state);
}
};
/**
* Handles key presses.
* @param {number} keyCode
*/
ascii.Controller.prototype.handleKeyPress = function(keyCode) {
// TODO: Handle undo, redo, and ctrl+c and ctrl+v.
var stringValue = String.fromCharCode(keyCode);
// Override some special characters so that can be handled in one place.
if (keyCode == 13) {
stringValue = '\n';
}
this.drawFunction.handleKey(stringValue);
this.view.dirty = true;
};

63
js-lib/draw.js
View File

@ -49,6 +49,8 @@ ascii.DrawFunction.prototype.end = function(position) {};
* @return {string}
*/
ascii.DrawFunction.prototype.getCursor = function(position) {};
/** Handle the key with given value being pressed. @param {string} value */
ascii.DrawFunction.prototype.handleKey = function(value) {};
/**
* @constructor
@ -75,6 +77,7 @@ ascii.DrawBox.prototype.end = function(position) {
ascii.DrawBox.prototype.getCursor = function(position) {
return 'crosshair';
};
ascii.DrawBox.prototype.handleKey = function(value) {};
/**
* @constructor
@ -107,6 +110,7 @@ ascii.DrawLine.prototype.end = function(position) {
ascii.DrawLine.prototype.getCursor = function(position) {
return 'crosshair';
};
ascii.DrawLine.prototype.handleKey = function(value) {};
/**
* @constructor
@ -131,6 +135,58 @@ ascii.DrawFreeform.prototype.end = function(position) {
ascii.DrawFreeform.prototype.getCursor = function(position) {
return 'crosshair';
};
ascii.DrawFreeform.prototype.handleKey = function(value) {};
/**
* @constructor
* @implements {ascii.DrawFunction}
* @param {ascii.State} state
*/
ascii.DrawText = function(state) {
this.state = state;
this.startPosition = null;
this.currentPosition = null;
};
ascii.DrawText.prototype.start = function(position) {
this.startPosition = position;
this.currentPosition = position;
// Clean up any existing draws.
this.state.clearDraw();
// Effectively highlights the starting cell.
var currentValue = this.state.getCell(position).getRawValue();
this.state.drawValue(position, currentValue == null ? ' ' : currentValue);
};
ascii.DrawText.prototype.move = function(position) {};
ascii.DrawText.prototype.end = function(position) {};
ascii.DrawText.prototype.getCursor = function(position) {
return 'text';
};
ascii.DrawText.prototype.handleKey = function(value) {
if (this.currentPosition == null) {
return;
}
if (value == '\n') {
// Pressed return key, so clear this cell.
this.state.clearDraw();
} else {
// Draw the value and commit it.
this.state.drawValue(this.currentPosition, value);
this.state.commitDraw();
}
var nextPosition = this.currentPosition.add(new ascii.Vector(1, 0));
// Check for hitting edge of box or return character, then line wrap.
if (value == '\n' || this.state.getCell(nextPosition).isSpecial()) {
nextPosition = this.startPosition.add(new ascii.Vector(0, 1));
this.startPosition = nextPosition;
}
// Highlight the next cell.
this.currentPosition = nextPosition;
var nextValue = this.state.getCell(nextPosition).getRawValue();
this.state.drawValue(nextPosition, nextValue == null ? ' ' : nextValue);
};
/**
* @constructor
@ -156,8 +212,8 @@ ascii.DrawErase.prototype.move = function(position) {
var endX = Math.max(this.startPosition.x, this.endPosition.x);
var endY = Math.max(this.startPosition.y, this.endPosition.y);
for (var i = startX; i < endX; i++) {
for (var j = startY; j < endY; j++) {
for (var i = startX; i <= endX; i++) {
for (var j = startY; j <= endY; j++) {
this.state.drawValue(new ascii.Vector(i, j), ' ');
}
}
@ -168,6 +224,7 @@ ascii.DrawErase.prototype.end = function(position) {
ascii.DrawErase.prototype.getCursor = function(position) {
return 'crosshair';
};
ascii.DrawErase.prototype.handleKey = function(value) {};
/**
* @constructor
@ -279,3 +336,5 @@ ascii.DrawMove.prototype.getCursor = function(position) {
}
};
ascii.DrawMove.prototype.handleKey = function(value) {};