Skip to content

Instantly share code, notes, and snippets.

@F2X
Created July 10, 2017 13:57
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save F2X/96d599ace2fff2ee2c86564c7abd55b3 to your computer and use it in GitHub Desktop.
Save F2X/96d599ace2fff2ee2c86564c7abd55b3 to your computer and use it in GitHub Desktop.
Custom user resource workaround
<!doctype html>
<html>
<head>
<link rel="icon" type="image/png" sizes="96×96" href="./favicon.ico">
<title>MyScript Unified Sample</title>
<link type="text/css" rel="stylesheet" href="https://fonts.googleapis.com/css?family=Waiting+for+the+Sunrise">
<!--A WebComponent polyfill is needed to use the web component, has it's not yet well implemented by all browsers-->
<script type="text/javascript" src="./bower_components/webcomponentsjs/webcomponents-lite.min.js"></script>
<script type="text/javascript" src="index.js"></script>
<link rel="import" href="./bower_components/paper-button/paper-button.html">
<link rel="import" href="./bower_components/myscript-common-element/myscript-common-element.html">
<link rel="import" href="./bower_components/myscript-text-web/myscript-text-web.html">
<link rel="import" href="./bower_components/myscript-math-web/myscript-math-web.html">
<style is="custom-style">
body {
margin: 0;
padding: 0;
border: 0;
height: 100%;
max-height: 100%;
overflow-x: hidden;
}
header {
height: 49px;
border-bottom: 1px solid #dddddd;
display: -webkit-flex;
display: flex;
align-items: center;
justify-content: center;
}
.write-here-wrapper {
position: relative;
}
.write-here {
position: absolute;
width: 100vw;
text-align: center;
padding: 0;
margin: -33px auto 0;
top: 50%;
font-family: 'Waiting for the Sunrise', cursive;
font-size: 40px;
z-index: 1;
}
#textInput,
#mathInput,
#graphicsInput {
height: calc(100vh - 50px);
}
paper-button[toggles][active] {
background: rgba(0, 0, 0, 0.2);
}
#musicInput {
height: 300px;
}
#MUSICXML {
border: none;
margin: 0;
overflow: auto;
height: calc(100vh - 350px);
}
</style>
</head>
<body touch-action="none">
<header>
<paper-button id="textButton" toggles>
<iron-icon src="./assets/img/demo/myscript-text.svg"></iron-icon>
</paper-button>
<paper-button id="mathButton" toggles>
<iron-icon src="./assets/img/demo/myscript-math.svg"></iron-icon>
</paper-button>
<paper-button id="graphicsButton" toggles>
<iron-icon src="./assets/img/demo/myscript-shape.svg"></iron-icon>
</paper-button>
<paper-button id="musicButton" toggles>
<iron-icon src="./assets/img/demo/myscript-music.svg"></iron-icon>
</paper-button>
</header>
<div id="content">
<div class="write-here-wrapper">
<div class="write-here">Write here</div>
<myscript-text-web id="textInput" host="webdemoapi.myscript.com" applicationkey="27f8d860-011b-4119-a32b-c75c8833ed33" hmackey="8fdcb786-db27-4381-af0e-b379ef7753be"></myscript-text-web>
<myscript-math-web id="mathInput" host="webdemoapi.myscript.com" applicationkey="*********************************" hmackey="********************************" hidden></myscript-math-web>
<myscript-common-element id="graphicsInput" host="webdemoapi.myscript.com" protocol="REST" applicationkey="27f8d860-011b-4119-a32b-c75c8833ed33" hmackey="8fdcb786-db27-4381-af0e-b379ef7753be" type="SHAPE" typeset="true" hidden></myscript-common-element>
<myscript-common-element id="musicInput" host="webdemoapi.myscript.com" protocol="REST" applicationkey="27f8d860-011b-4119-a32b-c75c8833ed33" hmackey="8fdcb786-db27-4381-af0e-b379ef7753be" type="MUSIC" hidden></myscript-common-element>
</div>
<pre id="MUSICXML" class="prettyprint lang-xml" hidden></pre>
</div>
</body>
<script>
window.addEventListener('load', function () {
console.log('load');
console.log(document.getElementById('mathInput')._mathParameters.userResources);
document.getElementById('mathInput')._mathParameters.userResources = ['writeline'];
console.log(document.getElementById('mathInput')._mathParameters.userResources);
})
</script>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment