Skip to content

lab-regan - day2 #22

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 4 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions lab-regan/.babelrc
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
{
"presets": ["es2015"]
}
19 changes: 19 additions & 0 deletions lab-regan/.eslintrc
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
{
"rules": {
"no-console": "off",
"indent": [ "error", 2 ],
"quotes": [ "error", "single" ],
"semi": ["error", "always"],
"linebreak-style": [ "error", "unix" ]
},
"env": {
"es6": true,
"node": true,
},
"ecmaFeatures": {
"modules": true,
"experimentalObjectRestSpread": true,
"impliedStrict": true
},
"extends": "eslint:recommended"
}
132 changes: 132 additions & 0 deletions lab-regan/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,132 @@

# Created by https://www.gitignore.io/api/osx,node,linux,windows

### Linux ###
*~

# temporary files which can be created if a process still has a handle open of a deleted file
.fuse_hidden*

# KDE directory preferences
.directory

# Linux trash folder which might appear on any partition or disk
.Trash-*

# .nfs files are created when an open file is removed but is still being accessed
.nfs*

###Local Files###
build

### Node ###
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*

# Runtime data
pids
*.pid
*.seed
*.pid.lock

# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov

# Coverage directory used by tools like istanbul
coverage

# nyc test coverage
.nyc_output

# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
.grunt

# Bower dependency directory (https://bower.io/)
bower_components

# node-waf configuration
.lock-wscript

# Compiled binary addons (http://nodejs.org/api/addons.html)
build/Release

# Dependency directories
node_modules/
jspm_packages/

# Typescript v1 declaration files
typings/

# Optional npm cache directory
.npm

# Optional eslint cache
.eslintcache

# Optional REPL history
.node_repl_history

# Output of 'npm pack'
*.tgz

# Yarn Integrity file
.yarn-integrity

# dotenv environment variables file



### OSX ###
*.DS_Store
.AppleDouble
.LSOverride

# Icon must end with two \r
Icon


# Thumbnails
._*

# Files that might appear in the root of a volume
.DocumentRevisions-V100
.fseventsd
.Spotlight-V100
.TemporaryItems
.Trashes
.VolumeIcon.icns
.com.apple.timemachine.donotpresent

# Directories potentially created on remote AFP share
.AppleDB
.AppleDesktop
Network Trash Folder
Temporary Items
.apdisk

### Windows ###
# Windows thumbnail cache files
Thumbs.db
ehthumbs.db
ehthumbs_vista.db

# Folder config file
Desktop.ini

# Recycle Bin used on file shares
$RECYCLE.BIN/

# Windows Installer files
*.cab
*.msi
*.msm
*.msp

# Windows shortcuts
*.lnk

# End of https://www.gitignore.io/api/osx,node,linux,windows
63 changes: 63 additions & 0 deletions lab-regan/app/entry.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,63 @@
'use strict';

require('./scss/reset.scss');
require('./scss/main.scss');

const angular = require('angular');
const cowsay = require('cowsay-browser');

const cowsayLab = angular.module('cowsayLab', []);

cowsayLab.controller('CowsayController', ['$log', CowsayController]);

function CowsayController($log){
$log.debug('CowsayController');

this.title = 'Creature Creeps! Make Em Speak!';
this.history = [];

cowsay.list((err, cowfiles) => {
this.cowfiles = cowfiles;
this.current = this.cowfiles[0];
});

this.update = function(input){
$log.debug('cowsayCtrl.update');
return cowsay.say({ text: input || 'Say wut?', f: this.current });
}

this.speak = function(input){
$log.debug('cowsayCtrl.speak');
// return cowsay.say({text: input || 'I am just a cow!'});
this.spoken = this.update(input);
this.history.push(this.spoken);
};

this.undo = function(){
$log.debug('cowsayCtrl.undo');
this.history.pop();
this.spoken = this.history.pop() || '';
};
};

cowsayLab.controller('NavController', ['$log', NavController]);

function NavController($log){
$log.debug('NavController');
this.routes = [
{
name: 'home',
url: '/home'
},
{
name: 'about',
url: '/about-us'
},
{
name: 'contact',
url: '/contact-us'
}
];
}

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great job refactoring this Regan!

//regan
76 changes: 76 additions & 0 deletions lab-regan/app/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,76 @@
<!DOCTYPE html>
<html ng-app='cowsayLab'>
<head>
<title>Congrats! You've Arrived in Cowtropolis</title>
<link href="https://fonts.googleapis.com/css?family=Nunito" rel="stylesheet">
</head>
<body>
<header>
<nav ng-controller='NavController as navCtrl' class='navMenu'>
<div class='navLeft'>
<!-- <div class='monsterIcon'></div> -->
<div class="monster">
<img src="../assets/cute-monster.svg" alt="">
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice image!

</div>
<div>Creature Creeps!</div>
</div>
<div class='navRight'>
<ul>
<li ng-repeat='route in navCtrl.routes'>
<a href="{{ route.url }}">{{ route.name }}</a>
</li>
</ul>
</div>
</nav>
</header>
<main>

<section class='container' ng-controller='CowsayController as cowsayCtrl'
ng-init='cowsayCtrl.current = "squirrel"'>


<div class='topLeftContent'>
<h2>{{ cowsayCtrl.title }}</h2>
<pre class='cow'>
{{ cowsayCtrl.update(cowsayCtrl.text) }}
</pre>
</div>


<form
ng-submit='cowsayCtrl.speak(cowsayCtrl.text)'
name='cowsayForm'
novalidate>

<div class='upperForm'>
<label for="select">Choose Your Creature</label>
<select ng-model='cowsayCtrl.current'>
<option ng-repeat='cowfile in cowsayCtrl.cowfiles' value='{{ cowfile }}'>
{{cowfile}}
</option>
</select>
<label for="textbox">Give the creep some words</label>
<input type="text" ng-model='cowsayCtrl.text' required>
<label for="speak">Let the creature creep!</label>
<button type='submit'>CREEP!!!</button>
</div>


<div ng-show='cowsayCtrl.spoken' class='history'>
<div class='bottomLeftContent'>
<pre class='cow'>
{{ cowsayCtrl.spoken }}
</pre>
</div>
<div class='undo'>
<button class='undoButton' type='button' ng-click='cowsayCtrl.undo()'>Undo!</button>
</div>
</div>
</form>
</section>
</main>
<footer><div>end</div>
<p>Icons made by <a href="http://www.freepik.com" title="Freepik">Freepik</a> from <a href="http://www.flaticon.com" title="Flaticon">www.flaticon.com</a> is licensed by <a href="http://creativecommons.org/licenses/by/3.0/" title="Creative Commons BY 3.0" target="_blank">CC 3.0 BY</a></p>
</footer>
</body>
</html>
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great job setting this up. It all looks good. You're layout looks great and it all works the way it is supposed to.

Loading