Initial commit

lib/assets/javascripts/builder/editor.js

@@ -0,0 +1,526 @@
+var ACTIVE_LOCALE = window.ACTIVE_LOCALE;
+
+ACTIVE_LOCALE = 'zh-cn';
+if (ACTIVE_LOCALE !== 'en') {
+  require('moment/locale/' + ACTIVE_LOCALE);
+}
+var Locale = require('locale/index');
+var Polyglot = require('node-polyglot');
+require('promise-polyfill');
+var polyglot = new Polyglot({
+  locale: ACTIVE_LOCALE, // Needed for pluralize behaviour
+  phrases: Locale[ACTIVE_LOCALE]
+});
+window._t = polyglot.t.bind(polyglot);
+
+var $ = require('jquery');
+var _ = require('underscore');
+var Backbone = require('backbone');
+var deepInsights = require('deep-insights/index');
+var ConfigModel = require('builder/data/config-model');
+var EditorMapView = require('builder/editor/editor-map-view');
+var MapDefinitionModel = require('builder/data/map-definition-model');
+var AnalysisDefinitionNodesCollection = require('builder/data/analysis-definition-nodes-collection');
+var AnalysisDefinitionsCollection = require('builder/data/analysis-definitions-collection');
+var LayerDefinitionsCollection = require('builder/data/layer-definitions-collection');
+var WidgetDefinitionsCollection = require('builder/data/widget-definitions-collection');
+var VisDefinitionModel = require('builder/data/vis-definition-model');
+var createEditorMenuTabPane = require('builder/components/tab-pane/create-editor-menu-tab-pane');
+var editorPaneTemplate = require('builder/editor/editor-pane.tpl');
+var editorPaneIconItemTemplate = require('builder/editor/editor-pane-icon.tpl');
+var ModalsServiceModel = require('builder/components/modals/modals-service-model');
+var AnalysesService = require('builder/editor/layers/layer-content-views/analyses/analyses-service');
+var OnboardingsServiceModel = require('builder/components/onboardings/onboardings-service-model');
+var BuilderOnboardingLauncher = require('builder/components/onboardings/builder/launcher');
+var viewFactory = require('builder/components/view-factory');
+var UserModel = require('builder/data/user-model');
+var UserNotifications = require('builder/data/user-notifications');
+var EditorModel = require('builder/data/editor-model');
+var UserActions = require('builder/data/user-actions');
+var ImporterManager = require('builder/components/background-importer/background-importer');
+var BackgroundPollingModel = require('builder/data/editor-background-polling-model');
+var StyleManager = require('builder/editor/style/style-manager');
+var DeepInsightsIntegrations = require('./deep-insights-integrations');
+var EditFeatureOverlay = require('./deep-insights-integration/edit-feature-overlay');
+var Notifier = require('builder/components/notifier/notifier');
+var MetricsTracker = require('builder/components/metrics/metrics-tracker');
+// var WebGLMetrics = require('builder/components/metrics/webgl-metrics');
+var FeedbackButtonView = require('builder/editor/feedback/feedback-button-view');
+var SettingsOptions = require('builder/data/map-settings');
+var SettingsView = require('builder/editor/editor-settings-view');
+var OverlaysCollection = require('builder/data/overlays-definition-collection');
+var MapcapsCollection = require('builder/data/mapcaps-collection');
+var PrivacyCollection = require('builder/components/modals/publish/privacy-collection');
+var CreatePrivacyOptions = require('builder/components/modals/publish/create-privacy-options');
+var UserGroupFetcher = require('builder/data/users-group-fetcher');
+var State = require('builder/data/state-definition-model');
+var LegendDefinitionsCollection = require('builder/data/legends/legend-definitions-collection');
+var LegendsState = require('builder/data/legends/legends-state');
+var LegendFactory = require('builder/editor/layers/layer-content-views/legend/legend-factory');
+var EditorVisualizationWarningView = require('builder/components/modals/editor-visualization-warning/editor-visualization-warning-view');
+var MapModeModel = require('./map-mode-model');
+var NodeGeometryTracker = require('./node-geometry-tracker');
+var WidgetsService = require('builder/editor/widgets/widgets-service');
+var DataServicesApiCheck = require('builder/editor/layers/layer-content-views/analyses/analyses-quota/analyses-quota-info');
+var AppNotifications = require('./app-notifications');
+var TipsyTooltipView = require('builder/components/tipsy-tooltip-view');
+var Router = require('builder/routes/router');
+var handleAnalysesRoute = require('builder/routes/handle-analyses-route');
+var handleModalsRoute = require('builder/routes/handle-modals-route');
+var handleWidgetRoute = require('builder/routes/handle-widget-route');
+
+const ForbiddenAction = require('builder/data/backbone/network-interceptors/interceptors/forbidden-403');
+const NetworkResponseInterceptor = require('builder/data/backbone/network-interceptors/interceptor');
+NetworkResponseInterceptor.addURLPattern('api/v');
+NetworkResponseInterceptor.addErrorInterceptor(ForbiddenAction());
+NetworkResponseInterceptor.start();
+
+// JSON data passed from entry point (editor/visualizations/show.html):
+var vizJSON = window.vizJSON;
+var stateJSON = window.stateJSON;
+var userData = window.userData;
+var frontendConfig = window.frontendConfig;
+var visualizationData = window.visualizationData;
+var layersData = window.layersData;
+var analysesData = window.analysesData;
+var builderNotifications = window.builderNotifications;
+var mapcapsData = window.mapcapsData;
+var overlaysData = window.overlaysData;
+var basemaps = window.basemaps;
+
+var configModel = new ConfigModel(
+  _.defaults(
+    {
+      base_url: userData.base_url,
+      api_key: userData.api_key
+    },
+    frontendConfig
+  )
+);
+
+DataServicesApiCheck.get(configModel).fetch();
+
+var onboardingNotification = new UserNotifications(builderNotifications, {
+  key: 'builder',
+  configModel: configModel
+});
+
+var userModel = new UserModel(userData, {
+  configModel: configModel
+});
+
+var editorModel = new EditorModel();
+
+var visDefinitionModel = new VisDefinitionModel(visualizationData, {
+  configModel: configModel
+});
+var modals = new ModalsServiceModel();
+var onboardings = new OnboardingsServiceModel();
+onboardings.editorModel = editorModel;
+
+UserGroupFetcher.track({
+  userModel: userModel,
+  configModel: configModel,
+  acl: visDefinitionModel.getPermissionModel().acl
+});
+
+var stateDefModel = new State({
+  json: stateJSON
+}, {
+  visDefinitionModel: visDefinitionModel
+});
+
+var mapId = visualizationData.map_id;
+
+var analysisDefinitionNodesCollection = new AnalysisDefinitionNodesCollection(null, {
+  userModel: userModel,
+  configModel: configModel,
+  relatedTableData: visualizationData.related_tables
+});
+
+var layerDefinitionsCollection = new LayerDefinitionsCollection(null, {
+  configModel: configModel,
+  userModel: userModel,
+  analysisDefinitionNodesCollection: analysisDefinitionNodesCollection,
+  mapId: mapId,
+  stateDefinitionModel: stateDefModel
+});
+
+var analysisDefinitionsCollection = new AnalysisDefinitionsCollection(analysesData, {
+  configModel: configModel,
+  analysisDefinitionNodesCollection: analysisDefinitionNodesCollection,
+  layerDefinitionsCollection: layerDefinitionsCollection,
+  vizId: visDefinitionModel.id
+});
+
+layerDefinitionsCollection.resetByLayersData(layersData);
+
+// Track geometry changes over any node definition model
+NodeGeometryTracker.track({
+  analysisDefinitionsCollection: analysisDefinitionsCollection,
+  analysisDefinitionNodesCollection: analysisDefinitionNodesCollection,
+  layerDefinitionsCollection: layerDefinitionsCollection
+});
+
+var widgetDefinitionsCollection = new WidgetDefinitionsCollection(null, {
+  configModel: configModel,
+  mapId: mapId,
+  layerDefinitionsCollection: layerDefinitionsCollection,
+  analysisDefinitionNodesCollection: analysisDefinitionNodesCollection
+});
+
+vizJSON.widgets.forEach(function (widgetDefinitionModel) {
+  widgetDefinitionsCollection.add(widgetDefinitionModel);
+});
+
+var legendDefinitionsCollection = new LegendDefinitionsCollection(null, {
+  configModel: configModel,
+  layerDefinitionsCollection: layerDefinitionsCollection,
+  vizId: visDefinitionModel.id
+});
+legendDefinitionsCollection.resetByData(vizJSON);
+LegendFactory.init(legendDefinitionsCollection);
+LegendsState.init(layerDefinitionsCollection, legendDefinitionsCollection);
+
+Notifier.init({
+  editorModel: editorModel,
+  visDefinitionModel: visDefinitionModel
+});
+
+AppNotifications.init();
+
+MetricsTracker.init({
+  userId: userModel.get('id'),
+  visId: visDefinitionModel.get('id'),
+  configModel: configModel
+});
+
+BuilderOnboardingLauncher.init({
+  onboardings: onboardings,
+  userModel: userModel,
+  editorModel: editorModel,
+  onboardingNotification: onboardingNotification
+});
+
+AnalysesService.init({
+  onboardings: onboardings,
+  layerDefinitionsCollection: layerDefinitionsCollection,
+  modals: modals,
+  userModel: userModel,
+  configModel: configModel
+});
+
+var userActions = UserActions({
+  userModel: userModel,
+  analysisDefinitionsCollection: analysisDefinitionsCollection,
+  analysisDefinitionNodesCollection: analysisDefinitionNodesCollection,
+  layerDefinitionsCollection: layerDefinitionsCollection,
+  widgetDefinitionsCollection: widgetDefinitionsCollection
+});
+
+var privacyOptions = CreatePrivacyOptions(visDefinitionModel, userModel);
+var privacyCollection = new PrivacyCollection(privacyOptions);
+
+var mapcapsCollection = new MapcapsCollection(mapcapsData, {
+  visDefinitionModel: visDefinitionModel
+});
+
+var backgroundPollingModel = new BackgroundPollingModel({
+  importsPolling: false
+}, {
+  configModel: configModel,
+  userModel: userModel,
+  userActions: userActions
+});
+
+ImporterManager.init({
+  pollingModel: backgroundPollingModel,
+  createVis: false,
+  userModel: userModel,
+  configModel: configModel,
+  modals: modals
+});
+
+var mapDefModel = new MapDefinitionModel(
+  _.extend(
+    vizJSON,
+    {
+      id: visualizationData.map_id
+    }
+  ),
+  {
+    parse: true,
+    configModel: configModel,
+    userModel: userModel,
+    layerDefinitionsCollection: layerDefinitionsCollection
+  }
+);
+
+var overlaysCollection = new OverlaysCollection(overlaysData, {
+  configModel: configModel,
+  visId: visDefinitionModel.id
+});
+
+var mapModeModel = new MapModeModel();
+
+WidgetsService.init({
+  analysisDefinitionNodesCollection: analysisDefinitionNodesCollection,
+  editorModel: editorModel,
+  layerDefinitionsCollection: layerDefinitionsCollection,
+  modals: modals,
+  userActions: userActions,
+  widgetDefinitionsCollection: widgetDefinitionsCollection
+});
+
+var mapCreation = function () {
+  BuilderOnboardingLauncher.launch();
+
+  deepInsights.createDashboard('#dashboard', vizJSON, {
+    apiKey: configModel.get('api_key'),
+    no_cdn: false,
+    cartodb_logo: false,
+    renderMenu: false,
+    show_empty_infowindow_fields: true,
+    showLimitErrors: true,
+    state: stateJSON,
+    interactiveFeatures: true,
+    layerSelectorEnabled: false
+  }, function (error, dashboard) {
+    if (error) {
+      window.trackJs && window.trackJs.console.log({
+        type: 'Dashboard:',
+        data: error
+      });
+    }
+
+    var vis = dashboard.getMap();
+    var dashboardView = dashboard.getView();
+
+    dashboardView.listenTo(editorModel, 'change:edition', function (m) {
+      dashboardView.$el.toggleClass('is-dark', m.isEditing());
+    });
+
+    var styleManager = new StyleManager(layerDefinitionsCollection, vis.map, configModel);
+
+    var editFeatureOverlay = new EditFeatureOverlay({
+      map: vis.map,
+      mapModeModel: mapModeModel,
+      modals: modals
+    });
+    editFeatureOverlay.hide();
+    vis.addCustomOverlay(editFeatureOverlay);
+
+    var deepInsightsIntegrations = new DeepInsightsIntegrations({
+      onboardings: onboardings,
+      userModel: userModel,
+      deepInsightsDashboard: dashboard,
+      analysisDefinitionsCollection: analysisDefinitionsCollection,
+      analysisDefinitionNodesCollection: analysisDefinitionNodesCollection,
+      layerDefinitionsCollection: layerDefinitionsCollection,
+      legendDefinitionsCollection: legendDefinitionsCollection,
+      widgetDefinitionsCollection: widgetDefinitionsCollection,
+      overlayDefinitionsCollection: overlaysCollection,
+      visDefinitionModel: visDefinitionModel,
+      mapDefinitionModel: mapDefModel,
+      stateDefinitionModel: stateDefModel,
+      mapModeModel: mapModeModel,
+      configModel: configModel,
+      editorModel: editorModel,
+      editFeatureOverlay: editFeatureOverlay
+    });
+
+    var currentRoute = Router.getRouteModel().get('currentRoute');
+    handleWidgetRoute(currentRoute, widgetDefinitionsCollection);
+
+    // Expose things after Map initialization
+    window.deepInsightsIntegrations = deepInsightsIntegrations;
+    window.styleManager = styleManager;
+    window.dashboard = dashboard;
+    window.vis = vis;
+  });
+};
+
+if (visDefinitionModel.get('version') === 2 && modals) {
+  visDefinitionModel.bind('change:version', function () {
+    mapcapsCollection.fetch();
+    mapCreation();
+  }, this);
+
+  modals.create(function (modalModel) {
+    return new EditorVisualizationWarningView({
+      modalModel: modalModel,
+      visDefinitionModel: visDefinitionModel
+    });
+  }, {
+    escapeOptionsDisabled: true,
+    keepOpenOnRouteChange: true
+  });
+} else {
+  mapCreation();
+}
+
+var settingsCollection = new Backbone.Collection(SettingsOptions(overlaysCollection, mapDefModel, userModel));
+
+Router.init({
+  modals: modals,
+  widgetDefinitionsCollection: widgetDefinitionsCollection,
+  editorModel: editorModel,
+  handleModalsRoute: function (currentRoute, modals) {
+    handleModalsRoute(currentRoute, modals);
+  },
+  handleAnalysesRoute: function (currentRoute) {
+    handleAnalysesRoute(currentRoute);
+  },
+  handleWidgetRoute: function (currentRoute, widgetDefinitionsCollection) {
+    handleWidgetRoute(currentRoute, widgetDefinitionsCollection);
+  }
+});
+
+var rootLocation = (/(\/builder\/[0-z\.\-]+\/?)/).exec(location.pathname)[1];
+var baseUrl = userModel.isInsideOrg() ? '/u/' + userModel.get('username') : '';
+Backbone.history.start({ pushState: true, hashChange: false, root: baseUrl + rootLocation });
+
+var editorTabPaneView = createEditorMenuTabPane([
+  {
+    icon: 'pencilMenu',
+    name: 'editor',
+    tooltip: 'edit-map',
+    selected: true,
+    onClick: function () { Router.goToLayerList(); },
+    createContentView: function () {
+      editorModel.set({ settingsView: false });
+      return new EditorMapView({
+        basemaps: basemaps,
+        userActions: userActions,
+        configModel: configModel,
+        userModel: userModel,
+        editorModel: editorModel,
+        pollingModel: backgroundPollingModel,
+        mapDefinitionModel: mapDefModel,
+        onboardings: onboardings,
+        modals: modals,
+        visDefinitionModel: visDefinitionModel,
+        layerDefinitionsCollection: layerDefinitionsCollection,
+        analysisDefinitionNodesCollection: analysisDefinitionNodesCollection,
+        widgetDefinitionsCollection: widgetDefinitionsCollection,
+        mapcapsCollection: mapcapsCollection,
+        privacyCollection: privacyCollection,
+        legendDefinitionsCollection: legendDefinitionsCollection,
+        mapModeModel: mapModeModel,
+        stateDefinitionModel: stateDefModel,
+        onboardingNotification: onboardingNotification,
+        settingsCollection: settingsCollection,
+        routeModel: Router.getRouteModel()
+      });
+    }
+  }, {
+    icon: 'settings',
+    name: 'settings',
+    tooltip: 'map-settings',
+    onClick: function () { Router.goToSettings(); },
+    createContentView: function () {
+      editorModel.set({ settingsView: true });
+      return new SettingsView({
+        mapDefinitionModel: mapDefModel,
+        overlaysCollection: overlaysCollection,
+        mapcapsCollection: mapcapsCollection,
+        visDefinitionModel: visDefinitionModel,
+        privacyCollection: privacyCollection,
+        configModel: configModel,
+        userModel: userModel,
+        modals: modals,
+        editorModel: editorModel,
+        settingsCollection: settingsCollection,
+        stateDefinitionModel: stateDefModel
+      });
+    }
+  }
+], {
+  tabPaneOptions: {
+    className: 'Editor-wrapper',
+    template: editorPaneTemplate,
+    url: userModel.get('base_url'),
+    avatar_url: userModel.get('avatar_url'),
+    tabPaneItemOptions: {
+      tagName: 'li',
+      klassName: 'EditorMenu-navigationItem'
+    },
+    onRouteChange: function (routeModel) {
+      var route = routeModel.get('currentRoute');
+      if (!route) {
+        Router.goToDefaultRoute();
+        return;
+      }
+      var routeName = route[0];
+      // I feel like we should/could be smarter here
+      // This is the top level routing element which should:
+      // - Show settings for /settings
+      // - Show layers for /layers/**/*
+      // because al subsequent views might do something with the route as well
+      // but they probably depend on the top level having the correct state
+      if (routeName === 'settings') {
+        this.setSelectedTabPaneByName('settings');
+      } else {
+        this.setSelectedTabPaneByName('editor');
+      }
+    }
+  },
+  tabPaneItemIconOptions: {
+    tagName: 'button',
+    template: editorPaneIconItemTemplate,
+    className: 'EditorMenu-navigationLink'
+  }
+});
+
+mapModeModel.bindRouteEvents(Router.getRouteModel());
+
+window.editorTabPane = editorTabPaneView;
+
+$('.js-editor').prepend(editorTabPaneView.render().$el);
+
+editorTabPaneView.listenTo(editorModel, 'change:edition', function (m) {
+  editorTabPaneView.$('.Editor-panelWrapper').toggleClass('is-larger', m.isEditing());
+});
+editorTabPaneView.add_related_model(editorModel);
+
+var tooltip = new TipsyTooltipView({
+  el: editorTabPaneView.$('.js-editor-logo'),
+  title: function () {
+    return _t('back-to-dashboard');
+  },
+  gravity: 'w'
+});
+editorTabPaneView.addView(tooltip);
+
+if (!configModel.get('cartodb_com_hosted')) {
+  var feedbackView = new FeedbackButtonView({ modals: modals });
+  $('.js-editorMenu').append(feedbackView.render().el);
+}
+
+document.title = visDefinitionModel.get('name') + ' | 快点';
+
+if (window.__backboneAgent) {
+  window.__backboneAgent.handleBackbone(Backbone);
+}
+
+// Expose the root stuff to be able to inspect and modify state from
+// developer console (before views)
+window.configModel = configModel;
+window.modals = modals;
+window.onboardings = onboardings;
+window.userActions = userActions;
+window.userModel = userModel;
+window.viewFactory = viewFactory;
+window.visDefinitionModel = visDefinitionModel;
+window.layerDefinitionsCollection = layerDefinitionsCollection;
+window.widgetDefinitionsCollection = widgetDefinitionsCollection;
+window.analysisDefinitionsCollection = analysisDefinitionsCollection;
+window.analysisDefinitionNodesCollection = analysisDefinitionNodesCollection;
+window.legendDefinitionsCollection = legendDefinitionsCollection;
+window.editorModel = editorModel;
+window.mapDefModel = mapDefModel;
+window.overlaysCollection = overlaysCollection;
+window.mapcapsCollection = mapcapsCollection;
+window.stateDefModel = stateDefModel;
+window.settingsCollection = settingsCollection;
+window.Router = Router;