diff --git a/.gitignore b/.gitignore
index 4049a9d0a3d86635a6d081372b015f11e244a3a9..fd7e9ed79b03ee52a08c8c925231c9e860ec0931 100644
--- a/.gitignore
+++ b/.gitignore
@@ -10,3 +10,6 @@ www/dist
 resources/android
 resources/ios
 .idea/
+.vscode/
+.settings/
+jsconfig.json
\ No newline at end of file
diff --git a/config.xml b/config.xml
index 98d932d787169c65e9f43d0ba85800d5e98d4a54..ebd217afa28169d911f57e3cabc8ca6d15d934ed 100644
--- a/config.xml
+++ b/config.xml
@@ -1,99 +1,103 @@
-<?xml version='1.0' encoding='utf-8'?>
+<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
 <widget id="com.jeremyguiselin.betskills" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
-    <name>Betskills</name>
-    <description>
+  <name>Betskills</name>
+  <description>
     Betskills app to see predictions of football and tennis games.
     </description>
-    <author email="contact@betskills.com" href="">
+  <author email="contact@betskills.com" href="">
       Betskills team
     </author>
-    <content src="index.html" />
-    <access origin="*" />
-    <preference name="webviewbounce" value="false" />
-    <preference name="UIWebViewBounce" value="false" />
-    <preference name="DisallowOverscroll" value="true" />
-    <preference name="SplashScreenDelay" value="3000" />
-    <preference name="android-minSdkVersion" value="16" />
-    <preference name="BackupWebStorage" value="none" />
-    <preference name="SplashScreen" value="screen" />
-    <preference name="xwalkVersion" value="18+" />
-    <preference name="xwalkCommandLine" value="--disable-pull-to-refresh-effect" />
-    <preference name="xwalkMode" value="embedded" />
-    <preference name="xwalkMultipleApk" value="true" />
-    <feature name="StatusBar">
-        <param name="ios-package" onload="true" value="CDVStatusBar" />
-    </feature>
-    <plugin name="cordova-plugin-console" spec="~1.0.3" />
-    <plugin name="cordova-plugin-whitelist" spec="~1.2.2" />
-    <plugin name="cordova-plugin-splashscreen" spec="~3.2.2" />
-    <plugin name="cordova-plugin-statusbar" spec="~2.1.3" />
-    <plugin name="ionic-plugin-keyboard" spec="~2.2.1" />
-    <plugin name="cordova-plugin-firebase" spec="~0.1.18" />
-    <plugin name="cordova-plugin-device" spec="~1.1.3" />
-    <plugin name="cordova-plugin-file-transfer" spec="~1.6.1" />
-    <plugin name="cordova-plugin-inapppurchase" spec="~1.1.0" />
-    <platform name="ios">
-        <preference name="FadeSplashScreen" value="false" />
-        <preference name="FadeSplashScreenDuration" value="1000" />
-        <preference name="iosPersistentFileLocation" value="Library" />
-        <splash height="1136" src="resources/ios/splash/Default-568h@2x~iphone.png" width="640" />
-        <splash height="1334" src="resources/ios/splash/Default-667h.png" width="750" />
-        <splash height="2208" src="resources/ios/splash/Default-736h.png" width="1242" />
-        <splash height="1242" src="resources/ios/splash/Default-Landscape-736h.png" width="2208" />
-        <splash height="1536" src="resources/ios/splash/Default-Landscape@2x~ipad.png" width="2048" />
-        <splash height="768" src="resources/ios/splash/Default-Landscape~ipad.png" width="1024" />
-        <splash height="2048" src="resources/ios/splash/Default-Portrait@2x~ipad.png" width="1536" />
-        <splash height="1024" src="resources/ios/splash/Default-Portrait~ipad.png" width="768" />
-        <splash height="960" src="resources/ios/splash/Default@2x~iphone.png" width="640" />
-        <splash height="480" src="resources/ios/splash/Default~iphone.png" width="320" />
-        <icon height="57" src="resources/ios/icon/icon.png" width="57" />
-        <icon height="114" src="resources/ios/icon/icon@2x.png" width="114" />
-        <icon height="40" src="resources/ios/icon/icon-40.png" width="40" />
-        <icon height="80" src="resources/ios/icon/icon-40@2x.png" width="80" />
-        <icon height="120" src="resources/ios/icon/icon-40@3x.png" width="120" />
-        <icon height="50" src="resources/ios/icon/icon-50.png" width="50" />
-        <icon height="100" src="resources/ios/icon/icon-50@2x.png" width="100" />
-        <icon height="60" src="resources/ios/icon/icon-60.png" width="60" />
-        <icon height="120" src="resources/ios/icon/icon-60@2x.png" width="120" />
-        <icon height="180" src="resources/ios/icon/icon-60@3x.png" width="180" />
-        <icon height="72" src="resources/ios/icon/icon-72.png" width="72" />
-        <icon height="144" src="resources/ios/icon/icon-72@2x.png" width="144" />
-        <icon height="76" src="resources/ios/icon/icon-76.png" width="76" />
-        <icon height="152" src="resources/ios/icon/icon-76@2x.png" width="152" />
-        <icon height="167" src="resources/ios/icon/icon-83.5@2x.png" width="167" />
-        <icon height="29" src="resources/ios/icon/icon-small.png" width="29" />
-        <icon height="58" src="resources/ios/icon/icon-small@2x.png" width="58" />
-        <icon height="87" src="resources/ios/icon/icon-small@3x.png" width="87" />
-    </platform>
-    <platform name="android">
-        <preference name="android-minSdkVersion" value="22" />
-        <preference name="android-targetSdkVersion" value="22" />
-        <preference name="SplashMaintainAspectRatio" value="true" />
-        <preference name="SplashShowOnlyFirstTime" value="false" />
-        <preference name="AndroidPersistentFileLocation" value="Compatibility" />
-        <preference name="android-build-tool" value="gradle" />
-        <splash density="land-ldpi" src="resources/android/splash/drawable-land-ldpi-screen.png" />
-        <splash density="land-mdpi" src="resources/android/splash/drawable-land-mdpi-screen.png" />
-        <splash density="land-hdpi" src="resources/android/splash/drawable-land-hdpi-screen.png" />
-        <splash density="land-xhdpi" src="resources/android/splash/drawable-land-xhdpi-screen.png" />
-        <splash density="land-xxhdpi" src="resources/android/splash/drawable-land-xxhdpi-screen.png" />
-        <splash density="land-xxxhdpi" src="resources/android/splash/drawable-land-xxxhdpi-screen.png" />
-        <splash density="port-ldpi" src="resources/android/splash/drawable-port-ldpi-screen.png" />
-        <splash density="port-mdpi" src="resources/android/splash/drawable-port-mdpi-screen.png" />
-        <splash density="port-hdpi" src="resources/android/splash/drawable-port-hdpi-screen.png" />
-        <splash density="port-xhdpi" src="resources/android/splash/drawable-port-xhdpi-screen.png" />
-        <splash density="port-xxhdpi" src="resources/android/splash/drawable-port-xxhdpi-screen.png" />
-        <splash density="port-xxxhdpi" src="resources/android/splash/drawable-port-xxxhdpi-screen.png" />
-        <icon density="ldpi" src="resources/android/icon/drawable-ldpi-icon.png" />
-        <icon density="mdpi" src="resources/android/icon/drawable-mdpi-icon.png" />
-        <icon density="hdpi" src="resources/android/icon/drawable-hdpi-icon.png" />
-        <icon density="xhdpi" src="resources/android/icon/drawable-xhdpi-icon.png" />
-        <icon density="xxhdpi" src="resources/android/icon/drawable-xxhdpi-icon.png" />
-        <icon density="xxxhdpi" src="resources/android/icon/drawable-xxxhdpi-icon.png" />
-        <access origin="cdvfile://*" />
-        <allow-intent href="cdvfile://*" />
-    </platform>
-    <icon src="resources/android/icon/drawable-xhdpi-icon.png" />
-    <plugin name="cordova-plugin-x-toast" spec="https://github.com/EddyVerbruggen/Toast-PhoneGap-Plugin.git" />
-    <plugin name="cordova-plugin-badge" spec="https://github.com/katzer/cordova-plugin-badge.git" />
-</widget>
+  <content src="index.html"/>
+  <access origin="*"/>
+  <preference name="webviewbounce" value="false"/>
+  <preference name="UIWebViewBounce" value="false"/>
+  <preference name="DisallowOverscroll" value="true"/>
+  <preference name="SplashScreenDelay" value="3000"/>
+  <preference name="android-minSdkVersion" value="16"/>
+  <preference name="BackupWebStorage" value="none"/>
+  <preference name="SplashScreen" value="screen"/>
+  <preference name="xwalkVersion" value="18+"/>
+  <preference name="xwalkCommandLine" value="--disable-pull-to-refresh-effect"/>
+  <preference name="xwalkMode" value="embedded"/>
+  <preference name="xwalkMultipleApk" value="true"/>
+  <feature name="StatusBar">
+    <param name="ios-package" onload="true" value="CDVStatusBar"/>
+  </feature>
+  <plugin name="cordova-plugin-console" spec="~1.0.3"/>
+  <plugin name="cordova-plugin-whitelist" spec="~1.2.2"/>
+  <plugin name="cordova-plugin-splashscreen" spec="~3.2.2"/>
+  <plugin name="cordova-plugin-statusbar" spec="~2.1.3"/>
+  <plugin name="ionic-plugin-keyboard" spec="~2.2.1"/>
+  <plugin name="cordova-plugin-firebase" spec="~0.1.18"/>
+  <plugin name="cordova-plugin-device" spec="~1.1.3"/>
+  <plugin name="cordova-plugin-file-transfer" spec="~1.6.1"/>
+  <plugin name="cordova-plugin-inapppurchase" spec="~1.1.0"/>
+  <plugin name="cordova-plugin-x-toast" spec="https://github.com/EddyVerbruggen/Toast-PhoneGap-Plugin.git"/>
+  <plugin name="cordova-plugin-badge" spec="https://github.com/katzer/cordova-plugin-badge.git"/>
+  <plugin name="cordova-plugin-facebook4" spec="~1.7.4">
+    <variable name="APP_ID" value="1830882820517971"/>
+    <variable name="APP_NAME" value="Betskills"/>
+  </plugin>
+  <platform name="ios">
+    <preference name="FadeSplashScreen" value="false"/>
+    <preference name="FadeSplashScreenDuration" value="1000"/>
+    <preference name="iosPersistentFileLocation" value="Library"/>
+    <splash height="1136" src="resources/ios/splash/Default-568h@2x~iphone.png" width="640"/>
+    <splash height="1334" src="resources/ios/splash/Default-667h.png" width="750"/>
+    <splash height="2208" src="resources/ios/splash/Default-736h.png" width="1242"/>
+    <splash height="1242" src="resources/ios/splash/Default-Landscape-736h.png" width="2208"/>
+    <splash height="1536" src="resources/ios/splash/Default-Landscape@2x~ipad.png" width="2048"/>
+    <splash height="768" src="resources/ios/splash/Default-Landscape~ipad.png" width="1024"/>
+    <splash height="2048" src="resources/ios/splash/Default-Portrait@2x~ipad.png" width="1536"/>
+    <splash height="1024" src="resources/ios/splash/Default-Portrait~ipad.png" width="768"/>
+    <splash height="960" src="resources/ios/splash/Default@2x~iphone.png" width="640"/>
+    <splash height="480" src="resources/ios/splash/Default~iphone.png" width="320"/>
+    <icon src="resources/ios/icon/icon.png" width="57" height="57"/>
+    <icon src="resources/ios/icon/icon@2x.png" width="114" height="114"/>
+    <icon src="resources/ios/icon/icon-40.png" width="40" height="40"/>
+    <icon src="resources/ios/icon/icon-40@2x.png" width="80" height="80"/>
+    <icon src="resources/ios/icon/icon-40@3x.png" width="120" height="120"/>
+    <icon src="resources/ios/icon/icon-50.png" width="50" height="50"/>
+    <icon src="resources/ios/icon/icon-50@2x.png" width="100" height="100"/>
+    <icon src="resources/ios/icon/icon-60.png" width="60" height="60"/>
+    <icon src="resources/ios/icon/icon-60@2x.png" width="120" height="120"/>
+    <icon src="resources/ios/icon/icon-60@3x.png" width="180" height="180"/>
+    <icon src="resources/ios/icon/icon-72.png" width="72" height="72"/>
+    <icon src="resources/ios/icon/icon-72@2x.png" width="144" height="144"/>
+    <icon src="resources/ios/icon/icon-76.png" width="76" height="76"/>
+    <icon src="resources/ios/icon/icon-76@2x.png" width="152" height="152"/>
+    <icon src="resources/ios/icon/icon-83.5@2x.png" width="167" height="167"/>
+    <icon src="resources/ios/icon/icon-small.png" width="29" height="29"/>
+    <icon src="resources/ios/icon/icon-small@2x.png" width="58" height="58"/>
+    <icon src="resources/ios/icon/icon-small@3x.png" width="87" height="87"/>
+  </platform>
+  <platform name="android">
+    <preference name="android-minSdkVersion" value="22"/>
+    <preference name="android-targetSdkVersion" value="22"/>
+    <preference name="SplashMaintainAspectRatio" value="true"/>
+    <preference name="SplashShowOnlyFirstTime" value="false"/>
+    <preference name="AndroidPersistentFileLocation" value="Compatibility"/>
+    <preference name="android-build-tool" value="gradle"/>
+    <splash density="land-ldpi" src="resources/android/splash/drawable-land-ldpi-screen.png"/>
+    <splash density="land-mdpi" src="resources/android/splash/drawable-land-mdpi-screen.png"/>
+    <splash density="land-hdpi" src="resources/android/splash/drawable-land-hdpi-screen.png"/>
+    <splash density="land-xhdpi" src="resources/android/splash/drawable-land-xhdpi-screen.png"/>
+    <splash density="land-xxhdpi" src="resources/android/splash/drawable-land-xxhdpi-screen.png"/>
+    <splash density="land-xxxhdpi" src="resources/android/splash/drawable-land-xxxhdpi-screen.png"/>
+    <splash density="port-ldpi" src="resources/android/splash/drawable-port-ldpi-screen.png"/>
+    <splash density="port-mdpi" src="resources/android/splash/drawable-port-mdpi-screen.png"/>
+    <splash density="port-hdpi" src="resources/android/splash/drawable-port-hdpi-screen.png"/>
+    <splash density="port-xhdpi" src="resources/android/splash/drawable-port-xhdpi-screen.png"/>
+    <splash density="port-xxhdpi" src="resources/android/splash/drawable-port-xxhdpi-screen.png"/>
+    <splash density="port-xxxhdpi" src="resources/android/splash/drawable-port-xxxhdpi-screen.png"/>
+    <access origin="cdvfile://*"/>
+    <allow-intent href="cdvfile://*"/>
+    <icon src="resources/android/icon/drawable-ldpi-icon.png" density="ldpi"/>
+    <icon src="resources/android/icon/drawable-mdpi-icon.png" density="mdpi"/>
+    <icon src="resources/android/icon/drawable-hdpi-icon.png" density="hdpi"/>
+    <icon src="resources/android/icon/drawable-xhdpi-icon.png" density="xhdpi"/>
+    <icon src="resources/android/icon/drawable-xxhdpi-icon.png" density="xxhdpi"/>
+    <icon src="resources/android/icon/drawable-xxxhdpi-icon.png" density="xxxhdpi"/>
+  </platform>
+  <icon src="resources/android/icon/drawable-xhdpi-icon.png"/>
+</widget>
\ No newline at end of file
diff --git a/resources/icon.png b/resources/icon.png
index 565a337cd64b24f100212e449124e8caa6418dca..ec686c3620a3f5e44699f7ee83f906f9ac4d3b65 100644
Binary files a/resources/icon.png and b/resources/icon.png differ
diff --git a/scss/header-bar.scss b/scss/header-bar.scss
index 3b4ff586667b8b19b21b4787e1dcc1a7ebb1a978..a7c36bd673c2017d573fafc85027eaf5ffe91e2c 100644
--- a/scss/header-bar.scss
+++ b/scss/header-bar.scss
@@ -1,6 +1,7 @@
 .info-icon {
   width: auto;
-  height: 80%;
+  max-height: 30px;
+  margin-top: 2px;
   margin-right: 20px;
 }
 
