diff --git a/src/DGAttribution/src/DGAttribution.js b/src/DGAttribution/src/DGAttribution.js index aef45652..5d024dc8 100644 --- a/src/DGAttribution/src/DGAttribution.js +++ b/src/DGAttribution/src/DGAttribution.js @@ -207,7 +207,7 @@ DG.Control.Attribution.include({ return { 'logotype': isHideButton, 'work_on': this.t('work_on'), - 'has_no_key': this._isDefaultKey ? null : this.t('has_no_key'), + 'has_no_key': this._isDefaultKey ? this.t('has_no_key') : null, 'lang': lang, 'copyright_apilink': this._getLink('copyright_apilink'), 'copyright_license': this._getLink('copyright_license'), diff --git a/src/DGCustomization/skin/basic/less/dg-customization.less b/src/DGCustomization/skin/basic/less/dg-customization.less index 0fc02ea0..be9f7b69 100755 --- a/src/DGCustomization/skin/basic/less/dg-customization.less +++ b/src/DGCustomization/skin/basic/less/dg-customization.less @@ -100,5 +100,7 @@ font-family: Helvetica, Arial, sans-serif; font-weight: Bold; pointer-events: none; + box-sizing: border-box; + padding: 0 20px; } diff --git a/src/DGCustomization/src/DGMap.ApiKeyValidator.js b/src/DGCustomization/src/DGMap.ApiKeyValidator.js index da35f198..ebe4db17 100644 --- a/src/DGCustomization/src/DGMap.ApiKeyValidator.js +++ b/src/DGCustomization/src/DGMap.ApiKeyValidator.js @@ -1,5 +1,5 @@ DG.ApiKeyValidator = DG.Class.extend({ - initialize: function(apiKey) { + initialize: function(apiKey, mapContainer) { this.apiKey = apiKey; this.endpoint = DG.config.keyServer + apiKey + DG.config.keyServices; this.isLoading = false; @@ -8,6 +8,8 @@ DG.ApiKeyValidator = DG.Class.extend({ this.request = null; this.MAX_ATTEMPTS = 4; this.keyRequestInterval = [0, 2, 2, 2]; + this.isErrorWasShown = false; + this.mapContainer = mapContainer; }, validate: function(callback) { @@ -20,6 +22,14 @@ DG.ApiKeyValidator = DG.Class.extend({ this._makeAttempt(callback); }, + validateKeyResponse: function() { + this.validate(function(response) { + if (!response || this._isResponseInvalid(response)) { + this._showError(); + } + }.bind(this)); + }, + _makeAttempt: function(callback) { if (this.attempts > 0) { this.lastTimeout = window.setTimeout(function() { @@ -31,31 +41,39 @@ DG.ApiKeyValidator = DG.Class.extend({ } }, - _executeRequest: function(callback) { - var xhr = new XMLHttpRequest(); - xhr.open('GET', this.endpoint, true); + _isResponseInvalid: function(response) { + return ( + response.meta.code === 400 || + response.meta.code === 404 || + response.result && + (!response.result.service.is_active || + !response.result.is_active || + response.result.service.status.code !== 'ok' + ) + ); + }, - xhr.onreadystatechange = function() { - if (xhr.readyState === 4) { - if (xhr.status === 200) { - try { - var response = JSON.parse(xhr.responseText); - this.isLoading = false; - callback(response); - } catch (e) { - this._handleError(callback, xhr.status); - } - } else { - this._handleError(callback, xhr.status); - } - } - }.bind(this); + _showError: function() { - xhr.onerror = function() { - this._handleError(callback, xhr.status); - }.bind(this); + if (!this.isErrorWasShown && this.mapContainer) { + var errorMessage = DG.DomUtil.create('div', 'dg-error-message'); + errorMessage.innerHTML = 'Your RasterJS API key is invalid. Please contact api@2gis.com to get RasterJS API key.'; + this.mapContainer.appendChild(errorMessage); + this.isErrorWasShown = true; + } + }, - xhr.send(); + _executeRequest: function(callback) { + this.request = DG.ajax(this.endpoint, { + type: 'GET', + success: function(response) { + this.isLoading = false; + callback(response); + }.bind(this), + error: function(xhr) { + this._handleError(callback, xhr.status); + }.bind(this) + }); }, _handleError: function(callback, status) { diff --git a/src/DGCustomization/src/DGMap.BaseLayer.js b/src/DGCustomization/src/DGMap.BaseLayer.js index fc489230..99285ab3 100644 --- a/src/DGCustomization/src/DGMap.BaseLayer.js +++ b/src/DGCustomization/src/DGMap.BaseLayer.js @@ -16,30 +16,9 @@ DG.Map.addInitHook(function() { }); var apiKey = this.options.key || DG.config.key; - - this.isErrorWasShown = false; - function handleTileError() { - var errorMessage = DG.DomUtil.create('div', 'dg-error-message'); - if (!this.isErrorWasShown) { - errorMessage.innerHTML = 'Your RasterJS API key is invalid. Please contact api@2gis.com to get RasterJS API key.'; - - var mapContainer = this.map.getContainer(); - - if (mapContainer) { - mapContainer.appendChild(errorMessage); - } - - this.isErrorWasShown = true; - } - } - - var validator = new DG.ApiKeyValidator(apiKey); - validator.validate(function(response) { - - if (response.meta.code === 400 || response.meta.code === 404 || response.result && (!response.result.service.is_active || !response.result.is_active || response.result.service.status.code !== 'ok')) { - handleTileError.call(this); - } - }); + var mapContainer = this.getContainer(); + var validator = new DG.ApiKeyValidator(apiKey, mapContainer); + validator.validateKeyResponse(); var tileUrl = DG.config.secureProtocol + (DG.Browser.retina ? DG.config.retinaTileServer : DG.config.tileServer); var arabicTileUrl = DG.config.secureProtocol +