Add new tilesets viewer static page (#16232)
Víctor Velarde
4 years ago
committed by
GitHub
parent
343a4a16c6
commit
68aa129bef
@ -0,0 +1,7 @@
|
||||
class Admin::TilesetsViewerController < ApplicationController
|
||||
protect_from_forgery except: :index
|
||||
|
||||
def index
|
||||
render(file: "public/static/tilesets_viewer/index.html", layout: false)
|
||||
end
|
||||
end
|
||||
@ -0,0 +1,43 @@
|
||||
<template>
|
||||
<div ref="viewer">
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import init from '@carto/viewer/src/init';
|
||||
|
||||
/* global __CARTO_MAPS_API_V2_EXTERNAL_URL_TEMPLATE__:false */
|
||||
// __CARTO_MAPS_API_V2_EXTERNAL_URL_TEMPLATE__ is injected via Webpack
|
||||
const CARTO_MAPS_API_V2_EXTERNAL_URL_TEMPLATE = __CARTO_MAPS_API_V2_EXTERNAL_URL_TEMPLATE__;
|
||||
|
||||
export default {
|
||||
name: 'App',
|
||||
mounted () {
|
||||
this.mountViewer();
|
||||
},
|
||||
methods: {
|
||||
async mountViewer () {
|
||||
const element = this.$refs.viewer;
|
||||
const { username, type } = this.getUsernameType();
|
||||
|
||||
this.props = {
|
||||
username: username,
|
||||
type: type,
|
||||
mapsUrl: CARTO_MAPS_API_V2_EXTERNAL_URL_TEMPLATE,
|
||||
query: new URLSearchParams(window.location.search),
|
||||
goBackFunction: () => {
|
||||
window.location = '/';
|
||||
}
|
||||
};
|
||||
init(element, this.props);
|
||||
},
|
||||
getUsernameType () {
|
||||
const regex = /viewer\/user\/(.*)\/(.*)/.exec(window.location.pathname);
|
||||
return { username: regex[1], type: regex[2] };
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
</style>
|
||||
@ -0,0 +1,15 @@
|
||||
import Vue from 'vue';
|
||||
import VueI18n from 'vue-i18n';
|
||||
|
||||
import en from 'new-dashboard/i18n/locales/en';
|
||||
|
||||
Vue.use(VueI18n);
|
||||
|
||||
const i18n = new VueI18n({
|
||||
locale: 'en',
|
||||
messages: {
|
||||
en
|
||||
}
|
||||
});
|
||||
|
||||
export default i18n;
|
||||
@ -0,0 +1,18 @@
|
||||
import Vue from 'vue';
|
||||
import App from './App.vue';
|
||||
|
||||
import i18n from './i18n';
|
||||
import store from './store';
|
||||
|
||||
Vue.config.productionTip = false;
|
||||
|
||||
const el = '#app';
|
||||
|
||||
/* eslint-disable no-new */
|
||||
new Vue({
|
||||
el,
|
||||
store,
|
||||
i18n,
|
||||
components: { App },
|
||||
template: '<App />'
|
||||
});
|
||||
@ -0,0 +1,39 @@
|
||||
/* Theme */
|
||||
$color-primary: #2E51E8;
|
||||
$color-primary--soft: #F2F6F9;
|
||||
$color-primary--dark: #3D33CC;
|
||||
|
||||
@import '../new-dashboard/styles/variables';
|
||||
|
||||
// base
|
||||
@import '../new-dashboard/styles/base/reset';
|
||||
@import '../new-dashboard/styles/base/typography';
|
||||
|
||||
// layout
|
||||
@import '../new-dashboard/styles/layout/cells';
|
||||
@import '../new-dashboard/styles/layout/grid';
|
||||
@import '../new-dashboard/styles/layout/page';
|
||||
@import '../new-dashboard/styles/layout/section';
|
||||
|
||||
// components
|
||||
@import '../new-dashboard/styles/components/buttons';
|
||||
@import '../new-dashboard/styles/components/checkbox';
|
||||
@import '../new-dashboard/styles/components/code';
|
||||
@import '../new-dashboard/styles/components/welcome';
|
||||
@import '../new-dashboard/styles/components/scrollbar';
|
||||
|
||||
// pages
|
||||
@import '../new-dashboard/styles/pages/solutionsIcons';
|
||||
@import '../new-dashboard/styles/pages/visualizations';
|
||||
|
||||
// helpers
|
||||
@import '../new-dashboard/styles/helpers/colors';
|
||||
@import '../new-dashboard/styles/helpers/flexbox';
|
||||
@import '../new-dashboard/styles/helpers/spacing';
|
||||
@import '../new-dashboard/styles/helpers/utilities';
|
||||
|
||||
//hangar
|
||||
@import '../new-dashboard/styles/hangar/main';
|
||||
|
||||
//vendors
|
||||
@import '../new-dashboard/styles/vendors/perfect-scrollbar';
|
||||
@ -0,0 +1,15 @@
|
||||
import Vue from 'vue';
|
||||
import Vuex from 'vuex';
|
||||
import catalog from 'new-dashboard/store/modules/data/catalog';
|
||||
|
||||
Vue.use(Vuex);
|
||||
|
||||
const store = new Vuex.Store({
|
||||
state: {},
|
||||
getters: {},
|
||||
modules: {
|
||||
catalog
|
||||
}
|
||||
});
|
||||
|
||||
export default store;
|
||||
Loading…
Reference in new issue