map.js
4.8 KB
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
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
/*******************************************************************************
* KindEditor - WYSIWYG HTML Editor for Internet
* Copyright (C) 2006-2011 kindsoft.net
*
* @author Roddy <luolonghao@gmail.com>
* @site http://www.kindsoft.net/
* @licence http://www.kindsoft.net/license.php
*******************************************************************************/
// Google Maps: http://code.google.com/apis/maps/index.html
KindEditor.plugin('map', function(K) {
var self = this, name = 'map', lang = self.lang(name + '.');
self.clickToolbar(name, function() {
var html = ['<div style="padding:10px 20px;">',
'<div class="ke-dialog-row">',
lang.address + ' <input id="kindeditor_plugin_map_address" name="address" class="ke-input-text" value="" style="width:200px;" /> ',
'<span class="ke-button-common ke-button-outer">',
'<input type="button" name="searchBtn" class="ke-button-common ke-button" value="' + lang.search + '" />',
'</span>',
'</div>',
'<div class="ke-map" style="width:558px;height:360px;"></div>',
'</div>'].join('');
var dialog = self.createDialog({
name : name,
width : 600,
title : self.lang(name),
body : html,
yesBtn : {
name : self.lang('yes'),
click : function(e) {
var geocoder = win.geocoder,
map = win.map,
center = map.getCenter().lat() + ',' + map.getCenter().lng(),
zoom = map.getZoom(),
maptype = map.getMapTypeId(),
url = 'http://maps.googleapis.com/maps/api/staticmap';
url += '?center=' + encodeURIComponent(center);
url += '&zoom=' + encodeURIComponent(zoom);
url += '&size=558x360';
url += '&maptype=' + encodeURIComponent(maptype);
url += '&markers=' + encodeURIComponent(center);
url += '&language=' + self.langType;
url += '&sensor=false';
self.exec('insertimage', url).hideDialog().focus();
}
},
beforeRemove : function() {
searchBtn.remove();
if (doc) {
doc.write('');
}
iframe.remove();
}
});
var div = dialog.div,
addressBox = K('[name="address"]', div),
searchBtn = K('[name="searchBtn"]', div),
win, doc;
var iframeHtml = ['<!doctype html><html><head>',
'<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />',
'<style>',
' html { height: 100% }',
' body { height: 100%; margin: 0; padding: 0; background-color: #FFF }',
' #map_canvas { height: 100% }',
'</style>',
'<script src="http://maps.googleapis.com/maps/api/js?sensor=false&language=' + self.langType + '"></script>',
'<script>',
'var map, geocoder;',
'function initialize() {',
' var latlng = new google.maps.LatLng(31.230393, 121.473704);',
' var options = {',
' zoom: 11,',
' center: latlng,',
' disableDefaultUI: true,',
' panControl: true,',
' zoomControl: true,',
' mapTypeControl: true,',
' scaleControl: true,',
' streetViewControl: false,',
' overviewMapControl: true,',
' mapTypeId: google.maps.MapTypeId.ROADMAP',
' };',
' map = new google.maps.Map(document.getElementById("map_canvas"), options);',
' geocoder = new google.maps.Geocoder();',
' geocoder.geocode({latLng: latlng}, function(results, status) {',
' if (status == google.maps.GeocoderStatus.OK) {',
' if (results[3]) {',
' parent.document.getElementById("kindeditor_plugin_map_address").value = results[3].formatted_address;',
' }',
' }',
' });',
'}',
'function search(address) {',
' if (!map) return;',
' geocoder.geocode({address : address}, function(results, status) {',
' if (status == google.maps.GeocoderStatus.OK) {',
' map.setZoom(11);',
' map.setCenter(results[0].geometry.location);',
' var marker = new google.maps.Marker({',
' map: map,',
' position: results[0].geometry.location',
' });',
' } else {',
' alert("Invalid address: " + address);',
' }',
' });',
'}',
'</script>',
'</head>',
'<body onload="initialize();">',
'<div id="map_canvas" style="width:100%; height:100%"></div>',
'</body></html>'].join('\n');
// TODO：用doc.write(iframeHtml)方式加载时，在IE6上第一次加载报错，暂时使用src方式
var iframe = K('<iframe class="ke-textarea" frameborder="0" src="' + self.pluginsPath + 'map/map.html" style="width:558px;height:360px;"></iframe>');
function ready() {
win = iframe[0].contentWindow;
doc = K.iframeDoc(iframe);
//doc.open();
//doc.write(iframeHtml);
//doc.close();
}
iframe.bind('load', function() {
iframe.unbind('load');
if (K.IE) {
ready();
} else {
setTimeout(ready, 0);
}
});
K('.ke-map', div).replaceWith(iframe);
// search map
searchBtn.click(function() {
win.search(addressBox.val());
});
});
});