this.width = CKEDITOR.config.googlemaps_width || 400;
this.height = CKEDITOR.config.googlemaps_height || 240;
-
+ this.widthType = 'px';
+ this.heightType = 'px';
+
this.centerLat = CKEDITOR.config.googlemaps_centerLat || 35.594757;
this.centerLon = CKEDITOR.config.googlemaps_centerLon || 139.620739;
this.zoom = CKEDITOR.config.googlemaps_zoom || 11;
{
var w = Math.min(this.width, 640);
var h = Math.min(this.height, 640);
+ if (this.widthType == '%') w = 640;
+ if (this.heightType == '%') h = 640;
+
var staticMapTypes = ['roadmap', 'satellite', 'hybrid', 'terrain'];
var mapUrl = 'http://maps.google.com/maps/api/staticmap?center=' + this.centerLat + ',' + this.centerLon
{
var iWidth, iHeight;
var regexSize = /^\s*(\d+)px\s*$/i;
+ var regexSizePer = /^\s*(\d+)%\s*$/i;
if (oFakeNode.style.width)
{
iWidth = aMatchW[1];
oFakeNode.style.width = '';
oFakeNode.width = iWidth;
+ this.widthType = 'px';
+ } else {
+ aMatchW = oFakeNode.style.width.match(regexSizePer);
+ if (aMatchW)
+ {
+ iWidth = aMatchW[1];
+ oFakeNode.style.width = '';
+ oFakeNode.width = iWidth;
+ this.widthType = '%';
+ }
}
}
iHeight = aMatchH[1];
oFakeNode.style.height = '';
oFakeNode.height = iHeight;
+ this.heightType = 'px';
+ } else {
+ aMatchH = oFakeNode.style.height.match(regexSizePer);
+ if (aMatchH)
+ {
+ iHeight = aMatchH[1];
+ oFakeNode.style.height = '';
+ oFakeNode.height = iHeight;
+ this.heightType = '%';
+ }
}
}
this.width = iWidth ? iWidth : oFakeNode.width;
this.height = iHeight ? iHeight : oFakeNode.height;
}
-GoogleMap.prototype.setDimensions = function(width, height)
+GoogleMap.prototype.setDimensions = function(width, height, widthType, heightType)
{
this.width = width;
this.height = height;
+ this.widthType = widthType;
+ this.heightType = heightType;
}
GoogleMap.prototype.decodeText = function(string)
{
// 入力値初期化
dialog.setValueOf('tab_map', 'txtWidth', mapInfo.width);
dialog.setValueOf('tab_map', 'txtHeight', mapInfo.height);
+ dialog.setValueOf('tab_map', 'cmbWidthType', mapInfo.widthType);
+ dialog.setValueOf('tab_map', 'cmbHeightType', mapInfo.heightType);
dialog.setValueOf('tab_map', 'cmbZoom', mapInfo.zoom);
dialog.setValueOf('tab_map', 'txtCenterLat', mapInfo.centerLat);
dialog.setValueOf('tab_map', 'txtCenterLon', mapInfo.centerLon);
{
if (!mapDiv) return;
- mapDiv.style.width = dialog.getValueOf('tab_map', 'txtWidth') + 'px';
- mapDiv.style.height = dialog.getValueOf('tab_map', 'txtHeight') + 'px';
-
+// mapDiv.style.width = dialog.getValueOf('tab_map', 'txtWidth') + 'px';
+// mapDiv.style.height = dialog.getValueOf('tab_map', 'txtHeight') + 'px';
+ mapDiv.style.width = dialog.getValueOf('tab_map', 'txtWidth') + dialog.getValueOf('tab_map', 'cmbWidthType');
+ mapDiv.style.height = dialog.getValueOf('tab_map', 'txtHeight') + dialog.getValueOf('tab_map', 'cmbHeightType');
+
//ResizeParent();
};
var updatePreview = function()
// マップ情報更新
mapInfo.width = data.info['txtWidth'];
mapInfo.height = data.info['txtHeight'];
+ mapInfo.widthType = data.info['cmbWidthType'];
+ mapInfo.heightType = data.info['cmbHeightType'];
mapInfo.zoom = data.info['cmbZoom'];
mapInfo.centerLat = data.info['txtCenterLat'];
mapInfo.centerLon = data.info['txtCenterLon'];
// var newMapElement = CKEDITOR.dom.element.createFromHtml('<div></div>', editor.document);
// newMapElement.append(scriptElement);
var newMapElement = CKEDITOR.dom.element.createFromHtml('<div>' + script + '</div>', editor.document); // IE8 not work.
- var style = 'width:' + mapInfo.width + 'px;height:' + mapInfo.height + 'px;display:none;';
+ var style = 'width:' + mapInfo.width + mapInfo.widthType + ';height:' + mapInfo.height + mapInfo.heightType + ';display:none;';
newMapElement.setAttributes({
'id': 'gmap' + mapInfo.number,
'style': style,
'background-position': 'center center',
'background-repeat': 'no-repeat',
'border': '0px',
- 'width': mapInfo.width + 'px',
- 'height': mapInfo.height + 'px'
+ 'width': mapInfo.width + mapInfo.widthType,
+ 'height': mapInfo.height + mapInfo.heightType
};
var newFakeImage = editor.createFakeElement(newMapElement, 'cke_googlemaps' + mapInfo.number, 'div', false);
newFakeImage.setStyles( extraStyles );
{
// 項目を横に配置
type: 'hbox',
- widths: [ '10%', '20%' ], // 項目間幅を調整
+ widths: [ '10%', '10%', '10%' ], // 項目間幅を調整
/* padding: '5px',*/
children: [
{
},
commit: commitValue
}, {
+ type: 'select',
+ id: 'cmbWidthType',
+ label: editor.lang.googlemaps.widthType,
+ style: 'width:50px',
+ 'default': 'px',
+ items: [
+ [ 'px', 'px' ],
+ [ '%', '%' ]
+ ],
+ commit: commitValue
+ }, {
type : 'text',
id : 'txtHeight',
label: editor.lang.googlemaps.height,
commit: commitValue
}, {
type: 'select',
- id: 'cmbZoom',
- label: editor.lang.googlemaps.zoomLevel,
+ id: 'cmbHeightType',
+ label: editor.lang.googlemaps.heightType,
style: 'width:50px',
- 'default': '',
+ 'default': 'px',
items: [
- [ '0', '0' ],
- [ '1', '1' ],
- [ '2', '2' ],
- [ '3', '3' ],
- [ '4', '4' ],
- [ '5', '5' ],
- [ '6', '6' ],
- [ '7', '7' ],
- [ '8', '8' ],
- [ '9', '9' ],
- [ '10', '10' ],
- [ '11', '11' ],
- [ '12', '12' ],
- [ '13', '13' ],
- [ '14', '14' ],
- [ '15', '15' ],
- [ '16', '16' ],
- [ '17', '17' ]
+ [ 'px', 'px' ],
+ [ '%', '%' ]
],
- onLoad: function(){
- fieldZoom = document.getElementById(this.getInputElement().$.id); // 参照を取得
- },
- onChange: function() {
- if (mapObj) mapObj.setZoom(parseInt(this.getValue()), 10);
- },
commit: commitValue
} ]
}, {
type: 'hbox',
- widths: [ '50%', '50%' ],
+ widths: [ '10%', '10%', '10%' ],
children: [
{
type: 'text',
if (mapObj) mapObj.setCenter(new google.maps.LatLng(fieldCenterLatitude.value, this.getValue()));
},
commit: commitValue
+ }, {
+ type: 'select',
+ id: 'cmbZoom',
+ label: editor.lang.googlemaps.zoomLevel,
+ style: 'width:50px',
+ 'default': '',
+ items: [
+ [ '0', '0' ],
+ [ '1', '1' ],
+ [ '2', '2' ],
+ [ '3', '3' ],
+ [ '4', '4' ],
+ [ '5', '5' ],
+ [ '6', '6' ],
+ [ '7', '7' ],
+ [ '8', '8' ],
+ [ '9', '9' ],
+ [ '10', '10' ],
+ [ '11', '11' ],
+ [ '12', '12' ],
+ [ '13', '13' ],
+ [ '14', '14' ],
+ [ '15', '15' ],
+ [ '16', '16' ],
+ [ '17', '17' ]
+ ],
+ onLoad: function(){
+ fieldZoom = document.getElementById(this.getInputElement().$.id); // 参照を取得
+ },
+ onChange: function() {
+ if (mapObj) mapObj.setZoom(parseInt(this.getValue()), 10);
+ },
+ commit: commitValue
} ]
}, {
type: 'html',
var mapInfo = GoogleMapsHandler.getMap(mapNumber);
if (mapInfo){
// 幅、高さを設定
- var width, height;
+ var width, height, widthType, heightType;
var style = element.attributes.style;
- if ((/width:\s*(\d+)px/i).test(style)) width = RegExp.$1;
- if ((/height:\s*(\d+)px/i).test(style)) height = RegExp.$1;
+ if ((/width:\s*(\d+)px/i).test(style)){
+ width = RegExp.$1;
+ widthType = 'px';
+ } else if ((/width:\s*(\d+)%/i).test(style)){
+ width = RegExp.$1;
+ widthType = '%';
+ }
+ if ((/height:\s*(\d+)px/i).test(style)){
+ height = RegExp.$1;
+ heightType = 'px';
+ } else if ((/height:\s*(\d+)%/i).test(style)){
+ height = RegExp.$1;
+ heightType = '%';
+ }
if (!width || !height){
width = CKEDITOR.config.googlemaps_width;
height = CKEDITOR.config.googlemaps_height;
+ widthType = 'px';
+ heightType = 'px';
}
- mapInfo.setDimensions(width, height);
+ mapInfo.setDimensions(width, height, widthType, heightType);
// 画像を背景に配置しリサイズ不可にする
CKEDITOR.addCss(
'background-position: center center;' +
'background-repeat: no-repeat;' +
'border: 0px;' +
- 'width: ' + width + 'px;' +
- 'height: ' + height + 'px;' +
+ 'width: ' + width + widthType + ';' +
+ 'height: ' + height + heightType + ';' +
'}'
);
var fakeImage = editor.createFakeParserElement(element, 'cke_googlemaps' + mapNumber, 'div', false/*リサイズ不可*/);
OSDN Git Service
