Add File System Example

This commit is contained in:
The Jared Wilcurt 2019-10-29 12:27:04 -04:00
parent eb31b843e2
commit 3955b2e342
2 changed files with 92 additions and 1 deletions

View File

@ -0,0 +1,85 @@
<template>
<div>
<div v-if="error">
There was an error attempting to read from the file system.
</div>
<button
data-test="fs-example-button"
@click="getCurrentDirectory"
>
<template v-if="!error">
Click for File System example
</template>
<template v-else>
Try again for File System example
</template>
</button>
<template v-if="contents">
<p>
The contents of the current working directory:
</p>
<div class="contents">
<div
v-for="(file, fileIndex) in contents"
class="file"
:key="'file' + fileIndex"
>
{{ file }}
</div>
</div>
</template>
</div>
</template>
<script>
export default {
name: 'FsExample',
data: function () {
return {
contents: null,
error: false
};
},
methods: {
getCurrentDirectory: function () {
const fs = window.nw.require('fs');
try {
this.contents = fs.readdirSync('.');
this.error = false;
} catch (err) {
this.error = true;
}
}
},
computed: {}
};
</script>
<style scoped>
button {
background: linear-gradient(0deg, #2EB277, #65E6AC);
border-width: 3.4px;
border-color: #35495E;
border-radius: 8px;
margin: 22px 0px 6px 0px;
padding: 11px 17px;
color: #050709;
font-family: 'Trebuchet MS', Verdana, sans-serif;
font-size: 16px;
font-weight: bold;
}
.contents {
display: flex;
flex-flow: wrap;
}
.file {
flex-grow: 1;
min-width: 200px;
background: #DDD;
margin: 5px;
padding: 11px;
}
</style>

View File

@ -37,17 +37,23 @@
<h3>Ecosystem</h3>
<LinkList :links="ecosystemLinks" />
<hr />
<FsExample />
</div>
</template>
<script>
import Vue from 'vue';
import FsExample from '@/components/FsExample.vue';
import LinkList from '@/components/LinkList.vue';
export default {
name: 'HelloWorld',
components: {
FsExample,
LinkList
},
props: {
@ -157,7 +163,7 @@ export default {
},
computed: {
devMode: function () {
return window.process.env.NODE_ENV === 'development';
return window.process.versions['nw-flavor'] === 'sdk';
},
versions: function () {
return window.process.versions;