This is a read-only snapshot of the ComputerCraft forums, taken in April 2020.
HaddockDev's profile picture

What do you want to see in my web browser?

Started by HaddockDev, 26 November 2017 - 04:16 PM
HaddockDev #1
Posted 26 November 2017 - 05:16 PM
Following the release of Firefox Quantum, I decided to make a web browser, a kinda-rendering engine, along with my own subset of HTML using a url parser, and a XML parser. The browser is more hacked-together than anything, but it currently features modem support, local file support, scripts, <text> with x,y and b(ack)g(round) and f(ore)g(ground) support, <a> but only href and x/y/fg/bg, <br>, <hr> using teletext characters, which makes it nice, buttons which invokes the scripts, and probably other things I don't remember.

The script part is very sandboxed. No print, no write, no nothing. You got math and string APIs, then ask/alert functions, a copy of the XML parsed page to edit it, and other things. It is specifically made to be really restricted and secure. Also, scripts can ONLY be invoked by using buttons. You define the scripts, give it an id, then you create a button with the script id as a tag. And only then will scripts work.

There is also no scrolling support, either. You can probably implement this in your page using buttons and scripts.

Screenshots!Homepage

Also, you'll notice that I am using Teletext characters to seperate the version and name from the logo. This can only be done in the browser by scripts, or if you are writing your page inside the browser, using [[ and ]] tags.

A simple script example, all in a 80KB, 1 minute GIF.

The "Move text" button doesn't work because there was only 1 text object on the page. But, it works.

The source of the page above, with scripts and all.


All possible tags, on one page. This is a testing page I use.

So, I'm not entirely sure if I explained everything well (probably not), but I want your thoughts and suggestions for this. It'd be nice.

Thanks for your responses in advance.
Exerro #2
Posted 26 November 2017 - 07:07 PM
Huh, nice timing:
SpoilerNote that most of this is highly experimental, the browser as a whole doesn't do anything, but the individual components (RGB image rendering, markup language parsing, design, DOM property animation) work pretty well.
Gradients woo

Different protocols

These will be tabs with little mini previews at some point

Fancy popups

Syntax highlighting

Syntax highlighting again

I guess I'll just dump my ideas for my own project then…

'NFC' capabilities
Imagine walking into a shop on a server, opening your browser, and seeing a little "Shop wants to show this page" message. You open it and are redirected to the store's page.
Also, imagine placing an order from home, then going into a collection booth where it takes you to a page allowing you log in and get your items.

Animations, animations everywhere!
Animations are awesome. They make a simple UI look good and make it far cleaner looking and more intuitive to use. I'd go CSS-like with `x-transition` and stuff.

RGB colour support
New versions of CC support palette changing, which means you can now use full RGB colour (as long as you limit it to 16 distinct colours before rendering). Why not go even further and add in RGBA? (I've done this, it works surprisingly well)

Web support
No more `pastebin run X` installers… just navigate to `http://someurl.domain/installer.markup` and have a web page that asks to install the program and shows some info about it too.

Really powerful layout elements
Lists, flows, layouts, and grids - these are the 4 core layout components for me. Lists just sequentially show their children (potentially with reverse order, alignment, etc), flows do the same but wrap when the content goes past the boundary (e.g. the width of the container), layouts position children with absolute positions, but still support things like `50%` for an X value, and grids… are grids.
You should also be able to use constant sizes, relative (X%) sizes, something like "use up this ratio of the remaining space", and "use as little space as possible" (e.g. for text, images, or nested containers).

Scrolling support
> There is also no scrolling support, either.
Add it! Scrolling is important, and **way** easier to do with the backend (the browser).

Styles
Being able to apply a particular style to a multitude of similar elements at once is really important. I think CSS does it quite well, but it's also kinda limited (no variables and somewhat limited selectors).


Well, that's quite the wall of text. It's cool to see someone else working on a similar project. I like the style of the homepage :)/> Good luck!
Wilma456 #3
Posted 26 November 2017 - 07:40 PM
Does it works mit normal HTML Websites (I know, that CSS and JS are not suported)?
HaddockDev #4
Posted 27 November 2017 - 12:41 AM
'NFC' capabilities
Imagine walking into a shop on a server, opening your browser, and seeing a little "Shop wants to show this page" message. You open it and are redirected to the store's page.
Also, imagine placing an order from home, then going into a collection booth where it takes you to a page allowing you log in and get your items.
Hmm. That does sound interesting.

Animations, animations everywhere!
Animations are awesome. They make a simple UI look good and make it far cleaner looking and more intuitive to use. I'd go CSS-like with `x-transition` and stuff.
I could add some half-baked animation support with some sort of CSS, also I could allow scripts to be loaded as the page is rendered. I'll think about that.

RGB colour support
New versions of CC support palette changing, which means you can now use full RGB colour (as long as you limit it to 16 distinct colours before rendering). Why not go even further and add in RGBA? (I've done this, it works surprisingly well)
Sure! I'll have to do some hacky things, like having only 4 or so colors available to add custom values (luckily the browser only uses a gray/white theme, so it might work out well)

Web support
No more `pastebin run X` installers… just navigate to `http://someurl.domain/installer.markup` and have a web page that asks to install the program and shows some info about it too.
I was doing a thing a while ago with OneOS and pkg to install apps, so I might possibly be able to add that.

Really powerful layout elements
Lists, flows, layouts, and grids - these are the 4 core layout components for me. Lists just sequentially show their children (potentially with reverse order, alignment, etc), flows do the same but wrap when the content goes past the boundary (e.g. the width of the container), layouts position children with absolute positions, but still support things like `50%` for an X value, and grids… are grids.
You should also be able to use constant sizes, relative (X%) sizes, something like "use up this ratio of the remaining space", and "use as little space as possible" (e.g. for text, images, or nested containers).
That was something I plan to add. In some things, I have the align variable so I could use something with that.

Scrolling support
> There is also no scrolling support, either.
Add it! Scrolling is important, and **way** easier to do with the backend (the browser).
Probably could do that with messing with Y. I'll think about it.

Styles
Being able to apply a particular style to a multitude of similar elements at once is really important. I think CSS does it quite well, but it's also kinda limited (no variables and somewhat limited selectors).
I was thinking about adding some lua-table configuration or something halfway through writing this post, so I could probably add something like a "lst" (lua style table) tag or something.

I also noticed you had mentioned protocols. I do have protocols in Mercury, with local:/// (the extra / is not a typo, there is just no host), and rdnt://, and pages built into the browser as mercury:// domains, like mercury://home.

Does it works mit normal HTML Websites (I know, that CSS and JS are not suported)?
No, it doesn't. It uses its own subset of XML with HTML like tags, as much as I can.
Edited on 26 November 2017 - 11:44 PM
Dave-ee Jones #5
Posted 30 November 2017 - 11:22 PM
Huh, nice timing:

HUH, NICE TIMING!
http://www.computerc...browser-for-cc/

Glad to see I potentially inspired a few to make a better web browser than I did. I must say, it was my funnest project yet. Lots of challenges..

November: The Rise of the Web Browsers - Emulated Code Edition (not even real)
Edited on 30 November 2017 - 10:23 PM