getBible
/
app
mirror of https://github.com/getbible/app.git
4
2
Fork 0
Code

Merge pull request #6 from getbible/staging 

New Layout, Also able to save to db
This commit is contained in:
Erastus Amunwe 2021-01-08 17:25:50 +02:00 committed by GitHub
parent 4b6ebcc0a2 45b2fb239f
commit c88d16efbf
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
15 changed files with 974 additions and 744 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

84
src/App.vue
View File

@ -1,44 +1,37 @@
<template> <template>
<div class="secondary-lighten3"> <div class="secondary-lighten3">
<!-- <div v-if="loading" class="uk-overlay-default uk-position-cover"> <navbar />
<div class="uk-position-center"> <div class="uk-container uk-animation-slide-bottom uk-margin-top">
<h1>Loading... Please wait...</h1> <selections />
<div class="uk-container uk-container-small">
<verses />
<options />
</div>
</div> </div>
</div> --> <div v-if="loading" id="overlay">
<navbar/> <div class="uk-position-center">
<div class="uk-container uk-animation-slide-bottom uk-margin-top"> <span uk-spinner="ratio: 3"></span>
<selections/> </div>
<div class="uk-container uk-container-small">
<verses/>
<options/>
</div> </div>
</div> </div>
<div v-if="loading" id="overlay">
<div class="uk-position-center less-opacity">
<h1>Loading... Please wait.</h1>
</div>
</div>
</div>
</template> </template>
<script> <script>
// import _ from 'lodash'; // import _ from 'lodash';
import UIkit from 'uikit'; import UIkit from "uikit";
import Icons from 'uikit/dist/js/uikit-icons'; import Icons from "uikit/dist/js/uikit-icons";
import {mapGetters} from 'vuex'; import { mapGetters } from "vuex";
import navbar from './components/NavBar.vue'; import navbar from "./components/NavBar.vue";
import options from './components/Options.vue'; import options from "./components/Options.vue";
import Selections from './components/Selection.vue' import Selections from "./components/Selection.vue";
import Verses from './components/Verses.vue' import Verses from "./components/Verses.vue";
UIkit.use(Icons); UIkit.use(Icons);
export default { export default {
name: 'App', name: "App",
components: { components: {
navbar, navbar,
options, options,
@ -46,23 +39,22 @@ export default {
Verses, Verses,
}, },
computed: { computed: {
...mapGetters(['loading']) ...mapGetters(["loading"]),
}, },
created(){ created() {
this.$store.dispatch("initialise");
this.$store.dispatch('initialise') console.log("Initialising");
console.log('Initialising'); console.log(JSON.parse(JSON.stringify(this.$store.state)));
console.log(JSON.parse(JSON.stringify(this.$store.state))); },
} };
}
</script> </script>
<style lang="less"> <style lang="less">
@import "../node_modules/uikit/src/less/uikit.less"; @import "../node_modules/uikit/src/less/uikit.less";
@import "../node_modules/uikit/src/less/uikit.theme.less"; @import "../node_modules/uikit/src/less/uikit.theme.less";
@global-link-color: #DA7D02; @global-link-color: #da7d02;
@global-background: #f5f4f4; @global-background: #f5f4f4;
@primary:#55828b; @primary: #55828b;
@secondary: #fed18c; @secondary: #fed18c;
#app { #app {
font-family: Avenir, Helvetica, Arial, sans-serif; font-family: Avenir, Helvetica, Arial, sans-serif;
@ -74,10 +66,10 @@ export default {
} }
.disabled { .disabled {
cursor: not-allowed; cursor: not-allowed;
color: gray color: gray;
} }
.disabled:hover { .disabled:hover {
color:gray color: gray;
} }
#overlay { #overlay {
position: fixed; position: fixed;
@ -88,19 +80,19 @@ export default {
left: 0; left: 0;
right: 0; right: 0;
bottom: 0; bottom: 0;
background-color: rgba(255,255,255,0.7); background-color: rgba(255, 255, 255, 0.7);
z-index: 20000; z-index: 20000;
cursor: pointer; cursor: pointer;
} }
.less-opacity{ .less-opacity {
background-color: rgba(255,255,255,0.7); background-color: rgba(255, 255, 255, 0.7);
} }
.primary { .primary {
// background-color: #813405 !important; // background-color: #813405 !important;
// background-color: #55828b !important; // background-color: #55828b !important;
background-color: @primary !important; background-color: @primary !important;
} }
.secondary { .secondary {
// background-color: #f9a03f !important; // background-color: #f9a03f !important;
// background-color: #87bba2 !important; // background-color: #87bba2 !important;
@ -116,7 +108,7 @@ export default {
.text-primary { .text-primary {
// color: #813405 !important; // color: #813405 !important;
color: #55828b !important; color: #55828b !important;
} }
.text-secondary { .text-secondary {
// color: #f9a03f !important; // color: #f9a03f !important;
// color: #87bba2 !important; // color: #87bba2 !important;

6
src/api/getbible_v2_api.js
View File

@ -4,12 +4,14 @@
let BASE_URL = 'https://getbible.net'; let BASE_URL = 'https://getbible.net';
let API_VERSION = 'v2'; let API_VERSION = 'v2';
export { BASE_URL, API_VERSION };
export default { export default {
get_translations(){ get_translations() {
return fetch(`${BASE_URL}/${API_VERSION}/translations.json`) return fetch(`${BASE_URL}/${API_VERSION}/translations.json`)
}, },
get_translation(abbreviation){ get_translation(abbreviation) {
return fetch(`${BASE_URL}/${API_VERSION}/${abbreviation}.json`) return fetch(`${BASE_URL}/${API_VERSION}/${abbreviation}.json`)
} }
} }

91
src/api/idb.js
View File

@ -27,6 +27,21 @@ export default {
let db = e.target.result; let db = e.target.result;
db.createObjectStore("saved_translations", { keyPath:'abbreviation' }); db.createObjectStore("saved_translations", { keyPath:'abbreviation' });
db.createObjectStore("translations", { keyPath:'abbreviation' }); db.createObjectStore("translations", { keyPath:'abbreviation' });
// let index = translations.createIndex('book_idx', 'name');
// let transaction = db.transaction("books"); // readonly
// let books = transaction.objectStore("books");
// let bookIndex = translations.index("book_idx");
// let request = bookIndex.getAll("Genesis");
// request.onsuccess = function() {
// if (request.result !== undefined) {
// console.log("Books", request.result); // array of books with name="Genesis"
// } else {
// console.log("No such books");
// }
// }
}; };
}); });
}, },
@ -134,50 +149,50 @@ export default {
}); });
}, },
async search(name, keyPath) { // async search(name, keyPath) {
let db = await this.getDb(); // let db = await this.getDb();
return new Promise((resolve, reject) => { // return new Promise((resolve, reject) => {
let trans = db.transaction([name],'readonly'); // let trans = db.transaction([name],'readonly');
trans.oncomplete = () => { // trans.oncomplete = () => {
resolve(tr); // resolve(tr);
}; // };
let store = trans.objectStore(name); // let store = trans.objectStore(name);
let tr = {}; // let tr = {};
store.openCursor().onsuccess = e => { // store.openCursor().onsuccess = e => {
let cursor = e.target.result; // let cursor = e.target.result;
if (cursor) { // if (cursor) {
if (keyPath == cursor.value.keyPath){ // if (keyPath == cursor.value.keyPath){
tr = cursor.value // tr = cursor.value
for (const book in cursor.value.books) { // for (const book in cursor.value.books) {
for (const chapters in book) { // for (const chapters in book) {
for (const verses in chapters) { // for (const verses in chapters) {
for (const verse in verses) { // for (const verse in verses) {
if(verse.text.includes(keyPath)){ // if(verse.text.includes(keyPath)){
console.log("We found a row with value: " + JSON.stringify(verse.text)); // console.log("We found a row with value: " + JSON.stringify(verse.text));
} // }
} // }
} // }
} // }
} // }
} // }
cursor.continue(); // cursor.continue();
} // }
}; // };
trans.onerror = e => { // trans.onerror = e => {
reject(e) // reject(e)
} // }
trans.onabort = e => { // trans.onabort = e => {
reject(e) // reject(e)
} // }
trans.commit(); // trans.commit();
}); // });
}, // },
} }

