1
|
|
|
/* global HTMLImageElement */ |
2
|
|
|
/* global HTMLCanvasElement */ |
3
|
|
|
/* global SVGElement */ |
4
|
|
|
|
5
|
|
|
import getOptionsFromElement from "./getOptionsFromElement.js"; |
6
|
|
|
import renderers from "../renderers"; |
7
|
|
|
|
8
|
|
|
import {InvalidElementException} from "../exceptions/exceptions.js"; |
9
|
|
|
|
10
|
|
|
// Takes an element and returns an object with information about how |
11
|
|
|
// it should be rendered |
12
|
|
|
// This could also return an array with these objects |
13
|
|
|
// { |
14
|
|
|
// element: The element that the renderer should draw on |
15
|
|
|
// renderer: The name of the renderer |
16
|
|
|
// afterRender (optional): If something has to done after the renderer |
17
|
|
|
// completed, calls afterRender (function) |
18
|
|
|
// options (optional): Options that can be defined in the element |
19
|
|
|
// } |
20
|
|
|
|
21
|
|
|
function getRenderProperties(element){ |
22
|
|
|
// If the element is a string, query select call again |
23
|
|
|
if(typeof element === "string"){ |
24
|
|
|
return querySelectedRenderProperties(element); |
25
|
|
|
} |
26
|
|
|
// If element is array. Recursivly call with every object in the array |
27
|
|
|
else if(Array.isArray(element)){ |
28
|
|
|
var returnArray = []; |
29
|
|
|
for(let i = 0; i < element.length; i++){ |
30
|
|
|
returnArray.push(getRenderProperties(element[i])); |
31
|
|
|
} |
32
|
|
|
return returnArray; |
33
|
|
|
} |
34
|
|
|
// If element, render on canvas and set the uri as src |
35
|
|
|
else if(typeof HTMLCanvasElement !== 'undefined' && element instanceof HTMLImageElement){ |
36
|
|
|
return newCanvasRenderProperties(element); |
37
|
|
|
} |
38
|
|
|
// If SVG |
39
|
|
|
else if( |
40
|
|
|
(element && element.nodeName === 'svg') || |
41
|
|
|
(typeof SVGElement !== 'undefined' && element instanceof SVGElement) |
42
|
|
|
){ |
43
|
|
|
return { |
44
|
|
|
element: element, |
45
|
|
|
options: getOptionsFromElement(element), |
46
|
|
|
renderer: renderers.SVGRenderer |
47
|
|
|
}; |
48
|
|
|
} |
49
|
|
|
// If canvas (in browser) |
50
|
|
|
else if(typeof HTMLCanvasElement !== 'undefined' && element instanceof HTMLCanvasElement){ |
51
|
|
|
return { |
52
|
|
|
element: element, |
53
|
|
|
options: getOptionsFromElement(element), |
54
|
|
|
renderer: renderers.CanvasRenderer |
55
|
|
|
}; |
56
|
|
|
} |
57
|
|
|
// If canvas (in node) |
58
|
|
|
else if(element && element.getContext){ |
59
|
|
|
return { |
60
|
|
|
element: element, |
61
|
|
|
renderer: renderers.CanvasRenderer |
62
|
|
|
}; |
63
|
|
|
} |
64
|
|
|
else if(element && typeof element === 'object' && !element.nodeName) { |
65
|
|
|
return { |
66
|
|
|
element: element, |
67
|
|
|
renderer: renderers.ObjectRenderer |
68
|
|
|
}; |
69
|
|
|
} |
70
|
|
|
else{ |
71
|
|
|
throw new InvalidElementException(); |
72
|
|
|
} |
73
|
|
|
} |
74
|
|
|
|
75
|
|
|
function querySelectedRenderProperties(string){ |
76
|
|
|
var selector = document.querySelectorAll(string); |
77
|
|
|
if(selector.length === 0){ |
78
|
|
|
return undefined; |
79
|
|
|
} |
80
|
|
|
else{ |
81
|
|
|
let returnArray = []; |
82
|
|
|
for(let i = 0; i < selector.length; i++){ |
83
|
|
|
returnArray.push(getRenderProperties(selector[i])); |
84
|
|
|
} |
85
|
|
|
return returnArray; |
86
|
|
|
} |
87
|
|
|
} |
88
|
|
|
|
89
|
|
|
|
90
|
|
|
function newCanvasRenderProperties(imgElement){ |
91
|
|
|
var canvas = document.createElement('canvas'); |
92
|
|
|
return { |
93
|
|
|
element: canvas, |
94
|
|
|
options: getOptionsFromElement(imgElement), |
95
|
|
|
renderer: renderers.CanvasRenderer, |
96
|
|
|
afterRender: function(){ |
97
|
|
|
imgElement.setAttribute("src", canvas.toDataURL()); |
98
|
|
|
} |
99
|
|
|
}; |
100
|
|
|
} |
101
|
|
|
|
102
|
|
|
export default getRenderProperties; |
103
|
|
|
|