Skip to content

Commit b59e8b7

Browse files
hasdavidchasdavidc
committed
initial commit
0 parents  commit b59e8b7

22 files changed

+1007
-0
lines changed

‎.bowerrc

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"directory": "src/bower_components"
3+
}

‎.gitattributes

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
* text=auto

‎.gitignore

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
node_modules
2+
.tmp
3+
.sass-cache
4+
src/bower_components

‎.travis.yml

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
language: node_js
2+
node_js:
3+
- '0.8'
4+
- '0.10'
5+
before_script:
6+
- 'npm install -g bower grunt-cli'
7+
- 'bower install'

‎Gruntfile.js

Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
module.exports = function(grunt) {
2+
3+
var nonFirebaseFiles = [
4+
'src/scripts/app.js',
5+
'src/scripts/facebookSDK.js',
6+
'src/scripts/facebookLogin.js'
7+
];
8+
9+
var firebaseFiles = [
10+
'src/scripts/appFirebase.js',
11+
'src/scripts/facebookSDK.js',
12+
'src/scripts/facebookLoginFirebase.js'
13+
];
14+
15+
grunt.initConfig({
16+
jshintrc : grunt.file.readJSON('.jshintrc'),
17+
uglify: {
18+
'build-minify-non-firebase-version' : {
19+
options: {
20+
mangle: {
21+
except: ['angular']
22+
},
23+
compress: true,
24+
wrap: true
25+
},
26+
files: {
27+
'src/facebookUtils.min.js' : nonFirebaseFiles
28+
}
29+
},
30+
'build-source-non-firebase-version' : {
31+
options: {
32+
mangle: false,
33+
beautify: true,
34+
wrap: true,
35+
compress: false
36+
},
37+
files: {
38+
'src/facebookUtils.js' : nonFirebaseFiles
39+
}
40+
},
41+
'build-minify-firebase-version' : {
42+
options: {
43+
mangle: {
44+
except: ['angular']
45+
},
46+
compress: true,
47+
wrap: true
48+
},
49+
files: {
50+
'src/facebookUtilsFirebase.min.js' : firebaseFiles
51+
}
52+
},
53+
'build-source-firebase-version' : {
54+
options: {
55+
mangle: false,
56+
beautify: true,
57+
wrap: true,
58+
compress: false
59+
},
60+
files: {
61+
'src/facebookUtilsFirebase.js' : firebaseFiles
62+
}
63+
}
64+
}
65+
});
66+
67+
68+
grunt.loadNpmTasks('grunt-contrib-uglify');
69+
70+
grunt.registerTask('default', ['uglify']);
71+
grunt.registerTask('build', ['uglify']);
72+
};

‎bower.json

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
{
2+
"name": "angularFacebookUtils",
3+
"version": "1.0.0",
4+
"ignore": [
5+
"**/.*",
6+
"node_modules",
7+
"src/bower_components",
8+
"Gruntfile.js"
9+
],
10+
"dependencies": {
11+
"angular": "~1.0.7"
12+
}
13+
}

‎channel.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
<script src="//connect.facebook.net/en_US/all.js"></script>

‎index.html

Lines changed: 176 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,176 @@
1+
<!doctype html>
2+
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
3+
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
4+
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
5+
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
6+
<head>
7+
<meta charset="utf-8">
8+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
9+
<title>Angular Facebook Utils</title>
10+
<meta name="description" content="">
11+
<meta name="viewport" content="width=device-width">
12+
<!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
13+
14+
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
15+
16+
<link rel="stylesheet" href="src/styles/facebookUtils.css">
17+
<style>
18+
html, body {
19+
margin: 20px;
20+
}
21+
22+
body {
23+
background: #fafafa;
24+
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
25+
color: #333;
26+
}
27+
.container > section {
28+
margin-bottom: 25px;
29+
padding-bottom: 25px;
30+
border-bottom: 1px solid #CCC;
31+
}
32+
</style>
33+
</head>
34+
<body ng-app="facebookUtils">
35+
<!--[if lt IE 7]>
36+
<p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
37+
<![endif]-->
38+
39+
<!--[if lt IE 9]>
40+
<script src="bower_components/es5-shim/es5-shim.js"></script>
41+
<script src="bower_components/json3/lib/json3.min.js"></script>
42+
<![endif]-->
43+
44+
<div class="container" ng-controller='ExampleCtrl'>
45+
46+
<section>
47+
<h1>Angular Facebook Utils</h1>
48+
49+
<p>
50+
Implementing Facebook Login in Meteor is as easy as:
51+
</p>
52+
<ol>
53+
<li><code>mrt create new-app && cd new-app</code></li>
54+
<li><code>mrt add accounts-ui && mrt add accounts-facebook</code></li>
55+
<li class="ng-non-bindable">Add the line <code>{{loginButtons}}</code> to new-app.html</li>
56+
<li><code>meteor</code> to run the server</li>
57+
<li>Click the login button and it will give you instructions on configuration</li>
58+
</ol>
59+
<p>Meteor can do this, in part, because they own the entire stack. They can save and interpolate values from Mongo.</p>
60+
<p>Let's make something as simple in Angular, with Firebase as our backend!</p>
61+
</section>
62+
63+
<section>
64+
<h1>Due Credit</h1>
65+
<p>I took code and ideas from these 3 places, so they deserve more obvious credit:</p>
66+
<p><a href='http://blog.brunoscopelliti.com/facebook-authentication-in-your-angularjs-web-app'>http://blog.brunoscopelliti.com/facebook-authentication-in-your-angularjs-web-app</a></p>
67+
<p><a href='https://github.com/Terumi/AngularJS-Facebook-Login/blob/master/js/app.js'>https://github.com/Terumi/AngularJS-Facebook-Login/blob/master/js/app.js</a></p>
68+
<p><a href='https://github.com/necolas/css3-social-signin-buttons'>https://github.com/necolas/css3-social-signin-buttons</a></p>
69+
</section>
70+
71+
<section>
72+
<h1>Final Product</h1>
73+
74+
<pre class='marginTop'>&lt;facebook-login firebase='https://davidchang.firebaseio.com/credentials' show-configure='true'&gt;&lt;/facebook-login&gt;</pre>
75+
76+
<facebook-login firebase='https://davidchang.firebaseio.com/credentials' show-configure='true'></facebook-login>
77+
78+
<h3 ng-show='facebookResponse.status == "connected"'>Hello, {{me.name}}!</h3>
79+
<h3 ng-hide='facebookResponse.status == "connected"'>Hello, Stranger!</h3>
80+
</section>
81+
82+
83+
<section>
84+
<h1>Examples</h1>
85+
<section>
86+
<h3>Use Firebase, No permissions:</h3>
87+
<pre class='marginTop'>&lt;facebook-login firebase='https://davidchang.firebaseio.com/credentials'&gt;&lt;/facebook-login&gt;</pre>
88+
</section>
89+
90+
<section>
91+
<h3>Use Firebase, Request permissions:</h3>
92+
<pre class='marginTop'>&lt;facebook-login firebase='https://davidchang.firebaseio.com/credentials' permissions='user_photos,user_likes'&gt;&lt;/facebook-login&gt;</pre>
93+
</section>
94+
95+
<section>
96+
<h3>Don't use Firebase, Request permissions:</h3>
97+
<pre class='marginTop'>&lt;facebook-login permissions='user_photos,user_likes' app-id='335763733225618'&gt;&lt;/facebook-login&gt;</pre>
98+
</section>
99+
100+
<section>
101+
<h3>Use Firebase, Always show Configuration step, Request permissions:</h3>
102+
<pre class='marginTop'>&lt;facebook-login firebase='https://davidchang.firebaseio.com/credentials' permissions='user_photos,user_likes' show-configure='true'&gt;&lt;/facebook-login&gt;</pre>
103+
</section>
104+
</section>
105+
106+
<section>
107+
<h1>Options</h1>
108+
<table class='table table-striped'>
109+
<thead>
110+
<tr><th>Attribute Name</th><th>Description</th></tr>
111+
</thead>
112+
<tbody>
113+
<tr>
114+
<td>firebase</td>
115+
<td>Your firebase URL</td>
116+
</tr>
117+
<tr>
118+
<td>app-id</td>
119+
<td>Your Facebook ID (required if Firebase is disabled)</td>
120+
</tr>
121+
<tr>
122+
<td>permissions</td>
123+
<td>Comma separated String for the Facebook permissions you want to request</td>
124+
</tr>
125+
<tr>
126+
<td>show-configure</td>
127+
<td>Always show configuration step (only applicable if Firebase is enabled)</td>
128+
</tr>
129+
</tbody>
130+
</table>
131+
</section>
132+
</div>
133+
134+
<script src="src/bower_components/angular/angular.js"></script>
135+
<script src="//cdn.firebase.com/v0/firebase.js"></script>
136+
<script src="//cdn.firebase.com/libs/angularfire/0.3.0/angularfire.min.js"></script>
137+
138+
139+
<script src="src/facebookUtilsFirebase.min.js"></script>
140+
141+
<script>
142+
'use strict';
143+
144+
angular.module('facebookUtils')
145+
.controller('ExampleCtrl', function ($scope) {
146+
147+
var afterLogIn = function() {
148+
FB.api('/me', function(response) {
149+
$scope.$apply(function() {
150+
$scope.me = response;
151+
});
152+
});
153+
};
154+
155+
$scope.facebookResponse = {};
156+
157+
$scope.$on('fbLoginSuccess', function(name, response) {
158+
$scope.facebookResponse = response;
159+
160+
if (response.status === 'connected') {
161+
afterLogIn();
162+
}
163+
});
164+
165+
$scope.$on('fbLogoutSuccess', function() {
166+
167+
$scope.$apply(function() {
168+
$scope.facebookResponse = {};
169+
});
170+
171+
});
172+
});
173+
</script>
174+
175+
</body>
176+
</html>

