diff --git a/platforms/android/.gradle/2.2.1/taskArtifacts/cache.properties.lock b/platforms/android/.gradle/2.2.1/taskArtifacts/cache.properties.lock
index f07d2cc..c24875b 100644
Binary files a/platforms/android/.gradle/2.2.1/taskArtifacts/cache.properties.lock and b/platforms/android/.gradle/2.2.1/taskArtifacts/cache.properties.lock differ
diff --git a/platforms/android/.gradle/2.2.1/taskArtifacts/fileHashes.bin b/platforms/android/.gradle/2.2.1/taskArtifacts/fileHashes.bin
index 5ba56ad..4309f27 100644
Binary files a/platforms/android/.gradle/2.2.1/taskArtifacts/fileHashes.bin and b/platforms/android/.gradle/2.2.1/taskArtifacts/fileHashes.bin differ
diff --git a/platforms/android/.gradle/2.2.1/taskArtifacts/fileSnapshots.bin b/platforms/android/.gradle/2.2.1/taskArtifacts/fileSnapshots.bin
index 8a8fd9a..feeefbe 100644
Binary files a/platforms/android/.gradle/2.2.1/taskArtifacts/fileSnapshots.bin and b/platforms/android/.gradle/2.2.1/taskArtifacts/fileSnapshots.bin differ
diff --git a/platforms/android/.gradle/2.2.1/taskArtifacts/outputFileStates.bin b/platforms/android/.gradle/2.2.1/taskArtifacts/outputFileStates.bin
index 5a92888..2847dca 100644
Binary files a/platforms/android/.gradle/2.2.1/taskArtifacts/outputFileStates.bin and b/platforms/android/.gradle/2.2.1/taskArtifacts/outputFileStates.bin differ
diff --git a/platforms/android/.gradle/2.2.1/taskArtifacts/taskArtifacts.bin b/platforms/android/.gradle/2.2.1/taskArtifacts/taskArtifacts.bin
index a1682b8..2315925 100644
Binary files a/platforms/android/.gradle/2.2.1/taskArtifacts/taskArtifacts.bin and b/platforms/android/.gradle/2.2.1/taskArtifacts/taskArtifacts.bin differ
diff --git a/platforms/android/.idea/workspace.xml b/platforms/android/.idea/workspace.xml
index cbdcc74..2b89972 100644
--- a/platforms/android/.idea/workspace.xml
+++ b/platforms/android/.idea/workspace.xml
@@ -41,8 +41,8 @@
       <file leaf-file-name="InAppBrowser.java" pinned="false" current-in-tab="true">
         <entry file="file://$PROJECT_DIR$/src/org/apache/cordova/inappbrowser/InAppBrowser.java">
           <provider selected="true" editor-type-id="text-editor">
-            <state vertical-scroll-proportion="0.8160535">
-              <caret line="80" column="50" selection-start-line="80" selection-start-column="50" selection-end-line="80" selection-end-column="50" />
+            <state vertical-scroll-proportion="0.59384614">
+              <caret line="77" column="52" selection-start-line="77" selection-start-column="52" selection-end-line="77" selection-end-column="52" />
               <folding>
                 <element signature="e#0#38645#0" expanded="false" />
                 <element signature="imports" expanded="false" />
@@ -56,7 +56,7 @@
         <entry file="file://$PROJECT_DIR$/assets/www/js/app.js">
           <provider selected="true" editor-type-id="text-editor">
             <state vertical-scroll-proportion="0.0">
-              <caret line="90" column="34" selection-start-line="90" selection-start-column="34" selection-end-line="90" selection-end-column="34" />
+              <caret line="91" column="5" selection-start-line="91" selection-start-column="5" selection-end-line="91" selection-end-column="5" />
               <folding />
             </state>
           </provider>
@@ -66,7 +66,7 @@
         <entry file="file://$PROJECT_DIR$/assets/www/js/controllers.js">
           <provider selected="true" editor-type-id="text-editor">
             <state vertical-scroll-proportion="0.0">
-              <caret line="477" column="0" selection-start-line="477" selection-start-column="0" selection-end-line="477" selection-end-column="0" />
+              <caret line="532" column="0" selection-start-line="532" selection-start-column="0" selection-end-line="532" selection-end-column="0" />
               <folding />
             </state>
           </provider>
@@ -76,7 +76,7 @@
         <entry file="file://$PROJECT_DIR$/assets/www/templates/tab-dash.html">
           <provider selected="true" editor-type-id="text-editor">
             <state vertical-scroll-proportion="0.0">
-              <caret line="5" column="0" selection-start-line="5" selection-start-column="0" selection-end-line="5" selection-end-column="0" />
+              <caret line="14" column="0" selection-start-line="14" selection-start-column="0" selection-end-line="14" selection-end-column="0" />
               <folding />
             </state>
           </provider>
@@ -1264,7 +1264,7 @@
     </option>
     <option name="modificationStamps">
       <map>
-        <entry key="$PROJECT_DIR$" value="5817832518370" />
+        <entry key="$PROJECT_DIR$" value="5817982802969" />
       </map>
     </option>
     <option name="projectBuildClasspath">
@@ -1646,7 +1646,7 @@
     <option name="x" value="-8" />
     <option name="y" value="-8" />
     <option name="width" value="1696" />
-    <option name="height" value="922" />
+    <option name="height" value="962" />
   </component>
   <component name="ProjectLevelVcsManager" settingsEditedManually="false">
     <OptionsSetting value="true" id="Add" />
@@ -1852,11 +1852,11 @@
     <servers />
   </component>
   <component name="ToolWindowManager">
-    <frame x="-8" y="-8" width="1696" height="922" extended-state="6" />
-    <editor active="false" />
+    <frame x="-8" y="-8" width="1696" height="962" extended-state="6" />
+    <editor active="true" />
     <layout>
       <window_info id="TODO" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" weight="0.33" sideWeight="0.5" order="6" side_tool="false" content_ui="tabs" />
-      <window_info id="Messages" active="true" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="true" weight="0.57310706" sideWeight="0.5" order="7" side_tool="false" content_ui="tabs" />
+      <window_info id="Messages" active="true" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="true" weight="0.5620347" sideWeight="0.5" order="7" side_tool="false" content_ui="tabs" />
       <window_info id="Build Variants" active="false" anchor="left" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" weight="0.33" sideWeight="0.5" order="2" side_tool="true" content_ui="tabs" />
       <window_info id="Palette&#9;" active="false" anchor="left" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" weight="0.33" sideWeight="0.5" order="2" side_tool="false" content_ui="tabs" />
       <window_info id="Event Log" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" weight="0.33" sideWeight="0.5" order="7" side_tool="true" content_ui="tabs" />
@@ -1930,7 +1930,7 @@
     <entry file="file://$PROJECT_DIR$/assets/www/templates/tab-dash.html">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0">
-          <caret line="5" column="0" selection-start-line="5" selection-start-column="0" selection-end-line="5" selection-end-column="0" />
+          <caret line="14" column="0" selection-start-line="14" selection-start-column="0" selection-end-line="14" selection-end-column="0" />
           <folding />
         </state>
       </provider>
@@ -1938,7 +1938,7 @@
     <entry file="file://$PROJECT_DIR$/assets/www/js/controllers.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0">
-          <caret line="477" column="0" selection-start-line="477" selection-start-column="0" selection-end-line="477" selection-end-column="0" />
+          <caret line="532" column="0" selection-start-line="532" selection-start-column="0" selection-end-line="532" selection-end-column="0" />
           <folding />
         </state>
       </provider>
@@ -1946,7 +1946,7 @@
     <entry file="file://$PROJECT_DIR$/assets/www/js/app.js">
       <provider selected="true" editor-type-id="text-editor">
         <state vertical-scroll-proportion="0.0">
-          <caret line="90" column="34" selection-start-line="90" selection-start-column="34" selection-end-line="90" selection-end-column="34" />
+          <caret line="91" column="5" selection-start-line="91" selection-start-column="5" selection-end-line="91" selection-end-column="5" />
           <folding />
         </state>
       </provider>
@@ -1961,8 +1961,8 @@
     </entry>
     <entry file="file://$PROJECT_DIR$/src/org/apache/cordova/inappbrowser/InAppBrowser.java">
       <provider selected="true" editor-type-id="text-editor">
-        <state vertical-scroll-proportion="0.8160535">
-          <caret line="80" column="50" selection-start-line="80" selection-start-column="50" selection-end-line="80" selection-end-column="50" />
+        <state vertical-scroll-proportion="0.59384614">
+          <caret line="77" column="52" selection-start-line="77" selection-start-column="52" selection-end-line="77" selection-end-column="52" />
           <folding>
             <element signature="e#0#38645#0" expanded="false" />
             <element signature="imports" expanded="false" />