diff --git a/www/index.html b/www/index.html
index 866b14433f05ea6bf97689e7ef1567ac08f6ac78..04fa1072e90113fdfe2f0a3988994a3ee37dc391 100644
--- a/www/index.html
+++ b/www/index.html
@@ -19,24 +19,6 @@
   <script src="dist/project.js"></script>
 </head>
 <body ng-app="starter">
-    <script>
-    window.fbAsyncInit = function() {
-      FB.init({
-        appId      : '1830882820517971',
-        xfbml      : true,
-        version    : 'v2.8'
-      });
-      FB.AppEvents.logPageView();
-    };
-
-    (function(d, s, id){
-       var js, fjs = d.getElementsByTagName(s)[0];
-       if (d.getElementById(id)) {return;}
-       js = d.createElement(s); js.id = id;
-       js.src = "//connect.facebook.net/en_US/sdk.js";
-       fjs.parentNode.insertBefore(js, fjs);
-     }(document, 'script', 'facebook-jssdk'));
-  </script>
   <ion-nav-bar></ion-nav-bar>
   <ion-nav-view name="content"></ion-nav-view>
 </body>
diff --git a/www/js/app.js b/www/js/app.js
index 6aa0f46da71f6335e40f7663c363f09ac6bd4ec9..3395d7429d2a76025322a762e16e7be8c0e399a9 100644
--- a/www/js/app.js
+++ b/www/js/app.js
@@ -23,7 +23,8 @@
       "all_predictions": "All the predictions",
       "unlock": "Unlock",
       "predictions": "Predictions",
