Skip to content
Snippets Groups Projects
Select Git revision
  • 8e298643d9d76205a58e114174ede0d8b3e47d81
  • master default protected
  • feat/new-image-formats
  • clickable-select-chevron
  • 2.20.0
  • 2.19.0
  • 2.18.0
  • 2.17.0
  • 2.16.1
  • 2.16.0
  • 2.15.0
  • 2.14.0
  • 2.13.0
  • 2.12.1
  • 2.11.0
  • 2.10.0
  • 2.9.1
  • 2.9.0
  • 2.8.0
  • 2.7.1
  • 2.7.0
  • 2.6.0
  • 2.5.2
  • 2.5.1
24 results

main.js

Blame
  • user avatar
    Tomáš Valenta authored
    06e2dadf
    History
    main.js 2.51 KiB
    import Vue from "vue";
    
    import { forEachNode } from "./utils";
    
    import Renderer from "./components/calendar/Renderer";
    import DummyProvider from "./components/calendar/DummyProvider";
    import GoogleProvider from "./components/calendar/GoogleProvider"
    import MonthCalendar from "./components/full-calendar/MonthCalendar";
    import YearCalendar from "./components/full-calendar/YearCalendar";
    import RegionMap from "./components/RegionMap";
    import ViewProvider from "./components/ViewProvider";
    import Navbar from "./components/navbar/Navbar";
    import FooterCollapsible from "./components/footer/FooterCollapsible";
    import FlipClock from "./components/FlipClock";
    
    import Chart from 'chart.js/auto';
    
    
    Vue.component("ui-calendar-renderer", Renderer);
    Vue.component("ui-calendar-dummy-provider", DummyProvider);
    Vue.component("ui-calendar-google-provider", GoogleProvider);
    Vue.component("ui-month-calendar", MonthCalendar);
    Vue.component("ui-year-calendar", YearCalendar);
    Vue.component("ui-region-map", RegionMap);
    Vue.component("ui-view-provider", ViewProvider);
    Vue.component("ui-navbar", Navbar);
    Vue.component("ui-footer-collapsible", FooterCollapsible);
    Vue.component("ui-flip-clock", FlipClock);
    
    
    import UiApp from "./components/UiApp.vue";
    
    
    const appFactory = (el, attrs) => {
      // Bootstrap Vue.js.
      new Vue({
        el,
        components: {
          UiApp
        }
      });
    };
    
    
    /**
     * Bootstrap Vue.js application at given Element instance.
     *
     * App properties are passed via data attributes, like:
     *
     * <div class="__vue-root" data-message="Hello" data-app="SomeApp"></div>
     *
     * @param {Element} el DOM Element
     */
    function renderVueAppElement(el) {
      const attrs = Object.assign({}, el.dataset);
      return appFactory(el, attrs);
    }
    
    
    function renderChart(element) {
      const data = [
        { year: 2010, count: 10 },
        { year: 2011, count: 20 },
        { year: 2012, count: 15 },
        { year: 2013, count: 25 },
        { year: 2014, count: 22 },
        { year: 2015, count: 30 },
        { year: 2016, count: 28 },
      ];
    
      new Chart(
        element,
        {
          type: 'bar',
          data: {
            labels: data.map(row => row.year),
            datasets: [
              {
                label: 'Firemní akvizice každý rok',
                data: data.map(row => row.count)
              }
            ]
          }
        }
      );
    }
    
    
    function init(event) {
      // Initialize Vue.js apps.
      forEachNode(document.querySelectorAll('.__js-root'), renderVueAppElement)
    
      // Show example charts.
      forEachNode(document.querySelectorAll('.__chart-example'), renderChart);
    }
    
    document.addEventListener('DOMContentLoaded', init);