Skip to content

Commit 459c8a4

Browse files
arnogarnog
committed
chore: updated dependencies
1 parent 6099e4d commit 459c8a4

File tree

3 files changed

+5892
-6374
lines changed

3 files changed

+5892
-6374
lines changed

‎index.html

Lines changed: 68 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -1,67 +1,75 @@
1-
<!DOCTYPE html><html lang="en-US">
2-
<head>
3-
<link rel="stylesheet" href="style.css">
4-
<link rel="stylesheet" href="../../dist/mathlive.core.css">
5-
<link rel="stylesheet" href="../../dist/mathlive.css">
6-
</head>
7-
<body>
1+
<!DOCTYPE html>
2+
<html lang="en-US">
3+
<head>
4+
<link rel="stylesheet" href="style.css" />
5+
<link
6+
rel="stylesheet"
7+
href="https://unpkg.com/mathlive/dist/mathlive.core.css"
8+
/>
9+
<link
10+
rel="stylesheet"
11+
href="https://unpkg.com/mathlive/dist/mathlive.css"
12+
/>
13+
</head>
14+
<body>
15+
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
816

9-
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
17+
<script type="module">
18+
import MathLive from "https://unpkg.com/mathlive/dist/mathlive.mjs";
19+
// import Mathfield from "./node_modules/mathlive/dist/vue-mathlive.mjs";
20+
import Mathfield from "https://unpkg.com/mathlive/dist/vue-mathlive.mjs";
1021

11-
<script type='module'>
12-
import MathLive from "../../src/mathlive.js";
13-
// import Mathfield from "../../dist/vue-mathlive.mjs";
14-
import Mathfield from "../../src/vue-mathlive.js";
22+
Vue.use(Mathfield, MathLive);
23+
// The default tag for mathfields is <mathlive-mathfield>
24+
// A custom tag can be defined using:
25+
// ```Vue.component("custom-tag", Mathfield);```
1526

16-
Vue.use(Mathfield, MathLive);
17-
// The default tag for mathfields is <mathlive-mathfield>
18-
// A custom tag can be defined using:
19-
// ```Vue.component("custom-tag", Mathfield);```
20-
21-
new Vue({
22-
el: 'main',
23-
data: function() { return {
24-
formula: 'g(x)',
25-
keystroke: ''
26-
}},
27+
new Vue({
28+
el: "main",
29+
data: function () {
30+
return {
31+
formula: "g(x)",
32+
keystroke: "",
33+
};
34+
},
2735
methods: {
28-
sayIt: function(event) {
29-
this.$refs.mathfield.perform('speakAll');
30-
},
31-
setIt: function(event) {
32-
this.formula = 'x=-b\\pm \\frac {\\sqrt{b^2-4ac}}{2a}';
33-
},
34-
ping: function() {
35-
console.log('ping');
36-
},
37-
displayKeystroke: function(keystroke, _ev) {
38-
this.keystroke = keystroke;
39-
return true;
40-
},
41-
asSpokenText: function() {
42-
return this.$refs.mathfield ? this.$refs.mathfield.text('spoken') : '';
43-
}
44-
}
45-
});
46-
</script>
36+
sayIt: function (event) {
37+
this.$refs.mathfield.perform(["speak", "all"]);
38+
},
39+
setIt: function (event) {
40+
this.formula = "x=-b\\pm \\frac {\\sqrt{b^2-4ac}}{2a}";
41+
},
42+
ping: function () {
43+
console.log("ping");
44+
},
45+
displayKeystroke: function (keystroke, _ev) {
46+
this.keystroke = keystroke;
47+
return true;
48+
},
49+
asSpokenText: function () {
50+
return this.$refs.mathfield
51+
? this.$refs.mathfield.text("spoken")
52+
: "";
53+
},
54+
},
55+
});
56+
</script>
4757
<main>
48-
<h2>MathLive with Vue.js</h2>
49-
<mathlive-mathfield
50-
id='mf'
51-
ref="mathfield"
52-
:config="{smartFence:false}"
53-
@focus="ping"
54-
:on-keystroke="displayKeystroke"
55-
v-model="formula">f(x)=</mathlive-mathfield>
56-
<div>
57-
<label>Keystroke:&nbsp;</label><span>{{keystroke}}</span>
58-
</div>
59-
<div class="output">LaTeX: {{formula}}</div>
60-
<div class="output">Spoken text: {{asSpokenText()}}</div>
61-
<button v-on:click="sayIt">Say It</button>
62-
<button v-on:click="setIt">Set It</button>
58+
<h2>MathLive with Vue.js</h2>
59+
<mathlive-mathfield
60+
id="mf"
61+
ref="mathfield"
62+
:config="{smartFence:false}"
63+
@focus="ping"
64+
:on-keystroke="displayKeystroke"
65+
v-model="formula"
66+
>f(x)=</mathlive-mathfield
67+
>
68+
<div><label>Keystroke:&nbsp;</label><span>{{keystroke}}</span></div>
69+
<div class="output">LaTeX: {{formula}}</div>
70+
<div class="output">Spoken text: {{asSpokenText()}}</div>
71+
<button v-on:click="sayIt">Say It</button>
72+
<button v-on:click="setIt">Set It</button>
6373
</main>
64-
</body>
74+
</body>
6575
</html>
66-
67-

0 commit comments

Comments
 (0)