Skip to content

Creating your first program

Maingron edited this page Apr 2, 2021 · 4 revisions

To get started making a new program, you need to pull the MainOS repository and you probably need a webserver. I recommend Prepros for this. Although MainOS doesn't require you to run PHP or anything like it, because of security policies in browsers, MainOS cannot run without a webserver.

So after you are now successfully hosting your MainOS version locally, you need to go to the actual MainOS files on your harddrive and navigate to Program Files/ and create a folder for your program. In future, you'll be able to just copy the template. In your program folder, you need the following files:

  • exec.html
  • exec.css
  • exec.js

exec.html:

You need to build a normal HTML structure and import the following files like that:

<head>
<link rel="stylesheet" href="../../helper.css">
<script src="../../helper.js"></script>
</head>

helper.css will help to provide an unique UI to the user, helper.js will do the same with UX, except you get access to useful functions and you should implement them.

Add meta stuff to your program

You can add things like a title to your program. MainOS will read it from the exec.html file. Just make sure your <head>-Tag isn't malformed and fits entirely within the first 1200 chars.
Make sure to put all the meta after embedding helper.js, else it might cause errors and slowdowns
Stuff that will be read:

<!-- Necessary -->
<title>The Title of your program</title>
<link rel="shortcut icon" href="iofs:C:/Program Files/excel/icon.png"> <!-- Favicon / Program icon -->
<meta version="1.2.3"> <!-- Current version of your program -->

exec.css

This is the stylesheet for your program. You could name it differently, but it's suggested to name it exec.css.

exec.js

This is your programs JavaScript. Like the exec.css, it could also be named differently.

To view the program in MainOS, you have to "install" it.

installing your program

Within MainOS, edit C:/mainos/customprograms.txt and enter the information for your program. Example:

{
"hansprogram": {
  "id": "hansprogram",
  "src": "program%20files/hans/exec.html"
  }
}

After that, restart MainOS and your program should appear on your desktop.

...