It is possible to read line by line txt file from my HTML5 game resources? (Resources = one of folders in my game project) I keep in this file informations about levels in my game. I found only examples using PHP, Ajax, but all of this requires server, but I want to run my game on servers or offline mode. Thanks in advance.
Asked
Active
Viewed 264 times
1
-
You could always use ajax to request the files you need, if you are not using a webserver, you could try using the file:// url scheme. (or use an iframe) – Arjan Mar 09 '13 at 09:53
-
possible duplicate of [Reading a txt file from Javascript](http://stackoverflow.com/questions/5135610/reading-a-txt-file-from-javascript) – Wouter J Mar 09 '13 at 09:55
-
2You can go with appcache. The first time the file will be downloaded form your server. But the next time, if the client is offline, it will be retrieved from the local cache. http://www.html5rocks.com/es/tutorials/appcache/beginner/ – hectorct Mar 09 '13 at 09:55
-
Try using local storage instead of a file. – soyuka Mar 09 '13 at 09:58
2 Answers
2
One technique used often by templates and preprocessing languages (like LESS or CoffeeScript) is to use a script tag with a type attribute not recognized by browsers. This causes it to be ignored by the browser and search engines, but be accessible by JavaScript.
demo | code view
<script type="text/mygamelevel" id="level1">
0010011001111011
0011011100010
10101110111101101
</script>
<script type="text/javascript">
var level = document.getElementById("level1").text;
var lines = level.split("\n");
for (var i=0; i<lines.length; i++) {
var line = lines[i];
if (!line.trim()) continue;
alert(line);
}
</script>
If a file is preferred, you can dynamically request it. This is an example using jQuery's get function.
$.get('levels/level1.txt', function(level) {
var lines = level.split("\n");
for (var i=0; i<lines.length; i++) {
var line = lines[i];
if (!line.trim()) continue;
alert(line);
}
});
No guarantee is made that the code in the callback will be executed at any given time, so I suggest putting some start-new-level code in there, as opposed to anywhere else in the code. Otherwise, you don't know if you have the level information downloaded yet or not. This problem is averted by inlining the data as shown in the first snippet of this answer.
Brigand
- 84,529
- 20
- 165
- 173
-
Instead of `.innerHTML` use `.text`, [it's a valid attribute on every inline script](http://stackoverflow.com/a/12761170/1139697). – Zeta Mar 09 '13 at 10:13
-
-
Thanks, but levels is a bit much and I don't want to keep all in main index.html file ^^ Can I do this like that? This isn't work, so what should I do to make it correct? – Piotrek Mar 09 '13 at 10:39
-
@Ludwik11, I added an example of asynchronously getting level information from the server. – Brigand Mar 09 '13 at 12:12