-      "games": "Game(s)"
+      "games": "Game(s)",
+      "currency": "£"
   	},
   	"fr": {
   		"info_title_1": "Comment resté connecté ?",
@@ -46,8 +47,9 @@
       "all_predictions": "Toutes les prédictions",
       "unlock": "Dévérouiller",
       "predictions": "Prédictions",
-      "games": "Match(s)"
-  	}
+      "games": "Match(s)",
+      "currency": "€"
+    }
   };
 
   /**
diff --git a/www/js/modules/config/config.js b/www/js/modules/config/config.js
index 923db7d86dd6a610bfee43095b124a8166c25bc6..0640850236bbca8c99fc358ad6cc6c6d45ca42a1 100644
--- a/www/js/modules/config/config.js
+++ b/www/js/modules/config/config.js
@@ -33,25 +33,37 @@
   module.constant('purchaseConfig', {
     'tennis': [
       'tennis',
-      'tennis-full-1',
-      'tennis-full-2',
-      'tennis-full-3',
-      'tennis-full-4',
-      'tennis-full-5'
+      'tennis_full_1',
+      'tennis_full_2',
+      'tennis_full_3',
+      'tennis_full_4',
+      'tennis_full_5'
     ],
     'football': [
-      'ligue-1',
-      'premiere-league',
+      'ligue_1',
+      'premiere_league',
       'bundesliga',
-      'liga-bbva',
-      'liga-nos',
-      'serie-a',
-      'champions-league',
-      'football-full-3',
-      'football-full-4',
-      'football-full-5',
-      'football-full-6'
-    ]
+      'liga_bbva',
+      'liga_nos',
+      'serie_a',
+      'champions_league',
+      'football_full_3',
+      'football_full_4',
+      'football_full_5',
+      'football_full_6',
+      'eredivisie'
+    ],
+    'mock' : {
+      'tennis': [
+        { productId: 'tennis', 'title': 'Tennis 1', description: 'Tennis 1 pack', price: '0.99€' },
+        { productId: 'tennis_full_1', 'title': 'Tennis 2', description: 'Tennis 2 pack', price: '1.99€' },
+        { productId: 'tennis_full_2', 'title': 'Tennis 3', description: 'Tennis 3 pack', price: '1.99€' },
+        { productId: 'tennis_full_3', 'title': 'Tennis 4', description: 'Tennis 4 pack', price: '2.99€' },
+        { productId: 'tennis_full_4', 'title': 'Tennis 5', description: 'Tennis 5 pack', price: '3.99€' },
+        { productId: 'tennis_full_5', 'title': 'Tennis 6', description: 'Tennis 6 pack', price: '4.99€' }
+      ],
+      'football': {}
+    }
   })
 
 })(angular);
diff --git a/www/js/modules/purchase/service.js b/www/js/modules/purchase/service.js
index beb65c71fb6fe05521895f9dd47c99a17bee12f4..9900cbfe47c349fe7f29ecf2e852e326cd0d125a 100644
--- a/www/js/modules/purchase/service.js
+++ b/www/js/modules/purchase/service.js
@@ -10,34 +10,66 @@
      *
      * @ngInject
      */
