enigmaquip/manuals
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

First Commit

Browse Source
This commit is contained in:
EnigmaQuip
2019-03-22 15:44:58 -06:00
commit fc975446f2
9 changed files with 330 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

159
html/index.html Normal file
View File

@@ -0,0 +1,159 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>Service Information</title>
<link href='https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900|Material+Icons' rel="stylesheet">
<link href="static/vuetify.min.css" rel="stylesheet">
<style>
.v-treeview-node__content,
.v-treeview-node__label{flex-shrink:1;font-size:0.9rem;}
.v-treeview-node__root{height:auto;}
[class="1-column-portrait"]{float:right;max-width:330px;}
.dtwarning{color:red;}
.dtnote{color:blue;}
.dtcaution{color:goldenrod;}
@media print {.v-content{padding:0 !important;}}
</style>
</head>
<body>
<div id="app">
<v-app>
<v-toolbar app clipped-left class="hidden-print-only">
<v-spacer></v-spacer>
<v-flex xs3 d-flex>
<v-select
v-model="year"
:items="yearitems"
label="Year"
outline
height=18
v-on:input="changeYear"
></v-select>
</v-flex>
<v-flex xs3 d-flex>
<v-select
v-model="model"
:items="modelitems"
label="Model"
outline
height=18
v-on:input="changeEngine"
></v-select>
</v-flex>
<v-flex xs3 d-flex>
<v-select
v-model="engine"
:items="engineitems"
label="Engine"
outline
height=18
v-on:input="changeCar"
></v-select>
</v-flex>
</v-toolbar>
<v-navigation-drawer permanent app fixed clipped class="hidden-print-only">
<v-text-field
v-model="search"
label="Search Manuals"
flat
solo-inverted
hide-details
clearable
></v-text-field>
<v-treeview
:open.sync="listactive"
:items="sidebar"
:search="search"
item-key="id"
open-on-click>
<template v-slot:label="{ item }">
<a v-if="item.file" @click="index(item.file)">{{item.name}}</a>
<span v-else :id="item.id">{{item.name}}</span>
</template>
</v-treeview>
</v-navigation-drawer>
<v-content>
<v-container fluid>
<div :is="dynamicHtml"></div>
</v-container>
</v-content>
</v-app>
</div>
<script src="static/vue.min.js"></script>
<script src="static/vuetify.min.js"></script>
<script>
var app = new Vue({
el: '#app',
data: {
listactive: [],
body: "",
sidebar: [],
search:"",
items: [],
yearitems: [],
year:" ",
modelitems: [],
model:" ",
engineitems: [],
engine:" "
},
computed: {
dynamicHtml() {
return {
template: this.body
}
}
},
created: function() {
fetch('cars')
.then(res => res.json())
.then(json => {
this.items = json;
this.yearitems = Object.keys(json);
})
},
updated: function() {
const refs = document.querySelectorAll('.intxref');
refs.forEach(refitem => {
var pointedAt = document.querySelector(refitem.getAttribute('href'));
refitem.innerText = pointedAt.getElementsByTagName("em")[0].innerText;
})
},
methods: {
changeYear() {
this.modelitems = Object.keys(this.items[this.year])
},
changeEngine() {
this.engineitems = Object.keys(this.items[this.year][this.model])
},
changeCar() {
document.title = [this.year, this.model, this.engine].join(" ");
fetch(this.items[this.year][this.model][this.engine])
.then(res => res.json())
.then(json => {
this.sidebar=json;
})
},
switchToc(list) {
var temp = JSON.parse(list);
temp.forEach(item => this.listactive.push(item));
var element = document.getElementById(temp[0]);
element.scrollIntoView({block: "start"});
},
index (folder) {
fetch("file/" + folder)
.then(res => res.text())
.then(json => {
this.$set(this, 'body', json);
console.log(this.body);
window.scrollTo(0, 0);
})
.catch(err => console.warn(err))
}
}
})
</script>
</body>
</html>

6
html/static/vue.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

5
html/static/vuetify.min.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

6
html/static/vuetify.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long