truck/Sahli
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

First use of Ansilove for rendering, plus loads of js lint fixes

Browse source
This commit is contained in:
Iam Naughton Phier 2014-10-10 03:55:37 +03:00
parent 413a4dad3e
commit a4eb5be5c9
2 changed files with 202 additions and 196 deletions
Download patch file Download diff file Expand all files Collapse all files

2
index.html
View file

@ -2,7 +2,7 @@
<head> <head>
<title>Sahli - ascii/ansi viewer</title> <title>Sahli - ascii/ansi viewer</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script> <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="textmode.js"></script> <script type="text/javascript" src="ansilove.js/ansilove.js"></script>
<script type="text/javascript" src="sahli.js"></script> <script type="text/javascript" src="sahli.js"></script>
<link rel="stylesheet" href="sahli.css" type="text/css" media="screen" /> <link rel="stylesheet" href="sahli.css" type="text/css" media="screen" />
<meta charset='UTF-8' /> <meta charset='UTF-8' />

92
sahli.js
View file

@ -10,6 +10,12 @@
// Uses fonts by DMG, http://trueschool.se // Uses fonts by DMG, http://trueschool.se
// Uses SixteenColors textmode js library for rendering // Uses SixteenColors textmode js library for rendering
/* remove this before publishing, as alert is ... well just crap to leave in */
/*global alert */
// but don't remove these
/*global XMLHttpRequest, AnsiLove, Element */
var Sahli = function () { var Sahli = function () {
this.outbox = $('div#outbox'); this.outbox = $('div#outbox');
this.dbox = $('div#drawbox'); this.dbox = $('div#drawbox');
@ -68,9 +74,9 @@ var Sahli = function () {
}; };
this.loadplain = function (picdata, inserthere) { this.loadplain = function (picdata, inserthere) {
var ref = this; // var ref = this;
var pdiv = $('<div>'); var pdiv = $('<div>');
var canv = document.createElement('canvas'); // var canv = document.createElement('canvas');
var req = new XMLHttpRequest(); var req = new XMLHttpRequest();
var fname = this.location + '/' + picdata.file; var fname = this.location + '/' + picdata.file;
var ptxt = $('<pre></pre>'); var ptxt = $('<pre></pre>');
@ -96,61 +102,59 @@ var Sahli = function () {
ptxt.text(this.responseText); ptxt.text(this.responseText);
inserthere.after(pdiv); inserthere.after(pdiv);
} else { } else {
sahli.loaderror(inserthere,fname,req.statusText,req.status) this.loaderror(inserthere, fname, req.statusText, req.status);
} }
} }
}; };
req.open('GET', fname, true); req.open('GET', fname, true);
req.send(null); req.send(null);
} };
this.loadansi = function (picdata, inserthere) { this.loadansi = function (picdata, inserthere) {
var fname = this.location + '/' + picdata.file; var fname = this.location + '/' + picdata.file;
var canv = document.createElement('canvas'); // var canv = document.createElement('canvas');
var pdiv = $('<div>'); var pdiv = $('<div>');
this.image = new ImageTextModeANSI(); // var SAUCE;
this.SAUCE = new ImageTextModeSAUCE(); AnsiLove.render(fname, function (canv, SAUCE) {
var picload = this.image.parseUrl(fname);
this.image.renderCanvas(canv);
pdiv.append(canv); pdiv.append(canv);
inserthere.after(pdiv); inserthere.after(pdiv);
this.origwidth = canv.width; this.origwidth = canv.width;
this.origheight = canv.height; this.origheight = canv.height;
if (picload < 1) { this.SAUCE = SAUCE;
// this is incorrect but currently parseUrl does not return errors. }, {"font": "80x25", "bits": "9", "columns": 80, "thumbnail": 0});
// fix, then deal with. };
sahli.loaderror(inserthere,fname,'Not found',404);
}
}
this.loadxbin = function (picdata, inserthere) { this.loadxbin = function (picdata, inserthere) {
alert('xbin'); alert('xbin', picdata, inserthere);
} };
this.loadbin = function (picdata, inserthere) { this.loadbin = function (picdata, inserthere) {
alert('bin'); alert('bin', picdata, inserthere);
} };
this.loadice = function (picdata, inserthere) { this.loadice = function (picdata, inserthere) {
alert('ice'); alert('ice', picdata, inserthere);
} };
this.loadidf = function (picdata, inserthere) { this.loadidf = function (picdata, inserthere) {
alert('idf'); alert('idf', picdata, inserthere);
} };
this.loadadf = function (picdata, inserthere) { this.loadadf = function (picdata, inserthere) {
alert('adf'); alert('adf', picdata, inserthere);
} };
this.loadavatar = function (picdata, inserthere) { this.loadavatar = function (picdata, inserthere) {
alert('avatar'); alert('avatar', picdata, inserthere);
} };
this.loadtundra = function (picdata, inserthere) { this.loadtundra = function (picdata, inserthere) {
alert('tundra'); alert('tundra', picdata, inserthere);
} };
this.loadpcboard = function (picdata, inserthere) { this.loadpcboard = function (picdata, inserthere) {
alert('pcboard'); alert('pcboard', picdata, inserthere);
} };
this.loadxbin = function(picdata,inserthere){
alert('xbin');
}
this.fillinfo = function (picdata) { this.fillinfo = function (picdata) {
@ -168,13 +172,13 @@ var Sahli = function () {
this.loaderror = function (inserthere, fname, errorText, errorCode) { this.loaderror = function (inserthere, fname, errorText, errorCode) {
var temptxt = ""; var temptxt = "";
if (errorCode === 404) { if (errorCode === 404) {
tmptxt = $("<h1>").text("Unable to find file " + fname); temptxt = $("<h1>").text("Unable to find file " + fname);
} else { } else {
tmptxt = $("<h1>").text("error! "+ errorText + " code " + errorCode + temptxt = $("<h1>").text("error! " + errorText + " code " + errorCode +
" file " + fname); " file " + fname);
} }
inserthere.after(tmptxt); inserthere.after(temptxt);
} };
this.calccolor = function (colorset) { this.calccolor = function (colorset) {
return 'rgba(' + colorset.toString() + ')'; return 'rgba(' + colorset.toString() + ')';
@ -192,7 +196,7 @@ var Sahli = function () {
this.fullwidth = function () { this.fullwidth = function () {
this.stopscroll(); this.stopscroll();
if ($('canvas').width() == this.dbox.width()) { if ($('canvas').width() === this.dbox.width()) {
this.originalsize(this.zoomspeed); this.originalsize(this.zoomspeed);
} else { } else {
var ratio = this.origwidth / this.dbox.width(); var ratio = this.origwidth / this.dbox.width();
@ -206,7 +210,7 @@ var Sahli = function () {
this.fullheight = function () { this.fullheight = function () {
var canv = $('canvas'); var canv = $('canvas');
if (canv.height() == this.dbox.height()) { if (canv.height() === this.dbox.height()) {
this.originalsize(this.zoomspeed); this.originalsize(this.zoomspeed);
} else { } else {
var ratio = this.origheight / this.dbox.height(); var ratio = this.origheight / this.dbox.height();
@ -220,6 +224,8 @@ var Sahli = function () {
this.originalsize = function (zoomspeed) { this.originalsize = function (zoomspeed) {
// why do we not have origwidth now? hmm. // why do we not have origwidth now? hmm.
var canv = $('canvas'); var canv = $('canvas');
var zs = zoomspeed; // why are we not using this?
zs = zs + 1;
canv.animate({ canv.animate({
width: this.origwidth, width: this.origwidth,
height: this.origheight height: this.origheight
@ -256,7 +262,7 @@ var Sahli = function () {
this.resizedrawbox = function (height) { this.resizedrawbox = function (height) {
var dbox1 = $('div#drawbox'); var dbox1 = $('div#drawbox');
if ('undefined' === typeof height) { if ('undefined' === height) {
dbox1.height(window.innerHeight - 2); dbox1.height(window.innerHeight - 2);
} else { } else {
dbox1.height(height); dbox1.height(height);
@ -319,7 +325,7 @@ var Sahli = function () {
this.gofullscreen = function () { this.gofullscreen = function () {
var docElm = document.documentElement; var docElm = document.documentElement;
var toid = window.setTimeout(sahli.resizedrawbox, 100); window.setTimeout(this.resizedrawbox, 100);
if (docElm.requestFullscreen) { if (docElm.requestFullscreen) {
docElm.requestFullscreen(Element.ALLOW_KEYBOARD_INPUT); docElm.requestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
} else if (docElm.mozRequestFullScreen) { } else if (docElm.mozRequestFullScreen) {
@ -331,7 +337,7 @@ var Sahli = function () {
}; };
this.cancelfullscreen = function () { this.cancelfullscreen = function () {
var toid = window.setTimeout(sahli.resizedrawbox, 100, this.nonfsheight); window.setTimeout(this.resizedrawbox, 100, this.nonfsheight);
if (document.exitFullscreen) { if (document.exitFullscreen) {
document.exitFullscreen(); document.exitFullscreen();
} else if (document.mozCancelFullScreen) { } else if (document.mozCancelFullScreen) {