65 lines
1.5 KiB
JavaScript
65 lines
1.5 KiB
JavaScript
import {createAppPageComponent} from './components/app-page';
|
|
|
|
function init() {
|
|
const components = loadComponents();
|
|
const categories = loadCategories(components);
|
|
const themes = loadThemes();
|
|
const patterns = loadPatterns();
|
|
|
|
window.components = components;
|
|
window.categories = categories;
|
|
window.themes = themes;
|
|
window.patterns = patterns;
|
|
|
|
const app = new Vue(createAppPageComponent({
|
|
components,
|
|
categories
|
|
}));
|
|
};
|
|
|
|
function loadCategories(components) {
|
|
const set = new Set();
|
|
components.forEach(component => {
|
|
set.add(component.category);
|
|
});
|
|
|
|
return [...set.values()].map(value => {
|
|
return {
|
|
name: value,
|
|
hash: value.toLowerCase().replace(/ /g, '_')
|
|
};
|
|
});
|
|
}
|
|
|
|
function loadComponents() {
|
|
return JSON.parse(document.querySelector('#data').getAttribute('data-components')).map(component => {
|
|
component = component.annotation;
|
|
component.id = component.name.toLowerCase().replace(/ /g, '_');
|
|
return component;
|
|
});
|
|
}
|
|
|
|
function loadThemes() {
|
|
const themes = JSON.parse(document.querySelector('#data').getAttribute('data-themes')).map(theme => {
|
|
return theme;
|
|
}).filter(theme => {
|
|
return theme !== 'onsen-css-components';
|
|
});
|
|
|
|
// デフォルトのテーマを先頭に追加
|
|
themes.unshift('onsen-css-components');
|
|
|
|
return themes;
|
|
}
|
|
|
|
function loadPatterns() {
|
|
return JSON.parse(document.querySelector('#data').getAttribute('data-patterns')).map(pattern => {
|
|
pattern.id = pattern.name.toLowerCase().replace(/ +/g, '_');
|
|
|
|
return pattern;
|
|
});
|
|
}
|
|
|
|
window.onload = init;
|
|
|