129
src/components/NavBar.vue
View File

@ -1,50 +1,95 @@
<template> <template>
<div
<div class="secondary" uk-sticky="sel-target: .uk-navbar-container; cls-active: uk-navbar-sticky"> class="secondary"
uk-sticky="sel-target: .uk-navbar-container; cls-active: uk-navbar-sticky"
<nav class="uk-navbar-container primary text-secondary uk-margin-small" uk-navbar> >
<div class="uk-navbar-left"> <nav
class="uk-navbar-container primary text-secondary uk-margin-small"
<!-- <a class="uk-navbar-item uk-logo" href="#">GetBible</a> --> uk-navbar
<a href="#selection" class="uk-navbar-item uk-search uk-search-default primary text-secondary" uk-toggle><span class="primary text-secondary" uk-icon="icon: album; ratio:2"></span>{{book_name }} {{chapter}}</a> >
<div class="uk-navbar-left">
<!-- <a class="uk-navbar-item uk-logo" href="#">GetBible</a> -->
<a
href="#selection"
class="uk-navbar-item uk-search uk-search-default primary text-secondary"
uk-toggle
><span
class="primary text-secondary"
uk-icon="icon: album; ratio:2"
></span
>{{ book_name }} {{ chapter }}</a
>
<a href="#offcanvas-slide" class="uk-navbar-item uk-search uk-search-default primary text-secondary" uk-toggle><span class="primary text-secondary" uk-icon="icon: search; ratio:2"></span>Search</a> <a
href="#offcanvas-slide"
class="uk-navbar-item uk-search uk-search-default primary text-secondary"
uk-toggle
><span
class="primary text-secondary"
uk-icon="icon: search; ratio:2"
></span
>Search</a
>
<search/> <search />
<!-- <span class="uk-label uk-label-primary"><span class="uk-badge uk-badge-danger">{{ num_of_tr}} </span>Translations Available</span> -->
<a class="uk-navbar-item" href="#" uk-toggle><span class="primary text-secondary" uk-icon="icon: history; ratio:2"></span></a>
</div>
<a class="uk-navbar-item uk-position-center-right primary text-secondary" href="#modal-sections" uk-toggle><span class="uk-icon-button primary text-secondary" uk-icon="icon: cog; ratio:2"></span></a>
<!-- Settings component --> <!-- <span class="uk-label uk-label-primary"><span class="uk-badge uk-badge-danger">{{ num_of_tr}} </span>Translations Available</span> -->
<settings/> <a class="uk-navbar-item" href="#" uk-toggle
><span
</nav> class="primary text-secondary"
<div class="uk-position-fixed uk-position-bottom-left"> uk-icon="icon: history; ratio:2"
<ul class="uk-list"> ></span
<li> ></a>
<a href="#" class="uk-icon-button primary uk-margin-small-left primary text-secondary" uk-icon="github"></a> </div>
</li> <a
<li> class="uk-navbar-item uk-position-center-right primary text-secondary"
<a href="#" class="uk-icon-button primary uk-margin-small-left primary text-secondary" uk-icon="facebook"></a> href="#modal-sections"
</li> uk-toggle
<li> ><span
<a href="#" class="uk-icon-button primary uk-margin-small-left primary text-secondary" uk-icon="world"></a> class="uk-icon-button primary text-secondary"
</li> uk-icon="icon: cog; ratio:2"
</ul> ></span
</div> ></a>
</div>
<!-- Settings component -->
<settings />
</nav>
<div class="uk-position-fixed uk-position-bottom-left">
<ul class="uk-list">
<li>
<a
href="#"
class="uk-icon-button primary uk-margin-small-left primary text-secondary"
uk-icon="github"
></a>
</li>
<li>
<a
href="#"
class="uk-icon-button primary uk-margin-small-left primary text-secondary"
uk-icon="facebook"
></a>
</li>
<li>
<a
href="#"
class="uk-icon-button primary uk-margin-small-left primary text-secondary"
uk-icon="world"
></a>
</li>
</ul>
</div>
</div>
</template> </template>
<script> <script>
import Search from './Search.vue'; import Search from "./Search.vue";
import Settings from './Settings.vue'; import Settings from "./Settings.vue";
// import Picker from "./Picker.vue";
export default { export default {
components: { components: {
Search, Search,
Settings Settings,
} // Picker,
} },
};
</script> </script>

269
src/components/Options.vue
View File

