Add option to add link to chapter.

This commit is contained in:
Llewellyn van der Merwe 2024-03-19 23:18:09 +02:00
parent 1160b14bec
commit 03cee779c1
Signed by: Llewellyn
GPG Key ID: A9201372263741E7
14 changed files with 655 additions and 494 deletions

92
dist/js/getBible.js vendored
View File

@ -1,7 +1,7 @@
/** /**
* getBible Loader v3.0.3 * getBible Loader v3.1.0
* https://getbible.net * https://getbible.net
* (c) 2014 - 2023 Llewellyn van der Merwe * (c) 2014 - 2024 Llewellyn van der Merwe
* MIT License * MIT License
**/ **/
@ -190,6 +190,15 @@
this.#data = data; this.#data = data;
} }
/**
* Retrieves the url values.
*
* @returns {string} The chapter number.
*/
get bibleUrl() {
return `${this.abbreviation}/${this.bookName}/${this.chapter}/${this.verseReference}`;
}
/** /**
* Retrieves the translation name. * Retrieves the translation name.
* *
@ -322,13 +331,21 @@
} }
/** /**
* Generates a reference string for the verses. * Generates a reference string for the (book chapter:verses).
* *
* @returns {string} The reference string. * @returns {string} The reference string.
*/ */
get reference() { get reference() {
return `${this.#data.name}:${this.verseReference}`;
}
/**
* Generates a reference string for the (verses).
*
* @returns {string} The reference verses string.
*/
get verseReference() {
const verseNumbers = this.#data.verses.map(verse => verse.verse).sort((a, b) => a - b); const verseNumbers = this.#data.verses.map(verse => verse.verse).sort((a, b) => a - b);
let refString = `${this.#data.name}:`;
let ranges = {}; let ranges = {};
let rangeStart = null; let rangeStart = null;
let rangeEnd = null; let rangeEnd = null;
@ -353,7 +370,7 @@
} }
// Join the range strings with commas // Join the range strings with commas
return refString + Object.values(ranges).join(','); return Object.values(ranges).join(',');
} }
} }
@ -396,6 +413,8 @@
#showAbbreviation; #showAbbreviation;
#showLanguage; #showLanguage;
#showLanguageCode; #showLanguageCode;
#showBibleLink;
#bibleUrl;
/** /**
* Initializes the Actions object with a DOM element and its data attributes. * Initializes the Actions object with a DOM element and its data attributes.
@ -418,10 +437,33 @@
this.#showAbbreviation = element.dataset.showAbbreviation ? parseInt(element.dataset.showAbbreviation, 10) : 0; this.#showAbbreviation = element.dataset.showAbbreviation ? parseInt(element.dataset.showAbbreviation, 10) : 0;
this.#showLanguage = element.dataset.showLanguage ? parseInt(element.dataset.showLanguage, 10) : 0; this.#showLanguage = element.dataset.showLanguage ? parseInt(element.dataset.showLanguage, 10) : 0;
this.#showLanguageCode = element.dataset.showLanguageCode ? parseInt(element.dataset.showLanguageCode, 10) : 0; this.#showLanguageCode = element.dataset.showLanguageCode ? parseInt(element.dataset.showLanguageCode, 10) : 0;
this.#showBibleLink = element.dataset.showBibleLink ? parseInt(element.dataset.showBibleLink, 10) : 0;
this.#bibleUrl = element.dataset.bibleUrl ? element.dataset.bibleUrl : 'https://getBible.net/';
if (this.#showLocalReference){ if (this.#showLocalReference){
this.#showReference = 0; this.#showReference = 0;
} }
if (this.#bibleUrl !== 'https://getBible.net/'){
this.#showBibleLink = 1;
}
}
/**
* Retrieves the bible url.
*
* @returns {string} The bible url as strings.
*/
get bibleUrl() {
return this.#bibleUrl;
}
/**
* Retrieves the show bible link flag.
*
* @returns {number} The show bible link flag (0 or 1).
*/
get bibleLink() {
return this.#showBibleLink;
} }
/** /**
@ -546,6 +588,30 @@
get(scripture) { get(scripture) {
throw new Error("The 'get' method must be implemented in BaseFormat subclass."); throw new Error("The 'get' method must be implemented in BaseFormat subclass.");
} }
/**
* Get external link svg image.
*
* @param {string} title - The external link title.
*
* @returns {string} The external link svg image.
*/
getExternalLinkImage(title) {
// just to be safe
title.replace(/&/g, "&")
.replace(/</g, "&lt;")
.replace(/>/g, "&gt;")
.replace(/"/g, "&quot;")
.replace(/'/g, "&#039;");
return `<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12">
<title>${title}</title>
<path
fill="#36c"
d="M6 1h5v5L8.86 3.85 4.7 8 4 7.3l4.15-4.16L6 1Z M2 3h2v1H2v6h6V8h1v2a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1Z"
/>
</svg>`;
}
} }
class BlockFormat extends BaseFormat { class BlockFormat extends BaseFormat {
@ -589,6 +655,13 @@
if (header.length > 0) { if (header.length > 0) {
display.push(`<b class="getbible-header">${header.join(' - ')}</b>`); display.push(`<b class="getbible-header">${header.join(' - ')}</b>`);
} }
// Add link to chapter
if (this.action.bibleLink) {
display.push(`&nbsp;<a class="getbible-link"
href="${this.action.bibleUrl}${reference.bibleUrl}"
target="_blank" style="text-decoration: unset;"
title="${reference.reference}">${this.getExternalLinkImage(reference.reference)}</a>`);
}
const verses = reference.verses const verses = reference.verses
.map(verse => `<div class="getbible-verse">${verse.verse}. ${verse.text}</div>`) .map(verse => `<div class="getbible-verse">${verse.verse}. ${verse.text}</div>`)
.join("\n"); .join("\n");
@ -645,6 +718,13 @@
if (footer.length > 0) { if (footer.length > 0) {
display.push(`<b class="getbible-footer">${footer.join(' - ')}</b>`); display.push(`<b class="getbible-footer">${footer.join(' - ')}</b>`);
} }
// Add link to chapter
if (this.action.bibleLink) {
display.push(`<a class="getbible-link"
href="${this.action.bibleUrl}${reference.bibleUrl}"
target="_blank" style="text-decoration: unset;"
title="${reference.reference}">${this.getExternalLinkImage(reference.reference)}</a>`);
}
display.push(`</div>`); display.push(`</div>`);
}); });
@ -1147,7 +1227,7 @@
super.load(content); super.load(content);
this.element.classList.add('has-tip'); this.element.classList.add('has-tip');
new Foundation.Tooltip(this.getElement(), { new Foundation.Tooltip(this.element, {
// Default options // Default options
disableHover: false, // Allows tooltip to be hoverable disableHover: false, // Allows tooltip to be hoverable
fadeOutDuration: 150, // Duration of fade out animation in milliseconds fadeOutDuration: 150, // Duration of fade out animation in milliseconds

File diff suppressed because one or more lines are too long

942
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -2,7 +2,7 @@
"name": "getbible.loader", "name": "getbible.loader",
"title": "getBible", "title": "getBible",
"description": "GetBible is an intuitive and lightweight JavaScript solution for embedding Bible scripture into your website.", "description": "GetBible is an intuitive and lightweight JavaScript solution for embedding Bible scripture into your website.",
"version": "3.0.3", "version": "3.1.0",
"main": "dist/js/getBible.min.js", "main": "dist/js/getBible.min.js",
"scripts": { "scripts": {
"build": "rollup -c" "build": "rollup -c"

View File

@ -12,6 +12,8 @@ export class Action {
#showAbbreviation; #showAbbreviation;
#showLanguage; #showLanguage;
#showLanguageCode; #showLanguageCode;
#showBibleLink;
#bibleUrl;
/** /**
* Initializes the Actions object with a DOM element and its data attributes. * Initializes the Actions object with a DOM element and its data attributes.
@ -34,10 +36,33 @@ export class Action {
this.#showAbbreviation = element.dataset.showAbbreviation ? parseInt(element.dataset.showAbbreviation, 10) : 0; this.#showAbbreviation = element.dataset.showAbbreviation ? parseInt(element.dataset.showAbbreviation, 10) : 0;
this.#showLanguage = element.dataset.showLanguage ? parseInt(element.dataset.showLanguage, 10) : 0; this.#showLanguage = element.dataset.showLanguage ? parseInt(element.dataset.showLanguage, 10) : 0;
this.#showLanguageCode = element.dataset.showLanguageCode ? parseInt(element.dataset.showLanguageCode, 10) : 0; this.#showLanguageCode = element.dataset.showLanguageCode ? parseInt(element.dataset.showLanguageCode, 10) : 0;
this.#showBibleLink = element.dataset.showBibleLink ? parseInt(element.dataset.showBibleLink, 10) : 0;
this.#bibleUrl = element.dataset.bibleUrl ? element.dataset.bibleUrl : 'https://getBible.net/';
if (this.#showLocalReference){ if (this.#showLocalReference){
this.#showReference = 0; this.#showReference = 0;
} }
if (this.#bibleUrl !== 'https://getBible.net/'){
this.#showBibleLink = 1;
}
}
/**
* Retrieves the bible url.
*
* @returns {string} The bible url as strings.
*/
get bibleUrl() {
return this.#bibleUrl;
}
/**
* Retrieves the show bible link flag.
*
* @returns {number} The show bible link flag (0 or 1).
*/
get bibleLink() {
return this.#showBibleLink;
} }
/** /**

View File

@ -43,6 +43,15 @@ export class Reference {
this.#data = data; this.#data = data;
} }
/**
* Retrieves the url values.
*
* @returns {string} The chapter number.
*/
get bibleUrl() {
return `${this.abbreviation}/${this.bookName}/${this.chapter}/${this.verseReference}`;
}
/** /**
* Retrieves the translation name. * Retrieves the translation name.
* *
@ -175,13 +184,21 @@ export class Reference {
} }
/** /**
* Generates a reference string for the verses. * Generates a reference string for the (book chapter:verses).
* *
* @returns {string} The reference string. * @returns {string} The reference string.
*/ */
get reference() { get reference() {
return `${this.#data.name}:${this.verseReference}`;
}
/**
* Generates a reference string for the (verses).
*
* @returns {string} The reference verses string.
*/
get verseReference() {
const verseNumbers = this.#data.verses.map(verse => verse.verse).sort((a, b) => a - b); const verseNumbers = this.#data.verses.map(verse => verse.verse).sort((a, b) => a - b);
let refString = `${this.#data.name}:`;
let ranges = {}; let ranges = {};
let rangeStart = null; let rangeStart = null;
let rangeEnd = null; let rangeEnd = null;
@ -206,6 +223,6 @@ export class Reference {
} }
// Join the range strings with commas // Join the range strings with commas
return refString + Object.values(ranges).join(','); return Object.values(ranges).join(',');
} }
} }

View File

@ -11,7 +11,7 @@ export class FoundationTooltip extends BaseTooltip {
super.load(content); super.load(content);
this.element.classList.add('has-tip'); this.element.classList.add('has-tip');
new Foundation.Tooltip(this.getElement(), { new Foundation.Tooltip(this.element, {
// Default options // Default options
disableHover: false, // Allows tooltip to be hoverable disableHover: false, // Allows tooltip to be hoverable
fadeOutDuration: 150, // Duration of fade out animation in milliseconds fadeOutDuration: 150, // Duration of fade out animation in milliseconds

View File

@ -32,4 +32,28 @@ export class BaseFormat {
get(scripture) { get(scripture) {
throw new Error("The 'get' method must be implemented in BaseFormat subclass."); throw new Error("The 'get' method must be implemented in BaseFormat subclass.");
} }
/**
* Get external link svg image.
*
* @param {string} title - The external link title.
*
* @returns {string} The external link svg image.
*/
getExternalLinkImage(title) {
// just to be safe
title.replace(/&/g, "&amp;")
.replace(/</g, "&lt;")
.replace(/>/g, "&gt;")
.replace(/"/g, "&quot;")
.replace(/'/g, "&#039;");
return `<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12">
<title>${title}</title>
<path
fill="#36c"
d="M6 1h5v5L8.86 3.85 4.7 8 4 7.3l4.15-4.16L6 1Z M2 3h2v1H2v6h6V8h1v2a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1Z"
/>
</svg>`;
}
} }

View File

@ -42,6 +42,13 @@ export class BlockFormat extends BaseFormat {
if (header.length > 0) { if (header.length > 0) {
display.push(`<b class="getbible-header">${header.join(' - ')}</b>`); display.push(`<b class="getbible-header">${header.join(' - ')}</b>`);
} }
// Add link to chapter
if (this.action.bibleLink) {
display.push(`&nbsp;<a class="getbible-link"
href="${this.action.bibleUrl}${reference.bibleUrl}"
target="_blank" style="text-decoration: unset;"
title="${reference.reference}">${this.getExternalLinkImage(reference.reference)}</a>`);
}
const verses = reference.verses const verses = reference.verses
.map(verse => `<div class="getbible-verse">${verse.verse}. ${verse.text}</div>`) .map(verse => `<div class="getbible-verse">${verse.verse}. ${verse.text}</div>`)
.join("\n"); .join("\n");

View File

@ -46,6 +46,13 @@ export class InlineFormat extends BaseFormat {
if (footer.length > 0) { if (footer.length > 0) {
display.push(`<b class="getbible-footer">${footer.join(' - ')}</b>`); display.push(`<b class="getbible-footer">${footer.join(' - ')}</b>`);
} }
// Add link to chapter
if (this.action.bibleLink) {
display.push(`<a class="getbible-link"
href="${this.action.bibleUrl}${reference.bibleUrl}"
target="_blank" style="text-decoration: unset;"
title="${reference.reference}">${this.getExternalLinkImage(reference.reference)}</a>`);
}
display.push(`</div>`); display.push(`</div>`);
}); });

View File

@ -19,10 +19,11 @@
<li class="getBible" data-translation="kjv;aov" data-show-translation="1" data-show-language="1" <li class="getBible" data-translation="kjv;aov" data-show-translation="1" data-show-language="1"
data-format="tooltip">John 3:16,19 data-format="tooltip">John 3:16,19
</li> </li>
<li class="getBible" data-show-abbreviation="1" data-format="modal">John 3:16-17; 1 John 3:16-19,22</li> <li class="getBible" data-show-abbreviation="1" data-format="modal" data-bible-url="https://trueChristian.church/scriptures/">John 3:16-17; 1 John 3:16-19,22</li>
<li class="getBible" data-translation="kjv;codex;aov" data-show-reference="1" data-format="modal">Genesis 1:1</li> <li class="getBible" data-translation="kjv;codex;aov" data-show-reference="1" data-format="modal" data-show-bible-link="1">Genesis 1:1</li>
<li class="getBible" data-translation="kjv;codex" data-show-language="1" data-format="inline">Psalms 23:1-4</li> <li class="getBible" data-translation="kjv;codex" data-show-language="1" data-format="tooltip">Psalms 23:1-4</li>
<li class="getBible">Romans 8:28,31-39</li> <li class="getBible" data-bible-url="https://trueChristian.church/scriptures/">Romans 8:28,31-39</li>
<li class="getBible" data-bible-url="https://trueChristian.church/scriptures/">John 3:15-21</li>
</ul> </ul>
</body> </body>

View File

@ -28,8 +28,8 @@
<li class="getBible" data-translation="kjv;aov" data-show-translation="1" data-show-language="1" <li class="getBible" data-translation="kjv;aov" data-show-translation="1" data-show-language="1"
data-format="tooltip">John 3:16,19 data-format="tooltip">John 3:16,19
</li> </li>
<li class="getBible" data-show-abbreviation="1" data-format="modal">John 3:16-17; 1 John 3:16-19,22</li> <li class="getBible" data-show-abbreviation="1" data-format="modal" data-show-bible-link="1">John 3:16-17; 1 John 3:16-19,22</li>
<li class="getBible" data-translation="kjv;codex" data-show-language="1" data-format="modal">Genesis 1:1</li> <li class="getBible" data-translation="kjv;codex" data-show-language="1" data-format="modal" data-show-bible-link="1">Genesis 1:1</li>
<li class="getBible" data-translation="kjv;codex" data-show-language="1" data-format="tooltip">Psalms 23:1-4</li> <li class="getBible" data-translation="kjv;codex" data-show-language="1" data-format="tooltip">Psalms 23:1-4</li>
<li class="getBible">Romans 8:28,31-39</li> <li class="getBible">Romans 8:28,31-39</li>
</ul> </ul>

View File

@ -25,8 +25,8 @@
<li class="getBible" data-translation="kjv;aov" data-show-translation="1" data-show-language="1" <li class="getBible" data-translation="kjv;aov" data-show-translation="1" data-show-language="1"
data-format="tooltip">John 3:16,19 data-format="tooltip">John 3:16,19
</li> </li>
<li class="getBible" data-show-abbreviation="1" data-format="modal">John 3:16-17; 1 John 3:16-19,22</li> <li class="getBible" data-show-abbreviation="1" data-format="modal" data-show-bible-link="1">John 3:16-17; 1 John 3:16-19,22</li>
<li class="getBible" data-translation="kjv;codex" data-show-language="1" data-format="modal">Genesis 1:1</li> <li class="getBible" data-translation="kjv;codex" data-show-language="1" data-format="modal" data-show-bible-link="1">Genesis 1:1</li>
<li class="getBible" data-translation="kjv;codex" data-show-language="1" data-format="tooltip">Psalms 23:1-4</li> <li class="getBible" data-translation="kjv;codex" data-show-language="1" data-format="tooltip">Psalms 23:1-4</li>
<li class="getBible">Romans 8:28,31-39</li> <li class="getBible">Romans 8:28,31-39</li>
</ul> </ul>

View File

@ -26,8 +26,8 @@
<li class="getBible" data-translation="kjv;aov" data-show-translation="1" data-show-language="1" <li class="getBible" data-translation="kjv;aov" data-show-translation="1" data-show-language="1"
data-format="tooltip">John 3:16,19 data-format="tooltip">John 3:16,19
</li> </li>
<li class="getBible" data-translation="kjv;aov" data-show-abbreviation="1" data-show-language-code="1" data-format="modal">John 3:16-17; 1 John 3:16-19,22</li> <li class="getBible" data-translation="kjv;aov" data-show-abbreviation="1" data-show-language-code="1" data-format="modal" data-show-bible-link="1">John 3:16-17; 1 John 3:16-19,22</li>
<li class="getBible" data-translation="kjv;codex" data-show-language="1" data-format="modal">Genesis 1:1</li> <li class="getBible" data-translation="kjv;codex" data-show-language="1" data-format="modal" data-show-bible-link="1">Genesis 1:1</li>
<li class="getBible" data-translation="kjv;codex" data-show-language="1" data-format="tooltip">Psalms 23:1-4</li> <li class="getBible" data-translation="kjv;codex" data-show-language="1" data-format="tooltip">Psalms 23:1-4</li>
<li class="getBible">Rom 8:28,31-39</li> <li class="getBible">Rom 8:28,31-39</li>
</ul> </ul>