FlowPlayer OVA Plugin - use XML directly

FlowPlayer OVA Plugin - use XML directly - javascript

So, i usually pass the url for the VAST XML into the plugins.ova.ads.schedule[0].server.tag.
Is there a way to pass the VAST XML string directly instead of a url for it?
ova: {
url: 'flowplayer/ova.swf',
autoPlay: true,
"canFireEventAPICalls": true,
debug: {
levels: 'all, fatal, config, vast_template, vpaid, http_calls'
},
ads: {
companions: {
regions: [
{ id: "companionad300x60", "width": "300", "height": "60", "resourceType": "static" },
{ id: "companionad300x60", "width": "300", "height": "60", "resourceType": "iframe" },
{ id: "companionad728x90", "width": "728", "height": "90", "index": 0 },
{ id: "companionad728x90", "width": "728", "height": "90", "index": 1 },
{ id: "companionad300x250", "width": "300", "height": "250", "resourceType": "static" },
{ id: "companion-300x250-iframe", "width": "300", "height": "250", "index": 1 }
]
},
schedule: [
{
position: "pre-roll",
server: {
type: "direct",
tag: undefined
}
}
]
}
}
Thanks

As it turns out, it's as simple as changing the type to "inject".
schedule: [{
position: "pre-roll",
server: {
type: "inject",
tag: xmlString
}
}]

Related

Javascript groupby and sum key value

I have the following array of dicts
var response = [{
"ShoppingCart": "cart1",
"Class": "Gen",
"Type": "300",
"SubClass": "Mens",
"Points": 0.9
},
{
"ShoppingCart": "cart2",
"Class": "Lux",
"Type": "3002C",
"SubClass": "Mens",
"Points": 0.75
},
{
"ShoppingCart": "cart3",
"Class": "Lux",
"Type": "380",
"SubClass": "Ladies",
"Points": 0.5
},
{
"ShoppingCart": "cart4",
"Class": "Lux",
"Type": "300",
"SubClass": "Cabin",
"Points": 1
},
{
"ShoppingCart": "cart5",
"Class": "Comfort",
"Type": "380",
"SubClass": "Ladies",
"Points": 1
},
{
"ShoppingCart": "cart6",
"Class": "Gen",
"Type": "380",
"SubClass": "Cabin",
"Points": 0.9
},
{
"ShoppingCart": "cart7",
"Class": "Gen",
"Type": "300",
"SubClass": "Cabin",
"Points": 0.7
},
{
"ShoppingCart": "cart8",
"Class": "Gen",
"Type": "380PC",
"SubClass": "Ladies",
"Points": 0.7
},
{
"ShoppingCart": "cart9",
"Class": "Lux",
"Type": "380",
"SubClass": "Cabin",
"Points": 0.5
},
{
"ShoppingCart": "cart10",
"Class": "Lux",
"Type": "380",
"SubClass": "Ladies",
"Points": 0.5
}
]
I am using reduce function and When i do a groupby and sum the Points , the Class is repeated and not unique , How can i perform a groupby and sum the unique values .
I know lodash's groupby function solves, how can i do it with the reduce function itself ?
The last Class comfort is not coming in the output , why is that ?
the code so far
result = [];
response.reduce(function(res, value) {
if (!res[value.Type]) {
res[value.Type] = { Type: value.Type, Class: value.Class, Points: 0 };
result.push(res[value.Type])
}
res[value.Type].Points += parseFloat(value.Points);
return res;
}, {});
console.log(result);
result:
[
{ Type: '300', Class: 'Gen', Points: 2.5999999999999996 },
{ Type: '3002C', Class: 'Lux', Points: 0.75 },
{ Type: '380', Class: 'Lux', Points: 3.4 },
{ Type: '380PC', Class: 'Gen', Points: 0.7 }
]
expected result:
[
{ Type: '300', Class: 'Gen', Points: 2.5999999999999996 },
{ Type: '3002C', Class: 'Lux', Points: 0.75 },
{ Type: '380', Class: 'Lux', Points: 3.4 },
{ Type: '380PC', Class: 'Gen', Points: 0.7 },
{ Type: '380', Class: 'Comfort', Points: 1 }
]
What am i missing in this reduce function ?
Modified Code as per epascarello's suggestions
response.reduce(function(res, value) {
const key = value.Type + "-" + value.Class;
if (!res[key]) {
res[key] = { Type: value.Type, Class: value.Class, Points: 0 };
result.push(res[key])
}
res[key].Points += parseFloat(value.Points);
return res;
}, {});
console.log(result);

