Comments (3)
I managed to get javascript to execute using an iframe, but it's not loading the external js properly. I set up an iframe to load html which the app serves:
<!DOCTYPE html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/raphael/2.1.2/raphael-min.js"></script>
<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
</head>
<html>
<body>
<div id="canvas_container"></div>
<script>
window.onload = function(){
console.log("EXECUTING");
paper = new Raphael(document.getElementById("canvas_container"), 500, 500);
var circle = paper.circle(50, 40, 10);
circle.attr("fill", "#f00");
circle.attr("stroke", "#fff");
};
</script>
</body>
</html>
And the content looks like:
@content: ->
@div class: 'block', id: 'plasmidDisplayBase', =>
@iframe src: "http://localhost:8888"
So the EXECUTING is sent to log now; however, I'm getting a different error if I try to serve that iframe within atom ("Raphael is not defined"). Outside of atom, chrome doesn't show any errors and works, so I'm pretty sure it's not the HTML or javascript that's wrong, space-pen just doesn't seem to want to load the external js.
from space-pen.
More experimentation; left a setTimeout, as follows:
<!DOCTYPE html>
<head>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/raphael/2.1.2/raphael-min.js"></script>
</head>
<html>
<body>
<div id="canvas_container"></div>
<script type="text/javascript">
setTimeout(function(){
console.log("EXECUTING");
paper = new Raphael(document.getElementById("canvas_container"), 500, 500);
var circle = paper.circle(50, 40, 10);
circle.attr("fill", "#f00");
circle.attr("stroke", "#fff");
}, 5000);
</script>
</body>
</html>
I get a "Cannot read property 'on' of undefined" immediately (and the console says it's from raphael-min.js), then after 5 seconds I get a "Raphael is not defined" (from the raphael-display.html). So for some reason, despite my browser reading the html fine, space-pen is doing something with the javascript src that causes it to go all screwy. Not sure what that error means.
from space-pen.
Resolved: this was an issue with the external js. See issue at raphael.js's repo here.
from space-pen.
Related Issues (20)
- Bower package HOT 8
- Why the dependency on jquery-extensions HOT 5
- Current dependencies HOT 5
- How to <br> ? HOT 2
- @subview in top level of given view HOT 3
- Listener added via View.preempt() cannot be removed. HOT 7
- Simplify removing a listener HOT 1
- Subview appears above table HOT 5
- How apply event click to content add by append? HOT 3
- Getting Started HOT 4
- atom-text-editor in @tag HOT 1
- Can't have an outlet on the top level HOT 1
- Does not play well when multiple versions of spacepen HOT 1
- Github pages is out of date HOT 1
- Improper jQuery code HOT 3
- npm install/start failed on windows HOT 2
- attached isn't called HOT 2
- Built-in tags with @tag HOT 1
- "No longer maintained" - more description in Readme? HOT 3
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from space-pen.