Skip to main content
GameDev.net gamedev.net
🔒 Locked

Creating a Web Language

Started by coderWalker May 13, 2011 at 5:29 PM 15 replies 4.7k views
Original Post
coderWalker
coderWalker
I would like to make my own version of HTML.

I know this wont get popular nor is it a way to make money but I would like to do it for experience.
I would really like to learn more about Network programming, languages and interpreters.

Basically I want to be able to have a page like the following on a server and it display correctly in a Browser.

//Set the variables
// in this case a string called name to Waldo
-Var
str Name = "Waldo"
//Display Test "Where's Waldo"
-Text
"Where's" & Name
//Draw an image
-Image
picture.png


This is a project I seriously want to take on.
I can create this code in a LANG file and FTP it to a server.
(LANG being an extension I just made up)

All I need is to write a Firefox plugin to display the page.
Does anyone have any information about how to make such a plugin? Tutorials? Examples?

I do not want it to interface HTML at all. Basically get my page off the internet and my plugin (or program) draw it.

Any info would be helpful!

Thanks in advance!
If this post was helpful please +1 or like it !

Webstrand
Alpha_ProgDes
Alpha_ProgDes
Looks like Javascript to me. Where in your example are the variables/tags/keywords for the layout. Layout = HTML.
Beginner in Game Development?  Read here. And read here.  
hplus0603
hplus0603

I would like to make my own version of HTML.


You don't need HTML at all. You want a configuration file served by a web server? That's done all the time. Some existing key/value data formats you may want to look at:

- JSON
- XML
- YAML

If none of those formats suit you, you can also define your own configuration file format. There's nothing stopping you from doing that.

My question is: What is your problem? Make a file, put it on a server, download it from clients -- are you having any problems with any of those parts?
enum Bool { True, False, FileNotFound };
coderWalker
coderWalker

My question is: What is your problem? Make a file, put it on a server, download it from clients -- are you having any problems with any of those parts?
[/quote]


//Set the variables
// in this case a string called name to Waldo
-Var
str Name = "Waldo"
//Display Test "Where's Waldo"
-Text
"Where's" & Name
//Draw an image
-Image
picture.png


Maby I didn't explain well.

I want to write a plugin that will be able to receive the data above, and instead of outputtin it do the following:
Create a string
Write the text on the webpage
Draw an image.

All without any already existing language.
If this post was helpful please +1 or like it !

Webstrand
SuperVGA
SuperVGA
Would you like to view that in an existing browser, or would you make your own client for viewing?
snisarenko
snisarenko

I would like to make my own version of HTML.

I know this wont get popular nor is it a way to make money but I would like to do it for experience.
I would really like to learn more about Network programming, languages and interpreters.

Basically I want to be able to have a page like the following on a server and it display correctly in a Browser.

//Set the variables
// in this case a string called name to Waldo
-Var
str Name = "Waldo"
//Display Test "Where's Waldo"
-Text
"Where's" & Name
//Draw an image
-Image
picture.png



Just going to point out that what you are trying to do has nothing to do with Network Programming. And everything to do with languages and interpreters. HTML is just a markup language that allows you to configure how you display data. Its no different than having a doc file or pdf file (except for the javascript part). You may be asking for help in the wrong forum.