diff --git a/platforms/android/android-release.apk b/platforms/android/android-release.apk
index 45153e8..f416f17 100644
Binary files a/platforms/android/android-release.apk and b/platforms/android/android-release.apk differ
diff --git a/platforms/android/assets/www/index.html b/platforms/android/assets/www/index.html
index dff66f1..0c94c92 100644
--- a/platforms/android/assets/www/index.html
+++ b/platforms/android/assets/www/index.html
@@ -8,7 +8,7 @@
     <link href="lib/ionic/css/ionic.css" rel="stylesheet">
     <link href='https://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'>
     <link href='https://fonts.googleapis.com/css?family=Oswald:400,300,700' rel='stylesheet' type='text/css'>
-	<link href='https://fonts.googleapis.com/css?family=Bubblegum+Sans' rel='stylesheet' type='text/css'>
+	  <link href='https://fonts.googleapis.com/css?family=Bubblegum+Sans' rel='stylesheet' type='text/css'>
     <link href="css/style.css" rel="stylesheet">
 
     <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
@@ -17,6 +17,7 @@
 
     <!-- ionic/angularjs js -->
     <script src="lib/ionic/js/ionic.bundle.js"></script>
+    <script src="js/ionic-modal-select.min.js"></script>
     <script src="js/ng-cordova.min.js"></script>
     <!-- cordova script (this will be a 404 during development) -->
     <script src="cordova.js"></script>
diff --git a/platforms/android/assets/www/js/app.js b/platforms/android/assets/www/js/app.js
index 170e012..257b7c2 100644
--- a/platforms/android/assets/www/js/app.js
+++ b/platforms/android/assets/www/js/app.js
@@ -7,7 +7,7 @@
 // 'starter.controllers' is found in controllers.js
 var db;
 
