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 = "100%"; Now we'll set up the asynchronous function to start the video stream. startVideo = async function(){ stream = await navigator.mediaDevices.getUserMedia({ […]

Basic Programing with Javascript

Welcome to the OakFrame Interactive Basic Programming with Javascript course. This course is provided through an interactive javascript notebook, powered by Scraps-JS, our open-source library. Each Scrap (or code cell), can be run independently. Let's start by running our first Javascript Scrap. // You can edit me dog = "dog"; fox = "fox"; return (dog […]

Our Work

Open Source Oak Studio Oak Studio is a Typescript & Node, PWA/SPA, Microservice Application Framework. Read Documentation View Source on GitHub Scraps-JS Scraps-JS is a State Driven Interactive Javascript Notebook/workspace Library. View Online Demo View Source on GitHub Artificial Intelligence Coming Soon. Our Clients

Your Idea is Totally Lame and You Should Totally Make It

Your Software Idea has been Thought of Before Luckily, it was by someone who didn’t have the skills or connections to make it possible. You will meet a thousand people who will tell you “I had that idea a long time ago” and you should believe them— there’s a saying that an idea is a […]

Multimedia Marketing Strategy

1.  Pillars and Funnel To follow the flow of the potential customer, we must direct their attention and their focus until they have solved the question or problem they had, and in the case of pillars and funnels, with the intention of leading them to a purchase. 1.1 Acquisition Goal: Aquire interested parties for the […]

Gordon Goodrum - Microservice and Software Architect

Software Architect and Microservice Evangelist Gordon Goodrum is a leader in research and development of web technologies. Gordon has been researching Artificial Intelligence and Human-Computer Interaction for over 5 years and has been applying these principals to web application and software development. His expertise is in the areas of Software Development and Human-Computer interaction in […]


atticus press enter to begin. X/XX/20XX, 0:00:00 XX var ui_time = document.getElementById('time'); var field = document.getElementById('field'); var title = document.getElementById('title'); var subtitle = document.getElementById('subtitle'); function SHIPP(width, height){ = []; this.width = width; this.height = height; this.size = width*height; }; SHIPP.prototype.shuffle = function(){ var temp = []; while ( > 0){ temp.push(*|0,1)[0]); } = […]

Fluid Viewports vs Fixed Screens in Native Web Apps

When designing an experience we must consider the rendering capabilities of the devices and platforms we run on. OakFrame is not only run in our own environments but powering millions of capable experiences. By leveraging the full browser rendering system and offering full control over how that browser renders frames, we are able to take […]


A SHIPP (Shift Pattern Properties) is a wrapper around 2-dimensional arrays so that they may be used in cases such as maps and path-finding implementations. map = new Oak.Math.SHIPP( 8, 16 ); map.placeCluster( -4, 0, 8, 8, 1); map.walkLine( 2, 1, 6, 14, "y"); table = document.createElement('div'); table.innerHTML = map.renderHTML({style:"class='slim'"}); Scrap.print( table );