Skip to content

Commit

Permalink
AWS Endpoint connected.
Browse files Browse the repository at this point in the history
Main details extracted and exposed.
The options should be mapped accordingly, So they could be displayed and selected.
  • Loading branch information
Royedc4 committed Mar 8, 2017
1 parent 31fae13 commit b3149d8
Show file tree
Hide file tree
Showing 3 changed files with 60 additions and 108 deletions.
4 changes: 2 additions & 2 deletions bower.json
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,8 @@
"iron-image": "PolymerElements/iron-image#^1.2.5",
"paper-button": "PolymerElements/paper-button#^1.0.14",
"vaadin-combo-box": "vaadin/vaadin-combo-box#^1.3.2",
"jsSHA": "jssha#^2.2.0",
"iron-ajax": "PolymerElements/iron-ajax#^1.4.3"
"iron-ajax": "PolymerElements/iron-ajax#^1.4.3",
"paper-spinner": "PolymerElements/paper-spinner#^1.2.1"
},
"devDependencies": {
"iron-component-page": "PolymerElements/iron-component-page#^1.0.0",
Expand Down
18 changes: 10 additions & 8 deletions stitch-order-form.html
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@
<link rel="import" href="bower_components/paper-styles/shadow.html">
<link rel="import" href="bower_components/paper-input/paper-input.html">
<link rel="import" href="bower_components/iron-image/iron-image.html">
<link rel="import" href="bower_components/paper-spinner/paper-spinner.html">
<link rel="import" href="bower_components/paper-button/paper-button.html">
<link rel="import" href="bower_components/vaadin-combo-box/vaadin-combo-box.html">
<link rel="import" href="font-styles.html">
Expand Down Expand Up @@ -56,11 +57,13 @@

.left iron-image {
display: block;
width: 150px;
height: 150px;
width: 160px;
height: 160px;
@apply(--shadow-elevation-4dp);
}

.left .checkPrime {
margin: 15px;
height: 29px;
}

Expand Down Expand Up @@ -112,19 +115,18 @@ <h1>Order Product</h1>
</paper-input>
</header>

<paper-spinner alt="Loading product image" active="[[loadingImage]]"></paper-spinner>

<form is="iron-form" id="form" method="get" content-type="application/json">
<div id="content" class="horizontal">
<div class="left">
<iron-image sizing="contain" preload fade placeholder="./placeholder.jpg"
src="[[productDetails.image]]">
</iron-image>

<iron-image sizing="contain" src="[[productDetails.image]]" preload fade></iron-image>
<img class="checkPrime" hidden$="[[!productDetails.prime]]"
src="./prime.png" alt="the Prime Logo with a checkmark">
</div>

<div class="right">
<h2>[[productDetails.Title]]</h2>
<h2>[[productDetails.title]]</h2>

<h4>Select Options</h4>
<div id="options">
Expand Down Expand Up @@ -156,7 +158,7 @@ <h3>Shipping information</h3>

<div id="invoiceResume" class="section">
<h3>Total Cost</h3>
<div>$ [[productDetails.cost]] + shipping</div>
<div>[[productDetails.cost]] + shipping</div>
<p>(Note: shipping is calculated when purchase is made)</p>
</div>

Expand Down
146 changes: 48 additions & 98 deletions stitch-order-request.html
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,9 @@

<dom-module id="stitch-order-request">
<template>
<iron-ajax on-response="_handleResponse"
<iron-ajax url="[[request.endpoint]]" method="POST"
content-type="application/json"
on-response="_handleResponse"
debounce-duration="300">
</iron-ajax>
</template>
Expand All @@ -21,7 +23,7 @@
*/

/**
* Fired when a response is received.
* Fired when a response is received and parsed.
*
* @event order-response
*/
Expand All @@ -33,24 +35,13 @@
*/

properties: {
/**
* The Amazon Access Key Id.
*/
accessKeyID: String,
/**
* The Amazon Associate Tag.
*/
associateTag: String,
/**
* The Amazon Secret Access Key.
* Required
*/
secretAccessKey: String,

/**
* The URL target of the request.
*/
productUrl: String,
productUrl: {
type: String,
observer: '_setRequestParams'
},

/**
* productUrl's response.
Expand All @@ -65,108 +56,67 @@
*/
productDetails: {
type: Object,
notify: true
notify: true,
value: {}
}
},

observers: [
'_setRequestParams(productUrl, accessKeyID, associateTag, secretAccessKey)'
],
ready: function(){
this.request = (function(){
var endpoint = 'https://kc5nsidmrk.execute-api.us-west-2.amazonaws.com/production/item/lookup';

attached: function(){
this.secretAccessKey = 'qSgTh1+jiDkga1Tt/ql8EcnS/ze6gHP6W+oqHlQn';
this.associateTag = 'buttonjoy-20';
this.accessKeyID = 'AKIAIO5T5P757JAH47QA';
var body = {
itemId: undefined, //Required, extracted from amazon product URL
ResponseGroup: 'Images,ItemAttributes,OfferListings,Offers'
};

return {
body: function(itemId){
var request = JSON.parse(JSON.stringify(body));
request.itemId = itemId;

return request;
},
get endpoint(){
return endpoint;
}
};
})();
},

_setRequestParams: function(productUrl, accessKeyID, associateTag, secretAccessKey){
_setRequestParams: function(productUrl){
this.debounce('requesting-product', function(){
if (productUrl.length > 23 && accessKeyID && associateTag && secretAccessKey) {
if (productUrl.length > 23) {
var ajax = this.$$('iron-ajax');
var itemID = this._getItemIdFromURL(productUrl);
var query = _service.paramsAsQuery(itemID, accessKeyID, associateTag);
var url = this._signedUrl(_service.url(), query, secretAccessKey);

ajax.set('url', url);
var request = ajax.generateRequest();
this.fire('order-request', {url: url, itemId: itemID});
ajax.set('body', this.request.body(itemID));
ajax.generateRequest();

this.fire('order-request', {itemId: itemID});
}
}, 300);
},

_handleResponse: function(e){
var response = e.detail.response;
console.log(response);
this.fire('order-response', response);
var response = e.detail.response[0];
var product = {
id: response.ASIN[0],
title: response.ItemAttributes[0].Title[0],
image: response.MediumImage[0].URL[0],
cost: response.ItemAttributes[0].ListPrice[0].FormattedPrice[0],
prime: !!Number(response.Offers[0].Offer[0].OfferListing[0].IsEligibleForPrime[0])
};

this.set('productDetails', product);
this.fire('order-response', product);
},

_getItemIdFromURL: function(url){
var regex = /\/dp\/(\w+)\//;
var regex = /\/dp\/(\w+)\/?/;
return regex.exec(url)[1];
},
_signString: function(stringToSignParam, secret){
var shaObj = new jsSHA('SHA-256', 'TEXT');
shaObj.setHMACKey(secret, 'TEXT');
shaObj.update(stringToSignParam);
var signature = shaObj.getHMAC('B64');
return encodeURIComponent(signature);
},
_signedUrl: function(url, canonicalizedQueryString, secret){
var parser = document.createElement('a');
parser.href = url;
var hostname = parser.hostname;
var pathname = parser.pathname;
var stringToSign = ['GET', hostname, pathname, canonicalizedQueryString].join('\n');

return url + '?' + [canonicalizedQueryString, 'Signature=' + this._signString(stringToSign, secret)].join('&');
}
});

var _service = (function(){
var awsUrl = 'http://webservices.amazon.com/onca/xml';

var params = {
Service: 'AWSECommerceService',
Operation: 'ItemLookup',
IdType: 'ASIN',
ResponseGroup: ['Images', 'ItemAttributes', 'Offers']
};

return {
params: function(itemID, accessKeyID, associateTag){
var requestParams = JSON.parse(JSON.stringify(params));
requestParams.ItemId = itemID;
requestParams.AWSAccessKeyId = accessKeyID;
requestParams.AssociateTag = associateTag;

return requestParams;
},
query: function(params, timestampParam){
var query = [];
for (var param in params) {
if (params.hasOwnProperty(param)) {
query.push(param + '=' + params[param]);
}
}

var tiemstamp = timestampParam || new Date().toISOString();
query = query.join('&').replace(/,/g, '%2C').split('&');
query.push('Timestamp=' + encodeURIComponent(tiemstamp));

return query.sort().join('&');
},
paramsAsQuery: function(itemID, accessKeyID, associateTag, timestampParam){
return this.query(this.params(itemID, accessKeyID, associateTag, timestampParam));
},
url: function(query){
if (query instanceof Object) {
query = this.query(query);
}

return awsUrl + (query ? '?' + query : '');
}
}
})();
})();
</script>
</dom-module>

0 comments on commit b3149d8

Please sign in to comment.