-    function PurchaseService($http, $cordovaToast, constantConfig, purchaseConfig) {
-        var service = {
+    function PurchaseService($http, $state, ToastService, constantConfig, purchaseConfig) {
+        return {
 
           getProducts: function (sport) {
             if (window.cordova) {
               var products = [];
               inAppPurchase
-                .getProducts(purchaseConfig[sport])
-                .then(function (storeProducts) {
-                  products = storeProducts;
+              .getProducts(purchaseConfig[sport])
+              .then(function (storeProducts) {
+                products = storeProducts;
+              })
+              .catch(function (err) {
+                ToastService.show(err, 'long', 'bottom');
+              });
+
+              return products;
+            } else {
+              return purchaseConfig['mock'][sport];
+            }
+          },
+
+          buyContent : function (uuid, purchaseId, leagues) {
+            var self = this;
+            var transactionData = {};
+            if (window.cordova) {
+              inAppPurchase
+                .buy(purchaseId)
+                .then(function (data) {
+                  transactionData = {
+                    transactionId: data.transactionId,
+                    uuid: uuid,
+                    leagues: leagues
+                  };
+                  self.savePurchase(transactionData);
                 })
                 .catch(function (err) {
-                  $cordovaToast
-                  .showLongBottom(err)
-                  .then(function(success) {
-                    // success
-                  }, function (error) {
-                    console.log(error);
-                  });
+                  ToastService.show('purchase_payment_error', 'long', 'center');
                 });
+            } else {
+              transactionData = {
+                transactionId: Math.random().toString(36).substring(7),
+                uuid: uuid,
+                leagues: leagues
+              };
+              self.savePurchase(transactionData);
             }
 
-            return [];
+          },
+
+          savePurchase: function (transactionData) {
+            $http.post(constantConfig.apiUrl + 'save-purchase', transactionData)
+              .then(function successCallback() {
+                $state.reload();
+                ToastService.show('purchase_ok', 'long', 'center');
+              }, function errorCallback() {
+                ToastService.show('purchase_internal_error', 'long', 'center');
+              });
           }
         };
 
-        return service;
-
       }
 
     angular.module('starter')
diff --git a/www/js/modules/toast/service.js b/www/js/modules/toast/service.js
new file mode 100644
index 0000000000000000000000000000000000000000..52b57cf5a2f8790ff15de3dd57db2c72f286f825
--- /dev/null
+++ b/www/js/modules/toast/service.js
@@ -0,0 +1,38 @@
+/**
+ * Created by jeremyguiselin on 17/01/2017.
+ */
+
+(function (angular) {
+  "use strict";
+  /**
+   * @ngdoc service
+   * @name starter.ToastService
+   *
+   * @description
+   *
+   * A service for toast message (mock for browser)
+   *
+   * @ngInject
+   */
+  function ToastService($cordovaToast, $translate) {
+    return {
+
+      show : function (message, duration, location) {
+        if (window.cordova) {
+          $cordovaToast.show($translate(message), duration, location).then(function(success) {
+            // success
+          }, function (error) {
+            console.log(error);
+          });
+        } else {
+          console.log($translate(message))
+        }
+      }
+    };
+
+  }
+
+  angular.module('starter')
+    .service('ToastService', ToastService)
+  ;
+})(angular);
diff --git a/www/js/pages/football/controller.js b/www/js/pages/football/controller.js
index 8d91dda761952975c3a57c6685cbad4d548e886b..1d24d13486b2e9be13b6184f5e28569ed4728406 100644
--- a/www/js/pages/football/controller.js
+++ b/www/js/pages/football/controller.js
@@ -20,13 +20,17 @@
     $http,
     $q,
     $ionicLoading,
-    constantConfig
+    PurchaseService,
+    constantConfig,
+    ToastService
   ) {
+
     /**
-    Static variables
-    **/
+     Static variables
+     **/
 
     var deregistrationCallbackList = [];
+    var products = PurchaseService.getProducts('football');
     var self = this;
     var uuid = window.cordova ? ionic.Platform.device().uuid : '7f4a6a40e5c87157';
 
@@ -54,30 +58,37 @@
 
     $scope.isBought = function (league) {
       return league.device_status === 'unlock';
-    }
+    };
 
     $scope.getLink = function (league) {
       if (league.device_status === 'unlock') {
         return 'details({leagueId:' + league.id + '})';
       }
       return '-';
-    }
+    };
 
     $scope.isSelected = function (league) {
       return $scope.selected.indexOf(league) !== -1;
-    }
+    };
 
     $scope.select = function (league) {
       if (!$scope.isBought(league.id)) {
         if ($scope.selected.indexOf(league) !== -1) {
           $scope.selected.splice($scope.selected.indexOf(league), 1);
           $scope.predictionsNumber -= league.predictions_number;
+          $scope.price = self.findPrice($scope.selected.length);
         } else {
           $scope.selected.push(league);
           $scope.predictionsNumber += league.predictions_number;
         }
       }
-    }
+    };
+
+
+    $scope.buyContent = function () {
+      var pack = self.findPack($scope.selected.length);
+      PurchaseService.buyContent(uuid, pack, $scope.selected);
+    };
 
     $scope.getPredictionClass = function (prediction, value) {
       var percentages = [prediction.prediction_win_first, prediction.prediction_win_second, prediction.prediction_draw];
@@ -89,7 +100,7 @@
       }
 
       return '';
