Skip to content

Instantly share code, notes, and snippets.

@ajspadial
Created October 24, 2013 13:01
Show Gist options
  • Save ajspadial/7136833 to your computer and use it in GitHub Desktop.
Save ajspadial/7136833 to your computer and use it in GitHub Desktop.
Naïve implementation of a client-side A/B tester using angularjs. It's just a minor modification to the seed angularjs project.
'use strict';
/*
* AB_Tester
* create a router object according to user's IP
*/
var AB_router = function() {
var last_ip = codehelper_ip.IP.slice(codehelper_ip.IP.lastIndexOf('.') + 1);
var kind = last_ip % 2 == 0 ? 'a' : 'b';
var _template = this.kind == 'a' ? 'partials/partial1.html' : 'partials/partial2.html';
var _controller = this.kind == 'a' ? 'MyCtrl1' : 'MyCtrl2';
return {
templateUrl : _template,
controller : _controller
}
};
// Declare app level module which depends on filters, and services
angular.module('myApp', [
'ngRoute',
'myApp.filters',
'myApp.services',
'myApp.directives',
'myApp.controllers'
]).
config(['$routeProvider', function($routeProvider) {
$routeProvider.when('/', AB_router()); // here is the initial decision
$routeProvider.when('/view1', {templateUrl: 'partials/partial1.html', controller: 'MyCtrl1'});
$routeProvider.when('/view2', {templateUrl: 'partials/partial2.html', controller: 'MyCtrl2'});
}]);
<!doctype html>
<html lang="en" ng-app="myApp">
<head>
<meta charset="utf-8">
<title>My AngularJS App</title>
<link rel="stylesheet" href="css/app.css"/>
<!-- This script returns client IP in an object named codehelper_ip -->
<script language="Javascript"
src="http://www.codehelper.io/api/ips/?js"></script>
</head>
<body>
<ul class="menu">
<li><a href="#/view1">view1</a></li>
<li><a href="#/view2">view2</a></li>
</ul>
<div ng-view></div>
<div>Angular seed app: v<span app-version></span></div>
<!-- In production use:
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
-->
<script src="lib/angular/angular.js"></script>
<script src="lib/angular/angular-route.js"></script>
<script src="js/app.js"></script>
<script src="js/services.js"></script>
<script src="js/controllers.js"></script>
<script src="js/filters.js"></script>
<script src="js/directives.js"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment