1. Knowledge Base
  2. Uniview User Interface
  3. HTML Pages
  4. Articles

Creating a Custom Web Page

I am trying to learn how to create a custom web page by using the example interface that was provided, but I am a little confused by what is actually necessary. I have attempted to create a simple one page interface with a single button on it, but so far no luck. Just for laughs, I have attached is my wreck of a try. html.zip



Could someone provide a very simple example of web interface? Just something that has a button or two to turn a constellation figure or label on and/ or off?



Also maybe a brief explanation of the various parts that should be included with each new design.

Previous article: Migrating HTML Buttons to Work in 1.6
Next article: Using/Migrating HTML Pages from 1.5 to 2.0

Is this article helpful for you?

Under review
anonymous fa 10 anys
To keep it super simple we just expose the "uniview.sendEvent('<event goes here>')" javascript function. The simplest html/js example I can think of is this:

<!DOCTYPE html>
<html lang="en">
<body>
<script src="/js/uniview.js"></script>
<h1>Simple test with Javascript</h1>
<div>
<div>
<button type="button" onclick="uniview.sendEvent('Earth.off')">Earth off</button>
<button type="button" onclick="uniview.sendEvent('Earth.on')">Earth on</button>
</div>
</div>
</body>
</html>
CelestialCoyote fa 10 anys
Okay I got that to work and it helps get me started.

Just a couple more questions . . . for now.

I copied the text below into a document and saved it as WebGUI.html, but when I tried to open it in the Profile GUI it could not find it.  I see that the example one has an index.html as does the one that Dan Tell asked about.  If I have just a single page interface, it needs called index.html correct?

Since I am really new to web design, can you explain the benefit of using the Angular stuff that is in the example?  It seems really complicated if you just want a single page interface.

Thanks again.
anonymous fa 10 anys
The reason it is called index.html is because that is the standard page that will be served when a folder is requested by a browser. So when you type in the profilegui it is actually requesting the profile/<my profile>/html folder. This is standard on all webservers, nothing special about Uniview here.

In my example there is no angular present, just html and javascript. I suggest you start by getting familiar with that. Angular is a more advanced javascript toolset to help you write powerful webpages. 

Customer support service by UserEcho