-angular.module('starter', ['ionic', 'ngCordova', 'starter.controllers', 'starter.services'])
+angular.module('starter', ['ionic', 'ngCordova', 'ionic-modal-select', 'starter.controllers', 'starter.services'])
 
 .run(function($ionicPlatform, $window, $ionicHistory, $database, $ionicPopup, $state, $localstorage, $rootScope) {
   $ionicPlatform.ready(function() {
diff --git a/platforms/android/assets/www/js/controllers.js b/platforms/android/assets/www/js/controllers.js
index 7d28709..dba9e1a 100644
--- a/platforms/android/assets/www/js/controllers.js
+++ b/platforms/android/assets/www/js/controllers.js
@@ -1,6 +1,6 @@
 angular.module('starter.controllers', [])
 
-.controller('DashCtrl', function($scope,$ionicPopup,$http, $database, $timeout,$rootScope, $cordovaFileTransfer,$cordovaFile,$ionicLoading,$state,$filter) {
+.controller('DashCtrl', function($scope,$ionicPopup,$http, $database, $timeout,$rootScope, $cordovaFileTransfer,$cordovaFile,$ionicLoading,$state,$filter,$ionicModal) {
 
   $scope.preis="";
   $scope.name="";
@@ -8,6 +8,22 @@ angular.module('starter.controllers', [])
   $scope.items=[];
   $scope.item=[];
 
+
+  $scope.backgroundpic = "1";
+  $scope.backgrounds =  [
+      { name : "Hintergrund 1", backvalue : "1", beschreibung: "Herzen und Tiere"}, 
+      { name : "Hintergrund 2", backvalue : "2", beschreibung: "geflügeltes Herz"}, 
+      { name : "Hintergrund 3", backvalue : "3", beschreibung: "Herzenmuster"}, 
+      { name : "Hintergrund 4", backvalue : "4", beschreibung: "Herzpflanzen"}, 
+      { name : "Hintergrund 5", backvalue : "5", beschreibung: "Neutral dunkel"}, 
+      { name : "Hintergrund 6", backvalue : "6", beschreibung: "Springendes Paar"}, 
+      { name : "Hintergrund 7", backvalue : "7", beschreibung: "Herzen mit Verzierung"}, 
+      { name : "Hintergrund 8", backvalue : "8", beschreibung: "Hände die sich halten"}, 
+      { name : "Hintergrund 9", backvalue : "9", beschreibung: "Stoffmuster"}, 
+      { name : "Hintergrund 10", backvalue : "10", beschreibung: "Ballons mit Herzen"},
+    ];
+
+
   $scope.producitems=[];
 
   $scope.rosen1titel="";
@@ -55,17 +71,52 @@ $scope.show = function() {
   $scope.validate = function() {
 
     var link = 'http://api.raataar.de/rosen/vorschau.php';
-
-    $http.post(link, {name : $scope.name, freitext: $scope.freitext, rosen: $scope.preis}).then(function (res){
+    $http.post(link, {name : $scope.name, freitext: $scope.freitext, rosen: $scope.preis, bg: $scope.backgroundpic}).then(function (res){
         $scope.response = res.data;
-        window.open($scope.response, '_system', 'location=yes'); 
+        //window.open($scope.response, '_system', 'location=yes'); 
+        //return false;
+        $scope.showVorschauImages($scope.response);
         return false;
     });
     
   };
 
 
+  /*
+  * Vorschau-Modal
+  */
+  $scope.showVorschauImages = function(imagesrc) {
+    //Bild im dialog anzeigen
+    $scope.imagesrc=imagesrc;
+    $scope.showVorschauModal('templates/image-vorschau-popover.html');
+  }
+ 
+  $scope.showVorschauModal = function(templateUrl) {
+    $ionicModal.fromTemplateUrl(templateUrl, {
+      scope: $scope,
+      animation: 'slide-in-up'
+    }).then(function(modal) {
+      $scope.modal = modal;
+      $scope.modal.show();
+    });
+  }
+ 
+  // Close the modal
+  $scope.closeVorschauModal = function() {
+    $scope.modal.hide();
+    $scope.modal.remove()
+  };
+  /*
+  * Vorschau-Modal ENDE
+  */
 
+  //Getter für Selectbox
+  $scope.getBackgroundOpt = function(option){
+    $scope.backgroundpic=option.backvalue;
+    return option.backvalue;
+  };
+
+  //Flatrate resetten DEBUGGING
   $scope.resetflat = function() {
     inappbilling.consumePurchase(function(result) {}, function(result) {}, 'rosenflatrate');
     $rootScope.flatrate=0;
@@ -74,6 +125,9 @@ $scope.show = function() {
   };
 
 
+  /*
+  * Zitat in Text-Box laden
+  */
   $scope.loadzitat = function() {
 
     $http({
@@ -149,9 +203,9 @@ $scope.show = function() {
     if($rootScope.flatrate==1) {
 
       $scope.showflatrate = false;
-      $scope.rosen1preistag="kostenlos -  Flaterate";
-      $scope.rosen3preistag="kostenlos -  Flaterate";
-      $scope.rosen9preistag="kostenlos -  Flaterate";
+      $scope.rosen1preistag="kostenlos -  Flatrate";
+      $scope.rosen3preistag="kostenlos -  Flatrate";
+      $scope.rosen9preistag="kostenlos -  Flatrate";
           
     }
 
@@ -177,7 +231,7 @@ $scope.show = function() {
   }
 
 
-  $timeout(getProducts, 1000);
+  $timeout(getProducts, 2000);
   /*
   * Produkt-Details abrufen ENDE
   */
@@ -226,7 +280,7 @@ $scope.show = function() {
     }
 
   function errorBuyHandler (error) {
-
+      /*
       var strResult = "";
       var returnBool=false;
 
@@ -235,7 +289,7 @@ $scope.show = function() {
       } else {
         strResult = error;
       }
-
+      */
       /*
       * Prüfen ob Kauf schonmal durchgeführt wurde, aber noch nicht konsumiert
       */
@@ -276,9 +330,9 @@ $scope.show = function() {
     $rootScope.flatrate=1;
     $scope.showflatrate = false;
 
-    $scope.rosen1preistag="kostenlos -  Flaterate";
-    $scope.rosen3preistag="kostenlos -  Flaterate";
-    $scope.rosen9preistag="kostenlos -  Flaterate";
+    $scope.rosen1preistag="kostenlos -  Flatrate";
+    $scope.rosen3preistag="kostenlos -  Flatrate";
+    $scope.rosen9preistag="kostenlos -  Flatrate";
 
     $timeout(getProducts, 300);
 
@@ -297,7 +351,7 @@ $scope.show = function() {
       $scope.show($ionicLoading);
       var link = 'http://api.raataar.de/rosen/kauf.php';
 
-      $http.post(link, {name : $scope.name, freitext: $scope.freitext, rosen: $scope.preis}).then(function (res){
+      $http.post(link, {name : $scope.name, freitext: $scope.freitext, rosen: $scope.preis, bg: $scope.backgroundpic}).then(function (res){
           $scope.filetodownload = res.data;
           
           // File for download
@@ -372,7 +426,7 @@ $scope.show = function() {
       inappbilling.consumePurchase(successConsumeHandler, errorConsumeHandler, $scope.preis);
   }
   /*
-  * Rosen konsuieren ENDE
+  * Rosen konsumieren ENDE
   */
 
 })
diff --git a/platforms/android/assets/www/js/ionic-modal-select.min.js b/platforms/android/assets/www/js/ionic-modal-select.min.js
new file mode 100644
index 0000000..73556da
--- /dev/null
+++ b/platforms/android/assets/www/js/ionic-modal-select.min.js
@@ -0,0 +1 @@
+var modalSelectTemplates=modalSelectTemplates||{};modalSelectTemplates["modal-template-multiple.html"]=' <ion-modal-view class="ionic-select-modal" ng-class="::ui.modalClass">\n    <ion-header-bar ng-class="::ui.headerFooterClass">\n      <h1 class="title">{{::ui.modalTitle}} MULTIPLE</h1>\n    </ion-header-bar>\n    <ion-content>\n\n    <div ng-if="!ui.shortList">\n        <div class="text-center" ng-if="!showList" style="padding-top:40px;">\n            <h4 class="muted">{{::ui.loadListMessage}}</h4>\n            <p>\n                <ion-spinner></ion-spinner>\n            </p>\n        </div>\n        <div class="list" ng-if="showList" class="animate-if">\n            <div class="item item-text-wrap" collection-repeat="option in options track by $index" ng-click="setOption(option)" ng-class="{\'{{::ui.selectedClass}}\': getSelectedValue(option) == ui.value}"> \n                <div compile="inner" compile-once="true"></div>\n            </div>\n        </div>\n    </div>\n    <div ng-if="ui.shortList">\n        <div class="list">\n            <div class="item item-checkbox" ng-repeat="option in options track by $index">\n                <label class="checkbox">\n                    <input type="checkbox" ng-model="isChecked[$index]">\n                </label>\n                <div compile="inner" compile-once="true"></div>\n            </div>\n        </div>\n    </div>\n    </ion-content>\n    <ion-footer-bar ng-class="::ui.headerFooterClass">\n        <button class="button button-stable" ng-click="closeModal()">{{ui.cancelButton}}</button>\n        <h2 class="title"><button class="button">OK</button></h2>\n        <button ng-if="::!ui.hideReset" class="button button-stable" ng-click="unsetValue()">{{ui.resetButton}}</button>\n    </ion-footer-bar>\n</ion-modal-view>\n';var modalSelectTemplates=modalSelectTemplates||{};modalSelectTemplates["modal-template.html"]=' <ion-modal-view class="ionic-select-modal" ng-class="::ui.modalClass">\n    \n    <ion-header-bar ng-class="::ui.headerFooterClass">\n      <h1 class="title">{{::ui.modalTitle}}</h1>\n    </ion-header-bar>\n\n    <div class="bar bar-subheader item-input-inset" ng-class="::ui.subHeaderClass" ng-if="ui.hasSearch">\n      <label class="item-input-wrapper">\n        <i class="icon ion-ios-search placeholder-icon"></i>\n        <input type="search" placeholder="{{::ui.searchPlaceholder}}" ng-model="ui.searchValue">\n      </label>\n      <button class="button button-clear" ng-click="clearSearch()">\n        {{ ui.cancelSearchButton }}\n      </button>\n    </div>\n\n    <ion-content class="has-header" ng-class="{\'has-subheader\':ui.hasSearch}">\n        <div class="text-center" ng-if="!ui.shortList && !showList" style="padding-top:40px;">\n            <h4 class="muted">{{::ui.loadListMessage}}</h4>\n            <p>\n                <ion-spinner></ion-spinner>\n            </p>\n        </div>\n        <div ng-if="showList">\n            <div ng-if="!ui.shortList">\n                <div class="list" ng-if="showList" class="animate-if">\n                    <div class="item item-text-wrap" collection-repeat="option in options track by $index" ng-click="setOption(option)" ng-class="{\'{{::ui.selectedClass}}\': compareValues(getSelectedValue(option), ui.value) }"> \n                        <div compile="inner" compile-once="true"></div>\n                    </div>\n                </div>\n            </div>\n            <div ng-if="ui.shortList">\n                <div class="list">\n                    <div class="item item-text-wrap" ng-repeat="option in options track by $index" ng-click="setOption(option)" ng-class="{\'{{::ui.selectedClass}}\': compareValues(getSelectedValue(option), ui.value) }">\n                        <div compile="inner" compile-once="true"></div>\n                    </div>\n                </div>\n            </div>\n        </div>\n    </ion-content>\n\n    <ion-footer-bar ng-class="::ui.headerFooterClass">\n        <button class="button button-stable modal-select-close-button" ng-click="closeModal()">{{ui.cancelButton}}</button>\n        <button ng-if="::!ui.hideReset" class="button button-stable" ng-click="unsetValue()">{{ui.resetButton}}</button>\n    </ion-footer-bar>\n\n</ion-modal-view>\n',function(){angular.module("ionic-modal-select",[]).directive("compile",["$compile",function($compile){return function(scope,iElement,iAttrs){var x=scope.$watch(function(scope){return scope.$eval(iAttrs.compile)},function(value){iElement.html(value),$compile(iElement.contents())(scope),"true"===iAttrs.compileOnce&&x()})}}]).directive("modalSelect",["$ionicModal","$timeout","$filter","$parse",function($ionicModal,$timeout,$filter,$parse){return{restrict:"A",require:"ngModel",scope:{initialOptions:"=options",optionGetter:"&",onSelect:"&",onReset:"&"},link:function(scope,iElement,iAttrs,ngModelController,transclude){function updateListMode(){"true"===iAttrs.useCollectionRepeat?shortList=!1:"false"===iAttrs.useCollectionRepeat?shortList=!0:"undefined"!=typeof scope.options&&(shortList=!!(scope.options.length<shortListBreak)),scope.ui.shortList=shortList}var shortList=!0,shortListBreak=iAttrs.shortListBreak?parseInt(iAttrs.shortListBreak):10,setFromProperty=iAttrs.optionProperty,onOptionSelect=iAttrs.optionGetter,clearSearchOnSelect="false"!==iAttrs.clearSearchOnSelect?!0:!1,multiple=iAttrs.multiple?!0:!1;multiple&&(scope.checkedItems=[]),scope.ui={modalTitle:iAttrs.modalTitle||"Select an option",okButton:iAttrs.okButton||"OK",hideReset:"true"!==iAttrs.hideReset?!1:!0,resetButton:iAttrs.resetButton||"Reset",cancelButton:iAttrs.cancelButton||"Cancel",loadListMessage:iAttrs.loadListMessage||"Loading",modalClass:iAttrs.modalClass||"",headerFooterClass:iAttrs.headerFooterClass||"bar-stable",value:null,selectedClass:iAttrs.selectedClass||"option-selected",hasSearch:"true"!==iAttrs.hasSearch?!1:!0,searchValue:"",searchPlaceholder:iAttrs.searchPlaceholder||"Search",subHeaderClass:iAttrs.subHeaderClass||"bar-stable",cancelSearchButton:iAttrs.cancelSearchButton||"Clear"};var allOptions=[];if(scope.options=[],iAttrs.optionsExpression){var optionsExpression=iAttrs.optionsExpression,match=optionsExpression.match(/^\s*([\s\S]+?)\s+in\s+([\s\S]+?)(?:\s+track\s+by\s+([\s\S]+?))?\s*$/);if(!match)throw new Error("collection-repeat expected expression in form of '_item_ in _collection_[ track by _id_]' but got '"+iAttrs.optionsExpression+"'.");var listExpr=(match[1],match[2]),listGetter=$parse(listExpr),s=iElement.scope();scope.$watch(function(){return listGetter(s)},function(nv,ov){allOptions=angular.copy(nv),scope.options=angular.copy(nv),updateListMode()},!0)}else scope.$watch("initialOptions",function(nv){allOptions=angular.copy(nv),scope.options=angular.copy(nv),updateListMode()});var opt=iElement[0].querySelector(".option");if(!opt)throw new Error({name:"modalSelectError:noOptionTemplate",message:'When using modalSelect directive you must include an element with class "option" to provide a template for your select options.',toString:function(){return this.name+" "+this.message}});scope.inner=angular.element(opt).html(),"remove"in Element.prototype||(Element.prototype.remove=function(){this.parentNode.removeChild(this)}),angular.element(opt).remove(),ngModelController.$render=function(){scope.ui.value=ngModelController.$viewValue};var getSelectedValue=scope.getSelectedValue=function(option){if(!option)return null;if(onOptionSelect){var out=scope.optionGetter({option:option});return out}return setFromProperty?val=option[setFromProperty]:val=option,val};scope.setOption=function(option){var oldValue=ngModelController.$viewValue,val=getSelectedValue(option);ngModelController.$setViewValue(val),ngModelController.$render(),scope.onSelect&&scope.onSelect({newValue:val,oldValue:oldValue}),scope.modal.hide().then(function(){scope.showList=!1,scope.ui.hasSearch&&clearSearchOnSelect&&(scope.ui.searchValue="")})},scope.unsetValue=function(){$timeout(function(){ngModelController.$setViewValue(""),ngModelController.$render(),scope.modal.hide(),scope.showList=!1,scope.onReset&&angular.isFunction(scope.onReset)&&scope.onReset()})},scope.closeModal=function(){scope.modal.hide().then(function(){scope.showList=!1})},scope.compareValues=function(a,b){return angular.equals(a,b)};var modalTpl=multiple?"modal-template-multiple.html":"modal-template.html";scope.modal=$ionicModal.fromTemplate(modalSelectTemplates[modalTpl],{scope:scope}),scope.$on("$destroy",function(){scope.modal.remove()}),iElement.on("click",function(){shortList?(scope.showList=!0,scope.modal.show()):scope.modal.show().then(function(){scope.showList=!0,scope.ui.shortList=shortList})}),scope.ui.hasSearch&&(scope.$watch("ui.searchValue",function(nv){scope.options=$filter("filter")(allOptions,nv)}),scope.clearSearch=function(){scope.ui.searchValue=""}),ngModelController.$render()}}}])}();
\ No newline at end of file
diff --git a/platforms/android/assets/www/templates/image-vorschau-popover.html b/platforms/android/assets/www/templates/image-vorschau-popover.html
new file mode 100644
index 0000000..5096505
--- /dev/null
+++ b/platforms/android/assets/www/templates/image-vorschau-popover.html
@@ -0,0 +1,3 @@
+<div class="modal image-modal transparent" ng-click="closeVorschauModal()">
+            <img ng-src="{{imagesrc}}" class="fullscreen-image"/>
+</div>
\ No newline at end of file
diff --git a/platforms/android/assets/www/templates/tab-dash.html b/platforms/android/assets/www/templates/tab-dash.html
index 9640cba..c104975 100644
--- a/platforms/android/assets/www/templates/tab-dash.html
+++ b/platforms/android/assets/www/templates/tab-dash.html
@@ -46,6 +46,16 @@
           </ion-list>
          </div>
 		
+    <div style="padding-bottom:15px;">
+      <button class="button button-full button-custom" modal-select="" ng-model="backgroundpic" options="backgrounds" option-getter="getBackgroundOpt(option)" modal-title="Hintergrund wählen">
+        {{ 'Hintergrund: ' +  backgroundpic || 'Hintergrund'}}
+          <div class="option">
+            <h2>{{option.name}}</h2>
+            <p>{{option.beschreibung}}</p>
+        </div>
+      </button>
+    </div>
+
 		<div class="list card">
         <div class="item item-divider oleo">Rosen jetzt kaufen?</div>
   
diff --git a/platforms/android/build/intermediates/assets/debug/www/index.html b/platforms/android/build/intermediates/assets/debug/www/index.html
index dff66f1..0c94c92 100644
--- a/platforms/android/build/intermediates/assets/debug/www/index.html
+++ b/platforms/android/build/intermediates/assets/debug/www/index.html
@@ -8,7 +8,7 @@
     <link href="lib/ionic/css/ionic.css" rel="stylesheet">
     <link href='https://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'>
     <link href='https://fonts.googleapis.com/css?family=Oswald:400,300,700' rel='stylesheet' type='text/css'>
-	<link href='https://fonts.googleapis.com/css?family=Bubblegum+Sans' rel='stylesheet' type='text/css'>
+	  <link href='https://fonts.googleapis.com/css?family=Bubblegum+Sans' rel='stylesheet' type='text/css'>
     <link href="css/style.css" rel="stylesheet">
 
     <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
@@ -17,6 +17,7 @@
 
     <!-- ionic/angularjs js -->
     <script src="lib/ionic/js/ionic.bundle.js"></script>
+    <script src="js/ionic-modal-select.min.js"></script>
     <script src="js/ng-cordova.min.js"></script>
     <!-- cordova script (this will be a 404 during development) -->
     <script src="cordova.js"></script>
diff --git a/platforms/android/build/intermediates/assets/debug/www/js/app.js b/platforms/android/build/intermediates/assets/debug/www/js/app.js
index 170e012..257b7c2 100644
--- a/platforms/android/build/intermediates/assets/debug/www/js/app.js
+++ b/platforms/android/build/intermediates/assets/debug/www/js/app.js
@@ -7,7 +7,7 @@
 // 'starter.controllers' is found in controllers.js
 var db;
 
-angular.module('starter', ['ionic', 'ngCordova', 'starter.controllers', 'starter.services'])
+angular.module('starter', ['ionic', 'ngCordova', 'ionic-modal-select', 'starter.controllers', 'starter.services'])
 
 .run(function($ionicPlatform, $window, $ionicHistory, $database, $ionicPopup, $state, $localstorage, $rootScope) {
   $ionicPlatform.ready(function() {
diff --git a/platforms/android/build/intermediates/assets/debug/www/js/controllers.js b/platforms/android/build/intermediates/assets/debug/www/js/controllers.js
index 7d28709..dba9e1a 100644
--- a/platforms/android/build/intermediates/assets/debug/www/js/controllers.js
+++ b/platforms/android/build/intermediates/assets/debug/www/js/controllers.js
@@ -1,6 +1,6 @@
 angular.module('starter.controllers', [])
 
-.controller('DashCtrl', function($scope,$ionicPopup,$http, $database, $timeout,$rootScope, $cordovaFileTransfer,$cordovaFile,$ionicLoading,$state,$filter) {
+.controller('DashCtrl', function($scope,$ionicPopup,$http, $database, $timeout,$rootScope, $cordovaFileTransfer,$cordovaFile,$ionicLoading,$state,$filter,$ionicModal) {
 
   $scope.preis="";
   $scope.name="";
@@ -8,6 +8,22 @@ angular.module('starter.controllers', [])
   $scope.items=[];
   $scope.item=[];
 
+
+  $scope.backgroundpic = "1";
+  $scope.backgrounds =  [
+      { name : "Hintergrund 1", backvalue : "1", beschreibung: "Herzen und Tiere"}, 
+      { name : "Hintergrund 2", backvalue : "2", beschreibung: "geflügeltes Herz"}, 
+      { name : "Hintergrund 3", backvalue : "3", beschreibung: "Herzenmuster"}, 
+      { name : "Hintergrund 4", backvalue : "4", beschreibung: "Herzpflanzen"}, 
+      { name : "Hintergrund 5", backvalue : "5", beschreibung: "Neutral dunkel"}, 
+      { name : "Hintergrund 6", backvalue : "6", beschreibung: "Springendes Paar"}, 
+      { name : "Hintergrund 7", backvalue : "7", beschreibung: "Herzen mit Verzierung"}, 
+      { name : "Hintergrund 8", backvalue : "8", beschreibung: "Hände die sich halten"}, 
+      { name : "Hintergrund 9", backvalue : "9", beschreibung: "Stoffmuster"}, 
+      { name : "Hintergrund 10", backvalue : "10", beschreibung: "Ballons mit Herzen"},
+    ];
+
+
   $scope.producitems=[];
 
   $scope.rosen1titel="";
@@ -55,17 +71,52 @@ $scope.show = function() {
   $scope.validate = function() {
 
     var link = 'http://api.raataar.de/rosen/vorschau.php';
-
-    $http.post(link, {name : $scope.name, freitext: $scope.freitext, rosen: $scope.preis}).then(function (res){
+    $http.post(link, {name : $scope.name, freitext: $scope.freitext, rosen: $scope.preis, bg: $scope.backgroundpic}).then(function (res){
         $scope.response = res.data;
-        window.open($scope.response, '_system', 'location=yes'); 
+        //window.open($scope.response, '_system', 'location=yes'); 
+        //return false;
+        $scope.showVorschauImages($scope.response);
         return false;
     });
     
   };
 
 
+  /*
+  * Vorschau-Modal
+  */
+  $scope.showVorschauImages = function(imagesrc) {
+    //Bild im dialog anzeigen
+    $scope.imagesrc=imagesrc;
+    $scope.showVorschauModal('templates/image-vorschau-popover.html');
+  }
+ 
+  $scope.showVorschauModal = function(templateUrl) {
+    $ionicModal.fromTemplateUrl(templateUrl, {
+      scope: $scope,
+      animation: 'slide-in-up'
+    }).then(function(modal) {
+      $scope.modal = modal;
+      $scope.modal.show();
+    });
+  }
+ 
+  // Close the modal
+  $scope.closeVorschauModal = function() {
+    $scope.modal.hide();
+    $scope.modal.remove()
+  };
+  /*
+  * Vorschau-Modal ENDE
+  */
 
+  //Getter für Selectbox
+  $scope.getBackgroundOpt = function(option){
+    $scope.backgroundpic=option.backvalue;
+    return option.backvalue;
+  };
+
+  //Flatrate resetten DEBUGGING
   $scope.resetflat = function() {
     inappbilling.consumePurchase(function(result) {}, function(result) {}, 'rosenflatrate');
     $rootScope.flatrate=0;
@@ -74,6 +125,9 @@ $scope.show = function() {
   };
 
 
+  /*
+  * Zitat in Text-Box laden
+  */
   $scope.loadzitat = function() {
 
     $http({
@@ -149,9 +203,9 @@ $scope.show = function() {
     if($rootScope.flatrate==1) {
 
       $scope.showflatrate = false;
-      $scope.rosen1preistag="kostenlos -  Flaterate";
-      $scope.rosen3preistag="kostenlos -  Flaterate";
-      $scope.rosen9preistag="kostenlos -  Flaterate";
+      $scope.rosen1preistag="kostenlos -  Flatrate";
+      $scope.rosen3preistag="kostenlos -  Flatrate";
+      $scope.rosen9preistag="kostenlos -  Flatrate";
           
     }
 
@@ -177,7 +231,7 @@ $scope.show = function() {
   }
 
 
-  $timeout(getProducts, 1000);
+  $timeout(getProducts, 2000);
   /*
   * Produkt-Details abrufen ENDE
   */
@@ -226,7 +280,7 @@ $scope.show = function() {
     }
 
   function errorBuyHandler (error) {
-
+      /*
       var strResult = "";
       var returnBool=false;
 
@@ -235,7 +289,7 @@ $scope.show = function() {
       } else {
         strResult = error;
       }
-
+      */
       /*
       * Prüfen ob Kauf schonmal durchgeführt wurde, aber noch nicht konsumiert
       */
@@ -276,9 +330,9 @@ $scope.show = function() {
     $rootScope.flatrate=1;
     $scope.showflatrate = false;
 
-    $scope.rosen1preistag="kostenlos -  Flaterate";
-    $scope.rosen3preistag="kostenlos -  Flaterate";
-    $scope.rosen9preistag="kostenlos -  Flaterate";
+    $scope.rosen1preistag="kostenlos -  Flatrate";
+    $scope.rosen3preistag="kostenlos -  Flatrate";
+    $scope.rosen9preistag="kostenlos -  Flatrate";
 
     $timeout(getProducts, 300);
 
@@ -297,7 +351,7 @@ $scope.show = function() {
       $scope.show($ionicLoading);
       var link = 'http://api.raataar.de/rosen/kauf.php';
 
-      $http.post(link, {name : $scope.name, freitext: $scope.freitext, rosen: $scope.preis}).then(function (res){
+      $http.post(link, {name : $scope.name, freitext: $scope.freitext, rosen: $scope.preis, bg: $scope.backgroundpic}).then(function (res){
           $scope.filetodownload = res.data;
           
           // File for download
@@ -372,7 +426,7 @@ $scope.show = function() {
       inappbilling.consumePurchase(successConsumeHandler, errorConsumeHandler, $scope.preis);
   }
   /*
-  * Rosen konsuieren ENDE
+  * Rosen konsumieren ENDE
   */
 
 })
diff --git a/platforms/android/build/intermediates/assets/debug/www/templates/tab-dash.html b/platforms/android/build/intermediates/assets/debug/www/templates/tab-dash.html
index 9640cba..c104975 100644
--- a/platforms/android/build/intermediates/assets/debug/www/templates/tab-dash.html
+++ b/platforms/android/build/intermediates/assets/debug/www/templates/tab-dash.html
@@ -46,6 +46,16 @@
           </ion-list>
          </div>
 		
+    <div style="padding-bottom:15px;">
+      <button class="button button-full button-custom" modal-select="" ng-model="backgroundpic" options="backgrounds" option-getter="getBackgroundOpt(option)" modal-title="Hintergrund wählen">
+        {{ 'Hintergrund: ' +  backgroundpic || 'Hintergrund'}}
+          <div class="option">
+            <h2>{{option.name}}</h2>
+            <p>{{option.beschreibung}}</p>
+        </div>
+      </button>
+    </div>
+
 		<div class="list card">
         <div class="item item-divider oleo">Rosen jetzt kaufen?</div>
   
diff --git a/platforms/android/build/intermediates/assets/release/www/index.html b/platforms/android/build/intermediates/assets/release/www/index.html
index dff66f1..0c94c92 100644
--- a/platforms/android/build/intermediates/assets/release/www/index.html
+++ b/platforms/android/build/intermediates/assets/release/www/index.html
@@ -8,7 +8,7 @@
     <link href="lib/ionic/css/ionic.css" rel="stylesheet">
     <link href='https://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'>
     <link href='https://fonts.googleapis.com/css?family=Oswald:400,300,700' rel='stylesheet' type='text/css'>
-	<link href='https://fonts.googleapis.com/css?family=Bubblegum+Sans' rel='stylesheet' type='text/css'>
+	  <link href='https://fonts.googleapis.com/css?family=Bubblegum+Sans' rel='stylesheet' type='text/css'>
     <link href="css/style.css" rel="stylesheet">
 
     <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
@@ -17,6 +17,7 @@
 
     <!-- ionic/angularjs js -->
     <script src="lib/ionic/js/ionic.bundle.js"></script>
+    <script src="js/ionic-modal-select.min.js"></script>
     <script src="js/ng-cordova.min.js"></script>
     <!-- cordova script (this will be a 404 during development) -->
     <script src="cordova.js"></script>
diff --git a/platforms/android/build/intermediates/assets/release/www/js/app.js b/platforms/android/build/intermediates/assets/release/www/js/app.js
index 170e012..257b7c2 100644
--- a/platforms/android/build/intermediates/assets/release/www/js/app.js
+++ b/platforms/android/build/intermediates/assets/release/www/js/app.js
@@ -7,7 +7,7 @@
 // 'starter.controllers' is found in controllers.js
 var db;
 
-angular.module('starter', ['ionic', 'ngCordova', 'starter.controllers', 'starter.services'])
+angular.module('starter', ['ionic', 'ngCordova', 'ionic-modal-select', 'starter.controllers', 'starter.services'])
 
 .run(function($ionicPlatform, $window, $ionicHistory, $database, $ionicPopup, $state, $localstorage, $rootScope) {
   $ionicPlatform.ready(function() {
diff --git a/platforms/android/build/intermediates/assets/release/www/js/controllers.js b/platforms/android/build/intermediates/assets/release/www/js/controllers.js
index 7d28709..dba9e1a 100644
--- a/platforms/android/build/intermediates/assets/release/www/js/controllers.js
+++ b/platforms/android/build/intermediates/assets/release/www/js/controllers.js
@@ -1,6 +1,6 @@
 angular.module('starter.controllers', [])
 
-.controller('DashCtrl', function($scope,$ionicPopup,$http, $database, $timeout,$rootScope, $cordovaFileTransfer,$cordovaFile,$ionicLoading,$state,$filter) {
+.controller('DashCtrl', function($scope,$ionicPopup,$http, $database, $timeout,$rootScope, $cordovaFileTransfer,$cordovaFile,$ionicLoading,$state,$filter,$ionicModal) {
 
   $scope.preis="";
   $scope.name="";
@@ -8,6 +8,22 @@ angular.module('starter.controllers', [])
   $scope.items=[];
   $scope.item=[];
 
+
+  $scope.backgroundpic = "1";
+  $scope.backgrounds =  [
+      { name : "Hintergrund 1", backvalue : "1", beschreibung: "Herzen und Tiere"}, 
+      { name : "Hintergrund 2", backvalue : "2", beschreibung: "geflügeltes Herz"}, 
+      { name : "Hintergrund 3", backvalue : "3", beschreibung: "Herzenmuster"}, 
+      { name : "Hintergrund 4", backvalue : "4", beschreibung: "Herzpflanzen"}, 
+      { name : "Hintergrund 5", backvalue : "5", beschreibung: "Neutral dunkel"}, 
+      { name : "Hintergrund 6", backvalue : "6", beschreibung: "Springendes Paar"}, 
+      { name : "Hintergrund 7", backvalue : "7", beschreibung: "Herzen mit Verzierung"}, 
+      { name : "Hintergrund 8", backvalue : "8", beschreibung: "Hände die sich halten"}, 
+      { name : "Hintergrund 9", backvalue : "9", beschreibung: "Stoffmuster"}, 
+      { name : "Hintergrund 10", backvalue : "10", beschreibung: "Ballons mit Herzen"},
+    ];
+
+
   $scope.producitems=[];
 
   $scope.rosen1titel="";
@@ -55,17 +71,52 @@ $scope.show = function() {
   $scope.validate = function() {
 
     var link = 'http://api.raataar.de/rosen/vorschau.php';
-
-    $http.post(link, {name : $scope.name, freitext: $scope.freitext, rosen: $scope.preis}).then(function (res){
+    $http.post(link, {name : $scope.name, freitext: $scope.freitext, rosen: $scope.preis, bg: $scope.backgroundpic}).then(function (res){
         $scope.response = res.data;
-        window.open($scope.response, '_system', 'location=yes'); 
+        //window.open($scope.response, '_system', 'location=yes'); 
+        //return false;
+        $scope.showVorschauImages($scope.response);
         return false;
     });
     
   };
 
 
+  /*
+  * Vorschau-Modal
+  */
+  $scope.showVorschauImages = function(imagesrc) {
+    //Bild im dialog anzeigen
+    $scope.imagesrc=imagesrc;
+    $scope.showVorschauModal('templates/image-vorschau-popover.html');
+  }
+ 
+  $scope.showVorschauModal = function(templateUrl) {
+    $ionicModal.fromTemplateUrl(templateUrl, {
+      scope: $scope,
+      animation: 'slide-in-up'
+    }).then(function(modal) {
+      $scope.modal = modal;
+      $scope.modal.show();
+    });
+  }
+ 
+  // Close the modal
+  $scope.closeVorschauModal = function() {
+    $scope.modal.hide();
+    $scope.modal.remove()
+  };
+  /*
+  * Vorschau-Modal ENDE
+  */
 
+  //Getter für Selectbox
+  $scope.getBackgroundOpt = function(option){
+    $scope.backgroundpic=option.backvalue;
+    return option.backvalue;
+  };
+
+  //Flatrate resetten DEBUGGING
   $scope.resetflat = function() {
     inappbilling.consumePurchase(function(result) {}, function(result) {}, 'rosenflatrate');
     $rootScope.flatrate=0;
@@ -74,6 +125,9 @@ $scope.show = function() {
   };
 
 
+  /*
+  * Zitat in Text-Box laden
+  */
   $scope.loadzitat = function() {
 
     $http({
@@ -149,9 +203,9 @@ $scope.show = function() {
     if($rootScope.flatrate==1) {
 
       $scope.showflatrate = false;
-      $scope.rosen1preistag="kostenlos -  Flaterate";
-      $scope.rosen3preistag="kostenlos -  Flaterate";
-      $scope.rosen9preistag="kostenlos -  Flaterate";
+      $scope.rosen1preistag="kostenlos -  Flatrate";
+      $scope.rosen3preistag="kostenlos -  Flatrate";
+      $scope.rosen9preistag="kostenlos -  Flatrate";
           
     }
 
@@ -177,7 +231,7 @@ $scope.show = function() {
   }
 
 
-  $timeout(getProducts, 1000);
+  $timeout(getProducts, 2000);
   /*
   * Produkt-Details abrufen ENDE
   */
@@ -226,7 +280,7 @@ $scope.show = function() {
     }
 
   function errorBuyHandler (error) {
-
+      /*
       var strResult = "";
       var returnBool=false;
 
@@ -235,7 +289,7 @@ $scope.show = function() {
       } else {
         strResult = error;
       }
-
+      */
       /*
       * Prüfen ob Kauf schonmal durchgeführt wurde, aber noch nicht konsumiert
       */
@@ -276,9 +330,9 @@ $scope.show = function() {
     $rootScope.flatrate=1;
     $scope.showflatrate = false;
 
-    $scope.rosen1preistag="kostenlos -  Flaterate";
-    $scope.rosen3preistag="kostenlos -  Flaterate";
-    $scope.rosen9preistag="kostenlos -  Flaterate";
+    $scope.rosen1preistag="kostenlos -  Flatrate";
+    $scope.rosen3preistag="kostenlos -  Flatrate";
+    $scope.rosen9preistag="kostenlos -  Flatrate";
 
     $timeout(getProducts, 300);
 
@@ -297,7 +351,7 @@ $scope.show = function() {
       $scope.show($ionicLoading);
       var link = 'http://api.raataar.de/rosen/kauf.php';
 
-      $http.post(link, {name : $scope.name, freitext: $scope.freitext, rosen: $scope.preis}).then(function (res){
+      $http.post(link, {name : $scope.name, freitext: $scope.freitext, rosen: $scope.preis, bg: $scope.backgroundpic}).then(function (res){
           $scope.filetodownload = res.data;
           
           // File for download
@@ -372,7 +426,7 @@ $scope.show = function() {
       inappbilling.consumePurchase(successConsumeHandler, errorConsumeHandler, $scope.preis);
   }
   /*
-  * Rosen konsuieren ENDE
+  * Rosen konsumieren ENDE
   */
 
 })
diff --git a/platforms/android/build/intermediates/assets/release/www/templates/tab-dash.html b/platforms/android/build/intermediates/assets/release/www/templates/tab-dash.html
index 9640cba..c104975 100644
--- a/platforms/android/build/intermediates/assets/release/www/templates/tab-dash.html
+++ b/platforms/android/build/intermediates/assets/release/www/templates/tab-dash.html
@@ -46,6 +46,16 @@
           </ion-list>
          </div>
 		
+    <div style="padding-bottom:15px;">
+      <button class="button button-full button-custom" modal-select="" ng-model="backgroundpic" options="backgrounds" option-getter="getBackgroundOpt(option)" modal-title="Hintergrund wählen">
+        {{ 'Hintergrund: ' +  backgroundpic || 'Hintergrund'}}
+          <div class="option">
+            <h2>{{option.name}}</h2>
+            <p>{{option.beschreibung}}</p>
+        </div>
+      </button>
+    </div>
+
 		<div class="list card">
         <div class="item item-divider oleo">Rosen jetzt kaufen?</div>
   
diff --git a/platforms/android/build/intermediates/gradle_project_sync_data.bin b/platforms/android/build/intermediates/gradle_project_sync_data.bin
index b7c3dd9..3eb95b0 100644
Binary files a/platforms/android/build/intermediates/gradle_project_sync_data.bin and b/platforms/android/build/intermediates/gradle_project_sync_data.bin differ
diff --git a/platforms/android/build/intermediates/res/resources-debug.ap_ b/platforms/android/build/intermediates/res/resources-debug.ap_
index 37143c6..05b1ec9 100644
Binary files a/platforms/android/build/intermediates/res/resources-debug.ap_ and b/platforms/android/build/intermediates/res/resources-debug.ap_ differ
diff --git a/platforms/android/build/intermediates/res/resources-release.ap_ b/platforms/android/build/intermediates/res/resources-release.ap_
index e64cf3d..66c0be8 100644
Binary files a/platforms/android/build/intermediates/res/resources-release.ap_ and b/platforms/android/build/intermediates/res/resources-release.ap_ differ
diff --git a/platforms/android/build/outputs/apk/android-debug-unaligned.apk b/platforms/android/build/outputs/apk/android-debug-unaligned.apk
index 4a073b5..ebf7004 100644
Binary files a/platforms/android/build/outputs/apk/android-debug-unaligned.apk and b/platforms/android/build/outputs/apk/android-debug-unaligned.apk differ
diff --git a/platforms/android/build/outputs/apk/android-debug.apk b/platforms/android/build/outputs/apk/android-debug.apk
index 7927b2a..d5908b9 100644
Binary files a/platforms/android/build/outputs/apk/android-debug.apk and b/platforms/android/build/outputs/apk/android-debug.apk differ
diff --git a/platforms/android/build/outputs/apk/android-release-unaligned.apk b/platforms/android/build/outputs/apk/android-release-unaligned.apk
index 759baca..f4429d7 100644
Binary files a/platforms/android/build/outputs/apk/android-release-unaligned.apk and b/platforms/android/build/outputs/apk/android-release-unaligned.apk differ
diff --git a/platforms/android/build/outputs/lint-results-release-fatal.html b/platforms/android/build/outputs/lint-results-release-fatal.html
index ec0fad2..29dce17 100644
--- a/platforms/android/build/outputs/lint-results-release-fatal.html
+++ b/platforms/android/build/outputs/lint-results-release-fatal.html
@@ -18,7 +18,7 @@ document.getElementById(id+'Link').style.display = 'none';
 <body>
 <h1>Lint Report</h1>
 <div class="titleSeparator"></div>
-Check performed at Wed Feb 03 14:31:51 CET 2016.<br/>
+Check performed at Thu Feb 04 11:24:33 CET 2016.<br/>
 6 errors and 0 warnings found:<br/><br/>
 <table class="overview">
 <tr><td></td><td class="categoryColumn"><a href="#Correctness">Correctness</a>
diff --git a/www/index.html b/www/index.html
index 5150cf6..2fe20e0 100644
--- a/www/index.html
+++ b/www/index.html
@@ -8,7 +8,7 @@
     <link href="lib/ionic/css/ionic.css" rel="stylesheet">
     <link href='https://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'>
     <link href='https://fonts.googleapis.com/css?family=Oswald:400,300,700' rel='stylesheet' type='text/css'>
-	<link href='https://fonts.googleapis.com/css?family=Bubblegum+Sans' rel='stylesheet' type='text/css'>
+	  <link href='https://fonts.googleapis.com/css?family=Bubblegum+Sans' rel='stylesheet' type='text/css'>
     <link href="css/style.css" rel="stylesheet">
 
     <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
@@ -17,6 +17,7 @@
 
     <!-- ionic/angularjs js -->
     <script src="lib/ionic/js/ionic.bundle.js"></script>
+    <script src="js/ionic-modal-select.min.js"></script>
     <script src="js/ng-cordova.min.js"></script>
     <!-- cordova script (this will be a 404 during development) -->
     <script src="cordova.js"></script>
diff --git a/www/js/app.js b/www/js/app.js
index 170e012..257b7c2 100644
--- a/www/js/app.js
+++ b/www/js/app.js
@@ -7,7 +7,7 @@
 // 'starter.controllers' is found in controllers.js
 var db;
 
-angular.module('starter', ['ionic', 'ngCordova', 'starter.controllers', 'starter.services'])
+angular.module('starter', ['ionic', 'ngCordova', 'ionic-modal-select', 'starter.controllers', 'starter.services'])
 
 .run(function($ionicPlatform, $window, $ionicHistory, $database, $ionicPopup, $state, $localstorage, $rootScope) {
   $ionicPlatform.ready(function() {
diff --git a/www/js/controllers.js b/www/js/controllers.js
index 7d28709..dba9e1a 100644
--- a/www/js/controllers.js
+++ b/www/js/controllers.js
@@ -1,6 +1,6 @@
 angular.module('starter.controllers', [])
 
-.controller('DashCtrl', function($scope,$ionicPopup,$http, $database, $timeout,$rootScope, $cordovaFileTransfer,$cordovaFile,$ionicLoading,$state,$filter) {
+.controller('DashCtrl', function($scope,$ionicPopup,$http, $database, $timeout,$rootScope, $cordovaFileTransfer,$cordovaFile,$ionicLoading,$state,$filter,$ionicModal) {
 
   $scope.preis="";
   $scope.name="";
@@ -8,6 +8,22 @@ angular.module('starter.controllers', [])
   $scope.items=[];
   $scope.item=[];
 
+
+  $scope.backgroundpic = "1";
+  $scope.backgrounds =  [
+      { name : "Hintergrund 1", backvalue : "1", beschreibung: "Herzen und Tiere"}, 
+      { name : "Hintergrund 2", backvalue : "2", beschreibung: "geflügeltes Herz"}, 
+      { name : "Hintergrund 3", backvalue : "3", beschreibung: "Herzenmuster"}, 
+      { name : "Hintergrund 4", backvalue : "4", beschreibung: "Herzpflanzen"}, 
+      { name : "Hintergrund 5", backvalue : "5", beschreibung: "Neutral dunkel"}, 
+      { name : "Hintergrund 6", backvalue : "6", beschreibung: "Springendes Paar"}, 
+      { name : "Hintergrund 7", backvalue : "7", beschreibung: "Herzen mit Verzierung"}, 
+      { name : "Hintergrund 8", backvalue : "8", beschreibung: "Hände die sich halten"}, 
+      { name : "Hintergrund 9", backvalue : "9", beschreibung: "Stoffmuster"}, 
+      { name : "Hintergrund 10", backvalue : "10", beschreibung: "Ballons mit Herzen"},
+    ];
+
+
   $scope.producitems=[];
 
   $scope.rosen1titel="";
@@ -55,17 +71,52 @@ $scope.show = function() {
   $scope.validate = function() {
 
     var link = 'http://api.raataar.de/rosen/vorschau.php';
-
-    $http.post(link, {name : $scope.name, freitext: $scope.freitext, rosen: $scope.preis}).then(function (res){
+    $http.post(link, {name : $scope.name, freitext: $scope.freitext, rosen: $scope.preis, bg: $scope.backgroundpic}).then(function (res){
         $scope.response = res.data;
-        window.open($scope.response, '_system', 'location=yes'); 
+        //window.open($scope.response, '_system', 'location=yes'); 
+        //return false;
+        $scope.showVorschauImages($scope.response);
         return false;
     });
     
   };
 
 
+  /*
+  * Vorschau-Modal
+  */
+  $scope.showVorschauImages = function(imagesrc) {
+    //Bild im dialog anzeigen
+    $scope.imagesrc=imagesrc;
+    $scope.showVorschauModal('templates/image-vorschau-popover.html');
+  }
+ 
+  $scope.showVorschauModal = function(templateUrl) {
+    $ionicModal.fromTemplateUrl(templateUrl, {
+      scope: $scope,
+      animation: 'slide-in-up'
+    }).then(function(modal) {
+      $scope.modal = modal;
+      $scope.modal.show();
+    });
+  }
+ 
+  // Close the modal
+  $scope.closeVorschauModal = function() {
+    $scope.modal.hide();
+    $scope.modal.remove()
+  };
+  /*
+  * Vorschau-Modal ENDE
+  */
 
+  //Getter für Selectbox
+  $scope.getBackgroundOpt = function(option){
+    $scope.backgroundpic=option.backvalue;
+    return option.backvalue;
+  };
+
+  //Flatrate resetten DEBUGGING
   $scope.resetflat = function() {
     inappbilling.consumePurchase(function(result) {}, function(result) {}, 'rosenflatrate');
     $rootScope.flatrate=0;
@@ -74,6 +125,9 @@ $scope.show = function() {
   };
 
 
+  /*
+  * Zitat in Text-Box laden
+  */
   $scope.loadzitat = function() {
 
     $http({
@@ -149,9 +203,9 @@ $scope.show = function() {
     if($rootScope.flatrate==1) {
 
       $scope.showflatrate = false;
-      $scope.rosen1preistag="kostenlos -  Flaterate";
-      $scope.rosen3preistag="kostenlos -  Flaterate";
-      $scope.rosen9preistag="kostenlos -  Flaterate";
+      $scope.rosen1preistag="kostenlos -  Flatrate";
+      $scope.rosen3preistag="kostenlos -  Flatrate";
+      $scope.rosen9preistag="kostenlos -  Flatrate";
           
     }
 
@@ -177,7 +231,7 @@ $scope.show = function() {
   }
 
 
-  $timeout(getProducts, 1000);
+  $timeout(getProducts, 2000);
   /*
   * Produkt-Details abrufen ENDE
   */
@@ -226,7 +280,7 @@ $scope.show = function() {
     }
 
   function errorBuyHandler (error) {
-
+      /*
       var strResult = "";
       var returnBool=false;
 
@@ -235,7 +289,7 @@ $scope.show = function() {
       } else {
         strResult = error;
       }
-
+      */
       /*
       * Prüfen ob Kauf schonmal durchgeführt wurde, aber noch nicht konsumiert
       */
@@ -276,9 +330,9 @@ $scope.show = function() {
     $rootScope.flatrate=1;
     $scope.showflatrate = false;
 
-    $scope.rosen1preistag="kostenlos -  Flaterate";
-    $scope.rosen3preistag="kostenlos -  Flaterate";
-    $scope.rosen9preistag="kostenlos -  Flaterate";
+    $scope.rosen1preistag="kostenlos -  Flatrate";
+    $scope.rosen3preistag="kostenlos -  Flatrate";
+    $scope.rosen9preistag="kostenlos -  Flatrate";
 
     $timeout(getProducts, 300);
 
@@ -297,7 +351,7 @@ $scope.show = function() {
       $scope.show($ionicLoading);
       var link = 'http://api.raataar.de/rosen/kauf.php';
 
-      $http.post(link, {name : $scope.name, freitext: $scope.freitext, rosen: $scope.preis}).then(function (res){
+      $http.post(link, {name : $scope.name, freitext: $scope.freitext, rosen: $scope.preis, bg: $scope.backgroundpic}).then(function (res){
           $scope.filetodownload = res.data;
           
           // File for download
@@ -372,7 +426,7 @@ $scope.show = function() {
       inappbilling.consumePurchase(successConsumeHandler, errorConsumeHandler, $scope.preis);
   }
   /*
-  * Rosen konsuieren ENDE
+  * Rosen konsumieren ENDE
   */
 
 })
diff --git a/www/js/ionic-modal-select.min.js b/www/js/ionic-modal-select.min.js
new file mode 100644
index 0000000..73556da
--- /dev/null
+++ b/www/js/ionic-modal-select.min.js
@@ -0,0 +1 @@
+var modalSelectTemplates=modalSelectTemplates||{};modalSelectTemplates["modal-template-multiple.html"]=' <ion-modal-view class="ionic-select-modal" ng-class="::ui.modalClass">\n    <ion-header-bar ng-class="::ui.headerFooterClass">\n      <h1 class="title">{{::ui.modalTitle}} MULTIPLE</h1>\n    </ion-header-bar>\n    <ion-content>\n\n    <div ng-if="!ui.shortList">\n        <div class="text-center" ng-if="!showList" style="padding-top:40px;">\n            <h4 class="muted">{{::ui.loadListMessage}}</h4>\n            <p>\n                <ion-spinner></ion-spinner>\n            </p>\n        </div>\n        <div class="list" ng-if="showList" class="animate-if">\n            <div class="item item-text-wrap" collection-repeat="option in options track by $index" ng-click="setOption(option)" ng-class="{\'{{::ui.selectedClass}}\': getSelectedValue(option) == ui.value}"> \n                <div compile="inner" compile-once="true"></div>\n            </div>\n        </div>\n    </div>\n    <div ng-if="ui.shortList">\n        <div class="list">\n            <div class="item item-checkbox" ng-repeat="option in options track by $index">\n                <label class="checkbox">\n                    <input type="checkbox" ng-model="isChecked[$index]">\n                </label>\n                <div compile="inner" compile-once="true"></div>\n            </div>\n        </div>\n    </div>\n    </ion-content>\n    <ion-footer-bar ng-class="::ui.headerFooterClass">\n        <button class="button button-stable" ng-click="closeModal()">{{ui.cancelButton}}</button>\n        <h2 class="title"><button class="button">OK</button></h2>\n        <button ng-if="::!ui.hideReset" class="button button-stable" ng-click="unsetValue()">{{ui.resetButton}}</button>\n    </ion-footer-bar>\n</ion-modal-view>\n';var modalSelectTemplates=modalSelectTemplates||{};modalSelectTemplates["modal-template.html"]=' <ion-modal-view class="ionic-select-modal" ng-class="::ui.modalClass">\n    \n    <ion-header-bar ng-class="::ui.headerFooterClass">\n      <h1 class="title">{{::ui.modalTitle}}</h1>\n    </ion-header-bar>\n\n    <div class="bar bar-subheader item-input-inset" ng-class="::ui.subHeaderClass" ng-if="ui.hasSearch">\n      <label class="item-input-wrapper">\n        <i class="icon ion-ios-search placeholder-icon"></i>\n        <input type="search" placeholder="{{::ui.searchPlaceholder}}" ng-model="ui.searchValue">\n      </label>\n      <button class="button button-clear" ng-click="clearSearch()">\n        {{ ui.cancelSearchButton }}\n      </button>\n    </div>\n\n    <ion-content class="has-header" ng-class="{\'has-subheader\':ui.hasSearch}">\n        <div class="text-center" ng-if="!ui.shortList && !showList" style="padding-top:40px;">\n            <h4 class="muted">{{::ui.loadListMessage}}</h4>\n            <p>\n                <ion-spinner></ion-spinner>\n            </p>\n        </div>\n        <div ng-if="showList">\n            <div ng-if="!ui.shortList">\n                <div class="list" ng-if="showList" class="animate-if">\n                    <div class="item item-text-wrap" collection-repeat="option in options track by $index" ng-click="setOption(option)" ng-class="{\'{{::ui.selectedClass}}\': compareValues(getSelectedValue(option), ui.value) }"> \n                        <div compile="inner" compile-once="true"></div>\n                    </div>\n                </div>\n            </div>\n            <div ng-if="ui.shortList">\n                <div class="list">\n                    <div class="item item-text-wrap" ng-repeat="option in options track by $index" ng-click="setOption(option)" ng-class="{\'{{::ui.selectedClass}}\': compareValues(getSelectedValue(option), ui.value) }">\n                        <div compile="inner" compile-once="true"></div>\n                    </div>\n                </div>\n            </div>\n        </div>\n    </ion-content>\n\n    <ion-footer-bar ng-class="::ui.headerFooterClass">\n        <button class="button button-stable modal-select-close-button" ng-click="closeModal()">{{ui.cancelButton}}</button>\n        <button ng-if="::!ui.hideReset" class="button button-stable" ng-click="unsetValue()">{{ui.resetButton}}</button>\n    </ion-footer-bar>\n\n</ion-modal-view>\n',function(){angular.module("ionic-modal-select",[]).directive("compile",["$compile",function($compile){return function(scope,iElement,iAttrs){var x=scope.$watch(function(scope){return scope.$eval(iAttrs.compile)},function(value){iElement.html(value),$compile(iElement.contents())(scope),"true"===iAttrs.compileOnce&&x()})}}]).directive("modalSelect",["$ionicModal","$timeout","$filter","$parse",function($ionicModal,$timeout,$filter,$parse){return{restrict:"A",require:"ngModel",scope:{initialOptions:"=options",optionGetter:"&",onSelect:"&",onReset:"&"},link:function(scope,iElement,iAttrs,ngModelController,transclude){function updateListMode(){"true"===iAttrs.useCollectionRepeat?shortList=!1:"false"===iAttrs.useCollectionRepeat?shortList=!0:"undefined"!=typeof scope.options&&(shortList=!!(scope.options.length<shortListBreak)),scope.ui.shortList=shortList}var shortList=!0,shortListBreak=iAttrs.shortListBreak?parseInt(iAttrs.shortListBreak):10,setFromProperty=iAttrs.optionProperty,onOptionSelect=iAttrs.optionGetter,clearSearchOnSelect="false"!==iAttrs.clearSearchOnSelect?!0:!1,multiple=iAttrs.multiple?!0:!1;multiple&&(scope.checkedItems=[]),scope.ui={modalTitle:iAttrs.modalTitle||"Select an option",okButton:iAttrs.okButton||"OK",hideReset:"true"!==iAttrs.hideReset?!1:!0,resetButton:iAttrs.resetButton||"Reset",cancelButton:iAttrs.cancelButton||"Cancel",loadListMessage:iAttrs.loadListMessage||"Loading",modalClass:iAttrs.modalClass||"",headerFooterClass:iAttrs.headerFooterClass||"bar-stable",value:null,selectedClass:iAttrs.selectedClass||"option-selected",hasSearch:"true"!==iAttrs.hasSearch?!1:!0,searchValue:"",searchPlaceholder:iAttrs.searchPlaceholder||"Search",subHeaderClass:iAttrs.subHeaderClass||"bar-stable",cancelSearchButton:iAttrs.cancelSearchButton||"Clear"};var allOptions=[];if(scope.options=[],iAttrs.optionsExpression){var optionsExpression=iAttrs.optionsExpression,match=optionsExpression.match(/^\s*([\s\S]+?)\s+in\s+([\s\S]+?)(?:\s+track\s+by\s+([\s\S]+?))?\s*$/);if(!match)throw new Error("collection-repeat expected expression in form of '_item_ in _collection_[ track by _id_]' but got '"+iAttrs.optionsExpression+"'.");var listExpr=(match[1],match[2]),listGetter=$parse(listExpr),s=iElement.scope();scope.$watch(function(){return listGetter(s)},function(nv,ov){allOptions=angular.copy(nv),scope.options=angular.copy(nv),updateListMode()},!0)}else scope.$watch("initialOptions",function(nv){allOptions=angular.copy(nv),scope.options=angular.copy(nv),updateListMode()});var opt=iElement[0].querySelector(".option");if(!opt)throw new Error({name:"modalSelectError:noOptionTemplate",message:'When using modalSelect directive you must include an element with class "option" to provide a template for your select options.',toString:function(){return this.name+" "+this.message}});scope.inner=angular.element(opt).html(),"remove"in Element.prototype||(Element.prototype.remove=function(){this.parentNode.removeChild(this)}),angular.element(opt).remove(),ngModelController.$render=function(){scope.ui.value=ngModelController.$viewValue};var getSelectedValue=scope.getSelectedValue=function(option){if(!option)return null;if(onOptionSelect){var out=scope.optionGetter({option:option});return out}return setFromProperty?val=option[setFromProperty]:val=option,val};scope.setOption=function(option){var oldValue=ngModelController.$viewValue,val=getSelectedValue(option);ngModelController.$setViewValue(val),ngModelController.$render(),scope.onSelect&&scope.onSelect({newValue:val,oldValue:oldValue}),scope.modal.hide().then(function(){scope.showList=!1,scope.ui.hasSearch&&clearSearchOnSelect&&(scope.ui.searchValue="")})},scope.unsetValue=function(){$timeout(function(){ngModelController.$setViewValue(""),ngModelController.$render(),scope.modal.hide(),scope.showList=!1,scope.onReset&&angular.isFunction(scope.onReset)&&scope.onReset()})},scope.closeModal=function(){scope.modal.hide().then(function(){scope.showList=!1})},scope.compareValues=function(a,b){return angular.equals(a,b)};var modalTpl=multiple?"modal-template-multiple.html":"modal-template.html";scope.modal=$ionicModal.fromTemplate(modalSelectTemplates[modalTpl],{scope:scope}),scope.$on("$destroy",function(){scope.modal.remove()}),iElement.on("click",function(){shortList?(scope.showList=!0,scope.modal.show()):scope.modal.show().then(function(){scope.showList=!0,scope.ui.shortList=shortList})}),scope.ui.hasSearch&&(scope.$watch("ui.searchValue",function(nv){scope.options=$filter("filter")(allOptions,nv)}),scope.clearSearch=function(){scope.ui.searchValue=""}),ngModelController.$render()}}}])}();
\ No newline at end of file
diff --git a/www/templates/image-vorschau-popover.html b/www/templates/image-vorschau-popover.html
new file mode 100644
index 0000000..5096505
--- /dev/null
+++ b/www/templates/image-vorschau-popover.html
@@ -0,0 +1,3 @@
+<div class="modal image-modal transparent" ng-click="closeVorschauModal()">
+            <img ng-src="{{imagesrc}}" class="fullscreen-image"/>
+</div>
\ No newline at end of file
diff --git a/www/templates/tab-dash.html b/www/templates/tab-dash.html
index 9640cba..c104975 100644
--- a/www/templates/tab-dash.html
+++ b/www/templates/tab-dash.html
@@ -46,6 +46,16 @@
           </ion-list>
          </div>
 		
+    <div style="padding-bottom:15px;">
+      <button class="button button-full button-custom" modal-select="" ng-model="backgroundpic" options="backgrounds" option-getter="getBackgroundOpt(option)" modal-title="Hintergrund wählen">
+        {{ 'Hintergrund: ' +  backgroundpic || 'Hintergrund'}}
+          <div class="option">
+            <h2>{{option.name}}</h2>
+            <p>{{option.beschreibung}}</p>
+        </div>
+      </button>
+    </div>
+
 		<div class="list card">
         <div class="item item-divider oleo">Rosen jetzt kaufen?</div>