@venite/components 0.16.5 → 0.16.9

package/dist/collection/components/bible-reading/dist/bible-reading.js

@@ -0,0 +1,354 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (_) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+exports.__esModule = true;
+exports.BibleReadingComponent = void 0;
+var core_1 = require("@ionic/core");
+var core_2 = require("@stencil/core");
+var ldf_1 = require("@venite/ldf");
+var locale_1 = require("../../utils/locale");
+var bible_reading_i18n_en_json_1 = require("./bible-reading.i18n.en.json");
+var bible_reading_i18n_es_json_1 = require("./bible-reading.i18n.es.json");
+var fetch_reading_1 = require("./fetch-reading");
+var LOCALE = {
+    'en': bible_reading_i18n_en_json_1["default"],
+    'es': bible_reading_i18n_es_json_1["default"]
+};
+var BibleReadingComponent = /** @class */ (function () {
+    function BibleReadingComponent() {
+    }
+    BibleReadingComponent.prototype.docChanged = function (newDoc) {
+        try {
+            if (typeof newDoc == 'string') {
+                this.obj = new ldf_1.BibleReading(JSON.parse(newDoc));
+            }
+            else {
+                this.obj = new ldf_1.BibleReading(newDoc);
+            }
+            this.processIntro();
+        }
+        catch (e) {
+            console.warn(e);
+            this.obj = new ldf_1.BibleReading();
+        }
+        this.loadVerses();
+    };
+    // Lifecycle events
+    BibleReadingComponent.prototype.componentWillLoad = function () {
+        return __awaiter(this, void 0, void 0, function () {
+            return __generator(this, function (_a) {
+                this.docChanged(this.doc);
+                this.loadLocaleStrings();
+                this.loadVerses();
+                this.processIntro();
+                return [2 /*return*/];
+            });
+        });
+    };
+    BibleReadingComponent.prototype.processIntro = function () {
+        var _a, _b;
+        // process intro
+        if ((_b = (_a = this.obj) === null || _a === void 0 ? void 0 : _a.metadata) === null || _b === void 0 ? void 0 : _b.intro) {
+            try {
+                this.obj.compileIntro();
+                this.obj = new ldf_1.BibleReading(__assign({}, this.obj));
+            }
+            catch (e) {
+                console.warn(e);
+                console.warn(this.obj);
+            }
+        }
+    };
+    // Private methods
+    BibleReadingComponent.prototype.loadLocaleStrings = function () {
+        return __awaiter(this, void 0, Promise, function () {
+            return __generator(this, function (_a) {
+                try {
+                    this.localeStrings = LOCALE[locale_1.getComponentClosestLanguage(this.element)];
+                }
+                catch (e) {
+                    console.warn(e);
+                }
+                return [2 /*return*/];
+            });
+        });
+    };
+    BibleReadingComponent.prototype.changeReading = function () {
+        var _a;
+        return __awaiter(this, void 0, void 0, function () {
+            var localeStrings, alert;
+            var _this = this;
+            return __generator(this, function (_b) {
+                switch (_b.label) {
+                    case 0:
+                        localeStrings = this.localeStrings || {};
+                        return [4 /*yield*/, core_1.alertController.create({
+                                header: localeStrings.changeReading,
+                                inputs: [
+                                    {
+                                        name: 'citation',
+                                        type: 'text',
+                                        value: (_a = this.obj) === null || _a === void 0 ? void 0 : _a.citation,
+                                        placeholder: localeStrings.newCitation
+                                    },
+                                ],
+                                buttons: [
+                                    {
+                                        text: localeStrings.cancel,
+                                        role: 'cancel',
+                                        cssClass: 'secondary'
+                                    },
+                                    {
+                                        text: localeStrings.ok,
+                                        handler: function (data) { return __awaiter(_this, void 0, void 0, function () {
+                                            var loading, newReading;
+                                            var _a, _b, _c;
+                                            return __generator(this, function (_d) {
+                                                switch (_d.label) {
+                                                    case 0:
+                                                        this.ldfDocShouldChange.emit(new ldf_1.Change({
+                                                            path: this.path,
+                                                            op: [
+                                                                {
+                                                                    type: 'set',
+                                                                    index: 'citation',
+                                                                    oldValue: (_a = this.obj) === null || _a === void 0 ? void 0 : _a.citation,
+                                                                    value: data === null || data === void 0 ? void 0 : data.citation
+                                                                }
+                                                            ]
+                                                        }));
+                                                        return [4 /*yield*/, core_1.loadingController.create({
+                                                                message: localeStrings.loading
+                                                            })];
+                                                    case 1:
+                                                        loading = _d.sent();
+                                                        return [4 /*yield*/, loading.present()];
+                                                    case 2:
+                                                        _d.sent();
+                                                        return [4 /*yield*/, fetch_reading_1.fetchReading(data.citation, ldf_1.versionToString((_b = this.obj) === null || _b === void 0 ? void 0 : _b.version))];
+                                                    case 3:
+                                                        newReading = _d.sent();
+                                                        return [4 /*yield*/, loading.dismiss()];
+                                                    case 4:
+                                                        _d.sent();
+                                                        this.ldfDocShouldChange.emit(new ldf_1.Change({
+                                                            path: this.path,
+                                                            op: [{
+                                                                    type: 'set',
+                                                                    index: 'value',
+                                                                    oldValue: (_c = this.obj) === null || _c === void 0 ? void 0 : _c.value,
+                                                                    value: (newReading === null || newReading === void 0 ? void 0 : newReading.value) || []
+                                                                }]
+                                                        }));
+                                                        this.obj = new ldf_1.BibleReading(__assign(__assign({}, this.obj), { citation: data === null || data === void 0 ? void 0 : data.citation, value: (newReading === null || newReading === void 0 ? void 0 : newReading.value) || [] }));
+                                                        this.loadVerses();
+                                                        return [2 /*return*/];
+                                                }
+                                            });
+                                        }); }
+                                    }
+                                ]
+                            })];
+                    case 1:
+                        alert = _b.sent();
+                        return [4 /*yield*/, alert.present()];
+                    case 2:
+                        _b.sent();
+                        return [2 /*return*/];
+                }
+            });
+        });
+    };
+    BibleReadingComponent.prototype.loadVerses = function () {
+        this.verses = this.obj.value || [];
+    };
+    BibleReadingComponent.prototype.paragraphs = function () {
+        var paragraphs = new Array();
+        var currentParagraph = new Array();
+        this.verses.forEach(function (verse) {
+            if (verse.hasOwnProperty('type') && verse.type === 'heading') {
+                paragraphs.push(currentParagraph);
+                currentParagraph = new Array();
+            }
+            else {
+                currentParagraph.push(verse);
+            }
+        });
+        paragraphs.push(currentParagraph);
+        return paragraphs;
+    };
+    // Render
+    BibleReadingComponent.prototype.render = function () {
+        var _this = this;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
+        var localeStrings = this.localeStrings || {};
+        if (this.verses) {
+            /* Editable version */
+            if (this.editable) {
+                var template_1 = __assign(__assign({}, this.verses[0]), { text: '' }), templateMaker_1 = function (text) { return (__assign(__assign({}, template_1), { text: text })); };
+                return (React.createElement("div", { lang: (_a = this.obj) === null || _a === void 0 ? void 0 : _a.language, "class": "editable bible-reading " + (((_b = this.obj) === null || _b === void 0 ? void 0 : _b.display_format) || 'default') },
+                    this.editable && React.createElement("ldf-label-bar", null,
+                        React.createElement("slot", { slot: 'end', name: 'controls' },
+                            React.createElement("ion-buttons", null,
+                                React.createElement("ion-button", { onClick: function () { return _this.changeReading(); } },
+                                    React.createElement("ion-icon", { name: "swap-horizontal", slot: "start" }),
+                                    React.createElement("ion-label", null, localeStrings.changeReading))))),
+                    React.createElement("ldf-label-bar", null,
+                        React.createElement("h3", { "class": "editable-label", slot: "start" },
+                            React.createElement("ldf-editable-text", { id: "label", text: (_c = this.obj) === null || _c === void 0 ? void 0 : _c.label, path: this.path + "/label", placeholder: localeStrings.label })),
+                        ((_d = this.obj) === null || _d === void 0 ? void 0 : _d.citation) && React.createElement("button", { "class": "citation-button", slot: "end", onClick: function () { return _this.changeReading(); } }, this.obj.citation)),
+                    ((_f = (_e = this.obj) === null || _e === void 0 ? void 0 : _e.metadata) === null || _f === void 0 ? void 0 : _f.compiled_intro) && React.createElement("ldf-liturgical-document", { editable: true, doc: this.obj.metadata.intro, path: this.path + "/metadata/intro" }),
+                    React.createElement("section", { "class": "verses" }, this.verses.map(function (verse, verseIndex) { return [
+                        verse.hasOwnProperty('type') && verse.type === 'heading'
+                            ? React.createElement("ldf-heading", { editable: true, doc: verse, path: _this.path + "/value/" + verseIndex })
+                            : React.createElement("div", { "class": "editable-verse" },
+                                React.createElement("div", { "class": "editable-citation" },
+                                    React.createElement("ldf-editable-text", { "class": "book", id: "verse-" + verseIndex + "-book", text: verse.book, path: _this.path + "/value/" + verseIndex + "/book", placeholder: localeStrings.book, short: true }),
+                                    React.createElement("ldf-editable-text", { id: "verse-" + verseIndex + "-chapter", text: verse.chapter, path: _this.path + "/value/" + verseIndex + "/chapter", placeholder: localeStrings.chapter, short: true }),
+                                    " :",
+                                    React.createElement("ldf-editable-text", { id: "verse-" + verseIndex + "-verse", text: verse.verse, path: _this.path + "/value/" + verseIndex + "/verse", placeholder: localeStrings.verse, short: true })),
+                                React.createElement("ldf-editable-text", { id: "verse-" + verseIndex + "-text", text: verse.text, path: _this.path + "/value/" + verseIndex + "/text", placeholder: localeStrings.text, short: false, template: template_1, templateMaker: templateMaker_1 }))
+                    ]; }))));
+            }
+            /* `short` renders a few verses, with a response and citation. */
+            else if (this.obj.style == 'short') {
+                var shortResponse = (((_h = (_g = this.obj) === null || _g === void 0 ? void 0 : _g.metadata) === null || _h === void 0 ? void 0 : _h.response) || localeStrings.amen).length <= 5;
+                var responseNode = void 0;
+                if (!((_k = (_j = this.obj) === null || _j === void 0 ? void 0 : _j.metadata) === null || _k === void 0 ? void 0 : _k.response)) {
+                    responseNode = React.createElement("span", { "class": "response" },
+                        " ",
+                        localeStrings.amen);
+                }
+                else {
+                    responseNode = React.createElement("span", { "class": "response" },
+                        " ",
+                        this.obj.metadata.response);
+                }
+                return (React.createElement(core_2.Host, null,
+                    ((_l = this.obj) === null || _l === void 0 ? void 0 : _l.label) && React.createElement("ldf-heading", { doc: new ldf_1.Heading({ type: 'heading', metadata: { level: 3 }, value: [this.obj.label] }) }),
+                    React.createElement("div", { lang: (_m = this.obj) === null || _m === void 0 ? void 0 : _m.language, "class": "bible-reading " + (((_o = this.obj) === null || _o === void 0 ? void 0 : _o.display_format) || 'default') },
+                        React.createElement("p", null,
+                            this.verses.map(function (verse, verseIndex) {
+                                var _a;
+                                return verse.hasOwnProperty('type') && verse.type === 'heading'
+                                    ? React.createElement("ldf-heading", { doc: new ldf_1.Heading(verse) })
+                                    : React.createElement("ldf-string", { citation: { book: verse.book, chapter: verse.chapter, verse: verse.verse }, id: _this.obj.uid, text: verse.text, fragment: _this.path, dropcap: ((_a = _this.obj) === null || _a === void 0 ? void 0 : _a.display_format) == "force_dropcap" && verseIndex === 0 ? "force" : "disabled" });
+                            }),
+                            shortResponse && !((_q = (_p = this.obj) === null || _p === void 0 ? void 0 : _p.metadata) === null || _q === void 0 ? void 0 : _q.omit_response) && responseNode,
+                            React.createElement("span", { "class": "citation" }, this.obj.citation)),
+                        !shortResponse && !((_s = (_r = this.obj) === null || _r === void 0 ? void 0 : _r.metadata) === null || _s === void 0 ? void 0 : _s.omit_response) && React.createElement("p", null, responseNode))));
+            }
+            /* `long` render a typical Bible reading in the liturgy */
+            else {
+                var paragraphs = this.paragraphs();
+                return (React.createElement("div", { lang: (_t = this.obj) === null || _t === void 0 ? void 0 : _t.language, "class": "bible-reading " + (((_u = this.obj) === null || _u === void 0 ? void 0 : _u.display_format) || 'default') },
+                    React.createElement("ldf-heading", { doc: new ldf_1.Heading({ type: 'heading', metadata: { level: 3 }, value: [this.obj.label], citation: this.obj.citation }) }),
+                    ((_w = (_v = this.obj) === null || _v === void 0 ? void 0 : _v.metadata) === null || _w === void 0 ? void 0 : _w.compiled_intro) && React.createElement("ldf-liturgical-document", { doc: this.obj.metadata.compiled_intro }),
+                    paragraphs.map(function (paragraph, paragraphIndex) { return React.createElement("p", { lang: _this.obj.language }, paragraph.map(function (verse, verseIndex) {
+                        return verse.hasOwnProperty('type') && verse.type === 'heading'
+                            ? React.createElement("ldf-heading", { doc: new ldf_1.Heading(verse) })
+                            : [
+                                React.createElement("sup", null, verse.verse),
+                                React.createElement("ldf-string", { citation: verse, dropcap: paragraphIndex == 0 && verseIndex == 0 ? 'force' : 'disabled', id: verse.chapter + "-" + verse.book + "-" + verse.verse, text: verse.text, index: verseIndex, fragment: _this.path })
+                            ];
+                    })); })));
+            }
+        }
+        else {
+            return this.loadingError ? React.createElement("pre", null, this.loadingError) : React.createElement("p", null, localeStrings.loading);
+        }
+    };
+    __decorate([
+        core_2.Element()
+    ], BibleReadingComponent.prototype, "element");
+    __decorate([
+        core_2.State()
+    ], BibleReadingComponent.prototype, "obj");
+    __decorate([
+        core_2.State()
+    ], BibleReadingComponent.prototype, "localeStrings");
+    __decorate([
+        core_2.State()
+    ], BibleReadingComponent.prototype, "verses");
+    __decorate([
+        core_2.State()
+    ], BibleReadingComponent.prototype, "loadingError");
+    __decorate([
+        core_2.Prop()
+    ], BibleReadingComponent.prototype, "doc");
+    __decorate([
+        core_2.Watch('doc')
+    ], BibleReadingComponent.prototype, "docChanged");
+    __decorate([
+        core_2.Prop({ reflect: true })
+    ], BibleReadingComponent.prototype, "path");
+    __decorate([
+        core_2.Prop()
+    ], BibleReadingComponent.prototype, "editable");
+    __decorate([
+        core_2.Event({ bubbles: true })
+    ], BibleReadingComponent.prototype, "ldfDocShouldChange");
+    __decorate([
+        core_2.Method()
+    ], BibleReadingComponent.prototype, "changeReading");
+    BibleReadingComponent = __decorate([
+        core_2.Component({
+            tag: 'ldf-bible-reading',
+            styleUrl: 'bible-reading.scss',
+            scoped: true
+        })
+    ], BibleReadingComponent);
+    return BibleReadingComponent;
+}());
+exports.BibleReadingComponent = BibleReadingComponent;