-
Notifications
You must be signed in to change notification settings - Fork 87
/
edit.html
110 lines (98 loc) · 5.14 KB
/
edit.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Leaflet edit</title>
</head>
<body>
<script>
var config = {
provider: 'plunker',
title: 'Leaflet',
description: "Leaflet example",
html: '<div id="map"></div>',
cssFile: 'https://unpkg.com/leaflet/dist/leaflet.css',
css: 'body {\n\tmargin: 0;\n}\nhtml, body, #map {\n\theight: 100%\n}',
jsFile: 'https://unpkg.com/leaflet/dist/leaflet-src.js',
js: "var map = L.map('map', {\n\tlayers: [\n\t\tL.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {\n\t\t\t'attribution': 'Map data © <a href=\"https://openstreetmap.org\">OpenStreetMap</a> contributors'\n\t\t})\n\t],\n\tcenter: [0, 0],\n\tzoom: 0\n});"
};
var hash = location.hash.substring(1);
if (hash) {
hash.split(';').forEach(function (str) {
var arg = str.split(':');
config[arg[0]] = arg[1];
});
}
if (config.version) {
if (config.version === 'main') {
config.cssFile = 'https://leafletjs-cdn.s3.amazonaws.com/content/build/main/leaflet.css',
config.jsFile = 'https://leafletjs-cdn.s3.amazonaws.com/content/build/main/leaflet-src.js'
} else {
config.cssFile = `https://unpkg.com/leaflet@${config.version}/dist/leaflet.css`
config.jsFile = `https://unpkg.com/leaflet@${config.version}/dist/leaflet-src.js`
}
}
function createForm (action) {
var form = document.createElement('form');
form.setAttribute('method', 'post');
form.setAttribute('action', action);
form.createInput = function (name, value) {
var input = document.createElement('input');
input.setAttribute('type', 'hidden');
input.setAttribute('name', name);
input.setAttribute('value', value);
this.appendChild(input);
};
document.body.appendChild(form);
return form;
}
var form;
if (config.provider === 'plunker') {
form = createForm('https://plnkr.co/edit/?p=preview');
form.createInput('description', config.description);
form.createInput('files[index.html]', `<!DOCTYPE html>\n<html>\n\t<head>\n\t\t<title>Leaflet</title>\n\t\t<meta charset="utf-8" />\n\t\t<meta name="viewport" content="width=device-width, initial-scale=1.0" />\n\t\t<link type="text/css" rel="stylesheet" href="${config.cssFile}" />\n\t\t<link type="text/css" rel="stylesheet" href="style.css" />\n\t</head>\n\t<body>\n\t\t${config.html}\n\t\t<script src="${config.jsFile}"><\/script>\n\t\t<script src="script.js"><\/script>\n\t</body>\n</html>`);
form.createInput('files[style.css]', config.css);
form.createInput('files[script.js]', config.js);
form.createInput('tags[0]', 'leaflet');
form.createInput('tags[1]', 'map');
form.createInput('tags[2]', 'gis');
form.createInput('private', false);
}
if (config.provider === 'codepen') {
form = createForm('https://codepen.io/pen/define');
form.createInput('data', JSON.stringify({
title: config.title,
description: config.description,
private: false,
tags: ["leaflet", "map", "gis"],
editors: "001",
layout: "top",
head: '<meta name="viewport" content="width=device-width, initial-scale=1.0">',
html: config.html,
css: config.css,
css_external: config.cssFile,
js: config.js,
js_external: config.jsFile
}));
}
if (config.provider === 'jsfiddle') {
form = createForm('http://jsfiddle.net/api/post/library/pure/');
form.createInput('title', config.title);
form.createInput('description', config.description);
form.createInput('resources', `${config.cssFile},${config.jsFile}`);
form.createInput('html', config.html);
form.createInput('css', config.css);
form.createInput('js', config.js);
form.createInput('panel_html', 0);
form.createInput('panel_css', 0);
form.createInput('panel_js', 0);
form.createInput('dtd', 'html');
form.createInput('normalize_css', 'no');
form.createInput('wrap', 'b');
}
if (form instanceof HTMLFormElement) {
form.submit();
}
</script>
</body>
</html>