If you want to build an actual Firefox plugin Google can help you with that. Here is a tutorial i found via simple google search.
http://colonelpanic....lugin-part-one/
http://colonelpanic....lugin-part-two/
http://colonelpanic....gin-part-three/
(a firefox extension might be easier, instead of converting your language to pixels you'll be converting it to HTML)

I hope you realize that building the plugin (or extension) is the trivial part. The hard part is actually building the interpreter (depending on which libraries you use).

Overall this exercise will not make you a better network programmer. All you are going to learn is how to create a language and interpret it. If that is what you want to learn, then thats fine.
coderWalker
coderWalker
Would you like to view that in an existing browser, or would you make your own client for viewing? [/quote]
I know making my own would be alot easier but I would like it to be viewable in an existing client, like firefox.


[quote name='coderWalker' timestamp='1305307770' post='4810326']
I would like to make my own version of HTML.

I know this wont get popular nor is it a way to make money but I would like to do it for experience.
I would really like to learn more about Network programming, languages and interpreters.

Basically I want to be able to have a page like the following on a server and it display correctly in a Browser.

//Set the variables
// in this case a string called name to Waldo
-Var
str Name = "Waldo"
//Display Test "Where's Waldo"
-Text
"Where's" & Name
//Draw an image
-Image
picture.png



Just going to point out that what you are trying to do has nothing to do with Network Programming. And everything to do with languages and interpreters. HTML is just a markup language that allows you to configure how you display data. Its no different than having a doc file or pdf file (except for the javascript part). You may be asking for help in the wrong forum.

If you want to build an actual Firefox plugin Google can help you with that. Here is a tutorial i found via simple google search.
http://colonelpanic....lugin-part-one/
http://colonelpanic....lugin-part-two/
http://colonelpanic....gin-part-three/
(a firefox extension might be easier, instead of converting your language to pixels you'll be converting it to HTML)

I hope you realize that building the plugin (or extension) is the trivial part. The hard part is actually building the interpreter (depending on which libraries you use).

Overall this exercise will not make you a better network programmer. All you are going to learn is how to create a language and interpret it. If that is what you want to learn, then thats fine.
[/quote]

Yes, Creating a language and interpreter is the main part I want to learn about.
I guess this would be more like flash than HTML, because I do not want it to convert down to HTML.

Would the plugin need to do everything, or would I need a plugin that runs my "flash" program and returns an image?
How does this work?
If this post was helpful please +1 or like it !

Webstrand
SuperVGA
SuperVGA
Now, you might be anxious to get things running in Firefox, but sit down with your favourite language, and either use an existing scanner to retreive the source file or make your own.
(I figure you could just use http when the time comes). The important thing now is to parse the lines and create an immediate representation; a hierarchical OO-version of the stuff that was just parsed.

Make some sort of output function that shows the IR structure.

When your language and the parser is done, worrying about making a firefox plugin will be the next step.

But for starters, you can actually enjoy planning the syntactical rules and programming a parser. - neat, huh?
wurstbrot
wurstbrot
Hello codeWalker!

Most of what I'm going to say has already been mentioned, but maybe my own explaination might still help you.
So, what you're talking about are actually three separate problems:

- Networking (Transfer of the file from the server to the client)
- Language Parsing (Reading and interpreting the content of the file, loading it into an appropriate data structure)
- Layout Rendering (Bringing the content of the file onto the screen in the way that you devised)

These parts all work together to create what the web is about, but from the technical point of view, they have nothing to do with each other.

If you want to learn how it all works, I suggest that you begin with the last part, the layout rendering. IMHO this is the most interesting (but also the most difficult) task. It is the field where the most improvements are achieved these days in web technology (Well, that's not really true. Currently, the hot thing is inventing a new 60% faster JavaScript interpreter every three weeks or so, but rendering improvements have dominated the browser dev world for many years before and - if you ask me - are much more important than creating even faster and faster JS engines). The other two aspects are pretty much settled: For networking, there's HTTP (and all the underlying protocols), and for parsing, there's XML. These are standards, and all browsers do them in the same way (That's another lie: HTML and how it is parsed by browsers is, in most cases, *not* based on XML, but it's similar and the difference doesn't really matter here). If you don't know about XML yet: It's a "meta-language" that defines a syntax similar to HTML, but allows you to invent your own tags and attributes. The big advantage of XML is that you can use existing parser libraries to read it, but still have the freedom to create your own language.

Having said that, I recommend you to pick up some library that does HTTP networking, another one that does XML parsing, and finally one for graphics output (like SDL). Then, invent a XML-based language and try to write your own browser for it. For the beginning, you could as well leave out the HTTP networking part and simply load the file from local hard disk.
snisarenko
snisarenko

Would the plugin need to do everything, or would I need a plugin that runs my "flash" program and returns an image?
How does this work?


I don't know, since I've never written a browser plugin. This is why I pointed you to tutorials that can help you figure that out. My best guess is that the browser provides you some sort of rendering context into which you can render.
hplus0603
hplus0603

I want to write a plugin that will be able to receive the data above, and instead of outputtin it do the following:
Create a string
Write the text on the webpage
Draw an image.



It sounds to me as if you want to create both a language (how do you express data and program flow), and a runtime library (how do you make things happen on the screen).

You don't need to write a plug-in to do that. You can implement that in JavaScript. Simply write a parser in JavaScript, and have that modify the DOM of the web page it lives on. Make the JavaScript download the language file using XMLHttpRequest.

However, it might be easier to just implement "create a string" and "write text on the web page" and "draw an image" directly in JavaScript, rather than a new language that you have to write an interpreter for. The language/program flow already exists (JavaScript), and the runtime library already exists (HTML DOM), so you can get straight to the fun part of actually writing the program that does things on the screen!

If you *want* to write it all as a native plug-in, you CAN do that, using XPCOM for Firefox/Chrome, and ActiveX for Internet Explorer, but that way lies a *LOT* of pain and undocumented behavior (trust me -- a *LOT* of pain, even for those who are already very experienced). You really don't want to be doing that.
enum Bool { True, False, FileNotFound };
coderWalker
coderWalker
Basically I want to make my own Flash (Language and intrepreter)
If this post was helpful please +1 or like it !

Webstrand
hplus0603
hplus0603

Basically I want to make my own Flash (Language and intrepreter)


Right, I understand the question. I also answered the question, but your post makes it seem as if you didn't understand the answer.
What part of my last answer do you feel did not answer your question?

Also, it might be easier to answer your question if you could also explain WHY you want to make your own flash-like plug-in, rather than use something that already exists.
enum Bool { True, False, FileNotFound };
coderWalker
coderWalker

[quote name='coderWalker' timestamp='1305420842' post='4810907']
Basically I want to make my own Flash (Language and intrepreter)


Right, I understand the question. I also answered the question, but your post makes it seem as if you didn't understand the answer.
What part of my last answer do you feel did not answer your question?

Also, it might be easier to answer your question if you could also explain WHY you want to make your own flash-like plug-in, rather than use something that already exists.
[/quote]

You said I could write a parser in Javascript. Would it be possible to make a program using C++ that can parse the data?
I don't want it to be dependent on Java or HTML.
Like this:
User Visits page
Browser see it's new://www.website.com
(I know we sand send data to other programs, ex: itunes, ftp)
sends the page to the Program
Browser creates place to draw
Program runs code it got online and draws in the browser.
So where it's currently showing this HTML page, instead the program would be drawing here.

So lets say someone makes a game.
They go to the page, and can play it in the page portion of the browser.
Without any Java or HTML.
Just use the Browser to get the page and provice a place to draw.

Basically I have the code online, my interpreter understands it and performs the events accordingly.

I was thinking of making a program that can fetch this from the internet, and work like that. But using a
different browser is impractical, so thats why I would like to make the plugin.

I think a project like this would really help me understand more about programming and would look great on a resume.
Someone else has planned to work with me on this, I just have to get it rolling first.

I know this has to be possible, any help is appreciated.

Thanks everyone that has posted so far!
If this post was helpful please +1 or like it !

Webstrand
hplus0603
hplus0603

You said I could write a parser in Javascript. Would it be possible to make a program using C++ that can parse the data?


Yes, as a browser plug-in that the user has to install.



Browser creates place to draw
Program runs code it got online and draws in the browser.
So where it's currently showing this HTML page, instead the program would be drawing here.
[/quote]

This is what a browser plug-in does. The user will have to be prompted to download and install the plug-in the first time he/she goes to a page that uses that plug-in, just like the Flash plug-in, Unity3D plug-in, Quicktime plug-in, etc.


Just use the Browser to get the page and provice a place to draw.
[/quote]

If you want a browser to have an area where a game can draw, without prompting for download/install of a plug-in, then that area MUST be a HTML5 Canvas object, or a SVG object, and the game MUST be written in Javascript.

If you want to do this in C++, I repeat my previous advice:


If you *want* to write it all as a native plug-in, you CAN do that, using XPCOM for Firefox/Chrome, and ActiveX for Internet Explorer, but that way lies a *LOT* of pain and undocumented behavior (trust me -- a *LOT* of pain, even for those who are already very experienced). You really don't want to be doing that.
[/quote]

Doing this to put it on your resume shows that you would rather re-solve a hard problem in a half-assed way, when that problem already has lots of good solutions, than re-use those good solutions to create something new. I'm not sure that counts as "looks good."
enum Bool { True, False, FileNotFound };
landlocked
landlocked
I agree with hplus0603. No job I've had has ever wanted me to build something completely new from the ground up. They want me to either revise what they already have and make it more efficient or build on top of what they have. Unless you're wanting to work for IBM this exercise won't get you very far professionally. All businesses care about is money. Whatever you do that can do that for them is what they want. In the vast majority of cases this means coming with knowing the languages and frameworks they already have unless they are already looking to move on to something else which is controlled by already existing processes and people. It's not impossible but nigh on the end improbably as being struck by lightning every day until you die to be able to cold pitch something to a prospective employer and have them run with your idea because you haven't built up any credibility with them. So, unless you firmly believe this will a) totally wow us in the near future or b) are looking to work for a firm where experience building something from the ground up is actually sought after I would advise you to use your time better elsewhere learning what's in common usage and become proficient with that.
Always strive to be better than yourself.
MortusMaximus
MortusMaximus
If all you want to do is learn how to design and implement your own language, I recommend you look into lex and yacc. These two C/C++ libraries work together to do most of the parsing of your language based on the regular expressions you set up to be valid constructs. When I did this as a class assignment, we had to write our own "dynamic programming" language that would automatically memoize function calls.
Check out the first gameplay video from my javascript/PHP RTS game

Topic Locked

This topic has been locked by a moderator. New replies are not allowed.

Sign in to reply to this topic.