Hello World Chameleon.API Application

This article explains how to create a Chameleon.API application. Chameleon.API is an api which supports building general purpose graphics applications. It uses the Chameleon Web Server to render graphics. Let’s get started.

Create Graphics

Launch the Chameleon Designer and create a simple scene with a single text box called ^helloworld:

Make sure the scene is named hello world and the text box is called ^helloworld. Save the project and call it hello world.

Be careful to give the text box font a colour that won’t be hidden by your web browser’s background.

Chameleon Web Server

Launch the Chameleon Web Server and create a new instance. Call it hello world. On the Settings tab,

set the Endpoint,
set the Project Folder to where you saved the graphics project,
enable the API settings
and choose an API Port:

Start the server:

Build the Application

In this example, we’re building the application using c# and Visual Studio.

Create a new Windows Forms application.

Add the Chameleon.API nuget package. You can find it by searching on bannisterlake:

Add a reference to assembly System.ServiceModel.

Create a c# class called CG.cs looking like this:

using System;
using System.Collections.Generic;
using System.ServiceModel;
using Chameleon.API;

namespace hello_world_chameleon_api {
	class CG : MarshalByRefObject, IChameleonCallback {
		const string SERVER_ADDRESS = "localhost";
		const int SERVER_PORT = 8112;
		const string ASSET_NAME = "hello world a";	// not required
		const string PROJECT = "hello world";
		const string SCENE = "hello world";
		const string TAG = "helloworld";

		public void OnlineStatus(string a, string b, string c, bool d) {
		}

		public void Thumbnail(string project, string scene, string base64) {
		}

		public void AsRunReport(string id) {
		}

		public void BugOn() {
			try {
				Dictionary<string, TagData> content = new Dictionary<string, TagData>();
				TagData tagData = new TagData();
				tagData.Type = TagType.Text;
				tagData.Value = "hello world";
				content.Add(TAG, tagData);
				ChameleonClient client = 
					ChameleonClient.CreateTcpClient(this, SERVER_ADDRESS, SERVER_PORT);
				if (client.State == CommunicationState.Opened) {
					client.LoadProject(PROJECT);
					client.SetOnline(ASSET_NAME, PROJECT, SCENE, content, true);
				}
			} catch (Exception ex) {
				string errMsg = ex.Message;
			}
		}

		public void BugOff() {
			try {
				ChameleonClient client = 
					ChameleonClient.CreateTcpClient(this, SERVER_ADDRESS, SERVER_PORT);
				if (client.State == CommunicationState.Opened)
					client.SetOffline(PROJECT, SCENE);
			} catch (Exception ex) {
				string errMsg = ex.Message;
			}
		}
	}
}

Be sure the SERVER_PORT value matches the API Port used in the Web Server settings tab earlier.

Drop a checkbox on the form and call it checkBoxHelloWorld. Create a handler for it and then create an instance of the CG class:

using System;
using System.Windows.Forms;

namespace hello_world_chameleon_api {
	public partial class Form1 : Form {
		CG cg = new CG();

		public Form1() {
			InitializeComponent();
		}

		private void checkBoxHelloWorld_CheckedChanged(object sender, EventArgs e) {
			if (checkBoxHelloWorld.Checked)
				cg.BugOn();
			else
				cg.BugOff();
		}
	}
}

Open the URL http://localhost/helloworld on any browser.

Now run the application:

and you should see the output in the browser when you select the checkbox: