Skip to content

Added uml gif and changed the controller to use Object.defineProperty fo... #1

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.

Sign up for GitHub

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
mschreibernaoual wants to merge 3 commits into
base: master
Choose a base branch
from
Open

Added uml gif and changed the controller to use Object.defineProperty fo... #1

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
6c0a60f
Added uml gif and changed the controller to use Object.defineProperty…
mschreibernaoual Dec 13, 2014
5bdcb25
Removed UML From Chaining Pattern. Updated Visitor Pattern
mschreibernaoual Dec 14, 2014
cdc7f1a
Updated Gif's Removed png
mschreibernaoual Dec 14, 2014
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
93 changes: 47 additions & 46 deletions chaining/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,49 +1,50 @@
<!DOCTYPE html>
<html lang="en" ng-app="patterns">
<head>
<title>Project Template</title>

<meta name="viewport" content="width=device-width, initial-scale=1">

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap-theme.min.css">
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>



<script src="js/app.js"></script>

<script src="js/services.js"></script>
<script src="js/directives.js"></script>
<script src="js/controllers.js"></script>

</head>
<body class="container">
<div ng-controller="mainCtrl as vm">
<h1>{{vm.title}}</h1>
<p>
The chaining pattern is an extremely useful way to perform continuous method calls on an object in JavaScript.
</p>

<p>
This pattern is widely used in many different libraries and frameworks for JavaScript.
</p>

<button class="btn btn-default" ng-click="vm.process()">
<span class="fa fa-gears"></span> Process
</button>
<br/>
<br/>
<p>Starting with a value of <b>5</b>, Chained methods: <b>add(</b>2<b>)</b>, <b>multiply(</b>5<b>)</b>, <b>subtract(</b>7<b>)</b> -> Result should be <b>28</b></p>

<hr/>

<h3>Result</h3>
<p>{{vm.result}}</p>
</div>
</body>
<head>
<title>Project Template</title>

<meta name="viewport" content="width=device-width, initial-scale=1">

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap-theme.min.css">
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>



<script src="js/app.js"></script>

<script src="js/services.js"></script>
<script src="js/directives.js"></script>
<script src="js/controllers.js"></script>

</head>
<body class="container">
<div ng-controller="mainCtrl as vm">
<h1>{{vm.title}}</h1>
<p>
The chaining pattern is an extremely useful way to perform continuous method calls on an object in JavaScript.
</p>

<p>
This pattern is widely used in many different libraries and frameworks for JavaScript.
</p>


<button class="btn btn-default" ng-click="vm.process()">
<span class="fa fa-gears"></span> Process
</button>
<br/>
<br/>
<p>Starting with a value of <b>5</b>, Chained methods: <b>add(</b>2<b>)</b>, <b>multiply(</b>5<b>)</b>, <b>subtract(</b>7<b>)</b> -> Result should be <b>28</b></p>

<hr/>

<h3>Result</h3>
<p>{{vm.result}}</p>
</div>
</body>
</html>
30 changes: 23 additions & 7 deletions chaining/js/controllers.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,16 +2,32 @@
'use strict';

function Calculator(start){
var total = start || 0;
if (this instanceof Calculator) {
var _total = start || 0;
this.add = function(x) { _total += x; return this;}
this.sub = function(x) { _total -= x; return this;}
this.mul = function(x) { _total *= x; return this;}
this.div = function(x) { _total /= x; return this;}

Object.defineProperty(this, "Total", {get: function () {
return _total;
},
set: function (newValue) {
_total = newValue;

},
enumerable: false,
configurable: true});

this.add = function(x) { total += x; return this;}
this.sub = function(x) { total -= x; return this;}
this.mul = function(x) { total *= x; return this;}
this.div = function(x) { total /= x; return this;}
}
else {
return new Calculator(start);
}

this.get = function() { return total; }
}



var controllerId = "mainCtrl";

angular.module('patterns.controllers').controller(controllerId, ['$scope', mainCtrl]);
Expand All @@ -31,7 +47,7 @@
vm.process = function(){
var calculator = new Calculator(5).add(2).mul(5).sub(7);

vm.result = calculator.get();
vm.result = calculator.Total;
}
}
}());
5 changes: 4 additions & 1 deletion visitor/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,10 @@ <h1>{{vm.title}}</h1>
<p>
With the modularity of the pattern, we're able to run N visitors against our data, giving us a lot of future extensibility for our system.
</p>

<img src="umldiagram.gif" alt="Visitor Uml" >
<p>
The UML Diagram is above
</p>
<button class="btn btn-default" ng-click="vm.doDiscount()">
<span class="fa fa-money"> Discount</span>
</button>
Expand Down
72 changes: 42 additions & 30 deletions visitor/js/controllers.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,51 +2,63 @@
'use strict';

var Product = function(name, price, discount, sale_price){
var self = this;
if (this instanceof Product) {
this.accept = function(visitor){
visitor.visit(this);
};

this.accept = function(visitor){
visitor.visit(self);
};
this.setDiscount = function(dis){
discount = dis;
};

this.getName = function(){
return name;
};

this.getPrice = function(){
return price;
}

this.setDiscount = function(dis){
discount = dis;
};
this.getDiscount = function(){
return discount;
};

this.getDiscount = function(){
return discount;
};
this.getDiscountPercentStr = function(){
if(discount){
return (discount * 100) + "%";
}
}

this.getDiscountPercentStr = function(){
if(discount){
return (discount * 100) + "%";
this.getDiscountAmount = function(){
if(discount){
return (price * this.getDiscount()).toFixed(2);
}
}
}

this.getDiscountAmount = function(){
if(discount){
return (price * self.getDiscount()).toFixed(2);
this.getSalePrice = function(){
if(discount){
return (price * (1 - this.getDiscount())).toFixed(2);
}
}
}
this.getName = function(){
return name;
};

this.getSalePrice = function(){
if(discount){
return (price * (1 - self.getDiscount())).toFixed(2);
this.getPrice = function(){
return price;
}

}
else {
return new Product(name,price,discount, sale_price);
}


}

var Discount = function(){
this.visit = function(prod){
prod.setDiscount(0.10);
if(this instanceof Discount) {
this.visit = function (prod) {
prod.setDiscount(0.10);
}
}
else {
return new Discount();
}

}

var controllerId = "mainCtrl";
Expand Down
Binary file added visitor/umldiagram.gif
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.