I’m doing another Creative Pact! This May I will create a new thing every day and put up on this blog. I am going to work with 3 things that I like: flocking.js, MYO, and C4. Hopefully by the end of the month I will be able to combine all of them masterfully.
My first work for creative pact 2016 is a failure, in the sense that it doesn’t yet work. I tried to create a C4 app with a UIWebView inside of it that loads flocking. I started by following a tutorial to get UIWebview to load a webpage and then added jquery. OK. So far so good.
The next step was to load flocking. I added this to the HTML page and I got some messages on the console (frameSizeChanged = 4096). Great. Then I remembered that Apple prevents audio from being loaded in webpages without some sort of user action. So, I looked through the web again and found the trick. Hooray, I thought. No sound. I tried doing a body click with jQuery to trigger the flock.play() but that didn’t work. So, I tried loading a sound file, which also didn’t work. Can flocking play in a UIWebView? Maybe, but not by me today. Tomorrow is another day.
//
// WorkSpace.swift
// UIWebViewFlock
//
// Created by Adam Tindale on 2016-05-01.
// Copyright © 2016 Adam Tindale. All rights reserved.
//
import UIKit
class WorkSpace: CanvasController {
var webview = UIWebView()
override func setup() {
webview.frame = CGRectMake(0, 0, 200, 200)
webview.mediaPlaybackRequiresUserAction = false
let url = NSBundle.mainBundle().URLForResource("home", withExtension: "html")
let request = NSURLRequest(URL: url!)
webview.loadRequest(request)
canvas.add(webview)
// doesn't work
//webview.stringByEvaluatingJavaScriptFromString("alert('ffff')")
// doesn't work
/*
let xx:String?
xx = webview.stringByEvaluatingJavaScriptFromString("$('#ttt').html('something else')")
print(xx!)
*/
canvas.addTapGestureRecognizer { locations, center, state in
//self.webview.stringByEvaluatingJavaScriptFromString("alert('ffff')") // works
self.webview.stringByEvaluatingJavaScriptFromString("$('#ttt').html('something else')")
// doesn't work
//self.webview.stringByEvaluatingJavaScriptFromString("document.getElementById('some_sound').play();")
//self.webview.stringByEvaluatingJavaScriptFromString("synth.play();")
}
}
}
<html>
<body>
HELLFOOALJKJLJDF
<div id="ttt"></div>
<script src="jquery.min.js"></script>
<script src="flocking-no-jquery.min.js"></script>
<script>
$('#ttt').html("jfjfkjlkjf");//test
var synth = flock.synth({
synthDef: {
ugen: "flock.ugen.sinOsc",
freq: 440,
mul: 0.25
}
});
synth.play();
$("#ttt").click(function(){
synth.play();
flock.enviro.shared.play();
});
</script>
<audio id="some_sound" controls>
<source src="Loop.aif" type="audio/aif">
</audio>
<script>
document.getElementById('some_sound').play();
</script>
</body>
</html>