🕸🏘 Web Cities DevBlog

23/3/2022 Animations ! & tile selection overlay

Time for some movement

So, back in the first post i showed how the original code was built with working animations, but i got sidetracked and made severe modifications to the original source, so i didin't really knew if animations still worked, and well, they do! The main (and original) problem remains tho, there isn't an UI implementation, so you need to tweak the tileTypes file manually.
Also added a little "Anim" text on all animated tiles so they can be spotted easily.
And lastly, now a red box stays on top of the selected tile, originally the UI was simple enough so you knew which tile you picked, but know with all the clutter is really difficult to tell, also if your tiles are unnamed you can get confused i did T_T

Demo Show

20/3/2022 Release date

Cranile Says: Well, well, well, we see each other again {user_name}

Cranile Says: For the past four days i have been writing this whole blog !
{user_name} Says: maybe thats why it reads on such a weird way
Cranile Says: No way ! you are imagining things
{user_name} Says: . . .
System: Speech check passed
Cranile Says: Well, okay, you got me, when i started the project i didn't thought on making this blog, it occur to me a month into the whole thing, and since i thought it was only going to take a couple more days to publish something into neocities i just waited until the last day, but this 2 week project eneded up taking more than 3 months, and a couple of days ago, around the 16, i decided to start writing this thing, i was gonna add some of the important stuff i and upload it like that, giving daily updates afterwards, but i quite enjoyed writing so i end up going back to when i started thinking of making this project, (around december of 2021) and write as if, i was making live updates, luckily i had a bunch of videos from those days and a lot of logs of what i had been doing, so writing some detailed stuff was fairly easy, it was more difficult not spoil future things than anything else LOL. But anyways, the thing is done, my writings have catched up and now i have to upload this thing, but i wanted to clarify this for those who may have noticed and those who didn't.
{user_name} Says: Okay . . . weird, but i get it, what i dont understand is why this has become the Minecraft ending poem
Cranile Says: . . .
System: Cranile has disconnected. {user_name} Says: you do realize, that i know you are still there right?
Cranile Says: go test my software and we will speak on another blog update. . .
System: Or on my Neocities feed ;) , with all this weird rambling all of the way, Enjoy !

15/2/2022 Fixing and resizing

Mistakes where made, and un-made

It happened again ε=ε=ε=┌(;*´Д`)ﾉ , while testing i found a lot of errors, so i had to fix them :P
* This was a big one, sometimes when starting a brand new project, the code will not be able to read your files, and crash because of missing data, this was my mistake, i forgot, that different boot methods have different reading functions, so i had fixed some Async stuff on one place and not the other (-.-!)
* The toggle for the download was not working properly, when getting your file, the < a > was suppossed to hide, now it works almost properly
* Since the addition of the main menu there was a back button, to get out of "from the ground up" section, but i never added functionality ¯\_(ツ)_/¯. Worry no more, since it's fixed!
* Moved some css things to other html elemets, for things to come in the future (｡◕‿◕｡).
* There was a bunch of buttons that did nothing beacuse i never added the behavoiur to make them work, so i deleted most of them until they have a reason to be there.
* Something cool, there is a little settings section, where you can tweak your project if something isn't right, most of it doesn't work yet, but i added the possibility to change the tile picker size, so if it is too big or small you can fix it yourself!
This feature is not fully implemented, each time you close and re open the editor you have to re-set the size since its not being save anywhere
* Added the most important thing yet . . . A favicon ! （ ^_^）o自自o（^_^ ）
Im using the spider web emoji, why? actually it's pretty funny, when making the documentation, gitbook added an icon emoji on its own, since the name of the project is Web cities, i guess they decided to put a literal web LOL, i felt that it was the best thing for a favicon/logo. But upon going back to my sources to write some stuff i realized that the Iconoweb (my main inspiration for this project) also has a web as their icon!

12/3/2022 Git migration, git pages and gitbook pain

Trouble on git town?

Up until now the public version of the editor software and the repos has been hosted on github, but i realized that having my personal git account sharing this software wasn't ideal, so i decided to move it to a new one, since microsoft decided to use all repos (included the private ones) to feed their AI, i wanted to move elsewhere.
The new repos are hosted on gitlab, making pages in there has a lot more steps that github so it took me more than expected, but it's done now, and you can try it HERE!
And with that whole trouble out of the way, let me talk about the other thing that made me go back in time like on the Prince of Persia.
Up until now i have been writing the documentation an guide on gitbook, which is really simple and practical to use, but i realized that i tied my gitbook account with my personal github account . . .
(╯°□°）╯︵ ┻━┻
So i needed to move aaall the content to a new gitbook, which seemed easy at first, but it turns out that gitbook doesn't let you export your pages, not even to another gitbook (or if there is a way, i didn't found it) , well, that's not quite true, see they do let you export your page, as a PDF, but only if you are a premium user ಠ_ಠ .
So in the end, i manually copied and pasted the whole thing into a google docs file, had to reformat and re link everything, and lost some of the styling on the process T_T, then i had to import the word file into the new gitbook which you can, they actually have quite a lot of ways to input files, but none of those worked properly, so i ended up exporting the word as html, dividing the single file into each of the documentation sections (like 8 pages on the end) and then one by one, adding them to gitbook, all of that to realize when reading the document, that all links where broken, style was mostly gone, and i had to manually upload and add all of the images on the page.
ಥ﹏ಥ
In the end it took my more than 2 hours, so moral of the story, first write your whole file on word, or even better, do it on html format and have it sync with git, so you can see how it looks and upload it directly.
Anyways, here is the link . Now i need to sleep.

9/3/2022 Documentation again, and new event

Or more like, almost event

The documentation was actually i pain to write and i havent even finished it, it doesn't help that my english is not the best T_T
But all and all, im kinda Painfully enjoying working on it, and also i think it looks pretty cool !
Now, speaking of the editor, i kinda added a new event, see, the event on itself is not implemented, but the function that makes it work is , the idea is that you can open a new whole browser window, my inspiration for this is how they made it on Neopets, when you wanted to see the description of a book for example, the only problem is that is not working quite is i expected so im leaving it as it is to focus on the important stuff.
The following text is a rant not related with the project, you can skip this one ;)

Speaking of important stuff, i got the game pass thing from Microsoft, since a friend wanted to play some stuff that was on there (Minecarft dungeons), which was actually quite fun, but tedious at the end, so much grind!! So after that, i started playing Nier Automata, and OH MY GOOOOD, Yoko Taro and the people at Platinum Games are geniuses, i loved that thing, i only got one "true" ending and one of the "prank" ones, but overall 10/10 game.
Later i played scarlet nexus, and it was horrible ლ(ಠ益ಠლ) , i won't say much since its really negative stuff, but i couldn't wait to see the credits roll and get done with it. Now, this being said, im full focus with the project again, so expect more updates!

21/2/2022 Morrowind is one hell of a drug

Oh, and also full map swapping

yet again, my biggest enemy G A M I N G, i been hearing quite a bit about Morrowind, and recently started watching a really cool YT channel called Warlockracy that made a bunch of videos about the game long story short, downloaded to give it a try (Tops of a couple of hours) got lost for more than 20, amazing game i hope to finish it someday lol.
Back to the important stuff, since i changed things about layers, and events the old method for loading maps "on the run" was not working properly, so i fixed it. the idea is adding this behavoiur as an event, to swap maps like an rpg game.
No attached content, since there is nothing to see ¯\_(ツ)_/¯

12/2/2022 Main menu and Zelda

I should stop playing games all together

After getting side tracked with BOTW for a couple of days im back!
One little big thing that the project was missing, is a main menu to be able to select the type of project and the settings, well, those times are no more!
The menu has four sections, full project input, where you need all of the project files to boot.
The "noob" section, where you can try the program with an example project or create a brand new one with your own specifications.
The partial project, i thought that someone may be missing some of the config files, so in this section the program fills the gaps of your missing assets with placeholders
And lastly the "comments" or guide box, by default it displays some basic information about the menu, but each section has a litle ? where some extra info about that area will display.
for the time being, the only working part of the menu is the example project, but i plan on implementing the rest in the following week

Demo 11 Show

2/2/2022 Events and settings !

Now this is looking a lot more interesting ☜(⌒▽⌒)☞

It took me a little while to make a new update, i have been doing some work on my room and couldnt work on the project for 2 days, but when i actually got to code, i was Unstoppable. . . not really, but i did some reallyy cool stuff.

First of all, EVENTS, i tend to get side tracked when working on everything, and the forget the original purpose of what i was making, so for the users ¿Like you? to be able to link their content and their friends i needed to make a way to call links.
Events are suposed to be a bunch of behaviours that you can put in your city, links, popups, map changes, sounds/music, etc. i only added the < a > behavoiur for now.
You can add a name, which cannot be really seen by the final user, but its helpfull for identifying stuff on the editor, then you have the position, thats in which tile the event is "hosted", the event type in this case "goToPage" and the parameters, that being a URL, and true for target="_blank", so if link should be opened on another tab.
you can select your existing events from a dropdown and choose to read them or modify them, you can have that and the creator section at the same time to copy your own events ;).

Appart from that, i kept working on the settings file, as you can see on "Demo 9-2" it holds quite a bit of info about the project, i will probably have to do some in depth tutorial or wiki on how it works, but you can take a look at it :).

It may not look really impressive but this took a lot of work (of the cool type if i say so myself), and there is some problems, mainly with the events, as you can see on the video, unless you know where the event is there is no way of knowing, so i will try to make the pointer change on hover, idk how to make that on canvas without checking for mouseposition on every frame :/

Demo 9-1 Show Demo 9-2 Show

26/1/2022 An smoll one

Sub-title

Well after a little bit of planning i decided to change the ZIndex somewhat, now the amount of layers can be set by the user so you can have as many or little as you want.
And instead of buttons im using a dropdown inside a new sub-section named Z index, i quite like the idea of separating all of the different "things" you can do on smaller UI elements.
Only a PNG this time, i still need to save those megas !

Demo 7 Show

25/1/2022 Happy birthday to me !

（ ^_^）o自 no real update today

More to come on the following days, believe me !

21/1/2022 Tiles by the thousands !!

And some automation, at last!

So one problem, which wasnt to big of a deal but, was really annoying, was manually setting the parameters for each tile, in my case i was using a tileset for a roguelike game and it has like 6K tiles, so manually giving parameters to each one wasnt an option.
I made a little built in tool, that given a tile size and a tileset image, automatically creates a .json with all the tiles ordered with ids, names, and some other data, like plain colors.
Now the only problem with this is that you still need to manually set custom names, and animations for the tiles, but is less of a burden than before.

Demo 5 Show

20/1/2022 Invasion of the walking Z

More like moving still than walking

Followed the tutorial a little bit more and now we have layered objects and animations ! ! ! (~‾▿‾)~
The only problem is that layers come pre-set with every object, so you can't stack two different tiles that are set to layer 2 for example, im thinking of letting the user set the index for each tile when they add it on the map, so any tile can be on any layer.
Appart from that animations have to also be set up manually, but i don't really think i can automate that part, since i dont know what tileset is everyone gonna use, maybe i can set up some ui elements to assign animations pseudo automatically.

Demo 3 Show

17/1/2022 Sneak peek And less runescape

Actually really fun to work in, learning a lot :)

I tried to make a simple tilemap based "game" on which you can input some graphics and draw with them, so you can put that on your page, but couldn't figure out how to translate an array into the tilemap, so i went to youtube for some answers, and lo and behold a handfull of people made the same tilemap based game thingy on canvas so i followed a couple of guides and tutorials here, you can have them ;)
Link 1 Link 2
at the end i sticked with this one which i felt, got the closer to the idea i had But
¿you don't really care about the trip don't you? You want the results, here they are

Demo 1 Show

I mostly followed the code shown on the tutorial, but it wasn't meant to be an editor, so i made some changes here and there.
But mainly i added a tile position to know exactly what eacht tile was, buttons to add some of the tiles, a display with the tile id and the type, and a download to get the map in json format.
It was kinda hard, but, really really fun. I had the idea of adding another canvas with all of the tiles so you can pick them from there instead of using boring html buttons :P

10/1/2022 Some ideas and getting distracted

How's the blog template looking?

I started working on an alternative blog so i can move out my stuff out of wordpress, i didn't really knew what style to use so, i just picked up a template from eggramen and started trying things I wanted to give it an "old school" vibe, so i looked on the internet for inspiration and some graphics.
I really like how the old school runescape page looks, so i got some of their assets from the page and the archive.org .
Im growing fond of the "medieval" style, i loved the part of camerons world page with the pillars, i need to have those.

Demo Show

23/12/2022 Blog stuff

I hope to have the blog setup in like a week

While looking at some nice neocities pages for ideas to make my own i remembered some really cool pixel backgrounds from Mike Ferrari i wanted to see if they had a license to use on webpages and found this absolutely crazy demo it uses something called html canvas, its a type of vanilla element that lets you draw graphics on a little area.