Skip to content

Commit c9c46fe

Browse files
author
Victor Nwaiwu
authored
Merge pull request #4 from andela-vnwaiwu/angular
Angular
2 parents 1416934 + b5d3f0b commit c9c46fe

File tree

5 files changed

+134
-52
lines changed

5 files changed

+134
-52
lines changed

public/css/style.css

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -35,4 +35,9 @@ main {
3535
.intro-image {
3636
background: url('../img/background-img2.jpg') center center;
3737
padding: 5%;
38+
}
39+
40+
.error {
41+
font-size: 10px;
42+
color: #ff0000;
3843
}

public/index.html

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<!DOCTYPE html>
2-
<html lang="en">
2+
<html lang="en" ng-app="StringExtension">
33

44
<head>
55
<title>String Class Extension Method</title>
@@ -19,7 +19,7 @@
1919

2020
</head>
2121

22-
<body>
22+
<body ng-controller="StringExtensionController">
2323
<header>
2424
<nav>
2525
<div class="nav-wrapper orange lighten-2">
@@ -135,28 +135,28 @@ <h4 class="center-align">How To Use</h4>
135135
<div class="col l4 s12 m12 push-l7">
136136
<div id="result-area" class="row">
137137
<h5 class="center-align">Result</h5>
138-
<div id="result">
138+
<p class="error center-align">{{error}}</p>
139+
<div id="result" class="center-align">
140+
{{result}}
139141
</div>
140142
</div>
141143
</div>
142144
<div class="col l5 s12 m12 pull-l3">
143145
<div class="row">
144146
<div class="input-field col l12">
145-
<input placeholder="Enter text to test" id="input" type="text" class="validate">
147+
<input placeholder="Enter text to test" id="input" type="text" class="validate" ng-model="input">
146148
<label for="input">String Input</label>
147149
</div>
148150
<div class="input-field col l12">
149-
<select>
151+
<select ng-model="selected">
150152
<option value="" disabled selected>Choose your option</option>
151-
<option value="1">Option 1</option>
152-
<option value="2">Option 2</option>
153-
<option value="3">Option 3</option>
153+
<option ng-repeat="option in options" ng-model="selected" value="{{option}}">{{option}}</option>
154154
</select>
155155
<label>Methods</label>
156156
</div>
157157
</div>
158158
<div class="row">
159-
<button class="waves-effect waves-light green btn">Get Result</button>
159+
<button class="waves-effect waves-light green btn" ng-click="getResult(input, selected)">Get Result</button>
160160
</div>
161161
</div>
162162
</div>

public/js/app.js

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
angular.module('StringExtension', [])
2+
.controller('StringExtensionController', ['$scope', '$timeout',
3+
($scope, $timeout) => {
4+
$scope.options = [
5+
'hasVowels',
6+
'toUpper',
7+
'toLower',
8+
'ucFirst',
9+
'isQuestion',
10+
'words',
11+
'wordCount',
12+
'toCurrency',
13+
'fromCurrency',
14+
'inverseCase',
15+
'alternatingCase',
16+
'getMiddle',
17+
'numberWords',
18+
'isDigit',
19+
'doubleCheck'
20+
];
21+
22+
$scope.result = '';
23+
$scope.error = '';
24+
$scope.getResult = (input, selected) => {
25+
if (input === '' || input === undefined) {
26+
$scope.result = '';
27+
$scope.error = 'You did not enter any text';
28+
return;
29+
} else if (selected === undefined) {
30+
$scope.result = '';
31+
$scope.error = 'You did not select a method';
32+
return;
33+
}
34+
$scope.error = '';
35+
$scope.result = input[selected]();
36+
return;
37+
}
38+
}])

src/string.js

Lines changed: 46 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,70 +1,84 @@
11
const stringClassExtensions = {
22

33
/**
4-
* Returns true if the string contains vowels.
5-
* @returns {Boolean}
4+
* hasVowels
5+
* Returns true if the string contains vowels or false if it does not
6+
* @returns {Boolean} true or false
67
*/
78
hasVowels() {
89
const vowelRegex = /[aeiou]/i;
910
return vowelRegex.test(this);
1011
},
1112

1213
/**
13-
* Returns the String in question but with all characters in upper cases as applicable.
14-
* @returns {String}
14+
* toUpper
15+
* Returns the String in question but with
16+
* all characters in upper cases as applicable
17+
* @returns {String} string with all characters in upper case
1518
*/
1619
toUpper() {
1720
return this.replace(/[a-z]/g, match => String
1821
.fromCharCode(match.charCodeAt(0) - 32));
1922
},
2023

2124
/**
22-
* Returns the String in question but with all characters in their lower cases as applicable.
23-
* @returns {String}
25+
* toLower
26+
* Returns the string in question but with all
27+
* characters in their lower cases as applicable
28+
* @returns {String} string with all characters to lower case
2429
*/
2530
toLower() {
2631
return this.replace(/[A-Z]/g, match => String
2732
.fromCharCode(match.charCodeAt(0) + 32));
2833
},
2934

3035
/**
31-
* Returns the String in question but changes the First Character to an Upper case.
32-
* @returns {String}
36+
* ucFirst
37+
* Returns the string in question but changes the first character
38+
* to an Upper case.
39+
* @returns {String} string with capitalized first letter
3340
*/
3441
ucFirst() {
3542
return this.replace(this[0], this[0].toUpper());
3643
},
3744

3845
/**
46+
* isQuestion
3947
* Returns true if the string is a question (ending with a question mark)
40-
* @returns {Boolean}
48+
* @returns {Boolean} true or false
4149
*/
4250
isQuestion() {
4351
const regexType = /\?$/g;
4452
return regexType.test(this);
4553
},
4654

4755
/**
48-
* Returns a list of the words in the string, as an Array.
49-
* @returns {Array}
56+
* words
57+
* Returns a list of the words in the string, as an Array
58+
* @returns {Array} array of words in the string
5059
*/
5160
words() {
5261
return this.replace(/[^a-z0-9A-Z\s]/g, '').split(/\s+/);
5362
},
5463

5564
/**
65+
* wordCount
5666
* Returns the number of words in the string
57-
* @returns {Number}
67+
* @returns {Number} number of words in the string
5868
*/
5969
wordCount() {
6070
return this.words().length;
6171
},
6272

6373
/**
74+
* toCurrency
6475
* Returns a currency representation of the String
65-
* @returns {String}
76+
* @returns {String} string of numbers
6677
*/
6778
toCurrency() {
79+
if (!Number(this)) {
80+
return 'This is not a Number';
81+
}
6882
let [number, decimal] = this.split(/\./g);
6983
if (decimal === undefined) {
7084
decimal = '00';
@@ -76,7 +90,9 @@ const stringClassExtensions = {
7690
},
7791

7892
/**
93+
* fromCurrency
7994
* Returns a number representation of the Currency String
95+
* @returns {String} string of numbers
8096
*/
8197
fromCurrency() {
8298
let [number, decimal] = this.split(/\./g);
@@ -90,26 +106,29 @@ const stringClassExtensions = {
90106
},
91107

92108
/**
109+
* inverseCase
93110
* Returns each letter in the string as an inverse of its current case
94-
* @returns {String}
111+
* @returns {String} inverted form of the string
95112
*/
96113
inverseCase() {
97114
return this.replace(/\w/g, character => (/[a-z]/
98115
.test(character) ? character.toUpper() : character.toLower()));
99116
},
100117

101118
/**
119+
* alternatingCase
102120
* Returns the letters in alternating cases. It must start with a lower case
103-
* @returns {String}
121+
* @returns {String} string in alternating cases starting with lower case
104122
*/
105123
alternatingCase() {
106124
return this.replace(/\w/g, (match, count) =>
107125
(count % 2 === 0 ? match.toLower() : match.toUpper()));
108126
},
109127

110128
/**
129+
* getMiddle
111130
* Returns the character(s) in the middle of the string
112-
* @returns {String}
131+
* @returns {String} character(s) in the middle of the string
113132
*/
114133
getMiddle() {
115134
const middlePosition = this.length / 2;
@@ -118,26 +137,33 @@ const stringClassExtensions = {
118137
},
119138

120139
/**
121-
* Returns true if a string contains double characters(including whitespace character)
122-
* @return {Boolean}
140+
* doubleCheck
141+
* Returns true if a string contains double characters
142+
* (including whitespace character)
143+
* @return {Boolean} true or false
123144
*/
124145
doubleCheck() {
125146
return /(.)\1{1}/.test(this);
126147
},
127148

128149
/**
150+
* isDigit
129151
* Test if string is single digit
130-
* @return {Boolean}
152+
* @return {Boolean} true or false
131153
*/
132154
isDigit() {
133155
return /^\d{1}$/g.test(this);
134156
},
135157

136158
/**
159+
* numberWords
137160
* Returns the numbers in words e.g 325 should return three two five.
138-
* @returns {String}
161+
* @returns {String} string form of numbers
139162
*/
140163
numberWords() {
164+
if (!Number(this)) {
165+
return 'This is not a Number';
166+
}
141167
const digitWordsMap = {
142168
0: 'zero',
143169
1: 'one',

0 commit comments

Comments
 (0)