Merge branch 'master' into mann-fr-cv-studio-0

This commit is contained in:
chris2fr 2020-10-24 15:18:51 +02:00
commit 6c58decfdd
5 changed files with 199 additions and 97 deletions

View File

@ -1,4 +1,4 @@
{
// "liveServer.settings.port": 5501;
editor.disableMonospaceOptimizations: true;
"liveServer.settings.port": 5501,
"editor.disableMonospaceOptimizations": true
}

View File

@ -36,51 +36,68 @@ var router = new VueRouter({
var app = new Vue({
el: '#app',
router: router,
components:
{
components:
{
},
data:
{
status: "loading",
sections: {},
/**
* Details of the current page/route.
*/
activePage: {
id: "",
title: "",
fontAwesomeIconCss: ""
},
data:
{
status: "loading",
countryCodes: [],
sections: {},
/**
* Details of the current page/route.
*/
activePage: {
id: "",
title: "",
fontAwesomeIconCss: ""
},
currentVersion: "",
countryCodes: []
},
versions: []
},
created()
{
this.sections = models.newDefaultSections();
console.log("this.sections=", this.sections);
created()
{
this.sections = models.newDefaultSections();
// this.versons = [];
this.versions = storage.getLocalStorage("versions");
this.currentVersion = "";
//-- Register all components
pageComponents.registerComponents();
// console.log("this.sections=", this.sections);
//-- Get the component for the initial route path
var initialRoute = this.$route.path;
var component = pageComponents.getComponentByPath(initialRoute);
this.setActivePageByComponent(component);
},
//-- Register all components
pageComponents.registerComponents();
destroyed()
{
},
//-- Get the component for the initial route path
var initialRoute = this.$route.path;
var component = pageComponents.getComponentByPath(initialRoute);
this.setActivePageByComponent(component);
},
mounted()
{
destroyed()
{
},
mounted()
{
this.loadCountryCodes();
this.loadFromStorage();
this.currentVersion = this.$root.sections.meta.version
// Quick Fix
storage.setVersionedLocalStorage(this.currentVersion, "sections", this.$root.sections);
// console.log([this.$root.sections.meta.version,this.$root.sections]);
//if (!this.availableVersions.hasKey(this.$root.sections.meta.version))
// this.availableVersions.push(this.$root.sections.meta.version);
// console.log([this.versions[0],storage.getVersionedLocalStorage(this.versions[0])]);
// this.availableVersions = this.$root.availableVersions;
// Set the "current" main navigation item based on the current route.
this.selectMenuItemForCurrentUrl();
@ -109,7 +126,19 @@ var app = new Vue({
this.activePage.fontAwesomeIconCss = component.fontAwesomeIcon;
},
onVersionChange: function() {
//Save previous state
storage.setVersionedLocalStorage(this.$root.sections.meta.version,"sections",this.$root.sections);
// console.log(["version",this.currentVersion,this.$root.sections.meta.version]);
this.$root.sections = storage.getVersionedLocalStorage(this.currentVersion,"sections");
// console.log(["Root Sections",this.$root.sections]);
storage.setLocalStorage(this.$root.sections); // Perhaps optimisation to come
//console.log(["version",this.currentVersion,this.$root.sections.meta.version]);
},
/**
* Reset and clear the details of the active page.
@ -120,13 +149,21 @@ var app = new Vue({
this.activePage.title = "";
this.activePage.fontAwesomeIconCss = "";
},
/*
*
*/
loadFromStorage: function()
{
var savedData = storage.getLocalStorage("sections");
this.populateSections(savedData);
},
loadVersionFromStorage: function(version)
{
var savedData = storage.getLocalStorageVersion(version,"sections");
this.populateSections(savedData);
},
populateSections: function(data)
{
if (data)
@ -141,9 +178,10 @@ var app = new Vue({
}
}
},
loadCountryCodes: function()
{
console.log("loadCountryCodes(): data", countryCodes);
// console.log("loadCountryCodes(): data", countryCodes);
this.countryCodes.push({
"code": "",
@ -159,7 +197,6 @@ var app = new Vue({
}
},
getCountryName: function(countryCode)
{
for (var i = 0; i < this.countryCodes.length; i++)
@ -174,12 +211,11 @@ var app = new Vue({
return "";
},
displayLocation: function()
{
return this.sections.basics.location.city + ", " + this.getCountryName(this.sections.basics.location.countryCode);
},
skillLevelAsPercent: function(index)
{
@ -202,6 +238,7 @@ var app = new Vue({
return 50;
}
},
languageFluencyAsPercent: function(index)
{
if (!this.$root.sections.skills[index]) {
@ -280,6 +317,7 @@ var app = new Vue({
return false;
},
saveResume: function()
{
var response = confirm("Resume saved");

View File

@ -1,35 +1,29 @@
var importComponent = {
template: '#import-template',
mounted: function()
{
},
destroyed: function()
{
},
data: function()
{
return {
item: {},
json: ""
};
},
methods: {
importJson: function()
{
console.log("import JSON: " + this.json);
// console.log("import JSON: " + this.json);
var data = JSON.parse(this.json);
@ -40,13 +34,61 @@ var importComponent = {
storage.setLocalStorage("sections", this.$root.sections);
storage.setVersionedLocalStorage(this.$root.sections.meta.version, "sections", this.$root.sections);
router.push("section/basics");
},
validateJson: function(value)
{
},
importVersion: function(version) {
//console.log(version);
this.$root.sections = storage.getVersionedLocalStorage(version,"sections");
storage.setLocalStorage("sections",this.$root.sections);
this.$root.currentVersion = version;
this.$root.loadFromStorage();
router.push("section/basics");
},
deleteVersion: function(version) {
var versions = storage.getLocalStorage("versions");
var index = versions.indexOf(version);
if (index > -1 && confirm("Are you sure you wish to delete " + version + "?")) {
versions.splice(index, 1);
storage.setVersionedLocalStorage(version,"sections",null);
storage.setLocalStorage("versions",versions);
this.$root.versions = versions;
}
},
deleteClicked: function(index)
{
console.log(index);
var response = confirm("Are you sure you want to delete this position? " + index);
if (response == true)
{
this.$root.versions.splice(index, 1);
}
},
moveUpClicked: function(index)
{
console.log(index);
this.$root.moveArrayPosition(this.$root.versions, index, index - 1);
},
moveDownClicked: function(index)
{
console.log(index);
this.$root.moveArrayPosition(this.$root.versions, index, index + 1);
}
}
};

View File

@ -57,8 +57,14 @@
<nav class="w3-sidebar w3-collapse w3-white w3-animate-left" style="z-index:3;width:300px;" id="mySidebar">
<div class="w3-bar-block">
<a href="#/" class="w3-bar-item w3-button w3-padding w3-blue"><i class="fas fa-home"></i>&nbsp; Home</a>
<a v-bind:href="this.sections.meta.canonical" v-if="this.sections.meta.canonical != ''" target="_new" class="w3-bar-item w3-button w3-padding w3-blue">{{ this.sections.meta.version }}</a>
<span v-else class="w3-bar-item w3-button w3-padding w3-blue">{{ this.sections.meta.version }}</span><span v-if="this.sections.meta.lastModified != ''" class="w3-bar-item w3-button w3-padding w3-blue">({{ this.sections.meta.lastModified}})</span>
<form>
<select name="currentVersion" v-model="currentVersion" @change="onVersionChange()">
<option v-for="(version, v_index) in this.$root.versions">
{{ version }}
</option>
</select>
</form>
<a v-bind:href="this.sections.meta.canonical" v-if="this.sections.meta.canonical != ''" target="_new" class="w3-bar-item w3-button w3-padding "><i class="fas fa-link"></i> link ({{ this.sections.meta.lastModified}})</a>
</div>
<div class="w3-container w3-margin-top">
<h5>Sections</h5>
@ -164,8 +170,6 @@
</div>
</template>
<template type="text/x-template" id="section-basics-template" lang="html">
<div id="section-basics-root">
<div class="w3-row">
@ -405,8 +409,6 @@
</div>
</template>
<template type="text/x-template" id="section-volunteer-template" lang="html">
<div id="section-volunteer-root">
<button type="button" class="w3-btn w3-white w3-border w3-border-blue w3-round w3-padding-small" v-on:click="addPosition">+ Add Position</button>
@ -482,8 +484,6 @@
</div>
</template>
<template type="text/x-template" id="section-education-template" lang="html">
<div id="section-education-root">
<button type="button" class="w3-btn w3-white w3-border w3-border-blue w3-round w3-padding-small" v-on:click="addEducation">+ Add Education</button>
@ -558,8 +558,6 @@
</div>
</template>
<template type="text/x-template" id="section-awards-template" lang="html">
<div id="section-awards-root">
<p>
@ -608,8 +606,6 @@
</div>
</template>
<template type="text/x-template" id="section-publications-template" lang="html">
<div id="section-publications-root">
<p>
@ -664,8 +660,6 @@
</div>
</template>
<template type="text/x-template" id="section-skills-template" lang="html">
<div id="section-skills-root">
<p>
@ -719,8 +713,6 @@
</div>
</template>
<template type="text/x-template" id="section-languages-template" lang="html">
<div id="section-languages-root">
<p>
@ -757,8 +749,6 @@
</div>
</template>
<template type="text/x-template" id="section-interests-template" lang="html">
<div id="section-interests-root">
<button type="button" class="w3-btn w3-white w3-border w3-border-blue w3-round w3-padding-small" v-on:click="addInterest">+ Add Interest</button>
@ -804,8 +794,6 @@
</div>
</template>
<template type="text/x-template" id="section-references-template" lang="html">
<div id="section-references-root">
<p>
@ -842,8 +830,6 @@
</div>
</template>
<template type="text/x-template" id="section-projects-template" lang="html">
<div id="section-projects-root">
<button type="button" class="w3-btn w3-white w3-border w3-border-blue w3-round w3-padding-small" v-on:click="addProject">+ Add Project</button>
@ -949,8 +935,6 @@
</div>
</template>
<template type="text/x-template" id="preview-resume-template" lang="html">
<div id="preview-resume-root">
<!-- Page Container -->
@ -1236,8 +1220,6 @@
</div>
</template>
<template type="text/x-template" id="preview-single-field-template" lang="html">
<div id="preview-single-field-root">
<div class="w3-row w3-margin-bottom" v-if="displayFormat == '' || displayFormat == 'url' || displayFormat == 'multi-line' || displayFormat == 'email' || displayFormat == 'phone' || displayFormat == 'date'">
@ -1266,8 +1248,6 @@
</div>
</template>
<template type="text/x-template" id="card-header-template" lang="html">
<div id="card-header-root">
<header class="w3-container w3-dark-grey w3-padding-16" v-bind:id="'header' + id">
@ -1285,8 +1265,6 @@
</div>
</template>
<template type="text/x-template" id="sorted-input-item-template" lang="html">
<div id="sorted-input-item-root">
<div class="" v-bind:id="'item' + id">
@ -1304,20 +1282,30 @@
</div>
</template>
<template type="text/x-template" id="import-template" lang="html">
<div id="import-root">
<p>
Past existing resume JSON and import to continue editing.
Paste existing resume JSON and import to continue editing.
</p>
<textarea rows="20" class="w3-input w3-border" type="text" v-model="json"></textarea>
<button class="w3-btn w3-white w3-border w3-border-blue w3-round" v-on:click="importJson">Import</button>
<br/>
<BR/>
<form class="w3-card-4 margin-top-32" v-for="(version, v_index) in this.$root.versions">
<card-header v-bind:label="version" v-bind:id="v_index" v-on:delete-clicked="deleteClicked" v-on:move-up-clicked="moveUpClicked" v-on:move-down-clicked="moveDownClicked"></card-header>
<div class="w3-container w3-hide" v-bind:id="'content' + v_index">
<button class="w3-btn w3-white w3-border w3-border-blue w3-round" v-on:click="importVersion(version,$event)">
Load {{ version }}
</button>
<button class="w3-btn w3-white w3-border w3-border-blue w3-round" v-on:click="deleteVersion(version,$event)">
Delete {{ version }}
</button>
</div>
</form>
</div>
</template>
<template type="text/x-template" id="export-template" lang="html">
<div id="export-root">
<p>
@ -1327,8 +1315,6 @@
</div>
</template>
<template type="text/x-template" id="about-template" lang="html">
<div id="export-root">
<p>
@ -1368,10 +1354,10 @@
<script type="text/javascript" src="vendor/vue.2.6.10.js"></script>
<script type="text/javascript" src="vendor/vue-router.3.1.3.js"></script>
<script type="text/javascript" src="vendor/markdown-it-10.0.0.js"></script>
<script type="text/javascript" src="app/page_registration.js"></script>
<script type="text/javascript" src="components/home.js"></script>
<script type="text/javascript" src="components/section_basics.js"></script>
<script type="text/javascript" src="components/section_work.js"></script>
@ -1391,6 +1377,7 @@
<script type="text/javascript" src="components/import.js"></script>
<script type="text/javascript" src="components/export.js"></script>
<script type="text/javascript" src="components/about.js"></script>
<script type="text/javascript" src="app/app.js"></script>
<!-- /Scripts -->

View File

@ -3,33 +3,68 @@
*/
var storage = {
getCurrentVersion: function()
{
console.log("storage getCurrentVersion" + this.getLocalStorage('sections.meta.version'));
return this.getLocalStorage('sections.meta.version');
},
getAvailableVersions: function()
{
return storage.getLocalStorage("versions");
},
setLocalStorage: function(key, value)
{
var jsonValue = JSON.stringify(value);
localStorage.setItem(key, jsonValue);
},
setVersionedLocalStorage: function(version, key, value)
{
var jsonValue = JSON.stringify(value);
key = "versions." + version + "." + key;
localStorage.setItem(key, jsonValue);
this.versions = [];
if (this.getLocalStorage("versions")) {
this.versions = this.getLocalStorage("versions");
}
if (!this.versions.includes(version)) {
this.versions.push(version);
}
// versions.push(version);
// console.log([version, key, value, versions]);
this.setLocalStorage("versions",this.versions);
},
getLocalStorage: function(key)
{
jsonValue = localStorage.getItem(key);
// console.log(key);
var value = null;
if (jsonValue)
if (key)
{
value = JSON.parse(jsonValue);
value = JSON.parse(localStorage.getItem(key));
}
// console.log(value);
return value;
//return this.parseJSON2Native(localStorage.getItem(key));
},
/*
* @TODO optimize
*/
getVersionedLocalStorage: function(version, key)
{
return this.getLocalStorage("versions." + version + "." + key);
},
clearLocalStorage: function(key)
{
localStorage.removeItem(key);
}
},
}