@ -1,136 +1,159 @@
<template> <template>
<div class="uk-container"> <div class="uk-container">
<div class="uk-margin" uk-margin>
<div class="uk-margin" uk-margin> <ul class="uk-pagination" v-if="chapter">
<ul class="uk-pagination" v-if="chapter"> <li @click="prev">
<li @click="prev"><a class="text-primary" href="#"><span class="uk-margin-small-right" uk-pagination-previous></span> Previous Chapter</a></li> <a class="text-primary" href="#"
<li class="uk-margin-auto-left" @click="next"><a class="text-primary" href="#">Next Chapter<span class="uk-margin-small-left" uk-pagination-next></span></a></li> ><span class="uk-margin-small-right" uk-pagination-previous></span>
</ul> Previous Chapter</a
</div> >
</li>
<li class="uk-margin-auto-left" @click="next">
<a class="text-primary" href="#"
>Next Chapter<span
class="uk-margin-small-left"
uk-pagination-next
></span
></a>
</li>
</ul>
</div> </div>
</div>
</template> </template>
<script> <script>
import _ from 'lodash'; import _ from "lodash";
import {mapGetters} from 'vuex' import { mapGetters } from "vuex";
import { BASE_URL, API_VERSION } from "../api/getbible_v2_api";
export default { export default {
components:{ components: {},
}, data: function () {
data: function(){ return {
return { progress: 0,
progress: 0, loading: false,
loading: false, };
},
computed: {
translations() {
return this.$store.state.saved_translations;
},
saved_translations() {
console.log(this.$store.state.saved_translations);
return this.$store.state.saved_translations;
},
...mapGetters(["chapters", "chapter"]),
fchapters: function () {
if (!this.search) return this.chapter.verses;
return this.filteredChapters;
},
filteredChapters() {
return _.orderBy(
this.chapter.verses.filter(
(item) =>
item.verse
.toString()
.toLowerCase()
.includes(this.search.toLowerCase()) ||
item.chapter
.toString()
.toLowerCase()
.includes(this.search.toLowerCase()) ||
item.name
.toString()
.toLowerCase()
.includes(this.search.toLowerCase()) ||
item.text.toLowerCase().includes(this.search.toLowerCase())
),
"verse"
);
},
},
methods: {
t(i) {
return this.translations.find((t) => t.abbreviation === i);
},
next() {
if (this.chapter < this.chapters.length)
this.$store.dispatch("set_chapter", this.chapter + 1);
},
prev() {
if (this.chapter > 1)
this.$store.dispatch("set_chapter", this.chapter - 1);
},
async update_chapter() {
// this.loading = true
this.progress = 95;
let config = {
headers: { "Access-Control-Allow-Origin": "*" },
};
}}, let url = `${BASE_URL}/${API_VERSION}/${this.translation}/${this.book}/${this.chapter_num}.json`;
computed: {
translations(){
return this.$store.state.saved_translations;
},
saved_translations(){
console.log(this.$store.state.saved_translations);
return this.$store.state.saved_translations
},
...mapGetters(['chapters', 'chapter']),
fchapters: function (){
if(!this.search)
return this.chapter.verses
return this.filteredChapters
},
filteredChapters() {
return _.orderBy(this.chapter.verses.filter((item) =>
item.verse.toString().toLowerCase().includes(this.search.toLowerCase())
|| item.chapter.toString().toLowerCase().includes(this.search.toLowerCase())
|| item.name.toString().toLowerCase().includes(this.search.toLowerCase())
|| item.text.toLowerCase().includes(this.search.toLowerCase())), 'verse');
},
},
methods:{
t(i){
return this.translations.find(t => t.abbreviation === i)
},
next(){
if(this.chapter<this.chapters.length)
this.$store.dispatch('set_chapter', this.chapter + 1)
},
prev(){
if(this.chapter>1)
this.$store.dispatch('set_chapter', this.chapter - 1)
},
async update_chapter() {
// this.loading = true
this.progress = 95
let config = {
headers: {'Access-Control-Allow-Origin': '*'}
};
let url = `https://getbible.net/v2/${this.translation}/${this.book}/${this.chapter_num}.json`
let response = await fetch(url, config).catch(function(err) {
this.chapter = err
this.loading =false
this.message = 'Error'
});
if (!response) return; let response = await fetch(url, config).catch(function (err) {
this.chapter = err;
this.loading = false;
this.message = "Error";
});
this.progress = 99 if (!response) return;
let data = await response.json().catch(err => {
this.chapter = err
this.loading =false
this.message = 'Error'
})
this.loading =false
if (!data) return;
this.chapter = data this.progress = 99;
this.progress =0 let data = await response.json().catch((err) => {
this.chapter = err;
this.loading = false;
this.message = "Error";
});
this.loading = false;
}, if (!data) return;
async update_tr(){
}, this.chapter = data;
async update_bk(){ this.progress = 0;
let config = { },
headers: {'Access-Control-Allow-Origin': '*'} async update_tr() {},
}; async update_bk() {
this.loading =true let config = {
this.progress =25 headers: { "Access-Control-Allow-Origin": "*" },
this.message = 'Loading...' };
let url = `https://getbible.net/v2/${this.translation}/books.json` this.loading = true;
fetch(url,config) this.progress = 25;
.then(response => response.json()) this.message = "Loading...";
.then(data => { let url = `${BASE_URL}/${API_VERSION}/${this.translation}/books.json`;
// console.log(data) fetch(url, config)
this.books = data .then((response) => response.json())
this.progress = 60 .then((data) => {
this.update_ch(); // console.log(data)
}).catch(function(err) { this.books = data;
this.chapter = err this.progress = 60;
this.loading =false this.update_ch();
this.message = 'Error' })
}); .catch(function (err) {
this.chapter = err;
}, this.loading = false;
async update_ch(){ this.message = "Error";
let config = { });
headers: {'Access-Control-Allow-Origin': '*'} },
}; async update_ch() {
fetch(`https://getbible.net/v2/${this.translation}/${this.book}/chapters.json`,config) let config = {
.then(response => response.json()) headers: { "Access-Control-Allow-Origin": "*" },
.then(data => { };
// console.log(data) fetch(
this.chapters = data `${BASE_URL}/${API_VERSION}/${this.translation}/${this.book}/chapters.json`,
this.progress = 85 config
this.update_chapter(); )
}).catch(function(err) { .then((response) => response.json())
this.chapter = err .then((data) => {
this.loading =false // console.log(data)
this.message = 'Error' this.chapters = data;
}); this.progress = 85;
} this.update_chapter();
}, })
.catch(function (err) {
} this.chapter = err;
this.loading = false;
this.message = "Error";
});
},
},
};
</script> </script>

38
src/components/Picker.vue Normal file
View File