-    }
+    };
 
     $scope.getTick = function (prediction) {
       var percentages = [
@@ -119,7 +130,7 @@
       }
 
       return null;
-    }
+    };
 
     $scope.parseDate = function (date) {
       var locale = window.navigator.language.split('-')[0];
@@ -130,7 +141,7 @@
       } else {
         return date[1] + '/' + date[2] + '/' + date[0].substr(-2);
       }
-    }
+    };
 
     /**
     End Scope functions
@@ -143,10 +154,65 @@
     this.parseScore = function (prediction) {
       if (prediction.score) {
         var score = prediction.score;
-        var scores = score.split('-');
-        prediction.score = scores;
+        prediction.score = score.split('-');
       }
-    }
+    };
+
+    this.isAllChampionsLeague = function () {
+      return $scope.selected[0].unitary_pack_name === 'champions_league'
+        && $scope.selected[1].unitary_pack_name === 'champions_league';
+    };
+
+    this.containsChampionsLeague = function () {
+      var contains = false;
+      $scope.selected.forEach(function (league) {
+        if (league.unitary_pack_name === 'champions_league') {
+          contains = true;
+        }
+      });
+
+      return contains;
+    };
+
+    this.findPrice = function (length) {
+      var packToGet = self.findPack(length);
+
+      if (packToGet !== '') {
+        var price = '';
+        products.forEach(function (el) {
+          if (el.productId === packToGet) {
+            price = el.price;
+          }
+        });
+        return price;
+      } else {
+        ToastService.show('selection_not_ok', 'long', 'bottom');
+      }
+    };
+
+    this.findPack = function (length) {
+      var packToGet = '';
+
+      if (length === 1) {
+        packToGet = $scope.selected[0].unitary_pack_name;
+      } else if (length == 2) {
+        if (self.isAllChampionsLeague()) {
+          packToGet = 'full_champions_league';
+        } else if (self.containsChampionsLeague()) {
+          ToastService.show('selection_not_ok', 'long', 'bottom');
+        } else {
+          packToGet = 'football_full_2';
+        }
+      } else if (length <= 6) {
+        if (!self.containsChampionsLeague()) {
+          packToGet = 'football_full_' + length;
+        } else {
+          ToastService.show('selection_not_ok', 'long', 'bottom');
+        }
+      }
+
+      return packToGet;
+    };
 
     /**
     End Controller functions
diff --git a/www/js/pages/tennis/controller.js b/www/js/pages/tennis/controller.js
index 1890599730e36344d9c45972810451f9bbfbaeb1..ab9c6b4c8c0b6576719dac214fa791e0ab4af188 100644
--- a/www/js/pages/tennis/controller.js
+++ b/www/js/pages/tennis/controller.js
@@ -57,7 +57,7 @@
 
     $scope.isBought = function (league) {
       return league.device_status === 'unlock';
-    }
+    };
 
     $scope.getLink = function (league) {
       if (league.device_status === 'unlock') {
@@ -65,11 +65,11 @@
       }
 
       return '-';
-    }
+    };
 
     $scope.isSelected = function (league) {
       return $scope.selected.indexOf(league) !== -1;
-    }
+    };
 
     $scope.select = function (league) {
       if (!$scope.isBought(league.id)) {
@@ -80,8 +80,9 @@
           $scope.selected.push(league);
           $scope.predictionsNumber += league.predictions_number;
         }
+        $scope.price = self.findPrice($scope.selected.length);
       }
-    }
+    };
 
     $scope.getPredictionClass = function (prediction, value) {
       var percentages = [
@@ -94,16 +95,21 @@
       }
 
       return '';
-    }
+    };
 
     $scope.buyContent = function () {
       var selectedPack = '';
       if ($scope.selected.length === 1) {
         selectedPack = 'tennis';
-      } else if($scope.selected.length > 1) {
-        selectedPack = 'tennis-full-'+ $scope.selected.length;
+      } else if($scope.selected.length > 1 && $scope.selected.length <= 6) {
+        var packNumber = $scope.selected.length - 1;
+        selectedPack = 'tennis_full_'+ packNumber;
       }
-    }
+
+      if (selectedPack !== '') {
+        PurchaseService.buyContent(uuid, selectedPack, $scope.selected);
+      }
+    };
 
     $scope.getTick = function (prediction) {
       var percentages = [
@@ -127,7 +133,7 @@
       }
 
       return null;
-    }
+    };
 
     $scope.parseDate = function (date) {
       var locale = window.navigator.language.split('-')[0];
@@ -138,7 +144,7 @@
       } else {
         return date[1] + '/' + date[2] + '/' + date[0].substr(-2);
       }
-    }
+    };
 
     /**
     End Scope functions
@@ -155,10 +161,29 @@
         var scores = [];
         sets.forEach(function (set) {
           scores.push(set.split('-'));
-        })
+        });
         prediction.score = scores;
       }
-    }
+    };
+
+    this.findPrice = function (length) {
+      var packToGet = '';
+      if (length === 1) {
+        packToGet = 'tennis';
+      } else if (length > 1 && length <= 6) {
+        packToGet = 'tennis_full_' + (length - 1);
+      }
+
+      if (packToGet !== '') {
+        var price = '';
+        products.forEach(function (el) {
+          if (el.productId === packToGet) {
+            price = el.price;
+          }
+        });
+        return price;
+      }
+    };
 
     /**
     End Controller functions
@@ -187,7 +212,7 @@
       $ionicLoading.show({
         template: '<ion-spinner icon="ripple" class="spinner-assertive"></ion-spinner>',
         animation: 'fade-in',
-        showBackdrop: true,
+        showBackdrop: true
       });
 
       var freePredictionsPromise = $http.get(constantConfig.apiUrl + 'predictions/tennis/free');
diff --git a/www/partials/prediction.html b/www/partials/prediction.html
index b7555dad483e30109ff66c85fa7fe7d48f6de99b..dec563a608876e05cdf7143c082e13038c8fd64d 100644
--- a/www/partials/prediction.html
+++ b/www/partials/prediction.html
@@ -38,8 +38,8 @@
 </div>
 <div class="score-container" ng-hide="freePrediction.score === null">
   <div class="tick"></div>
-  <div ng-if="freePrediction.league.sport === 'football'" ng-include="'/partials/score/football.html'" class="score football-score"></div>
-  <div ng-if="freePrediction.league.sport === 'tennis'" ng-include="'/partials/score/tennis.html'" class="score tennis-score"></div>
+  <div ng-if="freePrediction.league.sport === 'football'" ng-include="'partials/score/football.html'" class="score football-score"></div>
+  <div ng-if="freePrediction.league.sport === 'tennis'" ng-include="'partials/score/tennis.html'" class="score tennis-score"></div>
   <div class="tick">
     <img src="img/{{getTick(freePrediction)}}.png" alt="">
   </div>
diff --git a/www/partials/sport-index.html b/www/partials/sport-index.html
index 9292be77bbada79265e7af011a45b0bac1ce30b5..f7cec7e4e648aae1e342d3aa5eefa125b084db1f 100644
--- a/www/partials/sport-index.html
+++ b/www/partials/sport-index.html
@@ -25,6 +25,6 @@
 </ion-list>
 <div class="unlock" ng-class="{active : selected.length > 0}">
   <a class="content" ng-click="buyContent()">
-    {{"unlock" | translate}} {{predictionsNumber}} {{"predictions" | translate}} <span>{{price / 100}}€</span>
+    {{"unlock" | translate}} {{predictionsNumber}} {{"predictions" | translate}} <span>{{price}}</span>
   </div>
 </div>