[prev in list] [next in list] [prev in thread] [next in thread] 

List:       kde-commits
Subject:    [bodega-webapp-client/emberjs] /: Load the participant information properly.
From:       Antonis Tsiapaliokas <kok3rs () gmail ! com>
Date:       2013-12-23 19:22:11
Message-ID: E1VvB4t-0004xT-Ax () scm ! kde ! org
[Download RAW message or body]

Git commit 39c917ebe32d42a17a0caf0100994aebdd4a2195 by Antonis Tsiapaliokas.
Committed on 23/12/2013 at 19:18.
Pushed by tsiapaliokas into branch 'emberjs'.

Load the participant information properly.
Also we now able to change our participant information.

Also fix an issue with json/* route. 'POST' requests are now working.

M  +1    -1    lib/emberhelper.js
M  +28   -1    lib/utils.js
M  +2    -1    package.json
M  +1    -0    public/assets/app.js
M  +60   -29   public/assets/participant.js
M  +6    -0    public/assets/routes.js
A  +80   -0    public/assets/templates/participantinfo.hbs
M  +26   -21   routes.js

http://commits.kde.org/bodega-webapp-client/39c917ebe32d42a17a0caf0100994aebdd4a2195

diff --git a/lib/emberhelper.js b/lib/emberhelper.js
index 7ed2bfc..5e2a231 100644
--- a/lib/emberhelper.js
+++ b/lib/emberhelper.js
@@ -18,7 +18,7 @@
 var fs = require('fs');
 var path = require('path');
 
-var templateFiles = ['mainpage.hbs', 'channel.hbs', 'participant.hbs', \
'participanthistory.hbs', 'participantpaymentmethod.hbs']; +var templateFiles = \
['mainpage.hbs', 'channel.hbs', 'participant.hbs', 'participanthistory.hbs', \
'participantpaymentmethod.hbs', 'participantinfo.hbs'];  var jsFiles = ['app.js', \
'channels.js', 'participant.js', 'routes.js', 'radioButton.js'];  
 var EmberHelper = (function() {
diff --git a/lib/utils.js b/lib/utils.js
index 00cac40..9247e52 100644
--- a/lib/utils.js
+++ b/lib/utils.js
@@ -19,7 +19,7 @@
 var querystring = require('querystring');
 var url = require('url');
 
-var options = function(req, pathname, query, auth, useDomainInsteadOfIp) {
+var options = function(req, pathname, query, auth) {
 
     var p = app.config.server.api + pathname;
 
@@ -72,5 +72,32 @@ var findImage = function(imageCandidate, size, id) {
     return path;
 };
 
+var makeOptions = function(url, data, req, isPostMethod) {
+
+    var options = {
+      'uri': url,
+      'json': true
+    };
+
+    if (isPostMethod) {
+        options.form = data;
+        options.method = 'POST';
+    } else {
+        options.qs = data;
+        options.method = 'GET';
+    }
+
+    if (req.session && req.session.servercookie) {
+        options.headers = {
+            'Cookie': req.session.servercookie
+        };
+    } else {
+        console.log('There is no cookie. Authentication cannot be completed');
+    }
+
+    return options;
+};
+
 module.exports.options = options;
 module.exports.findImage = findImage;
+module.exports.makeOptions = makeOptions;
diff --git a/package.json b/package.json
index 4479443..4e0ef43 100644
--- a/package.json
+++ b/package.json
@@ -10,7 +10,8 @@
         "jade": "*",
         "connect-redis": "latest",
         "sockjs": "*",
-        "validator": "*"
+        "validator": "*",
+        "request": "latest"
     },
     "devDependencies": {
         "jshint": "*"
diff --git a/public/assets/app.js b/public/assets/app.js
index 61bb0fd..0f5d06c 100755
--- a/public/assets/app.js
+++ b/public/assets/app.js
@@ -9,5 +9,6 @@ App.Router.map(function() {
     this.resource('participant', { path: '/participant' });
     this.resource('participantPaymentMethod', { path: \
                '/participant/paymentMethod'});
     this.resource('participantHistory', { path: '/participant/history' });
+    this.resource('participantInfo', { path: '/participant/info' });
 });
 
diff --git a/public/assets/participant.js b/public/assets/participant.js
index 8f0549c..df38932 100755
--- a/public/assets/participant.js
+++ b/public/assets/participant.js
@@ -1,4 +1,28 @@
 App.Participant = Ember.Object.extend({
+    loadHistory: function() {
+        return Ember.Deferred.promise(function (p) {
+            p.resolve($.ajax({ url: "http://localhost:3001/json/participant/history" \
}).then(function(response) { +                return response.history;
+            }));
+        });
+    }
+});
+
+App.Participant.reopenClass({
+    purchaseAsset: function(assetId) {
+        if (assetId > 0) {
+            return Ember.Deferred.promise(function (p) {
+                p.resolve( $.ajax({url: 'http://localhost:3001/json/purchase/' + \
assetId }).then(function(response) { +                    return response;
+                }));
+            });
+        } else {
+            console.log('assetId' + assetId + 'doesn\'t exists!');
+        }
+    }
+});
+
+App.ParticipantInfo = Ember.Object.extend({
     loadInfo: function() {
         var _this = this;
         return Ember.Deferred.promise(function (p) {
@@ -6,48 +30,38 @@ App.Participant = Ember.Object.extend({
                 var info = {
                     firstName: response.firstName,
                     lastName: response.lastName,
-                    middleName: response.middleName,
+                    middleNames: response.middleNames,
                     email: response.email
                 };
                 return info;
             }));
         });
-    },
-    loadHistory: function() {
-        return Ember.Deferred.promise(function (p) {
-            p.resolve($.ajax({ url: "http://localhost:3001/json/participant/history" \
                }).then(function(response) {
-                return response.history;
-            }));
-        });
     }
 });
 
-App.Participant.reopenClass({
-    updateInfo: function(firstName, lastName, email, middleName) {
-        var query = '';
-        query = firstName ? (query + 'firstName=' + firstName) + '&' : query;
-        query = lastName ? (query + 'lastName=' + lastName) + '&' : query;
-        query = email ? (query + 'email=' + email) + '&' : query;
-        query = middleName ? (query + 'middleName=' + middleName) + '&' : query;
-        $.ajax({ url: 'http://localhost:3001/json/participant/changeAccountDetails?' \
+query }); +App.ParticipantInfo.reopenClass({
+    updateInfo: function(firstName, lastName, email, middleNames) {
+
+        return Ember.Deferred.promise(function (p) {
+            var query = {
+                'firstName': firstName,
+                'lastName': lastName,
+                'email': email,
+                'middleNames': middleNames
+            };
+            p.resolve($.ajax({
+                url: "http://localhost:3001/json/participant/changeAccountDetails" ,
+                type:"POST",
+                dataType: "json",
+                data: query
+            }));
+        });
     },
 
     updatePassword: function(newPassword) {
         if (newPassword) {
             $.ajax({ url: \
'http://localhost:3001/json/participant/changePassword?newPassword=' + newPassword \
});  }
-    },
-
-    purchaseAsset: function(assetId) {
-        if (assetId > 0) {
-            return Ember.Deferred.promise(function (p) {
-                p.resolve( $.ajax({url: 'http://localhost:3001/json/purchase/' + \
                assetId }).then(function(response) {
-                    return response;
-                }));
-            });
-        } else {
-            console.log('assetId' + assetId + 'doesn\'t exists!');
-        }
     }
 });
 
@@ -81,7 +95,7 @@ App.ParticipantPaymentMethod.reopenClass({
             });
         }
     }
-})
+});
 
 App.CreditCardComponent = Ember.Component.extend({
     classNames: ['form-horizontal'],
@@ -162,4 +176,21 @@ App.CreditCardComponent = Ember.Component.extend({
     }
 });
 
+App.AccountInfoComponent = Ember.Component.extend({
+    classNames: ['form-horizontal'],
+    tagName: 'form',
+    updateInfoRequested: false,
 
+    actions: {
+        updateAccountInfo: function(accountData) {
+            var _this = this;
+            _this.set('updateInfoRequested', true);
+
+            App.ParticipantInfo.updateInfo(accountData.firstName, \
accountData.lastName, accountData.email, \
accountData.middleNames).then(function(response) { +                if \
(response.error && response.error.type) { +                    \
_this.set('updateInfoError', response.error.type); +                }
+            });
+        }
+    }
+});
diff --git a/public/assets/routes.js b/public/assets/routes.js
index f8b3ef2..25eb119 100755
--- a/public/assets/routes.js
+++ b/public/assets/routes.js
@@ -20,6 +20,12 @@ App.ParticipantRoute = Ember.Route.extend({
     }
 });
 
+App.ParticipantInfoRoute = Ember.Route.extend({
+    model: function(params) {
+        return App.ParticipantInfo.create().loadInfo();
+    }
+});
+
 App.ParticipantPaymentMethodRoute = Ember.Route.extend({
     model: function(params) {
         return App.ParticipantPaymentMethod.create().loadPaymentMethod();
diff --git a/public/assets/templates/participantinfo.hbs \
b/public/assets/templates/participantinfo.hbs new file mode 100644
index 0000000..11d406d
--- /dev/null
+++ b/public/assets/templates/participantinfo.hbs
@@ -0,0 +1,80 @@
+<script type="text/x-handlebars" data-template-name="participantInfo">
+  <p>{{firstName}}</p>
+  <p>{{lastName}}</p>
+  <p>{{email}}</p>
+
+  {{#if middleNames}}
+    <p>aaaa{{middleNames}}</p>
+  {{/if}}
+  {{model}}
+  {{account-info accountData=model}}
+  
+</script>
+
+
+<script type="text/x-handlebars" data-template-name="components/account-info">
+
+  <fieldset>
+
+  <!-- Update information progress -->
+  {{#if updateInfoRequested}}
+    {{#if updateInfoError}}
+        <div class="alert alert-error">
+          <button type="button" class="close" data-dismiss="alert">×</button>
+          <h3>An error has occur {{updateInfoError}}</h3>
+        </div>
+    {{else}}
+        <div class="alert alert-success">
+          <button type="button" class="close" data-dismiss="alert">×</button>
+          <h3>Your account information has been updated successfully</h3>
+        </div>
+    {{/if}}
+  {{/if}}
+
+  <!-- Text input-->
+  <div class="control-group">
+    <label class="control-label" for="firstName">Name</label>
+    <div class="controls">
+      {{input id="firstName" name="firstName" type="text" placeholder="" \
value=accountData.firstName class="input-xlarge" required=""}} +    </div>
+  </div>
+
+  <!-- Text input-->
+  <div class="control-group">
+    <label class="control-label" for="lastName">Last Name</label>
+    <div class="controls">
+      {{input id="lastName" name="lastName" type="text" placeholder="" \
value=accountData.lastName class="input-xlarge" required=""}} +    </div>
+  </div>
+
+  <!-- Text input-->
+  {{#if accountData.middleNames}}
+    <div class="control-group">
+      <label class="control-label" for="middleNames">Middle Names</label>
+      <div class="controls">
+        {{input id="middleNames" name="middleNames" type="text" placeholder="" \
value=accountData.middleNames class="input-xlarge" required=""}} +      </div>
+    </div>
+  {{/if}}
+  
+  <!-- Text input-->
+  <div class="control-group">
+    <label class="control-label" for="email">Email</label>
+    <div class="controls">
+      {{input id="email" name="email" type="text" placeholder="" \
value=accountData.email class="input-xlarge" required=""}} +    </div>
+  </div>
+
+  <!-- Button -->
+  <div class="control-group">
+    <label class="control-label" for="updateAccount"></label>
+    <div class="controls">
+      <button id="updateAccount" {{action 'updateAccountInfo'accountData}} \
name="updateAccount" class="btn btn-primary">Update Account</button> +    </div>
+  </div>
+
+  </fieldset>
+
+
+
+</script>
diff --git a/routes.js b/routes.js
index 563f614..57d3840 100644
--- a/routes.js
+++ b/routes.js
@@ -20,6 +20,7 @@ var utils = require('./lib/utils');
 
 var express = require('express');
 var http = require('http');
+var request = require('request');
 
 function isAuthorized(req, res, next)
 {
@@ -31,28 +32,32 @@ function isAuthorized(req, res, next)
     }
 }
 
-app.all('/json/*', function(request, response) {
-    var options = utils.options(request, \
                request.url.substring(String("/json/").length), null, true);
-    options.method = request.method;
-
-    //console.log(JSON.stringify(request.headers.cookie));
-    //options.headers['Content-Type'] = request.headers['content-type'];
-    if (request.headers['content-length']) {
-        options.headers['content-length'] = request.headers['content-length']
-    }
-
-    var proxyRequest = http.request(options);
-
-    proxyRequest.addListener('response', function (proxy_response) {
-        response.writeHead(proxy_response.statusCode, proxy_response.headers);
-        proxy_response.pipe(response);
+app.all('/json/*', function(req, res) {
+    var relativeUrl = req.url.substring(String("/json/").length);
+    var serverUrl = 'http://' + app.config.server.hostname + ':' + app \
.config.server.port + app.config.server.api + relativeUrl; +
+    var isPostMethod = req.method === 'POST';
+    var data = isPostMethod ? req.body : req.query;
+
+    request(utils.makeOptions(serverUrl, data, req, isPostMethod), function(error, \
response, body) { +        if (!error && response.statusCode == 200) {
+            res.json(body);
+        } else {
+            console.log('there is an error: ' + error);
+            console.log('with statusCode: ' + response.statusCode);
+
+            // In case that the remote request has failed,
+            // bodega-server hasn't provide us an error.
+            // so let's provide a custom one.
+            var errorStatus = {
+                'error': {
+                    'type': error
+                }
+            };
+
+            res.json(errorStatus);
+        }
     });
-
-    proxyRequest.on('error', function(e) {
-        console.log('problem with request: ' + e.message);
-    });
-
-    request.pipe(proxyRequest);
 });
 
 app.get('/', express.bodyParser(), function(req, res) {


[prev in list] [next in list] [prev in thread] [next in thread] 

Configure | About | News | Add a list | Sponsored by KoreLogic