Importing content from a text file (.txt)

You can use standard HTML, so to make a single line break just use <br>.

:ok_hand: thanks. That simple.

Hi I have implemented this on my server but am having problems!

The text fails to load or is slow to load if you navigate to a new scene and return to the original scene with the dynamic text?

I have a feeling it could be due to slow or intermittent internet speeds but cant be 100% sure?

The app i am building will be in schools and i cant afford to have text or images not loading on screen can you please advise @Daniel

Also is there a better way to bring text and images in such as json/xml? The project is complex with 60 scenes and alot of text and images so am trying to build a dynamic template going forward!

Thanking you in advance (again!)
Stephen.

1 Like

there are quite a lot of examples in the forum that work with JSON-files(few with xml). just do a search … :slight_smile:

1 Like

Here is a jQuery example of importing specific paragraphs from an external text file.

external_text_import_jQuery.zip (123.8 KB)

1 Like

Hi Jangeltun
I downloaded the file but it didn't work, do I have to upload it to Server or not?

Hi Jangeltun
I downloaded the file but it didn’t work, do I have to upload it to Server or not?

Yeah, you'll need to host the txt file on a server first since the XMLHttpRequest doesn't work with File URLs.

Yes, you have to run the txt file on a server. I have another example of external text that is using a JS file, and that will run locally. example.zip (117.0 KB)

1 Like

This is pretty cool! Thank you for sharing Daniel. I realize this thread is pretty old but wondering if you could expand on this. I was able to get number 3 to work where it imports a number from an external text file on my server into a text box. Do you know how to expand this to encompass several text boxes in Hype that will contain different bits of text (prices)?
So say I wanted to have the average house price across the country by province and I had text boxes with unique IDs: OntPrice, QuePrice, BCPrice…
How would that work?
Would a json file with the data maybe work better in that case? Something that looked like this?
Or is there a way to do this as a text file as well?
{
“OntPrice”: “105,000”,
“QuePrice”: “99,000”,
“BCPrice”: “86,000”
}
and how would the javascript be changed to bring in those values? Any help would be appreciated!

Slightly different example but it loads JSON via Ajax. So this should work for you.

Hope it helps

Thanks Max! I’m not really sure if I’m there yet in terms of coding but I will try to decipher this.
Appreciate the response!

One Simple example of fetching json objects.

The text elements all have class names that match the keys of the json properties

i.e class name OntPrice etc…

The code then pulls the json and iterates over its property key names, finds the corresponding element with the class and set its text.

Simple Example_Json Fetch.hype.zip (24.0 KB)

So I think it would be helpful to watch…

He gets to json in video 4. But watch from video one…

Thanks Mark! Yes, I believe this may be a little easier to understand. I am going to watch the videos you referenced this evening. That guy is great. I have been trying to learn code and he’s pretty clear with things. Hey can I ask a silly question though before I get to watching this. Where does the actual text.json file in your sample reside? I don’t see a reference to a server in the javascript. Sorry I am such a newbie. I really need some courses in coding. Maybe it will become more clear when I watch the video.

Yep, he is great.

The file is in the resource folder.

You just need to set you path to the path of the file on the server…

'./text.json'

And put a file there.

Oh my gosh, I got it working on the server. This is brilliant.
Just needed this last step explainer. Thank you so so much Mark! And I will still watch the videos! I need to learn more.

1 Like

Hi Mark, I’m having a little trouble recreating this in my actual graphic. I believe I have followed all of the steps but I still don’t know why it doesn’t work. I feel I may be close. Perhaps I am just missing a small step? Here is the file if you or anyone has time to take a look at it. The main text boxes that I am aiming to have updated are within the symbols, KenoraBlurb, ThunderBayBlurb etc… I’ve included the .json file as well in case I am missing something there. Thanks in advance if you have time to look at it. Also the numbers that show up are just the ones I typed in, not the ones coming from the .json file. Archive.zip (419.9 KB)

Just looks like you had som esyntax errors in your json.

i.e did not match the last quotes around a value and also you had an extra “,” terminator at the end.text.json.zip (865 Bytes)

Also , and I am sure you realise this…
Best to have the place holder text something other than a price.
Or added code to deal with an error loading the data by putting some text that explains unavailable data at this time.

Thanks Mark, that did the trick. It’s an exact science isn’t it. lol.
I didn’t know about the place holder text. I am still really new at this all.
Thanks for the tip and for taking the time to look at my file! Have a lovely day.

No prob.

When I say place holder, I mean the text price you manually entered in Hype.

If for some reason the data cannot be loaded, like what you just ran into then as you see the text in hype is displayed. For the sort of site you are working on having that text as a dummy price would be a bad idea.

So maybe give each price element an extra class name line priceText.

Then change the code to something like this that will set the text to a default “…” then the price from the data.

If there is an issue with the data the the displayed text will be “…”

   //-- run this part always  
   const priceTexts = document.querySelectorAll(".priceText" )
  for (i = 0; i < priceTexts.length; ++i) {
  priceTexts[i].innerText = "...";
}
  
  loadPrices()
}
1 Like