So make your key based off the two properties, not just one
const key = value.Type + "-" + value.Class;
if (!res[key]) {

I think this is more what you're looking for.
Basically, for each item in response it will try to find an item in the results array that has the same Type and Class as the provided item. If it finds one it will increment that item's Points by the provided Points, if not it will append a new item onto the results array.
.reduce is a very useful function, but how you had it before was not utilizing its capabilities.
var response = [{
"ShoppingCart": "cart1",
"Class": "Gen",
"Type": "300",
"SubClass": "Mens",
"Points": 0.9
},
{
"ShoppingCart": "cart2",
"Class": "Lux",
"Type": "3002C",
"SubClass": "Mens",
"Points": 0.75
},
{
"ShoppingCart": "cart3",
"Class": "Lux",
"Type": "380",
"SubClass": "Ladies",
"Points": 0.5
},
{
"ShoppingCart": "cart4",
"Class": "Lux",
"Type": "300",
"SubClass": "Cabin",
"Points": 1
},
{
"ShoppingCart": "cart5",
"Class": "Comfort",
"Type": "380",
"SubClass": "Ladies",
"Points": 1
},
{
"ShoppingCart": "cart6",
"Class": "Gen",
"Type": "380",
"SubClass": "Cabin",
"Points": 0.9
},
{
"ShoppingCart": "cart7",
"Class": "Gen",
"Type": "300",
"SubClass": "Cabin",
"Points": 0.7
},
{
"ShoppingCart": "cart8",
"Class": "Gen",
"Type": "380PC",
"SubClass": "Ladies",
"Points": 0.7
},
{
"ShoppingCart": "cart9",
"Class": "Lux",
"Type": "380",
"SubClass": "Cabin",
"Points": 0.5
},
{
"ShoppingCart": "cart10",
"Class": "Lux",
"Type": "380",
"SubClass": "Ladies",
"Points": 0.5
}
];
var grouped = response.reduce((res, value) => {
const ext = res.find(({
Type,
Class
}) => {
return Type === value.Type && Class === value.Class;
});
if (ext) {
ext.Points += value.Points;
} else {
res.push({
Type: value.Type,
Class: value.Class,
Points: value.Points
});
}
return res;
}, []);
console.log(grouped);

Highcharts networkgraph layout

I am using Highcharts library to draw a network graph. But I have a layout problem when the data makes two or more disconnected networks. Then the bigest one is centered and pushes to the edges the other networks to the point where they are barely readable.
Example:
Highcharts.chart('container', {
chart: {
type: 'networkgraph',
height: '60%'
},
title: {
text: ''
},
plotOptions: {
networkgraph: {
keys: ['from', 'to'],
}
},
series: [{
dataLabels: {
enabled: true,
linkFormat: ''
},
id: 'demo-tree',
data: [["demo001", "demo002"], ["demo003", "demo004"], ["demo005", "demo002"], ["demo006", "demo007"], ["demo008", "demo009"], ["demo003", "demo010"], ["demo011", "demo009"], ["demo001", "demo008"], ["demo005", "demo001"], ["demo011", "demo008"], ["demo005", "demo006"], ["demo005", "demo007"], ["demo005", "demo011"], ["demo005", "demo009"], ["demo012", "demo004"], ["demo005", "demo008"], ["demo001", "demo006"], ["demo001", "demo007"]],
nodes: [{ "id": "demo001", "marker": { "radius": 119 }, "color": "#dc3545" }, { "id": "demo002", "marker": { "radius": 7 }, "color": "#ffc107" }, { "id": "demo003", "marker": { "radius": 9 }, "color": "#ffc107" }, { "id": "demo004", "marker": { "radius": 8 }, "color": "#ffc107" }, { "id": "demo005", "marker": { "radius": 100 }, "color": "#dc3545" }, { "id": "demo006", "marker": { "radius": 77 }, "color": "#dc3545" }, { "id": "demo007", "marker": { "radius": 76 }, "color": "#dc3545" }, { "id": "demo009", "marker": { "radius": 40 }, "color": "#dc3545" }, { "id": "demo008", "marker": { "radius": 33 }, "color": "#dc3545" }, { "id": "demo010", "marker": { "radius": 5 }, "color": "#28a745" }, { "id": "demo011", "marker": { "radius": 40 }, "color": "#dc3545" }, { "id": "demo012", "marker": { "radius": 4 }, "color": "#28a745" }]
}],
});
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/networkgraph.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<figure class="highcharts-figure">
<div id="container"></div>
</figure>
https://jsfiddle.net/jrb471kc/1/
What I want, is to make better use of the space. Rather then having this:
Have something like this:
I toyed around with the node.mass attribute to no avail.
Does somebody have a solution for this?
EDIT 1: To better explain my question, this is an example of what I got right now. What I want is the graph to not center the big network in the center. Align it left to have room for the 2 small ones.

Group x axis labels

I need to group (and show) labels of X axis of a grahp, but still showing all single labels.
This is the code I actually use, and its a normal column2d graph:
FusionCharts.ready(function() {
var myChart = new FusionCharts({
type: "column2d",
renderAt: "chart",
width: "100%",
height: "100%",
dataFormat: "json",
dataSource: {
"chart": {
"animation": 0,
"caption": "Graph title",
"xAxisName": "Performance",
"baseFontColor": "#000000",
},
"data": [
{
"label": "351-08",
"value": "91"
},
{
"label": "351-09",
"value": "90"
},
{
"label": "351-10",
"value": "94"
},
{
"label": "351-01",
"value": "99"
},
{
"label": "351-07",
"value": "92"
},
{
"label": "351-06",
"value": "81"
},
],
"trendlines": [
{
"line": [
{
"startvalue": "82",
"color": "#ff3333",
"thickness": "5",
"valueOnRight": "1",
"displayvalue": "Average"
}
]
}
]
}
}).render();
});
What I need is showing another label on X axis that groups labels.
For example:
Group 1: [label1, label2];
Group 2: [label3, label4, label5];
Group 3: [label6];
UPDATED
I attached an image of what I need.
As you can see I need another labels line ("Fattore1", "Fattore2" and "Fattore3") that group other labels.

Uncaught ReferenceError: Tankvalue is not defined

I want to display response data in charts. but Tankvalue is getting out of scope and giving error message
Tankvalue is not defined.
How to make variable can be accessed globally. Charts are not loading due to an undefined value. want to show Tankvalue in the chart.
var app = angular.module('myApp', []);
app.controller('myCtrl', function ($scope, $http) {
$http.get('url', {
headers: {
'Authorization': 'Basic Pasword=='
}
})
.then(function (response) {
$scope.names = response.data;
$scope.decodedFrame = atob($scope.names.dataFrame);
var Tankvalue = $scope.decodedFrame.substring(6);
});
});
FusionCharts.ready(function () {
var fusioncharts = new FusionCharts({
type: 'cylinder',
dataFormat: 'json',
id: 'fuelMeter-1',
renderAt: 'chart-container',
width: '200',
height: '350',
dataSource: {
"chart": {
"theme": "fint",
"caption": "Tank",
"subcaption": "Bakersfield Central",
"lowerLimit": "0",
"upperLimit": "25",
"lowerLimitDisplay": "Empty",
"upperLimitDisplay": "Full",
"numberSuffix": " ltrs",
"showValue": "1",
"chartBottomMargin": "45",
"showValue": "0"
},
"value": Tankvalue,
"annotations": {
"origw": "400",
"origh": "190",
"autoscale": "1",
"groups": [{
"id": "range",
"items": [{
"id": "rangeBg",
"type": "rectangle",
"x": "$canvasCenterX-45",
"y": "$chartEndY-30",
"tox": "$canvasCenterX +45",
"toy": "$chartEndY-75",
"fillcolor": "#6caa03"
}, {
"id": "rangeText",
"type": "Text",
"fontSize": "11",
"fillcolor": "#333333",
"text": "80 ltrs",
"x": "$chartCenterX-45",
"y": "$chartEndY-50"
}]
}]
}
},
});
fusioncharts.render();
});

Move FusionCharts.ready() inside then block as shown below.
.then(function (response) {
$scope.names = response.data;
$scope.decodedFrame = atob($scope.names.dataFrame);
var Tankvalue = $scope.decodedFrame.substring(6);
FusionCharts.ready(function () {
var fusioncharts = new FusionCharts({
type: 'cylinder',
dataFormat: 'json',
id: 'fuelMeter-1',
renderAt: 'chart-container',
width: '200',
height: '350',
dataSource: {
"chart": {
"theme": "fint",
"caption": "Tank",
"subcaption": "Bakersfield Central",
"lowerLimit": "0",
"upperLimit": "25",
"lowerLimitDisplay": "Empty",
"upperLimitDisplay": "Full",
"numberSuffix": " ltrs",
"showValue": "1",
"chartBottomMargin": "45",
"showValue": "0"
},
"value": Tankvalue,
"annotations": {
"origw": "400",
"origh": "190",
"autoscale": "1",
"groups": [{
"id": "range",
"items": [{
"id": "rangeBg",
"type": "rectangle",
"x": "$canvasCenterX-45",
"y": "$chartEndY-30",
"tox": "$canvasCenterX +45",
"toy": "$chartEndY-75",
"fillcolor": "#6caa03"
}, {
"id": "rangeText",
"type": "Text",
"fontSize": "11",
"fillcolor": "#333333",
"text": "80 ltrs",
"x": "$chartCenterX-45",
"y": "$chartEndY-50"
}]
}]
}
},
});
fusioncharts.render();
});
});

$http.get() is an async function, so FusionCharts.ready() runs before the value assigned to Tankvalue variable.
To fix this move ready() function inside .then().
Do it like:
var app = angular.module('myApp', []);
app.controller('myCtrl', function ($scope, $http) {
$http.get('url', {
headers: {
'Authorization': 'Basic Pasword=='
}
})
.then(function (response) {
$scope.names = response.data;
$scope.decodedFrame = atob($scope.names.dataFrame);
var Tankvalue = $scope.decodedFrame.substring(6);
FusionCharts.ready(function () {
var fusioncharts = new FusionCharts({
type: 'cylinder',
dataFormat: 'json',
id: 'fuelMeter-1',
renderAt: 'chart-container',
width: '200',
height: '350',
dataSource: {
"chart": {
"theme": "fint",
"caption": "Tank",
"subcaption": "Bakersfield Central",
"lowerLimit": "0",
"upperLimit": "25",
"lowerLimitDisplay": "Empty",
"upperLimitDisplay": "Full",
"numberSuffix": " ltrs",
"showValue": "1",
"chartBottomMargin": "45",
"showValue": "0"
},
"value": Tankvalue,
"annotations": {
"origw": "400",
"origh": "190",
"autoscale": "1",
"groups": [{
"id": "range",
"items": [{
"id": "rangeBg",
"type": "rectangle",
"x": "$canvasCenterX-45",
"y": "$chartEndY-30",
"tox": "$canvasCenterX +45",
"toy": "$chartEndY-75",
"fillcolor": "#6caa03"
}, {
"id": "rangeText",
"type": "Text",
"fontSize": "11",
"fillcolor": "#333333",
"text": "80 ltrs",
"x": "$chartCenterX-45",
"y": "$chartEndY-50"
}]
}]
}
},
});
fusioncharts.render();
});
});
});

You can not use local variable out of other function.make it a global or make as scope variable by using $scope.
$scope.Tankvalue = $scope.decodedFrame.substring(6);

How to build the proper mapping/indexing in ElasticSearch with NodeJS

I have been beating my head against this all day, and cannot seem figure out how to get this to work.
I have a source document like this:
{
"created_at": 1454700182,
"message_id": 160,
"user_id": 1,
"establishment_id": 1,
"geo": {
"coordinates": [-4.8767633,
89.7833547
],
"type": "Point"
},
"message": "Venus is in the west",
"active": true,
"score": 0,
"name": {
"first": "First",
"last": "Last"
},
"neighborhood": "Townside"
},
I create a document like this in ElasticSearch:
{
"message_id": 160,
"message": "Venus is in the west",
"first_name": "First",
"last_name": "Last",
"location": {
"lon": -4.8767633,
"lat": 89.7833547
},
"created_at": 1454700182,
"neighborhood": "Townside"
}
I've been trying different ways to create the index.
First:
client.indices.create({
index: 'messages',
type: 'document',
body: {
messages: {
properties: {
message: {
type: 'string',
index: 'not_analyzed'
},
neighborhood: {
type: 'string',
index: 'not_analyzed'
},
first_name: {
type: 'string',
index: 'not_analyzed'
},
last_name: {
type: 'string',
index: 'not_analyzed'
},
created_at: {
type: 'integer',
index: 'not_analyzed'
},
location: {
type: 'geo_point',
lat_lon: true
}
}
}
},
}
);
This allows me to do fuzzy text searches and greater than queries, but doesn't recognize the geo_point. So I tried this:
client.indices.create({
index: 'messages',
type: 'document',
"mappings": {
"messages": {
"properties": {
"message": {
"type": "string",
"index": "not_analyzed"
},
"neighborhood": {
"type": "string",
"index": "not_analyzed"
},
"first_name": {
"type": "string",
"index": "not_analyzed"
},
"last_name": {
"type": "string",
"index": "not_analyzed"
},
"created_at": {
"type": "integer",
"index": "not_analyzed"
},
"location": {
"type": "geo_point",
"lat_lon": true,
"index": "not_analyzed"
}
}
}
}
});
This does recognize the geo_point, but none of the other things work.
Here is the query I've been using for the non geo fields:
query = {
query: {
filtered: {
query: {
multi_match: {
query: message,
fields: ['message', 'neighborhood', 'first_name', 'last_name'],
"fuzziness": "AUTO",
"prefix_length": 2
}
},
filter: {
bool: {
must: {
range: {
"created_at": {
"gte": min_ts
}
}
}
}
}
}
}
};
I've been so turned around on this, just trying to allow text and geo search on the same collection of documents, that I need at least another set of eyes.
Appreciate any help!

Develop Reference

JavaScript is the programming language of the Web.

FlowPlayer OVA Plugin - use XML directly - javascript

As it turns out, it's as simple as changing the type to "inject". schedule: [{ position: "pre-roll", server: { type: "inject", tag: xmlString } }]

Related

Javascript groupby and sum key value

Highcharts networkgraph layout

Group x axis labels

Uncaught ReferenceError: Tankvalue is not defined

How to build the proper mapping/indexing in ElasticSearch with NodeJS

Categories

Resources