@ -0,0 +1,38 @@
<template>
<div>
<!-- <a href="" uk-marker>
<input v-model="primary" type="color" name="" id="">
</a>
<a href="" uk-marker>
<input v-model="secondary" type="color" name="" id="">
</a> -->
<label for="primary">Primary Color: </label>
<input v-model="primary" type="color" name="primary" id="primary" />
<br />
<label for="secondary">Secondary Color: </label>
<input v-model="secondary" type="color" name="secondary" id="secondary" />
</div>
</template>
<script>
import { dispatch } from "vuex";
export default {
data() {
return {
primary: "#55828b",
secondary: "#fed18c",
};
},
methods: {
updatePrimary() {
dispatch("primary", this.primary);
},
updateSecondary() {
dispatch("secondary", this.secondary);
},
},
};
</script>
<style>
</style>

181
src/components/Search.vue
View File

@ -1,58 +1,139 @@
<template> <template>
<div id="offcanvas-slide" uk-offcanvas>
<div id="offcanvas-slide" uk-offcanvas> <div class="uk-offcanvas-bar secondary text-secondary">
<div class="uk-offcanvas-bar secondary text-secondary"> <div class="uk-nav uk-nav-default">
<div class="uk-margin">
<div class="uk-nav uk-nav-default"> <form class="uk-search uk-search-default" action="javascript:void(0)">
<div class="uk-margin"> <!-- <span uk-search-icon></span> -->
<form class="uk-search uk-search-default" action="javascript:void(0)"> <input
<!-- <span uk-search-icon></span> --> class="uk-search-input text-secondary primary rounded"
<input class="uk-search-input text-secondary primary rounded" v-model="search" type="search" placeholder="Search Words..."> v-model="search_text"
<div class="uk-margin"> type="search"
<button class="uk-button uk-button-default uk-button-small text-secondary primary rounded">Search</button> placeholder="Search Words..."
</div> />
</form> <div class="uk-margin">
<button
</div> class="uk-button uk-button-default uk-button-small text-secondary primary rounded"
>
<div class="uk-margin"> Search
</button>
<div class="uk-margin">
<div class="uk-button-group text-primary ">
<button class="uk-button uk-button-default uk-button-small text-secondary primary uk-active">ALL WORDS</button>
<button class="uk-button uk-button-default uk-button-small text-secondary primary">ANY WORDS</button>
<button class="uk-button uk-button-default uk-button-small text-secondary primary">PHRASE</button>
</div>
</div>
<div class="uk-margin">
<div class="uk-button-group">
<button class="uk-button uk-button-default uk-button-small text-secondary primary uk-active">BIBLE</button>
<button class="uk-button uk-button-default uk-button-small text-secondary primary">OT</button>
<button class="uk-button uk-button-default uk-button-small text-secondary primary">NT</button>
<button class="uk-button uk-button-default uk-button-small text-secondary primary">CHAPTER</button>
</div>
</div>
<div class="uk-margin">
<div class="uk-button-group">
<button class="uk-button uk-button-default uk-button-small text-secondary primary uk-active">EXACT MATCH</button>
<button class="uk-button uk-button-default uk-button-small text-secondary primary">PARTIAL MATCH</button>
</div>
</div>
<div class="uk-margin">
<div class="uk-button-group">
<button class="uk-button uk-button-default uk-button-small text-secondary primary uk-active">CASE INSENSITIVE</button>
<button class="uk-button uk-button-default uk-button-small text-secondary primary">CASE SENSITIVE</button>
</div>
</div>
</div>
</div> </div>
</form>
</div> </div>
</div>
<div class="uk-margin">
<div class="uk-margin">
<div class="uk-button-group text-primary">
<button
class="uk-button uk-button-default uk-button-small text-secondary primary uk-active"
>
ALL WORDS
</button>
<button
class="uk-button uk-button-default uk-button-small text-secondary primary"
>
ANY WORDS
</button>
<button
class="uk-button uk-button-default uk-button-small text-secondary primary"
>
PHRASE
</button>
</div>
</div>
<div class="uk-margin">
<div class="uk-button-group">
<button
class="uk-button uk-button-default uk-button-small text-secondary primary uk-active"
>
BIBLE
</button>
<button
class="uk-button uk-button-default uk-button-small text-secondary primary"
>
OT
</button>
<button
class="uk-button uk-button-default uk-button-small text-secondary primary"
>
NT
</button>
<button
class="uk-button uk-button-default uk-button-small text-secondary primary"
>
CHAPTER
</button>
</div>
</div>
<div class="uk-button-group" data-uk-button-radio>
<label class="uk-button primary">
<input
class="primary"
type="radio"
checked="checked"
v-model="gender"
value="0"
style="display: none"
/>
Male
</label>
<label class="uk-button primary">
<input
type="radio"
v-model="gender"
value="1"
style="display: none"
/>
Female
</label>
</div>
{{ gender }}
<!-- <input type="color" name="theme" id=""> -->
<div class="uk-margin">
<div class="uk-button-group">
<button
class="uk-button uk-button-default uk-button-small text-secondary primary uk-active"
>
EXACT MATCH
</button>
<button
class="uk-button uk-button-default uk-button-small text-secondary primary"
>
PARTIAL MATCH
</button>
</div>
</div>
<div class="uk-margin">
<div class="uk-button-group">
<button
class="uk-button uk-button-default uk-button-small text-secondary primary uk-active"
>
CASE INSENSITIVE
</button>
<button
class="uk-button uk-button-default uk-button-small text-secondary primary"
>
CASE SENSITIVE
</button>
</div>
</div>
</div>
</div>
</div>
</div>
</template> </template>
<script> <script>
export default { export default {
data() {
} return {
search_text: "",
search_area: "",
match: "",
sensitivity: "",
words: "",
gender: "",
};
},
methods: {},
};
</script> </script>

206
src/components/Selection.vue
View File

