102 lines
2.8 KiB
JavaScript
102 lines
2.8 KiB
JavaScript
import 'iconify-icon'; // import only
|
|
|
|
import objectPath from 'object-path';
|
|
|
|
import { JSONEditor } from '@json-editor/json-editor/dist/jsoneditor';
|
|
|
|
import * as exampleData from '../sample.resume.json';
|
|
import * as jsoncvSchemaModule from '../schema/jsoncv.schema.json';
|
|
import { registerIconLib } from './iconlib';
|
|
import { registerTheme } from './theme';
|
|
import {
|
|
createElement,
|
|
traverseDownObject,
|
|
} from './utils';
|
|
|
|
const propertiesInOrder = ['basics', 'education', 'work', 'skills', 'projects', 'languages', 'interests', 'references', 'awards', 'publications', 'volunteer']
|
|
const basicsPropertiesInOrder = ['name', 'label', 'email', 'phone', 'url', 'summary', 'image', 'location', 'profiles']
|
|
|
|
// toc elements
|
|
const elToc = document.querySelector('.editor-toc')
|
|
const tocUl = createElement('ul', {
|
|
parent: elToc
|
|
})
|
|
const basicsUl = createElement('ul', {
|
|
parent: tocUl
|
|
})
|
|
|
|
|
|
// copy the object to remove the readonly restriction on module
|
|
const jsoncvSchema = {...jsoncvSchemaModule.default}
|
|
|
|
// add propertyOrder to schema, and add links to toc
|
|
propertiesInOrder.forEach((name, index) => {
|
|
jsoncvSchema.properties[name].propertyOrder = index
|
|
|
|
const li = createElement('li', {parent: tocUl})
|
|
createElement('a', {
|
|
text: name,
|
|
attrs: {
|
|
href: `#root.${name}`
|
|
},
|
|
parent: li,
|
|
})
|
|
|
|
if (name === 'basics') {
|
|
li.appendChild(basicsUl)
|
|
}
|
|
})
|
|
basicsPropertiesInOrder.forEach((name, index) => {
|
|
jsoncvSchema.properties.basics.properties[name].propertyOrder = index
|
|
const li = createElement('li', {parent: basicsUl})
|
|
createElement('a', {
|
|
text: name,
|
|
attrs: {
|
|
href: `#root.basics.${name}`
|
|
},
|
|
parent: li,
|
|
})
|
|
})
|
|
|
|
// add headerTemplate for each type:array in schema
|
|
traverseDownObject(jsoncvSchema, (key, obj) => {
|
|
let noun = key
|
|
if (noun.endsWith('s')) noun = noun.slice(0, -1)
|
|
if (obj.type === 'array' && obj.items) {
|
|
obj.items.headerTemplate = `${noun} {{i1}}`
|
|
}
|
|
})
|
|
|
|
// add format to schema
|
|
const keyFormatMap = {
|
|
'basics.properties.summary': 'textarea',
|
|
}
|
|
for (const [key, format] of Object.entries(keyFormatMap)) {
|
|
objectPath.get(jsoncvSchema.properties, key).format = format
|
|
}
|
|
|
|
// change schema title
|
|
jsoncvSchema.title = 'Resume'
|
|
|
|
// initialize editor
|
|
registerTheme(JSONEditor)
|
|
registerIconLib(JSONEditor)
|
|
const elEditorContainer = document.querySelector('.editor-container')
|
|
const editor = new JSONEditor(elEditorContainer, {
|
|
schema: jsoncvSchema,
|
|
theme: 'mytheme',
|
|
iconlib: 'myiconlib',
|
|
disable_array_delete_all_rows: true,
|
|
no_additional_properties: true,
|
|
startval: exampleData,
|
|
});
|
|
editor.on('ready',() => {
|
|
// editor.setValue(exampleData)
|
|
|
|
// add anchor to each schema element
|
|
document.querySelectorAll('[data-schemapath]').forEach(el => {
|
|
const schemapath = el.getAttribute('data-schemapath')
|
|
el.id = schemapath
|
|
})
|
|
})
|