octoprint client libs

App.js

    var App = function(ready) {
      var self = this;
      self.config = { 
        options : {baseurl: "http://localhost:5000", apikey:"raspberry"},
        scripts: ["/static/webassets/packed_libs.js", "/static/webassets/packed_client.js"] 
      };
      self.load = function(idx) {
        idx = idx || 0;
        if (idx === self.config.scripts.length) return self.done();
        var tag = document.createElement("script");
        tag.setAttribute("src", self.config.options.baseurl + self.config.scripts[idx]);
        tag.onload = function() {self.load(idx + 1);};
        document.head.appendChild(tag);
      };
      self.done = function() {
        OctoPrint.options = self.config.options;
        $(function() {
          if (ready) ready();
        });
      }
      self.load();
    }

OctoPrinter.ts

// First pass at a TS wrapper for OctoPrint

interface browser {
	login: (username, password, remember, opts) => any;
	passiveLogin: (opts) => any;
	logout: (opts) => any;
}

interface connection {
	getSettings: (opts) => any;
	connect: (data, opts) => any;
	disconnect: (opts) => any;
	fakeAck: (opts) => any;
}

interface control {
	getCustomControls: (opts) => any;
	sendGcode: (commands, opts) => any;
	sendGcodeScript: (script, context, opts) => any;
}

interface files {
	list: (opts) => any;
	listForLocation: (location, opts) => any;
	select: (location, filename, print, opts) => any;
	slice: (location, filename, parameters, opts) => any;
	delete: (location, filename, opts) => any;
	upload: (location, file, data) => any;
	download: (location, filename, opts) => any;
}

interface job {
	get: (opts) => any;
	start: (opts) => any;
	restart: (opts) => any;
	pause: (opts) => any;
	cancel: (opts) => any;
}

interface languages {
	list: (opts) => any;
	upload: (file) => any;
	delete: (locale, pack, opts) => any;
}

interface logs {
	list: (opts) => any;
	delete: (file, opts) => any;
	download: (file, opts) => any;
}

interface printer {
	getFullState: (data, opts) => any;
	getToolState: (data, opts) => any;
	getBedState: (data, opts) => any;
	getSdState: (opts) => any;
	jog: (data, opts) => any;
	home: (axes, opts) => any;
	setFeedrate: (factor, opts) => any;
	setToolTargetTemperatures: (targets, opts) => any;
	setToolTemperatureOffsets: (offsets, opts) => any;
	selectTool: (tool, opts) => any;
	extrude: (amount, opts) => any;
	setFlowrate: (factor, opts) => any;
	setBedTargetTemperature: (temperature, opts) => any;
	setBedTemperatureOffset: (offset, opts) => any;
	initSd: (opts) => any;
	refreshSd: (opts) => any;
	releaseSd: (opts) => any;
}

interface printerprofiles {
	get: (opts) => any;
	add: (profile, additional, opts) => any;
	update: (id, profile, additional, opts) => any;
	delete: (id, opts) => any;
}

interface settings {
	getPluginSettings: (plugin, opts) => any;
	savePluginSettings: (plugin, settings, opts) => any;
}

interface slicing {
	listAllSlicersAndProfiles: (opts) => any;
	listProfilesForSlicer: (slicer, opts) => any;
	getProfileForSlicer: (slicer, profileId, opts) => any;
	addProfileForSlicer: (slicer, profileId, profile, opts) => any;
	updateProfileForSlicer: (slicer, profileId, profile, opts) => any;
	deleteProfileForSlicer: (slicer, profileId, opts) => any;
}

interface system {
	getCommands: (opts) => any;
	getCommandsForSource: (source, opts) => any;
	executeCommand: (source, action, opts) => any;
}

interface timelapse {
	list: (opts) => any;
	download: (filename, opts) => any;
	delete: (filename, opts) => any;
	getConfig: (opts) => any;
	saveConfig: (config, opts) => any;
}

interface users {
	list: (opts) => any;
	add: (user, opts) => any;
	get: (name, opts) => any;
	update: (name, active, admin, opts) => any;
	delete: (name, opts) => any;
	changePassword: (name, password, opts) => any;
	generateApiKey: (name, opts) => any;
	resetApiKey: (name, opts) => any;
	getSettings: (name, opts) => any;
	saveSettings: (name, settings, opts) => any;
}

interface util {
	testPath: (path, additional, opts) => any;
	testExecutable: (path, additional, opts) => any;
	testUrl: (url, additional, opts) => any;
}

interface wizard {
	get: (opts) => any;
	finish: (handled, opts) => any;
}

interface Printer {
	browser: browser;
	connection: connection;
	control: control;
	files: files;
	job: job;
	languages: languages;
	logs: logs;
	printer: printer;
	printerprofiles: printerprofiles;
	settings: settings;
	slicing: slicing;
	system: system;
	timelapse: timelapse;
	users: users;
	util: util;
	wizard: wizard;
}

class Octo {
	static options = { baseurl: "http://myprinter", apikey: "myapikey" };
	static Print: Printer = Octo.getPrinter();
	private static getPrinter() {
		var ret = window["OctoPrint"];
		ret.options = Octo.options;
		return ret;
	}
}

status.htm

<!DOCTYPE html>
<html>

<head>
    <script src="jquery-2.1.4.js"></script>
    <script src="lodash.min.js"></script>
    <script src="knockout.js"></script>
    <script src="packed_client.js"></script>
    <script>
        var vm = {
          options: {baseurl: "http://myprinter", apikey: "myapikey" },            
          status: ko.observable(""),
          refresh: function() {
            OctoPrint.options = vm.options;
            OctoPrint.printer.getFullState().done(function (data) {
                vm.status(JSON.stringify(data));
            })
          }
        };
        $(function () {
            ko.applyBindings(vm);
            vm.refresh();
        });
    </script>
</head>

<body>
    <div data-bind="text: status"></div>
    <hr />
    <button data-bind="click: refresh">refresh</button>
</body>

</html>