‎karma.conf.js

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
// Karma configuration
2+
// http://karma-runner.github.io/0.10/config/configuration-file.html
3+
4+
module.exports = function(config) {
5+
config.set({
6+
// base path, that will be used to resolve files and exclude
7+
basePath: '../',
8+
9+
// testing framework to use (jasmine/mocha/qunit/...)
10+
frameworks: ['jasmine'],
11+
12+
// list of files / patterns to load in the browser
13+
files: [
14+
15+
//Testing fixtures
16+
'bower_components/chai/chai.js',
17+
'node_modules/chai-spies/chai-spies.js',
18+
'test/chai-starter.js',
19+
'bower_components/jasmine.async/src/jasmine.async.js',
20+
21+
//Dependencies
22+
23+
'bower_components/lodash/dist/lodash.underscore.js',
24+
'bower_components/q/q.js',
25+
'bower_components/jquery/jquery.min.js',
26+
'src/bower_components/angular/angular.js',
27+
'src/bower_components/angular-mocks/angular-mocks.js',
28+
29+
//Project source
30+
'src/scripts/app.js',
31+
'src/scripts/facebookSDK.js',
32+
'src/scripts/facebookLogin.js',
33+
34+
// All Tests
35+
'test/spec/*.js'
36+
],
37+
38+
// level of logging
39+
// possible values: LOG_DISABLE || LOG_ERROR || LOG_WARN || LOG_INFO || LOG_DEBUG
40+
logLevel: config.LOG_INFO,
41+
42+
// enable / disable watching file and executing tests whenever any file changes
43+
autoWatch: true,
44+
45+
// Start these browsers, currently available:
46+
// - Chrome
47+
// - ChromeCanary
48+
// - Firefox
49+
// - Opera
50+
// - Safari (only Mac)
51+
// - PhantomJS
52+
// - IE (only Windows)
53+
browsers: ['PhantomJS']
54+
55+
});
56+
};

‎package.json

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
{
2+
"name": "angularFacebookUtils",
3+
"version": "0.0.0",
4+
"dependencies": {},
5+
"devDependencies": {
6+
"grunt": "~0.4.1",
7+
"grunt-contrib-uglify": "~0.2.0",
8+
"load-grunt-tasks": "~0.1.0"
9+
},
10+
"engines": {
11+
"node": ">=0.8.0"
12+
}
13+
}

0 commit comments

Comments
 (0)