Skip to content

Instantly share code, notes, and snippets.

@McNull
Forked from haiau79/app.html
Created September 21, 2016 19:05
Show Gist options
  • Save McNull/39f5b7c4779026d92f39b26f6925be6c to your computer and use it in GitHub Desktop.
Save McNull/39f5b7c4779026d92f39b26f6925be6c to your computer and use it in GitHub Desktop.
Aurelia RequireJS Gist
<template>
<object type="image/svg+xml" id="svgId"
data="e-3.svg" height="50" width="50" viewBox="0 0 50 50"
mouseover.delegate="domouseover()" mouseout.delegate="domouseout()"
click.delegate="doClickSVG()">
</object>
<div>
<img src="e-3.svg" click.delegate="doClickSVG()"/>
</div>
</template>
export class App {
message: string = 'Welcome to Aurelia!';
domouseover() {
document.getElementById(event.srcElement.id).style.backgroundColor = "yellow";
document.getElementById(event.srcElement.id).getSVGDocument().getElementById("fillColor").style.fill = "blue";
}
domouseout() {
document.getElementById(event.srcElement.id).style.backgroundColor = "white";
document.getElementById(event.srcElement.id).getSVGDocument().getElementById("fillColor").style.fill = "green";
}
doClickSVG() {
alert("in doClickSVG");
}
}
Display the source blob
Display the rendered blob
Raw
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
<!doctype html>
<html>
<head>
<title>Aurelia</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body aurelia-app>
<h1>Loading...</h1>
<script src="https://jdanyow.github.io/rjs-bundle/node_modules/requirejs/require.js"></script>
<script src="https://jdanyow.github.io/rjs-bundle/config.js"></script>
<script src="https://jdanyow.github.io/rjs-bundle/bundles/aurelia.js"></script>
<script src="https://jdanyow.github.io/rjs-bundle/bundles/babel.js"></script>
<script>
require(['aurelia-bootstrapper']);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment