Skip to content

Commit 3e98bc9

Browse files
mtwomeymtwomey
committed
Merge branch 'facebook_component' into dev
2 parents 4806c98 + c07ce8b commit 3e98bc9

File tree

7 files changed

+273
-2
lines changed

7 files changed

+273
-2
lines changed

‎bower.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,8 @@
33
"private": "true",
44
"dependencies": {
55
"angular-resource": "1.5.3",
6-
"nouislider-angular": "^2.4.1"
6+
"nouislider-angular": "^2.4.1",
7+
"ng-cordova-oauth": "^0.2.8"
78
},
89
"devDependencies": {
910
"ionic": "driftyco/ionic-bower#1.3.1"

‎package.json‎

Lines changed: 14 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,19 @@
2929
"cordova-plugin-whitelist",
3030
"cordova-plugin-splashscreen",
3131
"cordova-plugin-statusbar",
32-
"ionic-plugin-keyboard"
32+
"ionic-plugin-keyboard",
33+
{
34+
"locator": "https://git-wip-us.apache.org/repos/asf/cordova-plugin-inappbrowser.git",
35+
"id": "cordova-plugin-inappbrowser"
36+
}
37+
],
38+
"cordovaPlatforms": [
39+
"android",
40+
{
41+
"platform": "android",
42+
"version": "",
43+
"locator": "android"
44+
},
45+
"ios"
3346
]
3447
}

‎src/components/facebook/facebook.js‎

Lines changed: 149 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,149 @@
1+
/*
2+
* Copyright (C) 2016 TopCoder Inc., All Rights Reserved.
3+
*/
4+
5+
/**
6+
* Represents the angular route,controller for facebook page
7+
*
8+
* @author TCDEVELOPER
9+
* @version 1.0
10+
*/
11+
12+
(function () {
13+
'use strict';
14+
15+
16+
var app = angular.module('app');
17+
app.requires.push('ngCordovaOauth'); //use ng cordova oauth library for login
18+
19+
20+
angular.module('app')
21+
.config(function ($stateProvider) {
22+
$stateProvider
23+
.state('app.facebook', {
24+
url: '/facebook',
25+
views: {
26+
'menuContent': {
27+
templateUrl: 'components/facebook/index.html',
28+
controller: 'FacebookCtrl as fb'
29+
}
30+
}
31+
})
32+
.state('app.facebooktimeline', {
33+
url: '/facebooktimeline',
34+
views: {
35+
'menuContent': {
36+
templateUrl: 'components/facebook/timeline.html',
37+
controller: 'FacebookPostCtrl'
38+
}
39+
}
40+
})
41+
})
42+
43+
44+
45+
46+
//facebook config
47+
.constant('FB_CONFIG', {
48+
APP_ID: '888218901283961',
49+
APP_SECRET: '8fc9750c427ea1900c06d9b87246544e',
50+
API_ENDPOINT:'https://graph.facebook.com/v2.6',
51+
DEFAULT_MESSAGE :'I just tried the Topcoder Ionic StarterPack!',
52+
LINK : 'https://github.com/topcoderinc/Topcoder-StarterPack_API',
53+
IMAGE_URL:'https://www.topcoder.com/wp-content/uploads/2014/01/New-Logo-Stacked-Square-158x154.png'
54+
})
55+
56+
57+
//defination of controller
58+
.controller("FacebookCtrl", function ($scope,$state, $http,$window,$timeout,$cordovaOauth,FB_CONFIG) {
59+
60+
/* this controller controls the login flow */
61+
62+
var vm = this;
63+
64+
/*
65+
perform the oauth
66+
*/
67+
vm.login = function() {
68+
$cordovaOauth.facebook(FB_CONFIG.APP_ID, ["email", "public_profile", "user_website", "user_location", "user_relationships","user_posts","user_photos","publish_actions"]).then(function(result) {
69+
$window.localStorage['fb_access_token'] = result.access_token; //store the access token
70+
$scope.showInfo('Login Success');
71+
72+
//change the state
73+
$state.go('app.facebooktimeline');
74+
75+
}, function(error) {
76+
$scope.showError('There was problem in login.')
77+
});
78+
};
79+
80+
//if logged in in start from the timeline page where user can post the data to the timeline
81+
if($window.localStorage['fb_access_token'] && $window.localStorage['fb_access_token']!=''){
82+
$state.go('app.facebooktimeline');
83+
}
84+
85+
})
86+
87+
.controller("FacebookPostCtrl", function ($scope,$state, $http,$window,$ionicModal,FB_CONFIG) {
88+
89+
/*
90+
THIS controller is used in timeline page contains 2 methods one post to facebook feed/timeline & seconfdmentod logs out from the facebook session
91+
*/
92+
93+
$scope.post=FB_CONFIG.DEFAULT_MESSAGE;
94+
console.log(FB_CONFIG.DEFAULT_MESSAGE);
95+
96+
/*
97+
check if we are logged in else go back to page to ask the user to login */
98+
99+
if(!$window.localStorage['fb_access_token'] || $window.localStorage['fb_access_token']==''){
100+
$state.go('app.facebook');
101+
}
102+
103+
104+
/*
105+
Post the message to facebook
106+
*/
107+
$scope.postFeed = function(form) {
108+
109+
if($window.localStorage['fb_access_token'] && $window.localStorage['fb_access_token']!='') {
110+
$scope.showLoading();
111+
112+
//construct the post request
113+
var req = {
114+
method: 'POST',
115+
url: FB_CONFIG.API_ENDPOINT+'/me/feed',
116+
data: {'message':$scope.post,'link':FB_CONFIG.LINK,'picture':FB_CONFIG.IMAGE_URL,'access_token':$window.localStorage['fb_access_token']}
117+
}
118+
119+
$http(req).then(function(result) {
120+
121+
$scope.showInfo('Message Posted Successfully');
122+
123+
}).catch($scope.showError)
124+
.finally(function () {
125+
$scope.hideLoading();
126+
});
127+
} else {
128+
$scope.showError("Oops looks like the sesssion has expired.");
129+
//clean up the token
130+
$scope.reset();
131+
}
132+
};
133+
134+
/*
135+
clean the facebook token & so that the user needs to login again
136+
*/
137+
$scope.reset=function(){
138+
$window.localStorage['fb_access_token']='';
139+
$scope.showInfo('Reset Successfull done');
140+
141+
$state.go('app.facebook');
142+
}
143+
144+
145+
})
146+
147+
148+
149+
})();

‎src/components/facebook/index.html‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<ion-view view-title="Facebook Demo">
2+
3+
<ion-content>
4+
5+
<!-- here show the required buutons -->
6+
<div class="row " style=" margin: 3rem auto;">
7+
<div class="col"> <a class=" button-positive button button-block" ng-click="fb.login()"><i class="icon ion-social-facebook"></i></a> </div>
8+
</div>
9+
10+
11+
</ion-content>
12+
13+
</ion-view>

‎src/components/facebook/menu_4.html‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
<ion-item menu-close href="#/app/facebook">
2+
Facebook
3+
</ion-item>

‎src/components/facebook/style.css‎

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
2+
.ibpBg{
3+
4+
}
5+
6+
.ibp-block {
7+
background:#CCC;
8+
border-radius: 5px;
9+
border-top: 5px solid #ff9800;
10+
margin: 3rem auto;
11+
}
12+
13+
.top-content { padding-top: 10vh; text-align: center; }
14+
.remvoeBP{ padding-bottom:0px;}
15+
.removePM{ margin-top:0px; margin-bottom:0px; padding-top:0px; padding-bottom:0px; }
16+
17+
.ibpBg .button {width:100%;}
18+
19+
20+
.error-container {
21+
margin: 5px 0;
22+
}
23+
24+
.error-container:last-child {
25+
margin: 5px 0 0;
26+
}
27+
28+
.error {
29+
padding: 10px 16px;
30+
font-family: "Arial Black", Gadget, sans-serif;
31+
font-size: 11px;
32+
33+
color: #f14b4b;
34+
vertical-align: middle;
35+
}
36+
37+
.error i {
38+
font-size: 24px;
39+
color: #f14b4b;
40+
vertical-align: middle;
41+
}
42+
43+
.last-error-container > .error {
44+
padding: 10px 16px 0;
45+
}
46+
47+
48+
49+
50+
label.item.has-error {
51+
border-bottom: 1px solid red;
52+
}
53+
54+
.no-errors {
55+
border-bottom: 3px solid green;
56+
}

‎src/components/facebook/timeline.html‎

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
<ion-view title="Facebook Post Share" >
2+
<ion-content>
3+
<div class="row row-center">
4+
<div class="col">
5+
<form name="fbpostForm" novalidate="" ng-submit="postFeed(fbpostForm)" >
6+
<!-- here we add a section to send email part -->
7+
<div class="row responsive-sm padding remvoeBP">
8+
<div class="col ibp-block">
9+
<div class="list removePM ">
10+
<label class="item item-input" >
11+
<textarea name="share_post" ng-model="post" required=""></textarea>
12+
</label>
13+
14+
<div class="error-container" ng-show="fbpostForm.$submitted || (fbpostForm.share_post.$dirty && fbpostForm.share_post.$invalid) || (fbpostForm.share_post.$dirty && fbpostForm.share_post.$error) || (fbpostForm.share_post.$touched && fbpostForm.share_post.$invalid) " >
15+
16+
<div class="error" ng-show="fbpostForm.share_post.$error.required">
17+
<i class="ion-information-circled"></i>
18+
This field is required!
19+
</div>
20+
21+
</div>
22+
</div>
23+
24+
<button class="button ion-unlocked button-block energized-bg" type="submit" > Share </button>
25+
</div>
26+
</div>
27+
</form>
28+
29+
<div class="row padding removePM">
30+
<div class="col"> <a class=" button-positive button button-block cust-btn" ng-click="reset()">Reset </a> </div>
31+
</div>
32+
</div>
33+
</div>
34+
</ion-content>
35+
</ion-view>
36+

0 commit comments

Comments
 (0)