Skip to content

GitLab

Commit 6f458fc2 authored by commit-bot@chromium.org's avatar commit-bot@chromium.org
Browse files

First pass at a web app that lets you run Skia code and see the results. 

BUG=skia:
R=reed@google.com

Author: jcgregorio@google.com

Review URL: https://codereview.chromium.org/195143004

git-svn-id: http://skia.googlecode.com/svn/trunk@13751 2bbb7eff-a529-9590-31e7-b0007b416f81
parent e63306df
Hide whitespace changes
Inline Side-by-side
Showing with 238 additions and 0 deletions
experimental/webtry/README 0 → 100644
View file @ 6f458fc2
WebTry
======
Allows trying out Skia code in the browser. Run a local webserver
and from the pages it serves try out Skia code and see the results
immediately.
Running
=======
$ cd experimental/webtry
$ python server.py
Then visit http://localhost:8765 in your browser.
experimental/webtry/index.html 0 → 100644
View file @ 6f458fc2
<!DOCTYPE html>
<html>
<head>
<title>Skia WebTry</title>
<meta charset='utf-8' />
<style type="text/css" media="screen">
textarea {
margin-left: 0;
border: solid 1px #ccc;
color: green;
}
pre, code {
padding: 0;
color: green;
}
</style>
</head>
<body>
<pre><code>#include "SkCanvas.h"
#include "SkGraphics.h"
#include "SkImageEncoder.h"
#include "SkImageInfo.h"
#include "SkForceLinking.h"
int main() {
SkForceLinking(false);
SkGraphics::Init();
SkImageInfo info = SkImageInfo::MakeN32(300, 300, kPremul_SkAlphaType);
SkBitmap bitmap;
bitmap.setConfig(info);
bitmap.allocPixels();
SkCanvas c(bitmap);
c.drawColor(SK_ColorWHITE);
<textarea name='code' id='code' rows='20' cols='80'>SkPaint p;
p.setColor(SK_ColorRED);
p.setAntiAlias(true);
p.setStyle(SkPaint::kStroke_Style);
p.setStrokeWidth(10);
c.drawLine(20, 20, 100, 100, p);
</textarea>
if (!SkImageEncoder::EncodeFile("foo.png", bitmap, SkImageEncoder::kPNG_Type, 100)) {
printf("Failed to encode\n");
}
}
</code></pre>
<p>Image appears here:</p>
<img id='img' src=''/>
<pre><code id='output'></code></pre>
<input type='button' value='Run' id='run'>
<script type='text/javascript' charset='utf-8'>
var run = document.getElementById('run');
var code = document.getElementById('code');
var output = document.getElementById('output');
var img = document.getElementById('img');
function codeComplete(e) {
// The response is JSON of the form:
// {
// "message": "you had an error...",
// "img": "<base64 encoded image but only on success>"
// }
//
// The img is optional and only appears if there is a valid
// image to display.
console.log(e.target.response);
body = JSON.parse(e.target.response);
output.innerText = body.message;
if (body.hasOwnProperty('img')) {
img.src = 'data:image/png;base64,' + body.img;
} else {
img.src = '';
}
}
function codeError(e) {
alert('Something bad happened: ' + e);
}
run.addEventListener('click', onSubmitCode);
function onSubmitCode() {
var req = new XMLHttpRequest();
req.addEventListener('load', codeComplete);
req.addEventListener('error', codeError);
req.overrideMimeType('application/json');
req.open('POST', '.', true);
req.send(code.value + '\r\nEOF\r\n');
}
</script>
</body>
</html>
experimental/webtry/server.py 0 → 100644
View file @ 6f458fc2
import BaseHTTPServer
import base64
import json
import logging
import string
import subprocess
HOST_NAME = 'localhost'
PORT_NUMBER = 8765
def runCode(usercode):
f = open('template.cpp', 'rb')
template = string.Template(f.read())
f.close()
code = template.substitute(usercode=usercode)
f = open('result.cpp', 'wb')
f.write(code)
f.close()
msg = ""
img = ""
try:
logging.info("compiling")
msg = subprocess.check_output('ninja -C ../../out/Debug webtry'.split())
try:
logging.info("running")
msg = subprocess.check_output('../../out/Debug/webtry'.split())
f = open('foo.png', 'rb')
img = base64.b64encode(f.read())
f.close()
except subprocess.CalledProcessError as e:
logging.info(e)
msg = e.output
except subprocess.CalledProcessError as e:
logging.info(e)
msg = e.output
retval = {
'message': msg
}
if img:
retval['img'] = img
return retval
class MyHandler(BaseHTTPServer.BaseHTTPRequestHandler):
def do_POST(self):
logging.info("POST")
body = ""
l = self.rfile.readline()
while l.strip() != "EOF":
body += l
l = self.rfile.readline()
self.send_response(200)
self.send_header("Content-type", "application/json")
self.end_headers()
resp = runCode(body)
self.wfile.write(json.dumps(resp))
self.end_headers()
def do_GET(self):
"""Respond to a GET request."""
self.send_response(200)
self.send_header("Content-type", "text/html")
self.end_headers()
f = open('index.html', 'rb')
self.wfile.write(f.read())
f.close()
if __name__ == '__main__':
server_class = BaseHTTPServer.HTTPServer
httpd = server_class((HOST_NAME, PORT_NUMBER), MyHandler)
logging.info("Server Start: %s:%s" % (HOST_NAME, PORT_NUMBER))
try:
httpd.serve_forever()
except KeyboardInterrupt:
pass
httpd.server_close()
experimental/webtry/template.cpp 0 → 100644
View file @ 6f458fc2
#include "SkCanvas.h"
#include "SkGraphics.h"
#include "SkImageEncoder.h"
#include "SkImageInfo.h"
#include "SkForceLinking.h"
int main() {
SkForceLinking(false);
SkGraphics::Init();
SkImageInfo info = SkImageInfo::MakeN32(300, 300, kPremul_SkAlphaType);
SkBitmap bitmap;
bitmap.setConfig(info);
bitmap.allocPixels();
SkCanvas c(bitmap);
c.drawColor(SK_ColorWHITE);
$usercode
if (!SkImageEncoder::EncodeFile("foo.png", bitmap, SkImageEncoder::kPNG_Type, 100)) {
printf("Failed to encode\n");
}
}
gyp/everything.gyp
View file @ 6f458fc2
......@@ -23,6 +23,7 @@
'debugger.gyp:debugger',
'pdfviewer.gyp:pdfviewer',
#'v8.gyp:SkV8Example',
#'webtry.gyp:webtry',
],
}],
],
......
gyp/webtry.gyp 0 → 100644
View file @ 6f458fc2
# GYP file to build a the webtry sample.
{
'targets': [
{
'target_name': 'webtry',
'type': 'executable',
'mac_bundle' : 1,
'include_dirs' : [
'../src/core',
'../src/images',
],
'sources': [
'../experimental/webtry/result.cpp',
],
'dependencies': [
'flags.gyp:flags',
'skia_lib.gyp:skia_lib',
'images.gyp:images',
],
},
],
}
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment