diff --git a/app.py b/app.py index a34428a..c847a09 100644 --- a/app.py +++ b/app.py @@ -8,53 +8,65 @@ base_url = "/" +#We assume a default filename of inlet.js to grab from the gist +default_filename = "inlet.js" + @app.route("/") def hello(): #return render_template("index.html", base_url=base_url) return render_template("gallery.html", base_url=base_url) -@app.route("/creator") -def creator(): - #return render_template("index.html", base_url=base_url) - return render_template("gallery_creator.html", base_url=base_url) - +#Live editing d3 for exploring parameter spaces @app.route("/tributary/") -def tributary(): - return render_template("tributary.html", base_url=base_url) - -@app.route("/reptile/") -def reptile(): - return render_template("reptile.html", base_url=base_url) - +@app.route("/tributary//") +def tributary_gist(gist=None): + return render_template("tributary.html", gist=gist, filename=default_filename, base_url=base_url) +#Live editing transitions @app.route("/delta/") -def delta(): - return render_template("delta.html", base_url=base_url) +@app.route("/delta//") +def delta_gist(gist=None): + return render_template("delta.html", gist=gist, filename=default_filename, base_url=base_url) +#Live editing run loops @app.route("/hourglass/") -def hourglass(): - return render_template("hourglass.html", base_url=base_url) - +@app.route("/hourglass//") +def hourglass_gist(gist=None): + return render_template("hourglass.html", gist=gist, filename=default_filename, base_url=base_url) +#Live editing music visualization @app.route("/flow/") -def flow(): - return render_template("flow.html", base_url=base_url) +@app.route("/flow//") +def flow_gist(gist=None): + return render_template("flow.html", gist=gist, filename=default_filename, base_url=base_url) -@app.route("/geyser/") -def geyser(): - return render_template("geyser.html", base_url=base_url) +#Experimenting with tiling and patterns +@app.route("/reptile/") +@app.route("/reptile//") +def reptile_gist(gist=None): + return render_template("reptile.html", gist=gist, filename=default_filename, base_url=base_url) -@app.route("/fountain/") -def fountain(): - return render_template("fountain.html", base_url=base_url) +#Embedded view for Tributary +@app.route("/embed//") +def embed_gist(gist=None): + return render_template("embed.html", gist=gist, filename=default_filename, base_url=base_url) +#Embedded view for Delta +@app.route("/shore//") +def shore_gist(gist=None): + return render_template("shore.html", gist=gist, filename=default_filename, base_url=base_url) -@app.route("/tributary/api//") -def internal_gist(gist, filename): + +#@app.route("/tributary/api//") +@app.route("/tributary/api//") +def internal_gist(gist, filename=None): code = "" + if filename is None: + filename = default_filename + #print gist, filename url = "https://raw.github.com/gist/" #1569370/boid.js url += gist + "/" + filename @@ -66,97 +78,46 @@ def internal_gist(gist, filename): code = obj.read() except URLError, e: print "ERROR", e.code - return code -@app.route("/tributary//") -def tributary_gist(gist=None, filename=None): - #print gist, filename - #return render_template("water.html", code=code, base_url=base_url) - return render_template("tributary.html", gist=gist, filename=filename, base_url=base_url) - -@app.route("/reptile//") -def reptile_gist(gist=None, filename=None): - #print gist, filename - #return render_template("water.html", code=code, base_url=base_url) - return render_template("reptile.html", gist=gist, filename=filename, base_url=base_url) +#Save a tributary to a gist +@app.route("/tributary/save", methods=["POST"]) +def save(): + data = request.values.get("gist") -@app.route("/delta//") -def delta_gist(gist=None, filename=None): - #print gist, filename - #return render_template("water.html", code=code, base_url=base_url) - return render_template("delta.html", gist=gist, filename=filename, base_url=base_url) + #TODO: use github auth for logged in users + url = 'https://api.github.com/gists' + req = urllib2.Request(url, data) + ret = urllib2.urlopen(req).read() + #print "ret", ret + resp = make_response(ret, 200) + resp.headers['Content-Type'] = 'application/json' -@app.route("/hourglass//") -def hourglass_gist(gist=None, filename=None): - #print gist, filename - return render_template("hourglass.html", gist=gist, filename=filename, base_url=base_url) + return resp -@app.route("/flow//") -def flow_gist(gist=None, filename=None): - #print gist, filename - #return render_template("water.html", code=code, base_url=base_url) - return render_template("flow.html", gist=gist, filename=filename, base_url=base_url) +#An experimental view that allowed creating screenshots from the gallery +@app.route("/creator") +def creator(): + return render_template("gallery_creator.html", base_url=base_url) +#EXPIREMENTAL: these don't work with the rewrite, will need to be resurrected +""" @app.route("/geyser//") def geyser_gist(gist=None, filename=None): - #print gist, filename - #return render_template("water.html", code=code, base_url=base_url) - return render_template("geyser.html", gist=gist, filename=filename, base_url=base_url) + return render_template("geyser.html", gist=gist, filename=default_filename, base_url=base_url) @app.route("/fountain//") def fountain_gist(gist=None, filename=None): - #print gist, filename - #return render_template("water.html", code=code, base_url=base_url) - return render_template("fountain.html", gist=gist, filename=filename, base_url=base_url) - - - -@app.route("/shore//") -def shore_gist(gist=None, filename=None): - #print gist, filename - #return render_template("water.html", code=code, base_url=base_url) - return render_template("shore.html", gist=gist, filename=filename, base_url=base_url) + return render_template("fountain.html", gist=gist, filename=default_filename, base_url=base_url) @app.route("/carbonite//") def carbonite_gist(gist=None, filename=None): - #print gist, filename - #return render_template("water.html", code=code, base_url=base_url) - return render_template("carbonite.html", gist=gist, filename=filename, base_url=base_url) - - -@app.route("/embed//") -def embed_gist(gist=None, filename=None): - #print gist, filename - #return render_template("water.html", code=code, base_url=base_url) - return render_template("embed.html", gist=gist, filename=filename, base_url=base_url) + return render_template("carbonite.html", gist=gist, filename=default_filename, base_url=base_url) +""" - -import urllib -@app.route("/tributary/save", methods=["POST"]) -@app.route("/delta/save", methods=["POST"]) -@app.route("/hourglass/save", methods=["POST"]) -@app.route("/flow/save", methods=["POST"]) -def save(): - #gistobj = json.loads(request.values.get("gist")) - data = request.values.get("gist") - #data = urllib.urlencode(gistobj) - #print "gistobj", data - - url = 'https://api.github.com/gists' - req = urllib2.Request(url, data) - ret = urllib2.urlopen(req).read() - #print "ret", ret - resp = make_response(ret, 200) - #TODO: get this working behind apache - #resp.headers['Conent-Type'] = 'application/json' - - return resp - - if __name__ == "__main__": app.run(host="localhost", port=8888) diff --git a/static/tributary.js b/static/tributary.js index 4f6403a..78c2736 100644 --- a/static/tributary.js +++ b/static/tributary.js @@ -51,21 +51,22 @@ tributary.Tributary = Backbone.Model.extend({ }, newcode: function(code) { //save the code in the model - this.set({code:code}) - this.execute() + this.set({code:code}); + this.execute(); //TODO: store code in local storage - return true + return true; }, get_code: function(callback) { + var that = this; if(this.get("gist") && this.get("filename")) { - src_url = "/tributary/api/" + this.get("gist") + "/" + this.get("filename"); + src_url = "/tributary/api/" + this.get("gist");// + "/" + this.get("filename"); d3.text(src_url, function(data) { if(data) { code = data; - this.set({code: data}); + that.set({code: data}); } else { - code = this.get("code"); + code = that.get("code"); if(!code) { code = ""; } @@ -171,17 +172,17 @@ tributary.TributaryView = Backbone.View.extend({ this.inlet = Inlet(this.code_editor); - that.init_gui(); + this.init_gui(); var code = this.model.get("code"); //check if we already have the code - if(code !== undefined) { + if(code !== undefined && code !== "") { this.code_editor.setValue(code); this.model.execute(); } else { //fill in the editor with text we get back from the gist this.model.get_code(function(error, got_code) { - this.code_editor.setValue(got_code); + that.code_editor.setValue(got_code); }); } @@ -206,7 +207,7 @@ tributary.TributaryView = Backbone.View.extend({ var that = this; //Setup the gui elements for this page //Setup tweet link - //var thisurl = window.location.protocol + "//" + window.location.host + "/" + window.location.pathname; + /* $('#tweet_this').append("tweet this"); $('#tweetPanel').on("click", function(e) { that.save_gist(function(newurl, newgist) { @@ -215,6 +216,7 @@ tributary.TributaryView = Backbone.View.extend({ //window.open(tweetlink, 'twitte') }); }); + */ //Setup the save panel $('#savePanel').on('click', function(e) { @@ -294,6 +296,9 @@ tributary.TributaryView = Backbone.View.extend({ //console.log("ENDPOINT", @endpoint) //Save the current code to a public gist var oldgist = parseInt(this.model.get("gist"), 10); + + //We now assume all tributaries will be saved as inlet.js + //so this code is a bit redundant, but it might be useful in the future filename = this.model.get("filename"); if(filename === ""){ filename = "inlet.js"; @@ -314,12 +319,11 @@ tributary.TributaryView = Backbone.View.extend({ var that = this; $.post('/tributary/save', {"gist":JSON.stringify(gist)}, function(data) { - //TODO: fix the flask headers to send back application/json and not text/html if(typeof(data) === "string") { data = JSON.parse(data); } var newgist = data.id; - var newurl = "/" + that.endpoint + "/" + newgist + "/" + filename; + var newurl = "/" + that.endpoint + "/" + newgist;// + "/" + filename; callback(newurl, newgist); //window.location = newurl; }); diff --git a/static/delta.js b/static/views/delta.js similarity index 100% rename from static/delta.js rename to static/views/delta.js diff --git a/static/flow.js b/static/views/flow.js similarity index 90% rename from static/flow.js rename to static/views/flow.js index c8afda4..c2eec7d 100644 --- a/static/flow.js +++ b/static/views/flow.js @@ -10,7 +10,32 @@ var audioBuffer; -$(function() { +(function() { + +tributary.Flow = tributary.Tributary.extend({ + //Music visualization exploration + execute: function() { + try { + eval(this.get("code")); + this.trigger("noerror"); + } catch (e) { + this.trigger("error", e); + } + + try { + $("#flow").empty(); + //we exec the user defined append code + tributary.init(tributary.g); + //then we run the user defined run function + tributary.execute(); + this.trigger("noerror"); + } catch (er) { + this.trigger("error", er); + } + + return true; + } +}); //time slider @@ -168,7 +193,7 @@ d3.timer(function() { -}); +}()); diff --git a/static/hourglass.js b/static/views/hourglass.js similarity index 69% rename from static/hourglass.js rename to static/views/hourglass.js index 9e0c30c..9c6dbd5 100644 --- a/static/hourglass.js +++ b/static/views/hourglass.js @@ -1,5 +1,43 @@ (function() { + tributary.HourGlass = tributary.Tributary.extend({ + //For exploring animations, run loops + initialize: function() { + this.binder(); + this.set({ + code: '\ +var txt;\n\ +tributary.init = function(g) {\n\ + txt = g.append("text")\n\ + .attr("transform", "translate(" + [100, 100] + ")");\n\ +};\n\ +tributary.run = function(g,t) {\n\ + txt.text(t);\n\ +};' + }); + }, + execute: function() { + try { + eval(this.get("code")); + this.trigger("noerror"); + } catch (e) { + this.trigger("error", e); + } + + try { + $("#hourglass").empty(); + //we exec the user defined append code + tributary.init(tributary.g); + //then we run the user defined run function + tributary.execute(); + this.trigger("noerror"); + } catch (er) { + this.trigger("error", er); + } + + return true; + } + }) //time slider //window.delta = {} //var delta = window.delta; diff --git a/static/reptile.js b/static/views/reptile.js similarity index 100% rename from static/reptile.js rename to static/views/reptile.js diff --git a/templates/base.html b/templates/base.html index 0b0cdfe..f51c64a 100644 --- a/templates/base.html +++ b/templates/base.html @@ -67,11 +67,13 @@ --> + diff --git a/templates/delta.html b/templates/delta.html index 428bea9..1e8c0dd 100644 --- a/templates/delta.html +++ b/templates/delta.html @@ -9,7 +9,7 @@ {% endblock %} {% block scripts %} - + {% endblock %} {% block branding %} diff --git a/templates/flow.html b/templates/flow.html index 5b27bbd..4e621e5 100644 --- a/templates/flow.html +++ b/templates/flow.html @@ -8,7 +8,7 @@ {% endblock %} {% block scripts %} - + {% endblock %} {% block branding %} diff --git a/templates/hourglass.html b/templates/hourglass.html index 94f5d99..95f9504 100644 --- a/templates/hourglass.html +++ b/templates/hourglass.html @@ -9,7 +9,7 @@ {% endblock %} {% block scripts %} - + {% endblock %} {% block branding %} diff --git a/templates/reptile.html b/templates/reptile.html index 2e77993..886c348 100644 --- a/templates/reptile.html +++ b/templates/reptile.html @@ -9,7 +9,7 @@ {% endblock %} {% block scripts %} - + {% endblock %} {% block branding %}