@ -1,94 +1,128 @@
<template> <template>
<div id="selection" class="primary text-secondary uk-animation-slide-bottom uk-width-1-1 uk-card uk-card-default uk-card-body rounded" uk-margin> <div
<div class="" v-if="!saved_translations.length>0">No translation added. <br/>Please click <a @click="open_settings">HERE</a> to Open Settings</div> id="selection"
<div v-else> class="primary text-secondary uk-animation-slide-bottom uk-width-1-1 uk-card uk-card-default uk-card-body rounded"
uk-margin
<ul class="uk-nav-default uk-nav-parent-icon uk-witdth-1-1 " uk-nav="multiple: false" > >
<li class="uk-parent uk-witdth-1-1"><a class="text-secondary">Translation</a> <div class="" v-if="!saved_translations.length > 0">
<ul class="uk-nav-sub uk-subnav uk-subnav-pill uk-pagination" uk-margin> No translations added. <br />Please click
<a @click="open_settings">HERE</a> to Open Settings
<!-- <li><a href="#"><span uk-pagination-previous></span></a></li> -->
<li
class="uk-card uk-card-hover text-secondary rounded"
v-for="(tr,i) in saved_translations"
@click="set_translation(tr.abbreviation)"
:key="i"
><a class="text-secondary" href="#">{{tr["language"]?`(${tr["language"]})`:null}} {{tr['translation']}}</a></li>
<!-- <li><a href="#"><span uk-pagination-next></span></a></li> -->
</ul>
</li>
<li class="uk-nav-divider uk-witdth-1-1"></li>
<li v-if="translation" class="uk-parent uk-witdth-1-1"><a class="text-secondary">Books</a>
<ul class="uk-nav-sub uk-subnav uk-subnav-pill uk-pagination" uk-margin>
<!-- <li><a href="#"><span uk-pagination-previous></span></a></li> -->
<li class="uk-card uk-card-hover text-secondary"
v-for="(bk,i) in books"
@click="set_book(bk['nr'])"
:key="i"
><a href="#" class="text-secondary">{{bk['name']}}</a></li>
<!-- <li><a href="#"><span uk-pagination-next></span></a></li> -->
</ul>
</li>
<li class="uk-nav-divider uk-witdth-1-1"></li>
<li v-if="book_nr" class="uk-parent uk-witdth-1-1 "><a class="text-secondary">Chapters</a>
<ul class="uk-nav-sub uk-subnav uk-subnav-pill uk-pagination" uk-margin>
<!-- <li><a href="#"><span uk-pagination-previous></span></a></li> -->
<li
class="uk-card uk-card-hover "
v-for="(ch,i) in chapters"
@click="set_chapter(ch['chapter'])"
:key="i"
><a href="#selection" class="text-secondary" uk-toggle>{{ch['chapter']}}</a></li>
<!-- <li><a href="#"><span uk-pagination-next></span></a></li> -->
</ul>
</li>
</ul>
</div> </div>
</div> <div v-else>
<ul
class="uk-nav-default uk-nav-parent-icon uk-witdth-1-1"
uk-nav="multiple: false"
>
<li class="uk-parent uk-witdth-1-1">
<a class="text-secondary">Translation</a>
<ul
class="uk-nav-sub uk-subnav uk-subnav-pill uk-pagination"
uk-margin
>
<!-- <li><a href="#"><span uk-pagination-previous></span></a></li> -->
<li
class="uk-card uk-card-hover text-secondary rounded"
v-for="(tr, i) in saved_translations"
@click="set_translation(tr.abbreviation)"
:key="i"
>
<a class="text-secondary" href="#"
>{{ tr["language"] ? `(${tr["language"]})` : null }}
{{ tr["translation"] }}</a
>
</li>
<!-- <li><a href="#"><span uk-pagination-next></span></a></li> -->
</ul>
</li>
<li class="uk-nav-divider uk-witdth-1-1"></li>
<li v-if="translation" class="uk-parent uk-witdth-1-1">
<a class="text-secondary">Books</a>
<ul
class="uk-nav-sub uk-subnav uk-subnav-pill uk-pagination"
uk-margin
>
<!-- <li><a href="#"><span uk-pagination-previous></span></a></li> -->
<li
class="uk-card uk-card-hover text-secondary"
v-for="(bk, i) in books"
@click="set_book(bk['nr'])"
:key="i"
>
<a href="#" class="text-secondary">{{ bk["name"] }}</a>
</li>
<!-- <li><a href="#"><span uk-pagination-next></span></a></li> -->
</ul>
</li>
<li class="uk-nav-divider uk-witdth-1-1"></li>
<li v-if="book_nr" class="uk-parent uk-witdth-1-1">
<a class="text-secondary">Chapters</a>
<ul
class="uk-nav-sub uk-subnav uk-subnav-pill uk-pagination"
uk-margin
>
<!-- <li><a href="#"><span uk-pagination-previous></span></a></li> -->
<li
class="uk-card uk-card-hover"
v-for="(ch, i) in chapters"
@click="set_chapter(ch['chapter'])"
:key="i"
>
<a href="#selection" class="text-secondary" uk-toggle>{{
ch["chapter"]
}}</a>
</li>
<!-- <li><a href="#"><span uk-pagination-next></span></a></li> -->
</ul>
</li>
</ul>
</div>
</div>
</template> </template>
<script> <script>
// import _ from 'lodash'; // import _ from 'lodash';
import UIkit from 'uikit'; import UIkit from "uikit";
import {mapGetters} from 'vuex'; import { mapGetters } from "vuex";
export default { export default {
components:{ components: {
// verses // verses
}, },
data: function(){ data: function () {
return { return {
// translation: 'akjv', // translation: 'akjv',
};
}}, },
computed: { computed: {
// translations(){ // translations(){
// // console.log(this.$store.state.saved_translations); // // console.log(this.$store.state.saved_translations);
// return this.$store.getters.saved_translations; // return this.$store.getters.saved_translations;
// }, // },
...mapGetters(['chapters', 'books', 'translation', 'book_nr', 'saved_translations']), ...mapGetters([
"chapters",
}, "books",
methods:{ "translation",
t(i){ "book_nr",
return this.translations.find(t => t.abbreviation === i) "saved_translations",
}, ]),
set_translation(a) { },
console.log("Hello"); methods: {
this.$store.dispatch('set_translation', {selected_translation:a}) t(i) {
}, return this.translations.find((t) => t.abbreviation === i);
set_book(b){ },
this.$store.dispatch('set_book', b) set_translation(a) {
}, console.log("Hello");
set_chapter(c){ this.$store.dispatch("set_translation", { selected_translation: a });
this.$store.dispatch('set_chapter', c) },
}, set_book(b) {
open_settings(){ this.$store.dispatch("set_book", b);
UIkit.modal('#modal-sections').show() },
} set_chapter(c) {
}, this.$store.dispatch("set_chapter", c);
created(){ },
open_settings() {
} UIkit.modal("#modal-sections").show();
} },
},
created() {},
};
</script> </script>

164
src/components/Verses.vue
View File

