cartodb-4.42/lib/assets/javascripts/builder/editor/layers/basemap-content-views/basemap-select-view.js

115 lines
3.1 KiB
JavaScript
Raw Normal View History

2024-04-06 13:25:13 +08:00
var CoreView = require('backbone/core-view');
var template = require('./basemap-select.tpl');
var MosaicFormView = require('builder/components/mosaic-form-view');
var BasemapFormView = require('./basemap-form-view');
var MosaicCollection = require('builder/components/mosaic/mosaic-collection');
var BasemapMosaicFormView = require('./basemap-mosaic-form-view');
var checkAndBuildOpts = require('builder/helpers/required-opts');
var REQUIRED_OPTS = [
'layerDefinitionsCollection',
'basemapsCollection',
'customBaselayersCollection',
'selectedCategoryVal',
'modals'
];
module.exports = CoreView.extend({
initialize: function (opts) {
checkAndBuildOpts(opts, REQUIRED_OPTS, this);
this._baseLayer = this._layerDefinitionsCollection.getBaseLayer();
this._disabled = opts.disabled;
this._initCollection();
this._initBinds();
},
render: function () {
this.clearSubViews();
this.$el.html(template());
var category = this._selectedCategoryVal.toLowerCase();
switch (category) {
case 'color':
this._renderForm();
break;
case 'custom':
this._renderCustomMosaic();
break;
case 'nasa':
case 'tilejson':
case 'mapbox':
case 'wms':
this._renderCustomMosaic(category);
break;
default:
this._renderMosaic();
}
return this;
},
_initCollection: function () {
this._filteredBasemapsCollection = new MosaicCollection(
this._basemapsCollection.findByCategory(this._selectedCategoryVal)
);
},
_initBinds: function () {
this._filteredBasemapsCollection.bind('change:selected', function (mdl) {
if (mdl.get('selected')) {
var value = mdl.getValue();
this._changeBasemap(value);
}
}, this);
this.add_related_model(this._filteredBasemapsCollection);
},
_changeBasemap: function (value) {
var basemap = this._basemapsCollection.getByValue(value);
this._layerDefinitionsCollection.setBaseLayer(basemap.toJSON());
},
_renderMosaic: function () {
var view = new MosaicFormView({
collection: this._filteredBasemapsCollection,
template: require('./basemap-mosaic.tpl'),
disabled: this._disabled
});
this.addView(view);
this.$('.js-select').append(view.render().el);
},
_renderCustomMosaic: function (category) {
var view = new BasemapMosaicFormView({
collection: this._filteredBasemapsCollection,
template: require('./basemap-mosaic.tpl'),
layerDefinitionsCollection: this._layerDefinitionsCollection,
basemapsCollection: this._basemapsCollection,
customBaselayersCollection: this._customBaselayersCollection,
modals: this._modals,
disabled: this._disabled,
currentTab: category
});
this.addView(view);
this.$('.js-select').append(view.render().el);
},
_renderForm: function () {
var view = new BasemapFormView({
model: this._baseLayer,
basemapsCollection: this._basemapsCollection,
layerDefinitionsCollection: this._layerDefinitionsCollection,
disabled: this._disabled
});
this.addView(view);
this.$('.js-select').append(view.render().el);
}
});