1
0
Fork 0

Hooked up roman computed property to stubbed function

This commit is contained in:
Joe L. Wroten 2015-11-01 23:21:51 -06:00
parent e31b1ba904
commit d1bc9711dd
3 changed files with 24 additions and 2 deletions

View file

@ -1,6 +1,8 @@
# roman-numeral-calculator # Roman Numeral Calculator
Whole number calculator that also displays the results in Roman Numerals. Whole number calculator that also displays the results in Roman Numerals.
Utilizes Vue and Bootstrap Material Design.
--- ---
## Getting Started ## Getting Started

20
app.js
View file

@ -1,4 +1,7 @@
/**
* Vue Application Code
*/
var App = new Vue({ var App = new Vue({
el: '#calculator', // Context for 'data' usage el: '#calculator', // Context for 'data' usage
data: { data: {
@ -6,6 +9,11 @@ var App = new Vue({
previousResult: NaN, previousResult: NaN,
calculation: '' // String that'll hold our calculation, such as '6+4/2*2' calculation: '' // String that'll hold our calculation, such as '6+4/2*2'
}, },
computed: {
resultRoman: function() {
return this.previousResult ? intToRoman(this.previousResult) : '';
}
},
methods: { methods: {
// Resets all of our values // Resets all of our values
clear: function() { clear: function() {
@ -43,6 +51,18 @@ var App = new Vue({
} }
}); });
/**
* Converts Integer to Roman Numerals
* @param {[number]} n [whole number to be converted]
* @return {[string]} [roman numeral conversion of provided whole number]
*/
function intToRoman(n) {
return n + 'TODO';
}
/**
* Page Load Initializers and Bindings
*/
$(document).ready(function() { $(document).ready(function() {
// This command is used to initialize some elements and make them work properly // This command is used to initialize some elements and make them work properly
$.material.init(); $.material.init();

View file

@ -34,7 +34,7 @@
<small class="pull-left text-muted">Roman Numerals</small> <small class="pull-left text-muted">Roman Numerals</small>
<br /> <br />
<h1 class="pull-right">{{ result }}</h1> <h1 class="pull-right">{{ result }}</h1>
<h1 class="pull-left text-muted">IV</h1> <h1 class="pull-left text-muted">{{ resultRoman }}</h1>
</div> </div>
<!-- Table --> <!-- Table -->