Actualizo funcion de codigo web de Graphic, y creo tests para la mism…

…a y sus auxiliares
datosgobar · Sep 24, 2019 · e9dbbd2 · e9dbbd2
1 parent 7577be5
commit e9dbbd2
Show file tree

Hide file tree

Showing 2 changed files with 245 additions and 106 deletions.
diff --git a/src/helpers/common/webCodeBuilders.ts b/src/helpers/common/webCodeBuilders.ts
@@ -1,6 +1,5 @@
-import { IWebSnippetOptions } from "../../components/exportable_card/FullCardDropdown";
 import { ISerie } from "../../api/Serie";
-import ChartTypeSelector from "../../api/ChartTypeSelector";
+import { IWebSnippetOptions } from "../../components/exportable_card/FullCardDropdown";
 import { cleanUrl } from "../graphic/graphicLinkBuilders";
 
 export function cardWebCode(options: IWebSnippetOptions): string {
@@ -84,34 +83,55 @@ export function cardWebCode(options: IWebSnippetOptions): string {
 
 export function graphicWebCode(url: string, series: ISerie[]): string {
 
-    return "<script type='text/javascript' src='https://cdn.jsdelivr.net/gh/datosgobar/series-tiempo-ar-explorer@ts_components_2.6.1/dist/js/components.js'></script>\n" +
-    "<link rel='stylesheet' type='text/css' href='https://cdn.jsdelivr.net/gh/datosgobar/series-tiempo-ar-explorer@ts_components_2.6.1/dist/css/components.css'/>\n" +
-    "<div id=\"root\"></div>\n" +
-    "<script>\n" +
-    "    window.onload = function() {\n" +
-    "        TSComponents.Graphic.render('root', {\n" +
-    "            graphicUrl: '" + cleanUrl(url) +"',\n"+
-    "            title: '" + calculateChartTitle(series) + "',\n" +
-    "            source: '" + calculateChartSource(series) + "',\n" +
-    "            chartTypes: " + JSON.stringify(calculateChartTypes(url, series)) + ",\n" +
-    "        })\n" +
-    "    }\n" +
-    "</script>\n"
+    const graphicUrl = cleanUrl(url);
+    const title = calculateChartTitle(series);
+    const source = calculateChartSource(series);
+    const chartType = calculateChartType(url);
+
+    let htmlScript = `<script type='text/javascript' src='https://cdn.jsdelivr.net/gh/datosgobar/series-tiempo-ar-explorer@ts_components_2.6.1/dist/js/components.js'></script>
+<link rel='stylesheet' type='text/css' href='https://cdn.jsdelivr.net/gh/datosgobar/series-tiempo-ar-explorer@ts_components_2.6.1/dist/css/components.css'/>
+<div id=\"root\"></div>
+<script>
+    window.onload = function() {
+        TSComponents.Graphic.render('root', {
+            graphicUrl: "${graphicUrl}",
+            title: "${title}",
+            source: "${source}"`;
+
+    if(chartType !== null && chartType !== "line") {
+        htmlScript += `,
+            chartType: "${chartType}"`;
+    }
+
+    htmlScript += `
+        })
+    }
+</script>
+`;
+
+    return htmlScript;
 
 }
 
-function calculateChartTitle(series: ISerie[]): string {
+export function calculateChartTitle(series: ISerie[]): string {
     return series.length > 1 ? series[0].datasetTitle : series[0].description;
 }
 
-function calculateChartSource(series: ISerie[]): string {
-    return Array.from(new Set(series.map((serie: ISerie) => serie.datasetSource))).join(', ')
+export function calculateChartSource(series: ISerie[]): string {
+
+    const sources = Array.from(new Set(series.map((serie: ISerie) => serie.datasetSource)));
+    if(sources.length > 1) {
+        const sourcesString = sources.join(', ');
+        return `Fuentes: ${sourcesString}`;
+    }
+    return `Fuente: ${sources[0]}`;
+
 }
 
-function calculateChartTypes(url: string, series: ISerie[]): any {
+export function calculateChartType(url: string): string | null {
+
     const params = url.split('?')[1];
     const urlSearchParams = new URLSearchParams(params);
+    return urlSearchParams.get('chartType');
 
-    const chartTypeSelector = new ChartTypeSelector(series, urlSearchParams);
-    return chartTypeSelector.getChartTypesBySeries();
 }