added In App picture support for server

src/controller.js

@@ -5,6 +5,18 @@ import picassoQ from 'picasso-plugin-q';
 import chartdef from './chartdef';
 
 export default ['$scope', '$element', function ($scope, $element) {
+
+  // Check if app id matches the current app id for In App Pictures
+  let app = qlik.currApp($scope);
+  let id = app.id;
+  let pictureUrl = $scope.layout.prop.background.picture;
+  if(!pictureUrl.includes(id) && !pictureUrl.includes('/content/')) {
+    let split = pictureUrl.split('/');
+    split[2] = id;
+    split = split.join('/');
+    $scope.layout.prop.background.picture = split;
+  }
+
   picasso.use(picassoQ);
 
   const ds = [{

src/definition.js

@@ -1306,7 +1306,7 @@ define(function () {
     component: "media",
     ref: "prop.background.picture",
     type: "string",
-    layoutRef: "backgroundpicture",
+    layoutRef: "prop.background.picture",
     show: function (data) {
       if (data.prop.background.pictureswitch && data.prop.background.cssswitch) { return true; }
     }

src/index.js

@@ -16,6 +16,7 @@ export default {
     const app = qlik.currApp(this);
     const scope = this.$scope;
     this.$scope.isInEdit = this.options.interactionState == 2;
+    //console.log(app);
     //console.log(scope.layout);
     //console.log($element);
 
@@ -35,8 +36,6 @@ export default {
       scope.KPIPosition = { "postion": "relative", "top": "0px" };
     }
 
-
-
     //refreshing chart
     if (scope.chart) {
       scope.chart.update();

src/style.css

@@ -2,6 +2,7 @@
     position: absolute;
     height: calc(100% + 10px);
     width: calc(100% + 20px);
+    top: 0px;
     left: -10px;
 }
 
@@ -14,6 +15,7 @@
 
 .adv-kpi-trend-a, .adv-kpi-trend-b {
     display: -webkit-inline-box;
+    display: ruby-base-container;
     z-index: 10;
 }