TH live code editor [1 MILLION PAGEVIEW UPDATE]

Posted 4 years, 10 months ago (Edited 4 months, 23 days ago) by circlejourney
I've made a World for code editor discussion and suggestion! It would be great if you could post suggestions there so they're all in one place.

Toyhouse code editor with live preview

Bookmark it on Toyhouse

rsle267.png

Preview your HTML/CSS code in various layouts as you type.

Toyhouse watermark previewer

Bookmark it on Toyhouse

mekM2EJ.png

Preview watermarks applied to images without uploading and regenerating.


A couple of code utilities for making certain aspects of using Toyhouse less tedious! The code editor shows a live preview of code as you type it, and the watermark previewer lets you preview the appearance of watermarks on images.

I created these tools to help make coding and applying watermarks easier. I'm not affiliated with Toyhouse and I'm maintaining these for fun in my free time. (If you'd like to support me, you can donate to my ko-fi.)

These are works in progress, and I've been fixing all bugs that I find/am informed of. I'm always happy for feedback, suggestions and bug reports! Do check the "known issues" section on the website to see what has already been reported.

circlejourney

StarJBlackheart Yeah, I think I would be able to create a way to save multiple different codes in the browser's local storage, but that would probably be a solid day's work. I'll put it on my roster of updates for whenever I next remember to update this, haha.

circlejourney

StarJBlackheart ah, if you're just looking for a way to switch between two codes that you paste into the text area, that would be simple enough, I was visualising a sort of "save slot" system where you could keep saving additional new codes and be able to access them all each time you closed and reopened the site.

crayola_crow

Will there be a way to apply it to actual pages so we can see what it'll look like properly? For example, if I'm doing coding for a character that already exists, I can link their page or something and it'll add their name, avatar, and all that stuff at the top, instead of just saying Character Name, User, etc? Or maybe just a way where we can type there, upload their avatar maybe, and stuff like that? Or if this is already an existing feature then I'd love to know, since I probably just missed it in that case

This is just a small detail I noticed on the character profile layout, it's missing the part at the top where it says profile and has a line underneath, I'm not sure if you noticed that / are adding it or if there's a way to add it already, but it makes it a little hard to see exactly how it would look on a profile

Also, not as much of a coding related issue, but when you click the little information thing, most of the links that show up (for your toyhouse, ko-fi, etc) don't seem to link anywhere, and just bring you back to the page. It looks like your ko-fi works, as well as the two sites you used, but the other ones don't

Just an edit for another small idea I had, it might be nice to have another thing for notes, or something similar, that can be toggled like the CSS panel! It could be really helpful if you're making a code based off of another one, or to have just snippets of coding that you might need, or just to write things you want to remember to add, just a section to freely write anything you might need! (for example I'm trying to rework two of my codes to go together, and it would be nice to be able to put them in another little notes section rather than scrolling up and down to see if I'm getting the right stuff)

circlejourney

Miner5431 I don't have features that let you enter your character's info--it would be a pretty involved update and I may not be able to add it for a while, but I will ping you when I do!

And for the second thing, thanks for the heads up! I accidentally edited those out haha. The notes panel could also be done! I'll have to think about how to add it to the interface but it's definitely simpler than adding the custom info, I'll also let you know if/when I add that.

entangled-life

how do i save the code once im done editing it? im using it on the mobile site

circlejourney

anisoptera-eyes Do you mean like save it as a text file? The only way is to copy the text into a file, but I can add a download button, that'll definitely get added to the to-do because it seems like a useful function, and I know how to do it!

If you mean how to save it before closing the browser window, that already happens automatically and it'll be there the next time you open the page.

entangled-life

circlejourney i do mean save it as a text file, yeah. for now i just rewrote it into the toyhouse character's bio by hand, but a download button would be great!

circlejourney

So, today I sat down and updated the code editor with most of the changes that have been requested, and some others that I have been meaning to. It now has buttons to download and upload code as files, a scratchpad, better resizing, and also some changes that'll hopefully improve performance and reduce the number of bugs!

Check it out here

rsle267.png

I'm always learning and updating this (even if it takes months!) and this was a really involved update, so do let me know if you run into any major problems and I'll roll back changes as I see fit. Thanks!

Pinstripe-King

It's not working properly for me after the update. Maybe because the code I'm editing is html and css at the same time? I don't know enough about coding so I'm not sure :c

this is the code I'm trying to edit

[Edit] It's the same problem as the others are having down here