Add help modal

app/db/README.md

@@ -28,16 +28,6 @@ To get more help on the Angular CLI use `ng help` or go check out the [Angular C
 
 # Punch List
 
-- Options to merge references \*\*
-  - Merge if overlap
-  - Merge if contains
-  - Merge if equals
-  - Don't merge
-- Page Admin \*\*
-  - Delete Page
-  - Show pages and list of card titles for each page in expansion panel
-  - Remove card from page
-  - Make page public (private edit only) [available only when logged in]
 - Notes Admin \*\*
   - List notes by title
     - Edit Note
@@ -52,9 +42,12 @@ To get more help on the Angular CLI use `ng help` or go check out the [Angular C
 - remove old ionic project
 - setup CI/CD
 - ignore reserved search words (the ones that are too big to fit in the index)
+- migration path for old data to new
 
 ## Optionally for Future
 
+- Page Admin
+  - Make page public (private edit only) [available only when logged in]
 - Edit card query
 - Swipe to close
 - Settings for theme

app/db/src/app/app-routing.module.ts

@@ -2,6 +2,7 @@ import { NgModule } from '@angular/core';
 import { Routes, RouterModule } from '@angular/router';
 import { SearchPage } from './pages/search/search.page';
 import { SavedPagesAdminPage } from './pages/saved-pages-admin/saved-pages-admin.page';
+import { HelpPage } from './components/help/help.page';
 
 const routes: Routes = [
   {

app/db/src/app/app.component.html

@@ -16,6 +16,9 @@
           [routerLink]="[p.route]"
           ><mat-icon color="accenovert">{{ p.icon }}</mat-icon> {{ p.title }}</a
         >
+        <a mat-list-item (click)="showHelp()"
+          ><mat-icon color="accenovert">help</mat-icon>Help</a
+        >
       </mat-nav-list>
 
       <mat-toolbar>Saved Pages</mat-toolbar>

app/db/src/app/app.component.ts

@@ -8,6 +8,8 @@ import { map, shareReplay } from 'rxjs/operators';
 import { MatSidenav } from '@angular/material/sidenav';
 import { SubscriberBase } from './common/subscriber-base';
 import { MatSnackBar } from '@angular/material/snack-bar';
+import { HelpModalComponent } from './components/help-modal/help-modal.component';
+import { MatDialog } from '@angular/material/dialog';
 
 @Component({
   selector: 'app-root',
@@ -34,7 +36,8 @@ export class AppComponent extends SubscriberBase implements AfterViewInit {
     private navService: NavService,
     private storageService: StorageService,
     private breakpointObserver: BreakpointObserver,
-    private snackBar: MatSnackBar
+    private snackBar: MatSnackBar,
+    public dialog: MatDialog
   ) {
     super();
 
@@ -87,6 +90,10 @@ export class AppComponent extends SubscriberBase implements AfterViewInit {
     //#endregion
   }
 
+  showHelp() {
+    this.dialog.open(HelpModalComponent);
+  }
+
   ngAfterViewInit(): void {
     this.navService.setSidenav(this.sidenav, this.settings);
   }

app/db/src/app/app.module.ts

@@ -56,6 +56,8 @@ import { AppComponent } from './app.component';
 import { SavedPagesAdminPage } from './pages/saved-pages-admin/saved-pages-admin.page';
 import { SavedPageCardComponent } from './components/saved-page-card/saved-page-card.component';
 
+import { HelpModalComponent } from './components/help-modal/help-modal.component';
+
 import { SearchPage } from './pages/search/search.page';
 
 import { OkCancelModalComponent } from './components/ok-cancel-modal/ok-cancel-modal.component';
@@ -77,6 +79,7 @@ import { AddToPageModalComponent } from './components/add-to-page-modal/add-to-p
     AppComponent,
     SavedPagesAdminPage,
     SavedPageCardComponent,
+    HelpModalComponent,
     SearchPage,
     PassageCardComponent,
     StrongsComponent,

app/db/src/app/components/help-modal/help-modal.component.html

@@ -0,0 +1,174 @@
+<mat-toolbar>
+  <mat-icon>help</mat-icon>
+  <span class="title">Help</span>
+  <span class="close-button">
+    <button mat-icon-button mat-dialog-close aria-label="Exit the verse picker">
+      <mat-icon>cancel</mat-icon>
+    </button>
+  </span>
+</mat-toolbar>
+<div class="content">
+  <h2>How to search for a verse</h2>
+  <p>
+    To bring up a passage, just type in a reference, or use the verse picker in
+    the top right corner. Dynamic Bible will recognize most abbreviations of
+    books, and can handle ranges within a book. Here are a few examples to get
+    you started:
+  </p>
+  <h3>Examples of Search Items:</h3>
+  <ul>
+    <li><b>John 1</b> (displays whole chapter)</li>
+    <li><b>John 3:16</b> (displays single verse)</li>
+    <li><b>Jn 3:16</b> (handles abbreviation of John)</li>
+    <li>
+      <b>Jn 3:16-17</b> (displays verses starting with chapter 1 verse 3 through
+      chapter 1 vs 5)
+    </li>
+    <li><b>John 3:16-4:4</b></li>
+    <li><b>Jn 3-4</b> (displays both chapters)</li>
+    <li><b>John 3 - John 4</b> (displays both chapters)</li>
+    <li>
+      <b>Jn 3:1-*</b> (this will get all the verses in the chapter. the * char
+      can be used in verse ranges, but not chapter ranges.)
+    </li>
+    <li>
+      <b>H1234</b> (displays the strongs definition for the Hebrew # 1234)
+    </li>
+    <li><b>G1234</b> (displays the strongs definition for the Greek # 1234)</li>
+    <li>
+      <b>Jesus</b> (searches for "Jesus". all search terms assume boolean AND,
+      i.e. "Jesus Christ" assumes "Jesus AND Christ". A word without a number is
+      interpreted as search term).
+    </li>
+  </ul>
+
+  We currently don't support ranges that cross book boundaries. If you search
+  for "John 12 - Romans 3" you will get an error. the second book name is
+  ignored.
+
+  <h3>Further Notes:</h3>
+  <ul>
+    <li>
+      Multiple lookups can be made using a semicolon as a seperator, i.e. "Ruth
+      1; g1234; spirit").
+    </li>
+    <li>
+      All greek/hebrew cross references translations are taken from the 1933
+      Websters version and are sometimes not the same as the KJV translation.
+    </li>
+    <li>
+      All source materials were taken from the
+      <a href="http://sourceforge.net/projects/zefania-sharp/"
+        >Zefania XML Bible Project</a
+      >
+      on SourceForge.
+    </li>
+    <li>
+      Any Errors and Omission you find would be appreciated. Please contact me
+      via <a href="http://www.jasonwall.org/">www.jasonwall.org</a>.
+    </li>
+  </ul>
+
+  <h3>Visit Us Online</h3>
+  <p>
+    <a href="http://www.dynamicbible.com">www.dynamicbible.com</a> hosts the
+    online version of the web app. We are currently available on the
+    <a
+      href="https://bitbucket.org/walljm/dynamicbible/downloads/DynamicBible-3.1.0.zip"
+      >Windows Platform</a
+    >
+    via the <a href="http://electron.atom.io/">Electron app from atom.io</a> and
+    on the
+    <a href="https://play.google.com/store/apps/details?id=walljm.dynamicbible"
+      >Google Android Play store</a
+    >. We are working on an IOS distribution and will be releasing that soon.
+  </p>
+
+  <h3>Book Names and Accepted Abbreviations</h3>
+  <ul>
+    <li><b>Genesis</b>: gen, ge, gn</li>
+    <li><b>Exodus</b>: ex, exo, exod, exd</li>
+    <li><b>Leviticus</b>: lev, le, levi, lv</li>
+    <li><b>Numbers</b>: num, nu, numb, number</li>
+    <li><b>Deuteronomy</b>: deut, de, dt, deu</li>
+    <li><b>Joshua</b>: josh, jos</li>
+    <li><b>Judges</b>: jud, jdg, judg</li>
+    <li><b>Ruth</b>: ru</li>
+    <li><b>1 Samuel</b>: 1, i, 1st, first samuel, sa, sam, sml</li>
+    <li><b>2 Samuel</b>: 2, ii, 2nd, second, sec samuel, sa, sam, sml</li>
+    <li><b>1 Kings</b>: 1, i, 1st, first kings, king, kgs, kn, k, ki</li>
+    <li><b>2 Kings</b>: 2, ii, 2nd, second, sec kings, king, kgs, kn, k, ki</li>
+    <li><b>1 Chronicles</b>: 1, i, 1st, first chronicles, chron, ch, chr</li>
+    <li>
+      <b>2 Chronicles</b>: 2, ii, 2nd, second, sec chronicles, chron, ch, chr
+    </li>
+    <li><b>Ezra</b>: ezr</li>
+    <li><b>Nehemiah</b>: neh, ne, nehamiah</li>
+    <li><b>Esther</b>: est, es, esth</li>
+    <li><b>Job</b>: jo, jb</li>
+    <li><b>Psalms</b>: ps, psa, psalm, psm</li>
+    <li><b>Proverbs</b>: prov, pr, pro, proverb, prv, prvbs</li>
+    <li><b>Ecclesiastes</b>: eccl, ecc, eccles, ec, ecl, ecclesiaste</li>
+    <li>
+      <b>Song of Solomon</b>: , song of songs, sos, ss, son, so, song, songs
+    </li>
+    <li><b>Isaiah</b>: is, isah, isai, ia</li>
+    <li><b>Jerimiah</b>: jeremiah, jer, je, jere</li>
+    <li><b>Lamentations</b>: lam, la, lamentation</li>
+    <li><b>Ezekiel</b>: eze, ezk, ezek</li>
+    <li><b>Daniel</b>: dan, dn, dl, da</li>
+    <li><b>Hosea</b>: hos, ho</li>
+    <li><b>Joel</b>: joe, jl</li>
+    <li><b>Amos</b>: am, amo</li>
+    <li><b>Obadiah</b>: oba, ob, obad</li>
+    <li><b>Jonah</b>: jnh, jon</li>
+    <li><b>Micah</b>: mic, mi</li>
+    <li><b>Nahum</b>: nah, na</li>
+    <li><b>Habakkuk</b>: hab, ha, habakuk</li>
+    <li><b>Zephaniah</b>: zeph, zep</li>
+    <li><b>Haggia</b>: hag, hg, haggai</li>
+    <li><b>Zechariah</b>: zech, zch, zec</li>
+    <li><b>Malachi</b>: mal</li>
+    <li><b>Matthew</b>: mt, matt, mat</li>
+    <li><b>Mark</b>: mrk, mk, mr</li>
+    <li><b>luke</b>: lu, lke, luk, lk</li>
+    <li><b>John</b>: jn, jhn</li>
+    <li><b>Acts</b>: ac, act</li>
+    <li><b>Romans</b>: rom, ro, rm, roman</li>
+    <li>
+      <b>1 Corinthians</b>: 1, i, 1st, first corinthian, cor, corinthians,
+      corinth, corin, corth, corint
+    </li>
+    <li>
+      <b>2 Corinthians</b>: 2, ii, 2nd, second, sec corinthian, cor,
+      corinthians, corinth, corin, corth, corint
+    </li>
+    <li>
+      <b>Galatians</b>: galatian, galations, gal, ga, gala, galation, galat
+    </li>
+    <li><b>Ephesians</b>: eph, ep, ephes, ephe, ephs</li>
+    <li><b>Philippians</b>: phi, phil, ph, philip</li>
+    <li><b>Colossians</b>: col, co, colossian, colos, coloss</li>
+    <li>
+      <b>1 Thessalonians</b>: 1, i, 1st, first thessalonians, the, thessa,
+      thessalonian, thes, thess, th
+    </li>
+    <li>
+      <b>2 Thessalonians</b>: 2, ii, 2nd, second, sec thessalonians, the,
+      thessa, thessalonian, thes, thess, th
+    </li>
+    <li><b>1 Timothy</b>: 1, i, 1st, first timothy, tim, ti, timoth, tm</li>
+    <li><b>2 Timothy</b>: 2, ii, 2nd, second, sec timothy, tim, timoth, tm</li>
+    <li><b>Titus</b>: tit</li>
+    <li><b>Philemon</b>: phlmn, phl, phm, phile, philem</li>
+    <li><b>Hebrews</b>: heb, he, hebrew</li>
+    <li><b>James</b>: jam, ja, jas, jms, jame, jm</li>
+    <li><b>1 Peter</b>: 1, i, 1st, first peter, pe, pet, pete, pt, p</li>
+    <li><b>2 Peter</b>: 2, ii, 2nd, second, sec peter, pe, pet, pete, pt, p</li>
+    <li><b>1 John</b>: 1, i, 1st, first john, jn, jo</li>
+    <li><b>2 John</b>: 2, ii, 2nd, second, sec john, jn, jo</li>
+    <li><b>3 John</b>: 3, iii, 3rd, third john, jn, jo</li>
+    <li><b>Jude</b>: ju</li>
+    <li><b>Revelation</b>: rev, re, revelations, rv</li>
+  </ul>
+</div>

app/db/src/app/components/help-modal/help-modal.component.scss

@@ -0,0 +1,18 @@
+.close-button {
+  float: right;
+  mat-icon {
+    font-size: 2rem;
+  }
+}
+
+.title {
+  width: 100%;
+  padding-left: 1rem;
+  font-size: 1.5rem;
+}
+
+.content {
+  margin-top: 12px;
+  max-height: 80vh;
+  overflow-y: scroll;
+}

app/db/src/app/components/help-modal/help-modal.component.ts

@@ -0,0 +1,12 @@
+import { Component } from '@angular/core';
+import { NavService } from '../../services/nav.service';
+
+@Component({
+  selector: 'app-help-modal-component',
+  templateUrl: './help-modal.component.html',
+  styleUrls: ['./help-modal.component.scss'],
+  preserveWhitespaces: true,
+})
+export class HelpModalComponent {
+  constructor(public navService: NavService) {}
+}

app/db/src/app/pages/saved-pages-admin/saved-pages-admin.page.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 import { MatDialog } from '@angular/material/dialog';
 import { AppService } from '../../services/app.service';
 import { NavService } from '../../services/nav.service';

app/db/src/app/services/app-state-initial-state.ts

@@ -33,7 +33,6 @@ export const initialState: AppState = {
   mainPages: [
     { title: PageTitles.Search, icon: PageIcons.Search, route: 'search' },
     { title: PageTitles.PageAdmin, icon: PageIcons.PageAdmin, route: 'saved/admin' },
-    { title: PageTitles.Help, icon: PageIcons.Help, route: 'help' },
   ],
   error: null,
   displaySettings: {