Our Services

OakFrame provides services ranging from research, design, and development. We create products that meet and exceed the requirements of our clients, whether large or small. We are here to help you achieve your goals. We provide reduced rates for organizations relating to the following fields: Childhood Education, Mental Health, Non-Profit, and Social Change. Please contact […]


let graph_container = document.createElement("div"); graph_container.id = "graph-render-area"; graph_container.className = "graph"; graph_container.style.height="400px"; print(graph_container); let graph = new Oak.Graph.Graph(); let btn = new Oak.Graph.Node.Button(); let txt = new Oak.Graph.Node.Text(); let alr = new Oak.Graph.Node.Alert(); let log = new Oak.Graph.Node.Log(); graph.attachNode(btn); graph.attachNode(txt); graph.attachNode(alr); graph.attachNode(log); graph.render(graph_container);


Networks are a CPU based implementation of a simple feed-forward / back-propagation Neural Network. Network.ts Methods network = new Oak.Neural.Network(); network.addLayer(4,2); network.addLayer(1); data = []; return network; Let's use a common training data set, the XOR task. Our training data is formatted in a way such that [input array, output array]: This is important to […]

Core Principals

Honesty It is our responsibility to our community and to the public to provide accurate information. This means being honest with our audience and ourselves. We strive to present information that is clear, accurate, and complete. It means taking the time to listen and respond to those who have questions, and being respectful of our […]

Spectre Elasticsearch Desktop GUI

The team at OakFrame and TimeRocket have done it again, a collaboration of epic-proportions. We've put our heads together to build the ultimate in cross-platform Desktop GUIs for Elasticsearch. This was a new challenge for us, and we're excited to be able to show it off. Our goal with this release is to bring and […]


Cameras are a way to transformations when rendering images to a surface. It relies on the Projection class to deliver 2d and 3d projection computations. Camera Methods First, we're going to set up some helper variables that will come in handy later. surface = new Oak.Rendering.Surface(); actor_image = new Oak.Rendering.Sprite("https://oakframe.org/wp-content/neighbors/sp_apple01.png"); getProjection() : Projection camera = […]

HTML5 JavaScript GeolocationAPI with Example

First, let’s set up a helper function that is going to convert coordinate latitude and longitude to a pixel X and Y position. This will be useful for displaying our coordinates on a 2d image of a map, which we’ll be doing later. function coordinatesToXY(image_size_x, image_size_y, coords){ return { x : (image_size_x) * (180 + […]

HTML5 JavaScript DeviceOrientation with Example

device = { absolute:null, alpha:null, beta:null, gamma:null } data=[]; function handleOrientation(event) { device.absolute = event.absolute; device.alpha = event.alpha-180; device.beta = event.beta; device.gamma = event.gamma; } DeviceOrientationEvent.requestPermission() .then( response => { // (optional) Do something after API prompt dismissed. if ( response == "granted" ) { Scrap.print("permission granted") } }) .catch( e => { Scrap.print("permission denied") […]

HTML5 JavaScript Webcam and Example

Let's get started by setting up some HTML Elements to be used for displaying the webcam video stream. video_element = document.createElement("video"); video_element.autoplay = true; video_element.playsinline = true; video_element.setAttribute('playsinline', 'playsinline'); // For iOS video_element.style.width = "100%"; Now we'll set up the asynchronous function to start the video stream. startVideo = async function(){ stream = await navigator.mediaDevices.getUserMedia({ […]