@ -1,34 +1,46 @@
<template > <template >
<div v-if="verses.length" > <div v-if="verses.length">
<!-- {{search.toLowerCase() + fverses.length}} --> <!-- {{search.toLowerCase() + fverses.length}} -->
<br /> <br />
<div class="uk-card uk-card-default primary uk-card-body uk-width-1-1 rounded"> <div
<ul :dir="dir" class="uk-card uk-card-default primary uk-card-body uk-width-1-1 rounded"
class="uk-margin-medium-top uk-list uk-list-divider uk-animation-hover"> >
<li v-for="(verse, i) in pverses" :key="i" <ul
:class="`uk-animation-slide-bottom uk-animation-15 uk-animation-hover`" :dir="dir"
> class="uk-margin-medium-top uk-list uk-list-divider uk-animation-hover"
>
<h5 class=" uk-primary text-secondary"> <li
<span class="uk-heading-bullet"> {{book_name+' '}} </span> v-for="(verse, i) in pverses"
<span class="uk-badge secondary text-primary badge-light"> :key="i"
{{verse.chapter}}:{{verse.verse}} :class="`uk-animation-slide-bottom uk-animation-15 uk-animation-hover`"
</span> >
</h5> <h5 class="uk-primary text-secondary">
<span class="text-secondary"> <span class="uk-heading-bullet"> {{ book_name + " " }} </span>
{{verse.text}} <span class="uk-badge secondary text-primary badge-light">
{{ verse.chapter }}:{{ verse.verse }}
</span> </span>
<br/> </h5>
<p></p> <span class="text-secondary">
{{ verse.text }}
</span>
<br />
<p></p>
</li> </li>
</ul> </ul>
</div> </div>
<div class="uk-position-small uk-position-center-left uk-overlay "> <div class="uk-position-small uk-position-center-left uk-overlay">
<span @click="prevV" class="uk-icon-button primary text-secondary" uk-icon="icon:chevron-left; ratio:2"></span> <span
</div> @click="prevV"
<div class="uk-position-small uk-position-center-right uk-overlay "> class="uk-icon-button primary text-secondary"
<span @click="nextV" class="uk-icon-button primary text-secondary" uk-icon="icon:chevron-right; ratio:2"></span> uk-icon="icon:chevron-left; ratio:2"
></span>
</div>
<div class="uk-position-small uk-position-center-right uk-overlay">
<span
@click="nextV"
class="uk-icon-button primary text-secondary"
uk-icon="icon:chevron-right; ratio:2"
></span>
</div> </div>
<!-- <ul class="uk-pagination" uk-margin> <!-- <ul class="uk-pagination" uk-margin>
@ -46,51 +58,63 @@
<li><a href="#">20</a></li> <li><a href="#">20</a></li>
<li><a href="#"><span uk-pagination-next></span></a></li> <li><a href="#"><span uk-pagination-next></span></a></li>
</ul> --> </ul> -->
</div> </div>
</template> </template>
<script> <script>
import _ from 'lodash'; import _ from "lodash";
import {mapGetters} from 'vuex'; import { mapGetters } from "vuex";
export default { export default {
data: () => { data: () => {
return { return {
// dir: '' // dir: ''
prev: 0, prev: 0,
next:5 next: 5,
} };
},
computed: {
...mapGetters(["verses", "dir", "book_name", "search"]),
pverses() {
return this.fverses.slice(this.prev, this.next);
}, },
computed: { fverses: function () {
...mapGetters(['verses', 'dir', 'book_name', 'search']), console.log(this.search);
pverses(){ if (!this.search) return this.verses;
return this.fverses.slice(this.prev, this.next) return this.filteredVerses;
},
fverses: function (){
console.log(this.search);
if(!this.search)
return this.verses
return this.filteredVerses
},
filteredVerses() {
return _.orderBy(this.verses.filter((item) =>
item.verse.toString().toLowerCase().includes(this.search.toLowerCase())
|| item.chapter.toString().toLowerCase().includes(this.search.toLowerCase())
|| item.name.toString().toLowerCase().includes(this.search.toLowerCase())
|| item.text.toLowerCase().includes(this.search.toLowerCase())), 'verse');
},
}, },
methods: { filteredVerses() {
nextV(){ return _.orderBy(
if(this.next> this.fverses.length) return; this.verses.filter(
this.next = this.next + 5 (item) =>
this.prev = this.prev+ 5 item.verse
// console.log(this.next, this.prev); .toString()
}, .toLowerCase()
prevV(){ .includes(this.search.toLowerCase()) ||
if(this.prev<1) item.chapter
return; .toString()
this.next -=5 .toLowerCase()
this.prev -=5 .includes(this.search.toLowerCase()) ||
} item.name
} .toString()
} .toLowerCase()
.includes(this.search.toLowerCase()) ||
item.text.toLowerCase().includes(this.search.toLowerCase())
),
"verse"
);
},
},
methods: {
nextV() {
if (this.next > this.fverses.length) return;
this.next = this.next + 5;
this.prev = this.prev + 5;
// console.log(this.next, this.prev);
},
prevV() {
if (this.prev < 1) return;
this.next -= 5;
this.prev -= 5;
},
},
};
</script> </script>

186
src/store/actions.js
View File

@ -1,8 +1,8 @@
import idb from '../api/idb'; import idb from '../api/idb';
import getbible from '../api/getbible_v2_api'; import getbible from '../api/getbible_v2_api';
export default { export default {
async add({commit}, payload){ async add({ commit }, payload) {
// payload = { // payload = {
// abbreviation: '', // abbreviation: '',
@ -12,106 +12,106 @@ export default {
// } // }
// } // }
commit('toggle_loading', true) commit('toggle_loading', true)
const response = await getbible.get_translation(payload.abbreviation).catch(err => console.log(err)) const response = await getbible.get_translation(payload.abbreviation).catch(err => console.log(err))
// console.log(response); // console.log(response);
if(!response) return; if (!response) return;
const data = await response.json().catch(err => console.log(err)) const data = await response.json().catch(err => console.log(err))
// console.log(JSON.parse(data)); // console.log(JSON.parse(data));
if(!data) return; if (!data) return;
let dataString = JSON.stringify(data) let dataString = JSON.stringify(data)
let savet = JSON.stringify(payload.saved_translations.putObj) let savet = JSON.stringify(payload.saved_translations.putObj)
// console.log(dataString); // console.log(dataString);
payload.translation = { payload.translation = {
name: 'translations', name: 'translations',
putObj: JSON.parse(dataString), putObj: JSON.parse(dataString),
} }
payload.saved_translations.putObj = JSON.parse(savet) payload.saved_translations.putObj = JSON.parse(savet)
let success = false let success = false
//save translation in indexdb //save translation in indexdb
success = await idb.save(payload.translation).catch(err => console.log(err)); success = await idb.save(payload.translation).catch(err => console.log(err));
if(!success) if (!success)
return; return;
// then save the newly added translation details to the list of saved tr...s // then save the newly added translation details to the list of saved tr...s
success = await idb.save(payload.saved_translations).catch(err => console.log(err)); success = await idb.save(payload.saved_translations).catch(err => console.log(err));
if(!success) return; if (!success) return;
commit('add_translation', payload); commit('add_translation', payload);
commit('toggle_loading', false) commit('toggle_loading', false)
}, },
async remove({commit}, payload){ async remove({ commit }, payload) {
// payload example // payload example
// payload = { // payload = {
// translation:{ // translation:{
// name: 'translation', // name: 'translation',
// keyPath: 'aksjv' // keyPath: 'aksjv'
// }, // },
// saved_translations:{ // saved_translations:{
// name: 'saved_translation', // name: 'saved_translation',
// keyPath: "askjv" // keyPath: "askjv"
// } // }
// } // }
commit('toggle_loading', true)
const {translation, saved_translations} = payload
let success = false
//save translation in indexdb
success = await idb.delete(translation).catch(err => console.log(err));
if(!success)
return;
// then save the newly added translation details to the list of saved tr...s
success = await idb.delete(saved_translations).catch(err => console.log(err));
if(!success) return;
commit('REMOVE_TRANSLATION', payload);
setTimeout(()=>{
commit('toggle_loading', false)
}, 1200)
},
async initialise({commit}){
commit('toggle_loading', true) commit('toggle_loading', true)
let saved_translations = await idb.getAll('saved_translations').catch(err => console.log(err)); const { translation, saved_translations } = payload
console.log(saved_translations); let success = false
if(!saved_translations) saved_translations = []; //save translation in indexdb
success = await idb.delete(translation).catch(err => console.log(err));
let translations = await idb.getAll('translations').catch(err => console.log(err)); if (!success)
return;
if(!translations || !translations.length) translations = [{}];
// then save the newly added translation details to the list of saved tr...s
commit('initialise', {saved_translations, translation: translations[0]}) success = await idb.delete(saved_translations).catch(err => console.log(err));
if (!success) return;
commit('REMOVE_TRANSLATION', payload);
setTimeout(() => {
commit('toggle_loading', false)
}, 1200)
},
async initialise({ commit }) {
commit('toggle_loading', true)
let saved_translations = await idb.getAll('saved_translations').catch(err => console.log(err));
console.log(saved_translations);
if (!saved_translations) saved_translations = [];
let translations = await idb.getAll('translations').catch(err => console.log(err));
if (!translations || !translations.length) translations = [{}];
commit('initialise', { saved_translations, translation: translations[0] })
commit('toggle_loading', false) commit('toggle_loading', false)
}, },
set_chapter({commit}, payload) { set_chapter({ commit }, payload) {
commit('set_chapter', payload) commit('set_chapter', payload)
}, },
message({commit}, payload){ message({ commit }, payload) {
commit('message', payload) commit('message', payload)
}, },
set_book({commit}, payload) { set_book({ commit }, payload) {
commit('set_book', payload) commit('set_book', payload)
}, },
async set_translation({commit}, payload){ async set_translation({ commit }, payload) {
commit('toggle_loading', true) commit('toggle_loading', true)
let translation = await idb.get('translations', payload.selected_translation).catch(err => console.log(err)); let translation = await idb.get('translations', payload.selected_translation).catch(err => console.log(err));
if(!translation) return; if (!translation) return;
payload.translation = translation payload.translation = translation
commit('set_translation', payload) commit('set_translation', payload)
// console.log("from acitons", payload); // console.log("from acitons", payload);
setTimeout(()=>{ setTimeout(() => {
commit('toggle_loading', false) commit('toggle_loading', false)
}, 2500) }, 2500)
}, },
search({commit}, payload){ search({ commit }, payload) {
commit('search', payload) commit('search', payload)
} }
} }

114
src/store/getters.js
View File

@ -2,67 +2,67 @@
export default { export default {
chapter : (state) =>{ chapter: (state) => {
return state.selected.chapter return state.selected.chapter
}, },
book_nr : (state) =>{ book_nr: (state) => {
return state.selected.book return state.selected.book
}, },
loading: (state) =>{ loading: (state) => {
return state.loading; return state.loading;
}, },
book_name:(state, getters)=> { book_name: (state, getters) => {
if(!getters.books.length) return null if (!getters.books.length) return null
let book = getters.books.find(book => book.nr === getters.book_nr) let book = getters.books.find(book => book.nr === getters.book_nr)
if(!book) return null; if (!book) return null;
return book.name; return book.name;
}, },
translation: (state)=>{ translation: (state) => {
return state.selected.translation; return state.selected.translation;
}, },
saved_translations: (state)=>{ saved_translations: (state) => {
return state.saved_translations; return state.saved_translations;
}, },
in_memory_translation : (state) =>{ in_memory_translation: (state) => {
// console.log("from ", state.in_memory_translation ); // console.log("from ", state.in_memory_translation );
return state.in_memory_translation return state.in_memory_translation
}, },
books : (state, getters)=>{ books: (state, getters) => {
if(!getters.in_memory_translation.books) if (!getters.in_memory_translation.books)
return [] return []
debugger; debugger;
return getters.in_memory_translation.books.map(book => ({nr: book.nr, name: book.name})) return getters.in_memory_translation.books.map(book => ({ nr: book.nr, name: book.name }))
}, },
dir:(state, getters)=>{ dir: (state, getters) => {
// console.log(getters.in_memory_translation); // console.log(getters.in_memory_translation);
if(!getters.in_memory_translation.direction) if (!getters.in_memory_translation.direction)
return 'ltr' return 'ltr'
return getters.in_memory_translation.direction.toLowerCase(); return getters.in_memory_translation.direction.toLowerCase();
}, },
search: (state)=>{ search: (state) => {
console.log(state.search); console.log(state.search);
debugger; debugger;
return state.search; return state.search;
}, },
chapters : (state, getters) =>{ chapters: (state, getters) => {
console.log(getters.book_nr); console.log(getters.book_nr);
debugger; debugger;
if(!getters.book_nr) return []; if (!getters.book_nr) return [];
const book = getters.in_memory_translation.books.find(book => book.nr == getters.book_nr) const book = getters.in_memory_translation.books.find(book => book.nr == getters.book_nr)
console.log("Found the book",book); console.log("Found the book", book);
return book.chapters return book.chapters
}, },
verses: (state, getters) => { verses: (state, getters) => {
// console.log("Searching for chapter", getters.chapter); // console.log("Searching for chapter", getters.chapter);
if(!getters.chapter) if (!getters.chapter)
return [] return []
const chapter = getters.chapters.find(chapter => chapter.chapter === getters.chapter) const chapter = getters.chapters.find(chapter => chapter.chapter === getters.chapter)
return chapter.verses; return chapter.verses;
} }
} }

122
src/store/mutations.js
View File

@ -1,80 +1,56 @@
export default { export default {
add_translation (state, payload ) { add_translation(state, payload) {
// payload = { state.saved_translations.push(payload.saved_translations.putObj)
// translation:{
// name: 'translation',
// putObj: {}
// },
// saved_translations:{
// name: 'saved_translation',
// putObj: {}
// }
// }
state.saved_translations.push(payload.saved_translations.putObj) },
REMOVE_TRANSLATION(state, payload) {
},
REMOVE_TRANSLATION (state, payload ) {
// payload example
// payload = {
// translation:{
// name: 'translation',
// keyPath: 'aksjv'
// },
// saved_translations:{
// name: 'saved_translation',
// keyPath: "askjv"
// }
// }
const {keyPath} = payload.saved_translations;
state.saved_translations = state.saved_translations.filter(tr => tr.abbreviation !== keyPath) const { keyPath } = payload.saved_translations;
if(state.in_memory_translation.abbreviation === keyPath){ state.saved_translations = state.saved_translations.filter(tr => tr.abbreviation !== keyPath)
state.in_memory_translation = {}
state.selected = { if (state.in_memory_translation.abbreviation === keyPath) {
translation: null, state.in_memory_translation = {}
book: null, state.selected = {
chapter: null translation: null,
} book: null,
} chapter: null
}
}, }
save_settings(state, settings){
state.settings = settings; },
localStorage.setItem('settings', JSON.stringify(settings)) save_settings(state, settings) {
}, state.settings = settings;
add_search(state, search){ localStorage.setItem('settings', JSON.stringify(settings))
state.search = search },
}, add_search(state, search) {
initialise(state, payload){ state.search = search
state.saved_translations = payload.saved_translations },
state.in_memory_translation = payload.translation initialise(state, payload) {
console.log(state.saved_translations); state.saved_translations = payload.saved_translations
}, state.in_memory_translation = payload.translation
set_chapter(state, payload){ console.log(state.saved_translations);
state.selected.chapter = payload; },
}, set_chapter(state, payload) {
set_book(state, payload){ state.selected.chapter = payload;
state.selected.chapter = null; },
state.selected.book = payload; set_book(state, payload) {
}, state.selected.chapter = null;
set_translation(state, payload){ state.selected.book = payload;
state.selected.book = null },
state.selected.chapter = null set_translation(state, payload) {
state.selected.translation = payload.selected_translation; state.selected.book = null
state.in_memory_translation = payload.translation; state.selected.chapter = null
}, state.selected.translation = payload.selected_translation;
toggle_loading(state, payload){ state.in_memory_translation = payload.translation;
state.loading = payload; },
}, toggle_loading(state, payload) {
search(state, payload){ state.loading = payload;
state.search = payload; },
} search(state, payload) {
} state.search = payload;
}
}

20
src/store/state.js
View File

@ -1,11 +1,11 @@
export default { export default {
saved_translations: [], saved_translations: [],
selected:{ selected: {
translation: null, translation: null,
book: null, book: null,
chapter: null chapter: null
}, },
loading: false, loading: false,
in_memory_translation:{}, in_memory_translation: {},
search: '', search: '',
} }

4
src/store/store.js
View File

@ -2,8 +2,8 @@ import { createStore } from 'vuex'
import state from './state'; import state from './state';
import getters from './getters'; import getters from './getters';
import mutations from './mutations'; import mutations from './mutations';
import actions from './actions' import actions from './actions'
export const store = createStore({ export const store = createStore({

104
utils/index.js
View File

@ -1,58 +1,58 @@
export const isArray = function(a) { export const isArray = function (a) {
return (!!a) && (a.constructor === Array); return (!!a) && (a.constructor === Array);
}; };
export const isObject = function(a) { export const isObject = function (a) {
return (!!a) && (a.constructor === Object); return (!!a) && (a.constructor === Object);
}; };
export const isDate = function(o) { export const isDate = function (o) {
return o instanceof Object && o.constructor === Date; return o instanceof Object && o.constructor === Date;
}
export const has = function (o, p) {
let has = true
for (const prop of p) {
has = o.hasOwnProperty(prop)
if (!has) break;
}
return has;
}
export const querablePromise = function (promise) {
// Don't modify any promise that has been already modified.
if (promise.isPending) return promise;
// Setup our initial state.
const state = {
isPending: true,
isRejected: false,
isResolved: false,
// Specified so that we'll generate accessor functions for them.
err: undefined,
val: undefined,
};
// We must actually wait for the promise to either resolve or reject,
// wrap that value, then let it continue on.
const result = promise.then(
function (val) {
state.isResolved = true;
state.isPending = false;
state.val = val;
return val;
},
function (err) {
state.isRejected = true;
state.isPending = false;
state.err = err;
throw err;
}
);
for (const val of Object.keys(state)) {
result[val] = function () { return state[val]; };
} }
export const has = function(o,p){ return result;
let has = true }
for (const prop of p) {
has = o.hasOwnProperty(prop)
if(!has) break;
}
return has;
}
export const querablePromise = function(promise) {
// Don't modify any promise that has been already modified.
if (promise.isPending) return promise;
// Setup our initial state.
const state = {
isPending: true,
isRejected: false,
isResolved: false,
// Specified so that we'll generate accessor functions for them.
err: undefined,
val: undefined,
};
// We must actually wait for the promise to either resolve or reject,
// wrap that value, then let it continue on.
const result = promise.then(
function(val) {
state.isResolved = true;
state.isPending = false;
state.val = val;
return val;
},
function(err) {
state.isRejected = true;
state.isPending = false;
state.err = err;
throw err;
}
);
for (const val of Object.keys(state)) {
result[val] = function() { return state[val]; };
}
return result;
}