Rework dockerfile to final form

Add jquery-ui
fix uuid validation for other versions
expand queryRef method to include parameters
converted mouseover to click events for embedded links
added additional parameters to openNote and retrieveNote

.env

@@ -1,42 +0,0 @@
-# In all environments, the following files are loaded if they exist,
-# the latter taking precedence over the former:
-#
-#  * .env                contains default values for the environment variables needed by the app
-#  * .env.local          uncommitted file with local overrides
-#  * .env.$APP_ENV       committed environment-specific defaults
-#  * .env.$APP_ENV.local uncommitted environment-specific overrides
-#
-# Real environment variables win over .env files.
-#
-# DO NOT DEFINE PRODUCTION SECRETS IN THIS FILE NOR IN ANY OTHER COMMITTED FILES.
-# https://symfony.com/doc/current/configuration/secrets.html
-#
-# Run "composer dump-env prod" to compile .env files for production use (requires symfony/flex >=1.2).
-# https://symfony.com/doc/current/best_practices.html#use-environment-variables-for-infrastructure-configuration
-
-###> symfony/framework-bundle ###
-APP_ENV=dev
-APP_SECRET=c9124e6a5434e81e428ab5236aa6259b
-APP_DEBUG=1
-###< symfony/framework-bundle ###
-
-###> doctrine/doctrine-bundle ###
-# Format described at https://www.doctrine-project.org/projects/doctrine-dbal/en/latest/reference/configuration.html#connecting-using-a-url
-# IMPORTANT: You MUST configure your server version, either here or in config/packages/doctrine.yaml
-#
-DATABASE_URL="sqlite:///%kernel.project_dir%/var/data.db"
-# DATABASE_URL="mysql://root:password@192.168.1.3:3306/sermon_notes"
-# DATABASE_URL="mysql://app:!ChangeMe!@127.0.0.1:3306/app?serverVersion=10.11.2-MariaDB&charset=utf8mb4"
-# DATABASE_URL="postgresql://app:!ChangeMe!@127.0.0.1:5432/app?serverVersion=16&charset=utf8"
-###< doctrine/doctrine-bundle ###
-
-###> symfony/messenger ###
-# Choose one of the transports below
-# MESSENGER_TRANSPORT_DSN=amqp://guest:guest@localhost:5672/%2f/messages
-# MESSENGER_TRANSPORT_DSN=redis://localhost:6379/messages
-MESSENGER_TRANSPORT_DSN=doctrine://default?auto_setup=0
-###< symfony/messenger ###
-
-###> symfony/mailer ###
-# MAILER_DSN=null://null
-###< symfony/mailer ###

.gitignore

@@ -1,5 +1,6 @@
 
 ###> symfony/framework-bundle ###
+/.env
 /.env.local
 /.env.local.php
 /.env.*.local

000-default.conf

@@ -0,0 +1,29 @@
+<VirtualHost *:80>
+	# The ServerName directive sets the request scheme, hostname and port that
+	# the server uses to identify itself. This is used when creating
+	# redirection URLs. In the context of virtual hosts, the ServerName
+	# specifies what hostname must appear in the request's Host: header to
+	# match this virtual host. For the default virtual host (this file) this
+	# value is not decisive as it is used as a last resort host regardless.
+	# However, you must set it for any further virtual host explicitly.
+	#ServerName www.example.com
+
+	ServerAdmin webmaster@localhost
+	DocumentRoot /var/www/html/public
+
+	# Available loglevels: trace8, ..., trace1, debug, info, notice, warn,
+	# error, crit, alert, emerg.
+	# It is also possible to configure the loglevel for particular
+	# modules, e.g.
+	#LogLevel info ssl:warn
+
+	ErrorLog ${APACHE_LOG_DIR}/error.log
+	CustomLog ${APACHE_LOG_DIR}/access.log combined
+
+	# For most configuration files from conf-available/, which are
+	# enabled or disabled at a global level, it is possible to
+	# include a line for only one particular virtual host. For example the
+	# following line enables the CGI configuration for this host only
+	# after it has been globally disabled with "a2disconf".
+	#Include conf-available/serve-cgi-bin.conf
+</VirtualHost>

Dockerfile

@@ -0,0 +1,54 @@
+FROM php:8.2-apache
+
+RUN apt update && \
+    apt upgrade -y && \
+    apt install -y \
+    libzip-dev \
+    unzip \
+    libonig-dev \
+    libxml2-dev \
+    libpng-dev \
+    libjpeg-dev \
+    libicu-dev \
+    sqlite3 \
+    curl \
+    git \
+    nano
+
+RUN docker-php-ext-configure gd --with-jpeg
+RUN docker-php-ext-configure zip
+
+RUN docker-php-ext-install \
+    #pdo_sqlite \
+    zip \
+    mbstring \
+    exif \
+    pcntl \
+    bcmath \
+    xml \
+    intl
+
+RUN php -r "copy('https://getcomposer.org/installer', 'composer-setup.php');" && \
+    php composer-setup.php --install-dir=/usr/local/bin --filename=composer && \
+    php -r "unlink('composer-setup.php');"
+
+RUN curl -sS https://get.symfony.com/cli/installer | bash && \
+    mv /root/.symfony5/bin/symfony /usr/local/bin/symfony
+
+COPY . /var/www/html/
+
+RUN mv 000-default.conf /etc/apache2/sites-available/
+RUN rm /var/www/html/.env*
+RUN rm -rf /var/www/html/var/*
+RUN rm -rf /var/www/html/vendor
+RUN rm -rf /var/www/html/tests
+RUN rm -rf /var/www/html/translations
+
+RUN COMPOSER_ALLOW_SUPERUSER=1 composer install --no-scripts --no-dev --optimize-autoloader
+RUN mv /var/www/html/data/data.db /var/www/html/var/
+
+RUN mkdir /var/www/html/var/cache
+RUN mkdir /var/www/html/var/log
+
+RUN chown -R www-data:www-data /var/www/html
+RUN chmod -R 755 /var/www/html

README.md

@@ -1,3 +1,66 @@
 # Sermon Notes
 
-A program to take sermon notes
+A program to take notes during a sermon.  The web app was built with PHP and Symfony.
+
+## Installation
+
+The best option for installing is using the Docker container.  Download the `docker-compose.yml` file from this repository and run `docker-compose up -d` from the command line.
+
+## Operation
+
+This is the home page you're first presented with.
+
+![Home](/assets/images/Home.png)
+
+Create an account with "Register".
+
+![Register](/assets/images/Registration.png)
+
+Once you create an account you'll need to login
+
+![Login](/assets/images/Login.png)
+
+Once you get logged in you'll be presented with the main home page
+
+![HomePage](/assets/images/HomePage.png)
+
+If you are accessing on a regular iPad the menu should be collapsed, if not, you may need to do that.  I built this with a iPad 9th Gen in mind so your mileage may vary.
+
+![Header](/assets/images/Header.png)
+
+Across the top you will see a "plus" and "minus" buttons that will increase and decrease the size of font for the reference content.  The 3rd button is to open the Reference opener box.  On the right side you will see the "table" that will open the sermon details portion.  The next button is a preview button to preview the notes you have typed.  The final dropdown is to quickly apply a template for you to start taking notes.
+
+![SermonData](/assets/images/SermonData.png)
+
+These fields are meant to hide because you only need to fill them out once and they are the specifics of the sermon itself (e.g. title, date, speaker, series, and passage)
+
+![Template](/assets/images/Template.png)
+
+The notes you take are done in [Markdown](/docs/markdown-cheat-sheet.md).  In the above example, there is an introduction and 3 bullet points.  Each has a sub-bullet unordered list.  Review the Markdown link above for more tips on how to write Markdown.
+
+When you are done with your Notes it will look something like the following.
+
+![Example](/assets/images/MarkdownExample.png)
+
+The tool is built that it will auto-save every 10 seconds and have a 5 second timeout should you be in a place where you don't have good internet service.  When the tool starts to save you will see an orange checkmark appear next to the "Notes" header above where your typing.  When it is done saving it will turn green and fade away.
+
+I built this tool because I needed a way to take notes and have reference material open next to me.  So I built a reference opener to do just that
+
+![ReferenceOpener](/assets/images/ReferenceOpener.png)
+
+I have added many reference options (Bible, various creeds, Belgic Confession, Heidelberg Catechism, Canons of Dort, Westminster Confession of Faith, Westminster Larger Catechism, or Westminster Short Catechism).  I plan to add others in the future.  Simply select the type then filter to the book/chapter/week of the referenced work and hit "Search".  This will open the reference on the left side of the page.
+
+![References](/assets/images/References.png)
+
+You can switch between the references by clicking the button on the left side.  You can double-tap one of the buttons to remove that reference from the list.
+
+Once a note has been saved, it can be retrieved in two different ways.  You can open the open page (by clicking on the Menu (hamburger) then "Open Notes")
+
+![OpenNotes](/assets/images/OpenNotes.png)
+
+or if the note was recently made you will see the most recent 4 notes listed under the menu
+
+![RecentNotes](/assets/images/RecentNotes.png)
+
+By click either of the title links it will open the note and display it for you to edit or read.  I can add "Notes" as future reference content.
+

bin/import-bible.php

@@ -0,0 +1,26 @@
+<?php
+
+require __DIR__.'/../vendor/autoload.php';
+
+use Symfony\Component\Uid\Uuid;
+
+$bible = json_decode(file_get_contents(dirname(__DIR__).'/var/esv-bible.json'));
+$db = new PDO('sqlite:'.dirname(__DIR__).'/var/data.db');
+
+foreach ($bible as $book => $data) {
+    $stmt = $db->prepare('INSERT INTO bible (id, book, chapter, verse, content, book_index) VALUES (:id, :book, :chapter, :verse, :content, :book_index)');
+
+    foreach ($data->text as $chapter => $verses) {
+        foreach ($verses as $verse => $text) {
+            print "{$book} {$chapter}:{$verse}".PHP_EOL;
+            $stmt->execute([
+                'id' => Uuid::v4(),
+                'book' => $book,
+                'chapter' => $chapter,
+                'verse' => ($verse + 1),
+                'content' => $text,
+                'book_index' => $data->index
+            ]);
+        }
+    }
+}

composer.json

@@ -45,7 +45,8 @@
         "symfony/web-link": "7.0.*",
         "symfony/yaml": "7.0.*",
         "twig/extra-bundle": "^2.12|^3.0",
-        "twig/twig": "^2.12|^3.0"
+        "twig/twig": "^2.12|^3.0",
+        "symfony/debug-bundle": "7.0.*"
     },
     "config": {
         "allow-plugins": {
@@ -101,10 +102,9 @@
         "phpunit/phpunit": "^9.5",
         "symfony/browser-kit": "7.0.*",
         "symfony/css-selector": "7.0.*",
-        "symfony/debug-bundle": "7.0.*",
         "symfony/maker-bundle": "^1.0",
         "symfony/phpunit-bridge": "^7.0",
         "symfony/stopwatch": "7.0.*",
         "symfony/web-profiler-bundle": "7.0.*"
     }
-}
+}

composer.lock

@@ -4,7 +4,7 @@
         "Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
         "This file is @generated automatically"
     ],
-    "content-hash": "0d70d3365b484d441657610d2a288a25",
+    "content-hash": "7f57aa7d9b15ae1237c769af447ea233",
     "packages": [
         {
             "name": "composer/semver",
@@ -548,16 +548,16 @@
         },
         {
             "name": "doctrine/doctrine-migrations-bundle",
-            "version": "3.3.0",
+            "version": "3.3.1",
             "source": {
                 "type": "git",
                 "url": "https://github.com/doctrine/DoctrineMigrationsBundle.git",
-                "reference": "1dd42906a5fb9c5960723e2ebb45c68006493835"
+                "reference": "715b62c31a5894afcb2b2cdbbc6607d7dd0580c0"
             },
             "dist": {
                 "type": "zip",
-                "url": "https://api.github.com/repos/doctrine/DoctrineMigrationsBundle/zipball/1dd42906a5fb9c5960723e2ebb45c68006493835",
-                "reference": "1dd42906a5fb9c5960723e2ebb45c68006493835",
+                "url": "https://api.github.com/repos/doctrine/DoctrineMigrationsBundle/zipball/715b62c31a5894afcb2b2cdbbc6607d7dd0580c0",
+                "reference": "715b62c31a5894afcb2b2cdbbc6607d7dd0580c0",
                 "shasum": ""
             },
             "require": {
@@ -568,6 +568,7 @@
                 "symfony/framework-bundle": "^5.4 || ^6.0 || ^7.0"
             },
             "require-dev": {
+                "composer/semver": "^3.0",
                 "doctrine/coding-standard": "^12",
                 "doctrine/orm": "^2.6 || ^3",
                 "doctrine/persistence": "^2.0 || ^3 ",
@@ -619,7 +620,7 @@
             ],
             "support": {
                 "issues": "https://github.com/doctrine/DoctrineMigrationsBundle/issues",
-                "source": "https://github.com/doctrine/DoctrineMigrationsBundle/tree/3.3.0"
+                "source": "https://github.com/doctrine/DoctrineMigrationsBundle/tree/3.3.1"
             },
             "funding": [
                 {
@@ -635,20 +636,20 @@
                     "type": "tidelift"
                 }
             ],
-            "time": "2023-11-13T19:44:41+00:00"
+            "time": "2024-05-14T20:32:18+00:00"
         },
         {
             "name": "doctrine/event-manager",
-            "version": "2.0.0",
+            "version": "2.0.1",
             "source": {
                 "type": "git",
                 "url": "https://github.com/doctrine/event-manager.git",
-                "reference": "750671534e0241a7c50ea5b43f67e23eb5c96f32"
+                "reference": "b680156fa328f1dfd874fd48c7026c41570b9c6e"
             },
             "dist": {
                 "type": "zip",
-                "url": "https://api.github.com/repos/doctrine/event-manager/zipball/750671534e0241a7c50ea5b43f67e23eb5c96f32",
-                "reference": "750671534e0241a7c50ea5b43f67e23eb5c96f32",
+                "url": "https://api.github.com/repos/doctrine/event-manager/zipball/b680156fa328f1dfd874fd48c7026c41570b9c6e",
+                "reference": "b680156fa328f1dfd874fd48c7026c41570b9c6e",
                 "shasum": ""
             },
             "require": {
@@ -658,10 +659,10 @@
                 "doctrine/common": "<2.9"
             },
             "require-dev": {
-                "doctrine/coding-standard": "^10",
+                "doctrine/coding-standard": "^12",
                 "phpstan/phpstan": "^1.8.8",
-                "phpunit/phpunit": "^9.5",
-                "vimeo/psalm": "^4.28"
+                "phpunit/phpunit": "^10.5",
+                "vimeo/psalm": "^5.24"
             },
             "type": "library",
             "autoload": {
@@ -710,7 +711,7 @@
             ],
             "support": {
                 "issues": "https://github.com/doctrine/event-manager/issues",
-                "source": "https://github.com/doctrine/event-manager/tree/2.0.0"
+                "source": "https://github.com/doctrine/event-manager/tree/2.0.1"
             },
             "funding": [
                 {
@@ -726,7 +727,7 @@
                     "type": "tidelift"
                 }
             ],
-            "time": "2022-10-12T20:59:15+00:00"
+            "time": "2024-05-22T20:47:39+00:00"
         },
         {
             "name": "doctrine/inflector",
@@ -1070,16 +1071,16 @@
         },
         {
             "name": "doctrine/orm",
-            "version": "3.1.3",
+            "version": "3.2.0",
             "source": {
                 "type": "git",
                 "url": "https://github.com/doctrine/orm.git",
-                "reference": "8ca99fdfdca3dc129ed93124e95e7f88b791a354"
+                "reference": "37946d3a21ddf837c0d84f8156ee60a92102e332"
             },
             "dist": {
                 "type": "zip",
-                "url": "https://api.github.com/repos/doctrine/orm/zipball/8ca99fdfdca3dc129ed93124e95e7f88b791a354",
-                "reference": "8ca99fdfdca3dc129ed93124e95e7f88b791a354",
+                "url": "https://api.github.com/repos/doctrine/orm/zipball/37946d3a21ddf837c0d84f8156ee60a92102e332",
+                "reference": "37946d3a21ddf837c0d84f8156ee60a92102e332",
                 "shasum": ""
             },
             "require": {
@@ -1101,12 +1102,12 @@
             "require-dev": {
                 "doctrine/coding-standard": "^12.0",
                 "phpbench/phpbench": "^1.0",
-                "phpstan/phpstan": "1.10.59",
+                "phpstan/phpstan": "1.11.1",
                 "phpunit/phpunit": "^10.4.0",
                 "psr/log": "^1 || ^2 || ^3",
                 "squizlabs/php_codesniffer": "3.7.2",
                 "symfony/cache": "^5.4 || ^6.2 || ^7.0",
-                "vimeo/psalm": "5.22.2"
+                "vimeo/psalm": "5.24.0"
             },
             "suggest": {
                 "ext-dom": "Provides support for XSD validation for XML mapping files",
@@ -1152,9 +1153,9 @@
             ],
             "support": {
                 "issues": "https://github.com/doctrine/orm/issues",
-                "source": "https://github.com/doctrine/orm/tree/3.1.3"
+                "source": "https://github.com/doctrine/orm/tree/3.2.0"
             },
-            "time": "2024-04-30T07:14:13+00:00"
+            "time": "2024-05-23T14:27:52+00:00"
         },
         {
             "name": "doctrine/persistence",
@@ -1256,23 +1257,26 @@
         },
         {
             "name": "doctrine/sql-formatter",
-            "version": "1.2.0",
+            "version": "1.4.0",
             "source": {
                 "type": "git",
                 "url": "https://github.com/doctrine/sql-formatter.git",
-                "reference": "a321d114e0a18e6497f8a2cd6f890e000cc17ecc"
+                "reference": "d1ac84aef745c69ea034929eb6d65a6908b675cc"
             },
             "dist": {
                 "type": "zip",
-                "url": "https://api.github.com/repos/doctrine/sql-formatter/zipball/a321d114e0a18e6497f8a2cd6f890e000cc17ecc",
-                "reference": "a321d114e0a18e6497f8a2cd6f890e000cc17ecc",
+                "url": "https://api.github.com/repos/doctrine/sql-formatter/zipball/d1ac84aef745c69ea034929eb6d65a6908b675cc",
+                "reference": "d1ac84aef745c69ea034929eb6d65a6908b675cc",
                 "shasum": ""
             },
             "require": {
-                "php": "^7.1 || ^8.0"
+                "php": "^8.1"
             },
             "require-dev": {
-                "bamarni/composer-bin-plugin": "^1.4"
+                "doctrine/coding-standard": "^12",
+                "phpstan/phpstan": "^1.10",
+                "phpunit/phpunit": "^10.5",
+                "vimeo/psalm": "^5.24"
             },
             "bin": [
                 "bin/sql-formatter"
@@ -1302,9 +1306,9 @@
             ],
             "support": {
                 "issues": "https://github.com/doctrine/sql-formatter/issues",
-                "source": "https://github.com/doctrine/sql-formatter/tree/1.2.0"
+                "source": "https://github.com/doctrine/sql-formatter/tree/1.4.0"
             },
-            "time": "2023-08-16T21:49:04+00:00"
+            "time": "2024-05-08T08:12:09+00:00"
         },
         {
             "name": "egulias/email-validator",
@@ -1529,16 +1533,16 @@
         },
         {
             "name": "phpdocumentor/reflection-docblock",
-            "version": "5.4.0",
+            "version": "5.4.1",
             "source": {
                 "type": "git",
                 "url": "https://github.com/phpDocumentor/ReflectionDocBlock.git",
-                "reference": "298d2febfe79d03fe714eb871d5538da55205b1a"
+                "reference": "9d07b3f7fdcf5efec5d1609cba3c19c5ea2bdc9c"
             },
             "dist": {
                 "type": "zip",
-                "url": "https://api.github.com/repos/phpDocumentor/ReflectionDocBlock/zipball/298d2febfe79d03fe714eb871d5538da55205b1a",
-                "reference": "298d2febfe79d03fe714eb871d5538da55205b1a",
+                "url": "https://api.github.com/repos/phpDocumentor/ReflectionDocBlock/zipball/9d07b3f7fdcf5efec5d1609cba3c19c5ea2bdc9c",
+                "reference": "9d07b3f7fdcf5efec5d1609cba3c19c5ea2bdc9c",
                 "shasum": ""
             },
             "require": {
@@ -1587,9 +1591,9 @@
             "description": "With this component, a library can provide support for annotations via DocBlocks or otherwise retrieve information that is embedded in a DocBlock.",
             "support": {
                 "issues": "https://github.com/phpDocumentor/ReflectionDocBlock/issues",
-                "source": "https://github.com/phpDocumentor/ReflectionDocBlock/tree/5.4.0"
+                "source": "https://github.com/phpDocumentor/ReflectionDocBlock/tree/5.4.1"
             },
-            "time": "2024-04-09T21:13:58+00:00"
+            "time": "2024-05-21T05:55:05+00:00"
         },
         {
             "name": "phpdocumentor/type-resolver",
@@ -1651,16 +1655,16 @@
         },
         {
             "name": "phpstan/phpdoc-parser",
-            "version": "1.28.0",
+            "version": "1.29.0",
             "source": {
                 "type": "git",
                 "url": "https://github.com/phpstan/phpdoc-parser.git",
-                "reference": "cd06d6b1a1b3c75b0b83f97577869fd85a3cd4fb"
+                "reference": "536889f2b340489d328f5ffb7b02bb6b183ddedc"
             },
             "dist": {
                 "type": "zip",
-                "url": "https://api.github.com/repos/phpstan/phpdoc-parser/zipball/cd06d6b1a1b3c75b0b83f97577869fd85a3cd4fb",
-                "reference": "cd06d6b1a1b3c75b0b83f97577869fd85a3cd4fb",
+                "url": "https://api.github.com/repos/phpstan/phpdoc-parser/zipball/536889f2b340489d328f5ffb7b02bb6b183ddedc",
+                "reference": "536889f2b340489d328f5ffb7b02bb6b183ddedc",
                 "shasum": ""
             },
             "require": {
@@ -1692,9 +1696,9 @@
             "description": "PHPDoc parser with support for nullable, intersection and generic types",
             "support": {
                 "issues": "https://github.com/phpstan/phpdoc-parser/issues",
-                "source": "https://github.com/phpstan/phpdoc-parser/tree/1.28.0"
+                "source": "https://github.com/phpstan/phpdoc-parser/tree/1.29.0"
             },
-            "time": "2024-04-03T18:51:33+00:00"
+            "time": "2024-05-06T12:04:23+00:00"
         },
         {
             "name": "psr/cache",
@@ -2563,6 +2567,80 @@
             ],
             "time": "2024-04-18T09:29:19+00:00"
         },
+        {
+            "name": "symfony/debug-bundle",
+            "version": "v7.0.7",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/symfony/debug-bundle.git",
+                "reference": "4b013a2c886cfd0292d90a9a9cebfa29ec7b578c"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://api.github.com/repos/symfony/debug-bundle/zipball/4b013a2c886cfd0292d90a9a9cebfa29ec7b578c",
+                "reference": "4b013a2c886cfd0292d90a9a9cebfa29ec7b578c",
+                "shasum": ""
+            },
+            "require": {
+                "ext-xml": "*",
+                "php": ">=8.2",
+                "symfony/dependency-injection": "^6.4|^7.0",
+                "symfony/http-kernel": "^6.4|^7.0",
+                "symfony/twig-bridge": "^6.4|^7.0",
+                "symfony/var-dumper": "^6.4|^7.0"
+            },
+            "conflict": {
+                "symfony/config": "<6.4",
+                "symfony/dependency-injection": "<6.4"
+            },
+            "require-dev": {
+                "symfony/config": "^6.4|^7.0",
+                "symfony/web-profiler-bundle": "^6.4|^7.0"
+            },
+            "type": "symfony-bundle",
+            "autoload": {
+                "psr-4": {
+                    "Symfony\\Bundle\\DebugBundle\\": ""
+                },
+                "exclude-from-classmap": [
+                    "/Tests/"
+                ]
+            },
+            "notification-url": "https://packagist.org/downloads/",
+            "license": [
+                "MIT"
+            ],
+            "authors": [
+                {
+                    "name": "Fabien Potencier",
+                    "email": "fabien@symfony.com"
+                },
+                {
+                    "name": "Symfony Community",
+                    "homepage": "https://symfony.com/contributors"
+                }
+            ],
+            "description": "Provides a tight integration of the Symfony VarDumper component and the ServerLogCommand from MonologBridge into the Symfony full-stack framework",
+            "homepage": "https://symfony.com",
+            "support": {
+                "source": "https://github.com/symfony/debug-bundle/tree/v7.0.7"
+            },
+            "funding": [
+                {
+                    "url": "https://symfony.com/sponsor",
+                    "type": "custom"
+                },
+                {
+                    "url": "https://github.com/fabpot",
+                    "type": "github"
+                },
+                {
+                    "url": "https://tidelift.com/funding/github/packagist/symfony/symfony",
+                    "type": "tidelift"
+                }
+            ],
+            "time": "2024-04-18T09:29:19+00:00"
+        },
         {
             "name": "symfony/dependency-injection",
             "version": "v7.0.7",
@@ -7391,16 +7469,16 @@
         },
         {
             "name": "twig/extra-bundle",
-            "version": "v3.9.3",
+            "version": "v3.10.0",
             "source": {
                 "type": "git",
                 "url": "https://github.com/twigphp/twig-extra-bundle.git",
-                "reference": "ef6869adf1fdab66f7e495771a7ba01496ffc0d5"
+                "reference": "cdc6e23aeb7f4953c1039568c3439aab60c56454"
             },
             "dist": {
                 "type": "zip",
-                "url": "https://api.github.com/repos/twigphp/twig-extra-bundle/zipball/ef6869adf1fdab66f7e495771a7ba01496ffc0d5",
-                "reference": "ef6869adf1fdab66f7e495771a7ba01496ffc0d5",
+                "url": "https://api.github.com/repos/twigphp/twig-extra-bundle/zipball/cdc6e23aeb7f4953c1039568c3439aab60c56454",
+                "reference": "cdc6e23aeb7f4953c1039568c3439aab60c56454",
                 "shasum": ""
             },
             "require": {
@@ -7449,7 +7527,7 @@
                 "twig"
             ],
             "support": {
-                "source": "https://github.com/twigphp/twig-extra-bundle/tree/v3.9.3"
+                "source": "https://github.com/twigphp/twig-extra-bundle/tree/v3.10.0"
             },
             "funding": [
                 {
@@ -7461,20 +7539,20 @@
                     "type": "tidelift"
                 }
             ],
-            "time": "2024-04-18T09:24:21+00:00"
+            "time": "2024-05-11T07:35:57+00:00"
         },
         {
             "name": "twig/twig",
-            "version": "v3.9.3",
+            "version": "v3.10.3",
             "source": {
                 "type": "git",
                 "url": "https://github.com/twigphp/Twig.git",
-                "reference": "a842d75fed59cdbcbd3a3ad7fb9eb768fc350d58"
+                "reference": "67f29781ffafa520b0bbfbd8384674b42db04572"
             },
             "dist": {
                 "type": "zip",
-                "url": "https://api.github.com/repos/twigphp/Twig/zipball/a842d75fed59cdbcbd3a3ad7fb9eb768fc350d58",
-                "reference": "a842d75fed59cdbcbd3a3ad7fb9eb768fc350d58",
+                "url": "https://api.github.com/repos/twigphp/Twig/zipball/67f29781ffafa520b0bbfbd8384674b42db04572",
+                "reference": "67f29781ffafa520b0bbfbd8384674b42db04572",
                 "shasum": ""
             },
             "require": {
@@ -7528,7 +7606,7 @@
             ],
             "support": {
                 "issues": "https://github.com/twigphp/Twig/issues",
-                "source": "https://github.com/twigphp/Twig/tree/v3.9.3"
+                "source": "https://github.com/twigphp/Twig/tree/v3.10.3"
             },
             "funding": [
                 {
@@ -7540,7 +7618,7 @@
                     "type": "tidelift"
                 }
             ],
-            "time": "2024-04-18T11:59:33+00:00"
+            "time": "2024-05-16T10:04:27+00:00"
         },
         {
             "name": "webmozart/assert",
@@ -9422,80 +9500,6 @@
             ],
             "time": "2024-04-18T09:29:19+00:00"
         },
-        {
-            "name": "symfony/debug-bundle",
-            "version": "v7.0.7",
-            "source": {
-                "type": "git",
-                "url": "https://github.com/symfony/debug-bundle.git",
-                "reference": "4b013a2c886cfd0292d90a9a9cebfa29ec7b578c"
-            },
-            "dist": {
-                "type": "zip",
-                "url": "https://api.github.com/repos/symfony/debug-bundle/zipball/4b013a2c886cfd0292d90a9a9cebfa29ec7b578c",
-                "reference": "4b013a2c886cfd0292d90a9a9cebfa29ec7b578c",
-                "shasum": ""
-            },
-            "require": {
-                "ext-xml": "*",
-                "php": ">=8.2",
-                "symfony/dependency-injection": "^6.4|^7.0",
-                "symfony/http-kernel": "^6.4|^7.0",
-                "symfony/twig-bridge": "^6.4|^7.0",
-                "symfony/var-dumper": "^6.4|^7.0"
-            },
-            "conflict": {
-                "symfony/config": "<6.4",
-                "symfony/dependency-injection": "<6.4"
-            },
-            "require-dev": {
-                "symfony/config": "^6.4|^7.0",
-                "symfony/web-profiler-bundle": "^6.4|^7.0"
-            },
-            "type": "symfony-bundle",
-            "autoload": {
-                "psr-4": {
-                    "Symfony\\Bundle\\DebugBundle\\": ""
-                },
-                "exclude-from-classmap": [
-                    "/Tests/"
-                ]
-            },
-            "notification-url": "https://packagist.org/downloads/",
-            "license": [
-                "MIT"
-            ],
-            "authors": [
-                {
-                    "name": "Fabien Potencier",
-                    "email": "fabien@symfony.com"
-                },
-                {
-                    "name": "Symfony Community",
-                    "homepage": "https://symfony.com/contributors"
-                }
-            ],
-            "description": "Provides a tight integration of the Symfony VarDumper component and the ServerLogCommand from MonologBridge into the Symfony full-stack framework",
-            "homepage": "https://symfony.com",
-            "support": {
-                "source": "https://github.com/symfony/debug-bundle/tree/v7.0.7"
-            },
-            "funding": [
-                {
-                    "url": "https://symfony.com/sponsor",
-                    "type": "custom"
-                },
-                {
-                    "url": "https://github.com/fabpot",
-                    "type": "github"
-                },
-                {
-                    "url": "https://tidelift.com/funding/github/packagist/symfony/symfony",
-                    "type": "tidelift"
-                }
-            ],
-            "time": "2024-04-18T09:29:19+00:00"
-        },
         {
             "name": "symfony/dom-crawler",
             "version": "v7.0.7",
@@ -9565,16 +9569,16 @@
         },
         {
             "name": "symfony/maker-bundle",
-            "version": "v1.59.0",
+            "version": "v1.59.1",
             "source": {
                 "type": "git",
                 "url": "https://github.com/symfony/maker-bundle.git",
-                "reference": "1f02b59b98003b2c1f51bc8f178aee5cbf36779c"
+                "reference": "b87b1b25c607a8a50832395bc751c784946a0350"
             },
             "dist": {
                 "type": "zip",
-                "url": "https://api.github.com/repos/symfony/maker-bundle/zipball/1f02b59b98003b2c1f51bc8f178aee5cbf36779c",
-                "reference": "1f02b59b98003b2c1f51bc8f178aee5cbf36779c",
+                "url": "https://api.github.com/repos/symfony/maker-bundle/zipball/b87b1b25c607a8a50832395bc751c784946a0350",
+                "reference": "b87b1b25c607a8a50832395bc751c784946a0350",
                 "shasum": ""
             },
             "require": {
@@ -9637,7 +9641,7 @@
             ],
             "support": {
                 "issues": "https://github.com/symfony/maker-bundle/issues",
-                "source": "https://github.com/symfony/maker-bundle/tree/v1.59.0"
+                "source": "https://github.com/symfony/maker-bundle/tree/v1.59.1"
             },
             "funding": [
                 {
@@ -9653,7 +9657,7 @@
                     "type": "tidelift"
                 }
             ],
-            "time": "2024-04-27T21:12:25+00:00"
+            "time": "2024-05-06T03:59:59+00:00"
         },
         {
             "name": "symfony/phpunit-bridge",

config/packages/security.yaml

@@ -21,6 +21,7 @@ security:
         login_path: app_login
         check_path: app_login
         enable_csrf: false
+        default_target_path: app_home
       logout:
         path: app_logout
         # where to redirect after logout

config/production.yml

@@ -0,0 +1,7 @@
+# config/production.yml
+
+framework:
+  name: sermon-notes
+  version: "1.0.0"
+  secret: "%kernel.secret%"
+  default_locale: "%locale%"

docker-compose.yml

@@ -0,0 +1,13 @@
+version: "3"
+
+services:
+  sermon-notes:
+    container_name: sermon-notes
+    image: ryanprather/sermon-notes:latest
+    command:
+      - "php bin/console doctrine:migrations:migrate --no-interaction"
+      - "bash install.sh"
+    ports:
+      - 80:80
+    volumes:
+      - .:/var/www/html

docs/markdown-cheat-sheet.md

@@ -0,0 +1,97 @@
+# Markdown Cheat Sheet
+
+Thanks for visiting [The Markdown Guide](https://www.markdownguide.org)!
+
+This Markdown cheat sheet provides a quick overview of all the Markdown syntax elements. It can’t cover every edge case, so if you need more information about any of these elements, refer to the reference guides for [basic syntax](https://www.markdownguide.org/basic-syntax/) and [extended syntax](https://www.markdownguide.org/extended-syntax/).
+
+## Basic Syntax
+
+These are the elements outlined in John Gruber’s original design document. All Markdown applications support these elements.
+
+### Heading
+
+# H1
+## H2
+### H3
+
+### Bold
+
+**bold text**
+
+### Italic
+
+*italicized text*
+
+### Blockquote
+
+> blockquote
+
+### Ordered List
+
+1. First item
+2. Second item
+3. Third item
+
+### Unordered List
+
+- First item
+- Second item
+- Third item
+
+### Code
+
+`code`
+
+### Horizontal Rule
+
+---
+
+### Link
+
+[Markdown Guide](https://www.markdownguide.org)
+
+### Image
+
+![alt text](https://www.markdownguide.org/assets/images/tux.png)
+
+## Extended Syntax
+
+These elements extend the basic syntax by adding additional features. Not all Markdown applications support these elements.
+
+### Table
+
+| Syntax | Description |
+| ----------- | ----------- |
+| Header | Title |
+| Paragraph | Text |
+
+### Fenced Code Block
+
+```json
+{
+  "firstName": "John",
+  "lastName": "Smith",
+  "age": 25
+}
+```
+
+### Footnote
+
+Here's a sentence with a footnote. [^1]
+
+[^1]: This is the footnote.
+
+### Definition List
+
+term
+: definition
+
+### Strikethrough
+
+~~The world is flat.~~
+
+### Task List
+
+- [x] Write the press release
+- [ ] Update the website
+- [ ] Contact the media

install.sh

@@ -0,0 +1,17 @@
+#!/bin/bash
+
+rm -rf .env*
+
+echo "APP_ENV=prod" > .env
+echo "APP_DEBUG=0" >> .env
+
+LENGTH=32
+
+SECRET_KEY=$(openssl rand -base64 $LENGTH | tr -d '=' | tr -d '+' | tr -d '/' | tr -d ' ')
+TRIMMED_KEY=$(cut -c1-32 <<< $SECRET_KEY)
+echo "APP_SECRET=$TRIMMED_KEY" >> .env
+echo "DATABASE_URL=\"sqlite:///%kernel.project_dir%/var/data.db\"" >> .env
+echo "MESSENGER_TRANSPORT_DSN=doctrine://default?auto_setup=0" >> .env
+
+symfony console doctrine:migrations:migrate --no-interaction
+COMPOSER_ALLOW_SUPERUSER=1 composer update

public/css/style.css

@@ -3,21 +3,7 @@ body {
   margin: 0;
 }
 
-.top-tab {
-  height: 50px;
-  width: 100%;
-}
-
 /* Style for hamburger menu */
-.fa-check {
-  color: green;
-}
-
-.fa-bars:before,
-.fa-navicon:before {
-  padding: 3px;
-}
-
 .inner {
   display: flex;
   flex-direction: row;
@@ -25,14 +11,24 @@ body {
   justify-content: space-evenly;
   align-items: stretch;
   align-content: flex-start;
-  max-width: 1020px;
+  max-width: 1060px;
   /* Adjust to your desired width */
   margin: 0 auto;
 }
 
 .ref-tab {
   width: 60px;
-  padding-top: 65px !important;
+  padding-top: 75px !important;
+}
+
+.ref-tab ul {
+  margin: 0;
+  padding: 0;
+}
+
+.ref-tab ul li {
+  list-style: none;
+  list-style-type: none;
 }
 
 .tab {
@@ -63,24 +59,14 @@ body {
   background-color: #3e8e41 !important;
 }
 
-.ref-tab ul {
-  margin: 0;
-  padding: 0;
-}
-
-.ref-tab ul li {
-  list-style: none;
-  list-style-type: none;
-}
-
 .ref {
   width: 35%;
 }
 
 .ref > div#ref {
   vertical-align: top;
-  justify-content: start;
-  align-content: start;
+  justify-content: flex-start;
+  align-content: flex-start;
   overflow-y: scroll;
   width: 100%;
   height: 100%;
@@ -89,6 +75,10 @@ body {
   box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
 }
 
+#ref {
+  padding: 3px 3px 3px 10px;
+}
+
 #passage {
   width: 100px;
 }
@@ -103,53 +93,10 @@ body {
   width: 110px;
 }
 
-#noteSearch {
-  display: none;
-}
-
 #fields-container {
   display: none;
 }
 
-.button {
-  top: 10px;
-  right: 20px;
-  font-size: 16px;
-  cursor: pointer;
-  background-color: #4CAF50;
-  /* green */
-  color: #fff;
-  /* white */
-  border: none;
-  border-radius: 5px;
-  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.6);
-  padding: 5px 20px;
-  text-align: center;
-  text-decoration: none;
-  display: inline-block;
-  font-size: 16px;
-  margin: 4px 2px;
-  transition: all 0.3s ease-out;
-}
-.button:hover {
-  background-color: #3e8e41;
-  /* darker green */
-}
-.button::before {
-  font-size: 16px;
-  cursor: pointer;
-}
-
-.button::before {
-  font-size: 16px;
-  cursor: pointer;
-  transition: transform 0.5s ease-in-out;
-}
-
-.button:hover::before {
-  transform: translateY(-10px);
-}
-
 #fields-container.show {
   display: block;
 }
@@ -169,6 +116,12 @@ textarea#notes {
   overflow-x: scroll;
 }
 
+#previewBtn.active,
+#show-hide-btn.active {
+  background-color: #f56a6a !important;
+  color: white !important;
+}
+
 #note-header-left {
   display: inline-flex;
   flex-direction: row;
@@ -196,24 +149,16 @@ textarea#notes {
   list-style: none;
 }
 
-.noteListLinks {
-  cursor: pointer;
-  text-decoration: none;
-  color: purple;
-  font-weight: bold;
-  font-size: 16px;
-}
-
 div#refQuery {
   display: none;
   position: absolute;
   z-index: 100;
-  background-color: rgba(0, 0, 0, 0.5);
+  background-color: rgba(0, 0, 0, 0.8);
   width: 400px;
   height: 200px;
 }
 
-div#refQuery #search {
+div#refQuery #referenceSearch {
   border: none;
   border-radius: 5px;
   padding: 10px 20px;
@@ -224,6 +169,7 @@ div#refQuery #search {
   width: 150px;
   height: 25px;
   cursor: pointer;
+  display: none;
 }
 
 #passage-popup {
@@ -245,11 +191,49 @@ div#refQuery #search {
   opacity: 0;
   text-align: right;
   font-size: 20pt;
-  margin-top: 15px;
+  margin-left: 15px;
+  color: green;
+}
+
+#save-check.saving {
+  color: orange;
+}
+
+#save-check.error {
+  color: red;
 }
 
 #fields-container input,
 #fields-container select {
   width: 19.5%;
   display: inline-block;
+}
+
+#old-notes article p:first-child {
+  margin-bottom: 0 !important;
+  font-size: 10pt;
+}
+
+#old-notes article a {
+  font-size: 12pt;
+}
+
+#old-notes article p:last-child {
+  font-size: 12pt;
+}
+
+.inner {
+  padding-left: 0;
+}
+
+.ref h2 {
+  display: inline-block;
+}
+
+#ref {
+  font-size: 12pt;
+}
+
+#referenceBook {
+  display: none;
 }/*# sourceMappingURL=style.css.map */

public/css/style.css.map

@@ -1 +1 @@
-{"version":3,"sources":["style.scss","style.css"],"names":[],"mappings":"AAAA,kCAAA;AACA;EACI,SAAA;ACCJ;;ADEA;EACI,YAAA;EACA,WAAA;ACCJ;;ADEA,6BAAA;AAEA;EACI,YAAA;ACAJ;;ADGA;;EAEI,YAAA;ACAJ;;ADGA;EACI,aAAA;EACA,mBAAA;EACA,eAAA;EACA,6BAAA;EACA,oBAAA;EACA,yBAAA;EACA,iBAAA;EACA,iCAAA;EACA,cAAA;ACAJ;;ADGA;EACI,WAAA;EACA,4BAAA;ACAJ;;ADGA;EACI,kBAAA;ACAJ;;ADGA,GAAA;AACA;EACI,aAAA;EACA,uBAAA;EACA,mBAAA;EACA,YAAA;EACA,WAAA;EACA,kBAAA;EACA,yBAAA;EACA,sBAAA;EACA,YAAA;EACA,kBAAA;EACA,wCAAA;EACA,eAAA;EACA,kBAAA;ACAJ;ADEI;EACI,yBAAA;ACAR;;ADIA;EACI,oCAAA;ACDJ;;ADIA;EACI,SAAA;EACA,UAAA;ACDJ;;ADIA;EACI,gBAAA;EACA,qBAAA;ACDJ;;ADIA;EACI,UAAA;ACDJ;;ADIA;EACI,mBAAA;EACA,sBAAA;EACA,oBAAA;EACA,kBAAA;EACA,WAAA;EACA,YAAA;EACA,uBAAA;EACA,kBAAA;EACA,wCAAA;ACDJ;;ADIA;EACI,YAAA;ACDJ;;ADIA;EACI,aAAA;EACA,YAAA;ACDJ;;ADIA;EACI,aAAA;EACA,YAAA;ACDJ;;ADIA;EACI,aAAA;ACDJ;;ADIA;EACI,aAAA;ACDJ;;ADMA;EACI,SAAA;EACA,WAAA;EACA,eAAA;EACA,eAAA;EACA,yBAAA;EACA,UAAA;EACA,WAAA;EACA,UAAA;EACA,YAAA;EACA,kBAAA;EACA,wCAAA;EACA,iBAAA;EACA,kBAAA;EACA,qBAAA;EACA,qBAAA;EACA,eAAA;EACA,eAAA;EAGA,6BAAA;ACHJ;ADKI;EACI,yBAAA;EACA,iBAAA;ACHR;ADMI;EACI,eAAA;EACA,eAAA;ACJR;;ADQA;EACI,eAAA;EACA,eAAA;EACA,sCAAA;ACLJ;;ADQA;EACI,4BAAA;ACLJ;;ADQA;EACI,cAAA;ACLJ;;ADQA;EACI,UAAA;ACLJ;;ADQA;EACI,WAAA;EACA,YAAA;EACA,eAAA;ACLJ;;ADQA;EACI,aAAA;EACA,kBAAA;ACLJ;;ADQA;EACI,oBAAA;EACA,mBAAA;EACA,UAAA;ACLJ;;ADQA;EACI,oBAAA;EACA,2BAAA;EACA,UAAA;ACLJ;;ADQA;EACI,iBAAA;ACLJ;;ADQA;EACI,aAAA;ACLJ;;ADQA;EACI,SAAA;EACA,UAAA;EACA,qBAAA;EACA,gBAAA;ACLJ;;ADQA;EACI,eAAA;EACA,qBAAA;EACA,aAAA;EACA,iBAAA;EACA,eAAA;ACLJ;;ADQA;EACI,aAAA;EACA,kBAAA;EACA,YAAA;EACA,oCAAA;EACA,YAAA;EACA,aAAA;ACLJ;;ADQA;EACI,YAAA;EACA,kBAAA;EACA,kBAAA;EACA,eAAA;EACA,gBAAA;EACA,WAAA;EACA,yBAAA;EACA,YAAA;EACA,YAAA;EACA,eAAA;ACLJ;;ADQA;EACI,aAAA;EACA,kBAAA;EACA,YAAA;EACA,sBAAA;EACA,YAAA;EACA,aAAA;EACA,sBAAA;EACA,kBAAA;EACA,wCAAA;EACA,YAAA;EACA,aAAA;EACA,kBAAA;ACLJ;;ADQA;EACI,UAAA;EACA,iBAAA;EACA,eAAA;EACA,gBAAA;ACLJ;;ADQA;;EAEI,YAAA;EACA,qBAAA;ACLJ","file":"style.css"}
+{"version":3,"sources":["style.scss","style.css"],"names":[],"mappings":"AAAA,kCAAA;AACA;EACI,SAAA;ACCJ;;ADEA,6BAAA;AAEA;EACI,aAAA;EACA,mBAAA;EACA,eAAA;EACA,6BAAA;EACA,oBAAA;EACA,yBAAA;EACA,iBAAA;EACA,iCAAA;EACA,cAAA;ACAJ;;ADGA;EACI,WAAA;EACA,4BAAA;ACAJ;;ADGA;EACI,SAAA;EACA,UAAA;ACAJ;;ADGA;EACI,gBAAA;EACA,qBAAA;ACAJ;;ADGA;EACI,kBAAA;ACAJ;;ADGA,GAAA;AACA;EACI,aAAA;EACA,uBAAA;EACA,mBAAA;EACA,YAAA;EACA,WAAA;EACA,kBAAA;EACA,yBAAA;EACA,sBAAA;EACA,YAAA;EACA,kBAAA;EACA,wCAAA;EACA,eAAA;EACA,kBAAA;ACAJ;ADEI;EACI,yBAAA;ACAR;;ADIA;EACI,oCAAA;ACDJ;;ADIA;EACI,UAAA;ACDJ;;ADIA;EACI,mBAAA;EACA,2BAAA;EACA,yBAAA;EACA,kBAAA;EACA,WAAA;EACA,YAAA;EACA,uBAAA;EACA,kBAAA;EACA,wCAAA;ACDJ;;ADIA;EACI,yBAAA;ACDJ;;ADIA;EACI,YAAA;ACDJ;;ADIA;EACI,aAAA;EACA,YAAA;ACDJ;;ADIA;EACI,aAAA;EACA,YAAA;ACDJ;;ADIA;EACI,aAAA;ACDJ;;ADIA;EACI,cAAA;ACDJ;;ADIA;EACI,UAAA;ACDJ;;ADIA;EACI,WAAA;EACA,YAAA;EACA,eAAA;ACDJ;;ADIA;EACI,aAAA;EACA,kBAAA;ACDJ;;ADIA;;EAEI,oCAAA;EACA,uBAAA;ACDJ;;ADIA;EACI,oBAAA;EACA,mBAAA;EACA,UAAA;ACDJ;;ADIA;EACI,oBAAA;EACA,2BAAA;EACA,UAAA;ACDJ;;ADIA;EACI,iBAAA;ACDJ;;ADIA;EACI,aAAA;ACDJ;;ADIA;EACI,SAAA;EACA,UAAA;EACA,qBAAA;EACA,gBAAA;ACDJ;;ADIA;EACI,aAAA;EACA,kBAAA;EACA,YAAA;EACA,oCAAA;EACA,YAAA;EACA,aAAA;ACDJ;;ADIA;EACI,YAAA;EACA,kBAAA;EACA,kBAAA;EACA,eAAA;EACA,gBAAA;EACA,WAAA;EACA,yBAAA;EACA,YAAA;EACA,YAAA;EACA,eAAA;EACA,aAAA;ACDJ;;ADIA;EACI,aAAA;EACA,kBAAA;EACA,YAAA;EACA,sBAAA;EACA,YAAA;EACA,aAAA;EACA,sBAAA;EACA,kBAAA;EACA,wCAAA;EACA,YAAA;EACA,aAAA;EACA,kBAAA;ACDJ;;ADIA;EACI,UAAA;EACA,iBAAA;EACA,eAAA;EACA,iBAAA;EACA,YAAA;ACDJ;;ADIA;EACI,aAAA;ACDJ;;ADIA;EACI,UAAA;ACDJ;;ADIA;;EAEI,YAAA;EACA,qBAAA;ACDJ;;ADIA;EACI,2BAAA;EACA,eAAA;ACDJ;;ADIA;EACI,eAAA;ACDJ;;ADIA;EACI,eAAA;ACDJ;;ADIA;EACI,eAAA;ACDJ;;ADIA;EACI,qBAAA;ACDJ;;ADIA;EACI,eAAA;ACDJ;;ADIA;EACI,aAAA;ACDJ","file":"style.css"}

public/css/style.min.css

@@ -1 +1 @@
-body{margin:0}.top-tab{height:50px;width:100%}.fa-check{color:green}.fa-bars:before,.fa-navicon:before{padding:3px}.inner{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-evenly;align-items:stretch;align-content:flex-start;max-width:1020px;margin:0 auto}.ref-tab{width:60px;padding-top:65px !important}.tab{margin-bottom:3px}.tab button{display:flex;justify-content:center;align-items:center;height:80px;width:100%;text-align:center;background-color:#f56a6a;color:#fff !important;border:none;border-radius:3px;box-shadow:0 4px 5px rgba(0,0,0,.8);font-size:14px;margin-bottom:3px}.tab button:active{background-color:#7a0016}.activeRef{background-color:#3e8e41 !important}.ref-tab ul{margin:0;padding:0}.ref-tab ul li{list-style:none;list-style-type:none}.ref{width:35%}.ref>div#ref{vertical-align:top;justify-content:start;align-content:start;overflow-y:scroll;width:100%;height:100%;border:#000 solid 1px;border-radius:3px;box-shadow:0 2px 5px rgba(0,0,0,.3)}#passage{width:100px}#newSpeaker{display:none;width:110px}#newSeries{display:none;width:110px}#noteSearch{display:none}#fields-container{display:none}.button{top:10px;right:20px;font-size:16px;cursor:pointer;background-color:#4caf50;color:#fff;border:none;border-radius:5px;box-shadow:0 2px 5px rgba(0,0,0,.6);padding:5px 20px;text-align:center;text-decoration:none;display:inline-block;font-size:16px;margin:4px 2px;transition:all .3s ease-out}.button:hover{background-color:#3e8e41}.button::before{font-size:16px;cursor:pointer}.button::before{font-size:16px;cursor:pointer;transition:transform .5s ease-in-out}.button:hover::before{transform:translateY(-10px)}#fields-container.show{display:block}.notes{width:55%}textarea#notes{width:100%;height:100%;font-size:14pt}#notePreview{display:none;overflow-x:scroll}#note-header-left{display:inline-flex;flex-direction:row;width:25%}#note-header-right{display:inline-flex;flex-direction:row-reverse;width:74%}#note-header-left h2.dirty{color:#ff8c00}#note-list{display:none}#note-list ul{margin:0;padding:0;list-style-type:none;list-style:none}.noteListLinks{cursor:pointer;text-decoration:none;color:purple;font-weight:bold;font-size:16px}div#refQuery{display:none;position:absolute;z-index:100;background-color:rgba(0,0,0,.5);width:400px;height:200px}div#refQuery #search{border:none;border-radius:5px;padding:10px 20px;font-size:16px;line-height:1.5;color:#333;background-color:#f4f4f4;width:150px;height:25px;cursor:pointer}#passage-popup{display:none;position:absolute;z-index:100;background-color:#fff;color:#000;padding:10px;border:1px solid #ccc;border-radius:5px;box-shadow:0 2px 5px rgba(0,0,0,.3);width:300px;height:300px;overflow-x:scroll}#save-check{opacity:0;text-align:right;font-size:20pt;margin-top:15px}#fields-container input,#fields-container select{width:19.5%;display:inline-block}/*# sourceMappingURL=style.min.css.map */
+body{margin:0}.inner{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-evenly;align-items:stretch;align-content:flex-start;max-width:1060px;margin:0 auto}.ref-tab{width:60px;padding-top:75px !important}.ref-tab ul{margin:0;padding:0}.ref-tab ul li{list-style:none;list-style-type:none}.tab{margin-bottom:3px}.tab button{display:flex;justify-content:center;align-items:center;height:80px;width:100%;text-align:center;background-color:#f56a6a;color:#fff !important;border:none;border-radius:3px;box-shadow:0 4px 5px rgba(0,0,0,.8);font-size:14px;margin-bottom:3px}.tab button:active{background-color:#7a0016}.activeRef{background-color:#3e8e41 !important}.ref{width:35%}.ref>div#ref{vertical-align:top;justify-content:flex-start;align-content:flex-start;overflow-y:scroll;width:100%;height:100%;border:#000 solid 1px;border-radius:3px;box-shadow:0 2px 5px rgba(0,0,0,.3)}#ref{padding:3px 3px 3px 10px}#passage{width:100px}#newSpeaker{display:none;width:110px}#newSeries{display:none;width:110px}#fields-container{display:none}#fields-container.show{display:block}.notes{width:55%}textarea#notes{width:100%;height:100%;font-size:14pt}#notePreview{display:none;overflow-x:scroll}#previewBtn.active,#show-hide-btn.active{background-color:#f56a6a !important;color:#fff !important}#note-header-left{display:inline-flex;flex-direction:row;width:25%}#note-header-right{display:inline-flex;flex-direction:row-reverse;width:74%}#note-header-left h2.dirty{color:#ff8c00}#note-list{display:none}#note-list ul{margin:0;padding:0;list-style-type:none;list-style:none}div#refQuery{display:none;position:absolute;z-index:100;background-color:rgba(0,0,0,.8);width:400px;height:200px}div#refQuery #referenceSearch{border:none;border-radius:5px;padding:10px 20px;font-size:16px;line-height:1.5;color:#333;background-color:#f4f4f4;width:150px;height:25px;cursor:pointer;display:none}#passage-popup{display:none;position:absolute;z-index:100;background-color:#fff;color:#000;padding:10px;border:1px solid #ccc;border-radius:5px;box-shadow:0 2px 5px rgba(0,0,0,.3);width:300px;height:300px;overflow-x:scroll}#save-check{opacity:0;text-align:right;font-size:20pt;margin-left:15px;color:green}#save-check.saving{color:orange}#save-check.error{color:red}#fields-container input,#fields-container select{width:19.5%;display:inline-block}#old-notes article p:first-child{margin-bottom:0 !important;font-size:10pt}#old-notes article a{font-size:12pt}#old-notes article p:last-child{font-size:12pt}.inner{padding-left:0}.ref h2{display:inline-block}#ref{font-size:12pt}#referenceBook{display:none}/*# sourceMappingURL=style.min.css.map */

public/css/style.min.css.map

@@ -1 +1 @@
-{"version":3,"sources":["style.scss"],"names":[],"mappings":"AACA,KACI,QAAA,CAGJ,SACI,WAAA,CACA,UAAA,CAKJ,UACI,WAAA,CAGJ,mCAEI,WAAA,CAGJ,OACI,YAAA,CACA,kBAAA,CACA,cAAA,CACA,4BAAA,CACA,mBAAA,CACA,wBAAA,CACA,gBAAA,CAEA,aAAA,CAGJ,SACI,UAAA,CACA,2BAAA,CAGJ,KACI,iBAAA,CAIJ,YACI,YAAA,CACA,sBAAA,CACA,kBAAA,CACA,WAAA,CACA,UAAA,CACA,iBAAA,CACA,wBAAA,CACA,qBAAA,CACA,WAAA,CACA,iBAAA,CACA,mCAAA,CACA,cAAA,CACA,iBAAA,CAEA,mBACI,wBAAA,CAIR,WACI,mCAAA,CAGJ,YACI,QAAA,CACA,SAAA,CAGJ,eACI,eAAA,CACA,oBAAA,CAGJ,KACI,SAAA,CAGJ,aACI,kBAAA,CACA,qBAAA,CACA,mBAAA,CACA,iBAAA,CACA,UAAA,CACA,WAAA,CACA,qBAAA,CACA,iBAAA,CACA,mCAAA,CAGJ,SACI,WAAA,CAGJ,YACI,YAAA,CACA,WAAA,CAGJ,WACI,YAAA,CACA,WAAA,CAGJ,YACI,YAAA,CAGJ,kBACI,YAAA,CAKJ,QACI,QAAA,CACA,UAAA,CACA,cAAA,CACA,cAAA,CACA,wBAAA,CAEA,UAAA,CAEA,WAAA,CACA,iBAAA,CACA,mCAAA,CACA,gBAAA,CACA,iBAAA,CACA,oBAAA,CACA,oBAAA,CACA,cAAA,CACA,cAAA,CAGA,2BAAA,CAEA,cACI,wBAAA,CAIJ,gBACI,cAAA,CACA,cAAA,CAIR,gBACI,cAAA,CACA,cAAA,CACA,oCAAA,CAGJ,sBACI,2BAAA,CAGJ,uBACI,aAAA,CAGJ,OACI,SAAA,CAGJ,eACI,UAAA,CACA,WAAA,CACA,cAAA,CAGJ,aACI,YAAA,CACA,iBAAA,CAGJ,kBACI,mBAAA,CACA,kBAAA,CACA,SAAA,CAGJ,mBACI,mBAAA,CACA,0BAAA,CACA,SAAA,CAGJ,2BACI,aAAA,CAGJ,WACI,YAAA,CAGJ,cACI,QAAA,CACA,SAAA,CACA,oBAAA,CACA,eAAA,CAGJ,eACI,cAAA,CACA,oBAAA,CACA,YAAA,CACA,gBAAA,CACA,cAAA,CAGJ,aACI,YAAA,CACA,iBAAA,CACA,WAAA,CACA,+BAAA,CACA,WAAA,CACA,YAAA,CAGJ,qBACI,WAAA,CACA,iBAAA,CACA,iBAAA,CACA,cAAA,CACA,eAAA,CACA,UAAA,CACA,wBAAA,CACA,WAAA,CACA,WAAA,CACA,cAAA,CAGJ,eACI,YAAA,CACA,iBAAA,CACA,WAAA,CACA,qBAAA,CACA,UAAA,CACA,YAAA,CACA,qBAAA,CACA,iBAAA,CACA,mCAAA,CACA,WAAA,CACA,YAAA,CACA,iBAAA,CAGJ,YACI,SAAA,CACA,gBAAA,CACA,cAAA,CACA,eAAA,CAGJ,iDAEI,WAAA,CACA,oBAAA","file":"style.min.css"}
+{"version":3,"sources":["style.scss"],"names":[],"mappings":"AACA,KACI,QAAA,CAKJ,OACI,YAAA,CACA,kBAAA,CACA,cAAA,CACA,4BAAA,CACA,mBAAA,CACA,wBAAA,CACA,gBAAA,CAEA,aAAA,CAGJ,SACI,UAAA,CACA,2BAAA,CAGJ,YACI,QAAA,CACA,SAAA,CAGJ,eACI,eAAA,CACA,oBAAA,CAGJ,KACI,iBAAA,CAIJ,YACI,YAAA,CACA,sBAAA,CACA,kBAAA,CACA,WAAA,CACA,UAAA,CACA,iBAAA,CACA,wBAAA,CACA,qBAAA,CACA,WAAA,CACA,iBAAA,CACA,mCAAA,CACA,cAAA,CACA,iBAAA,CAEA,mBACI,wBAAA,CAIR,WACI,mCAAA,CAGJ,KACI,SAAA,CAGJ,aACI,kBAAA,CACA,0BAAA,CACA,wBAAA,CACA,iBAAA,CACA,UAAA,CACA,WAAA,CACA,qBAAA,CACA,iBAAA,CACA,mCAAA,CAGJ,KACI,wBAAA,CAGJ,SACI,WAAA,CAGJ,YACI,YAAA,CACA,WAAA,CAGJ,WACI,YAAA,CACA,WAAA,CAGJ,kBACI,YAAA,CAGJ,uBACI,aAAA,CAGJ,OACI,SAAA,CAGJ,eACI,UAAA,CACA,WAAA,CACA,cAAA,CAGJ,aACI,YAAA,CACA,iBAAA,CAGJ,yCAEI,mCAAA,CACA,qBAAA,CAGJ,kBACI,mBAAA,CACA,kBAAA,CACA,SAAA,CAGJ,mBACI,mBAAA,CACA,0BAAA,CACA,SAAA,CAGJ,2BACI,aAAA,CAGJ,WACI,YAAA,CAGJ,cACI,QAAA,CACA,SAAA,CACA,oBAAA,CACA,eAAA,CAGJ,aACI,YAAA,CACA,iBAAA,CACA,WAAA,CACA,+BAAA,CACA,WAAA,CACA,YAAA,CAGJ,8BACI,WAAA,CACA,iBAAA,CACA,iBAAA,CACA,cAAA,CACA,eAAA,CACA,UAAA,CACA,wBAAA,CACA,WAAA,CACA,WAAA,CACA,cAAA,CACA,YAAA,CAGJ,eACI,YAAA,CACA,iBAAA,CACA,WAAA,CACA,qBAAA,CACA,UAAA,CACA,YAAA,CACA,qBAAA,CACA,iBAAA,CACA,mCAAA,CACA,WAAA,CACA,YAAA,CACA,iBAAA,CAGJ,YACI,SAAA,CACA,gBAAA,CACA,cAAA,CACA,gBAAA,CACA,WAAA,CAGJ,mBACI,YAAA,CAGJ,kBACI,SAAA,CAGJ,iDAEI,WAAA,CACA,oBAAA,CAGJ,iCACI,0BAAA,CACA,cAAA,CAGJ,qBACI,cAAA,CAGJ,gCACI,cAAA,CAGJ,OACI,cAAA,CAGJ,QACI,oBAAA,CAGJ,KACI,cAAA,CAGJ,eACI,YAAA","file":"style.min.css"}

public/css/style.scss

@@ -3,22 +3,8 @@ body {
     margin: 0;
 }
 
-.top-tab {
-    height: 50px;
-    width: 100%;
-}
-
 /* Style for hamburger menu */
 
-.fa-check {
-    color: green;
-}
-
-.fa-bars:before,
-.fa-navicon:before {
-    padding: 3px;
-}
-
 .inner {
     display: flex;
     flex-direction: row;
@@ -26,14 +12,24 @@ body {
     justify-content: space-evenly;
     align-items: stretch;
     align-content: flex-start;
-    max-width: 1020px;
+    max-width: 1060px;
     /* Adjust to your desired width */
     margin: 0 auto;
 }
 
 .ref-tab {
     width: 60px;
-    padding-top: 65px !important;
+    padding-top: 75px !important;
+}
+
+.ref-tab ul {
+    margin: 0;
+    padding: 0;
+}
+
+.ref-tab ul li {
+    list-style: none;
+    list-style-type: none;
 }
 
 .tab {
@@ -65,24 +61,14 @@ body {
     background-color: #3e8e41 !important;
 }
 
-.ref-tab ul {
-    margin: 0;
-    padding: 0;
-}
-
-.ref-tab ul li {
-    list-style: none;
-    list-style-type: none;
-}
-
 .ref {
     width: 35%;
 }
 
 .ref>div#ref {
     vertical-align: top;
-    justify-content: start;
-    align-content: start;
+    justify-content: flex-start;
+    align-content: flex-start;
     overflow-y: scroll;
     width: 100%;
     height: 100%;
@@ -91,6 +77,10 @@ body {
     box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
 }
 
+#ref {
+    padding: 3px 3px 3px 10px;
+}
+
 #passage {
     width: 100px;
 }
@@ -105,59 +95,10 @@ body {
     width: 110px;
 }
 
-#noteSearch {
-    display: none;
-}
-
 #fields-container {
     display: none;
 }
 
-#show-hide-btn {}
-
-.button {
-    top: 10px;
-    right: 20px;
-    font-size: 16px;
-    cursor: pointer;
-    background-color: #4CAF50;
-    /* green */
-    color: #fff;
-    /* white */
-    border: none;
-    border-radius: 5px;
-    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.6);
-    padding: 5px 20px;
-    text-align: center;
-    text-decoration: none;
-    display: inline-block;
-    font-size: 16px;
-    margin: 4px 2px;
-    -webkit-transition: all 0.3s ease-out;
-    -moz-transition: all 0.3s ease-out;
-    transition: all 0.3s ease-out;
-
-    &:hover {
-        background-color: #3e8e41;
-        /* darker green */
-    }
-
-    &::before {
-        font-size: 16px;
-        cursor: pointer;
-    }
-}
-
-.button::before {
-    font-size: 16px;
-    cursor: pointer;
-    transition: transform 0.5s ease-in-out;
-}
-
-.button:hover::before {
-    transform: translateY(-10px);
-}
-
 #fields-container.show {
     display: block;
 }
@@ -177,6 +118,12 @@ textarea#notes {
     overflow-x: scroll;
 }
 
+#previewBtn.active,
+#show-hide-btn.active {
+    background-color: #f56a6a !important;
+    color: white !important;
+}
+
 #note-header-left {
     display: inline-flex;
     flex-direction: row;
@@ -204,24 +151,16 @@ textarea#notes {
     list-style: none;
 }
 
-.noteListLinks {
-    cursor: pointer;
-    text-decoration: none;
-    color: purple;
-    font-weight: bold;
-    font-size: 16px;
-}
-
 div#refQuery {
     display: none;
     position: absolute;
     z-index: 100;
-    background-color: rgba(0, 0, 0, 0.5);
+    background-color: rgba(0, 0, 0, 0.8);
     width: 400px;
     height: 200px;
 }
 
-div#refQuery #search {
+div#refQuery #referenceSearch {
     border: none;
     border-radius: 5px;
     padding: 10px 20px;
@@ -232,6 +171,7 @@ div#refQuery #search {
     width: 150px;
     height: 25px;
     cursor: pointer;
+    display: none;
 }
 
 #passage-popup {
@@ -253,11 +193,49 @@ div#refQuery #search {
     opacity: 0;
     text-align: right;
     font-size: 20pt;
-    margin-top: 15px;
+    margin-left: 15px;
+    color: green;
+}
+
+#save-check.saving {
+    color: orange;
+}
+
+#save-check.error {
+    color: red;
 }
 
 #fields-container input,
 #fields-container select {
     width: 19.5%;
     display: inline-block;
+}
+
+#old-notes article p:first-child {
+    margin-bottom: 0 !important;
+    font-size: 10pt;
+}
+
+#old-notes article a {
+    font-size: 12pt;
+}
+
+#old-notes article p:last-child {
+    font-size: 12pt;
+}
+
+.inner {
+    padding-left: 0;
+}
+
+.ref h2 {
+    display: inline-block;
+}
+
+#ref {
+    font-size: 12pt;
+}
+
+#referenceBook {
+    display: none;
 }

public/js/data.js

@@ -1,95 +0,0 @@
-var BOOKS = {
-    "bible": [
-        "Genesis",
-        "Exodus",
-        "Leviticus",
-        "Numbers",
-        "Deuteronomy",
-        "Joshua",
-        "Judges",
-        "Ruth",
-        "1 Samuel",
-        "2 Samuel",
-        "1 Kings",
-        "2 Kings",
-        "1 Chronicles",
-        "2 Chronicles",
-        "Ezra",
-        "Nehemiah",
-        "Esther",
-        "Job",
-        "Psalms",
-        "Proverbs",
-        "Ecclesiastes",
-        "Song of Solomon",
-        "Isaiah",
-        "Jeremiah",
-        "Lamentations",
-        "Ezekiel",
-        "Daniel",
-        "Hosea",
-        "Joel",
-        "Amos",
-        "Obadiah",
-        "Jonah",
-        "Micah",
-        "Nahum",
-        "Habakkuk",
-        "Zephaniah",
-        "Haggai",
-        "Zechariah",
-        "Malachi",
-        "Matthew",
-        "Mark",
-        "Luke",
-        "John",
-        "Acts",
-        "Romans",
-        "1 Corinthians",
-        "2 Corinthians",
-        "Galatians",
-        "Ephesians",
-        "Philippians",
-        "Colossians",
-        "1 Thessalonians",
-        "2 Thessalonians",
-        "1 Timothy",
-        "2 Timothy",
-        "Titus",
-        "Philemon",
-        "Hebrews",
-        "James",
-        "1 Peter",
-        "2 Peter",
-        "1 John",
-        "2 John",
-        "3 John",
-        "Jude",
-        "Revelation"
-    ],
-    "creed": {
-        "apc": "Apostle's Creed",
-        "nc": "Nicene Creed",
-        "atc": "Athanasian Creed",
-        "dc": "Definition of Chalcedon",
-        "fc": "French Confession"
-    },
-    "bc": [
-        1, 37
-    ],
-    "hc": [
-        1, 52
-    ],
-    "cd": [
-        "1", "2", "3", "5", "Conclusion"
-    ],
-    "wcf": [
-        1, 33
-    ],
-    "wsc": [
-        1, 107
-    ],
-    "wlc": [
-        1, 196
-    ]
-};

public/js/script.js

@@ -5,6 +5,23 @@ var tabs = [];
 let saved = false;
 let textDirty = false;
 let saveTimeout = 10000;
+var to = null;
+let controller;
+var BOOKS = {};
+
+fetch('/js/data.json')
+    .then((res) => {
+        if (!res.ok) {
+            throw new Error('HTTP Error: Status: ${res.status}');
+        }
+        return res.json();
+    })
+    .then((data) => {
+        BOOKS = data;
+    })
+    .catch((error) => {
+        console.log(error);
+    })
 
 document.addEventListener('keyup', function (event) {
     if (event.key == "F3") {
@@ -49,12 +66,53 @@ function setHeight() {
     notePreview = document.querySelector('#notePreview');
     notePreview.style.height = (window.innerHeight - 50) + 'px';
 
-    date = document.querySelector('#noteDate');
-    dt = new Date();
-    date.value = dt.getFullYear() + '-' +
-        ((dt.getMonth() < 9) ? '0' + (dt.getMonth() + 1) : (dt.getMonth() + 1)) + '-' +
-        (dt.getDate() < 10 ? '0' + dt.getDate() : dt.getDate());
-    setTimeout(saveNote, saveTimeout);
+    if ($('#noteDate')) {
+        $('#noteDate').datepicker();
+    }
+
+    if ($('#query')) {
+        document.querySelector('#query').addEventListener('keyup', function (event) {
+            if (event.key == "Enter") {
+                search();
+            }
+        });
+    }
+    if (!to) {
+        to = setTimeout(saveNote, saveTimeout);
+    }
+}
+
+function search() {
+    query = document.querySelector('#query').value;
+    fetch('/index.php/search', {
+        method: 'POST',
+        headers: {
+            'Content-Type': 'application/json'
+        },
+        body: JSON.stringify({
+            'query': query
+        })
+    })
+        .then(response => response.json())
+        .then(results => {
+            var oldNotes = document.querySelector('#old-notes');
+            oldNotes.innerHTML = '';
+            for (var n in results) {
+                var link = document.createElement('a');
+                link.href = '#';
+                link.setAttribute('onclick', "retrieveNote('" + results[n].id + "');openNote();");
+                link.innerHTML = results[n].title;
+
+                var p = document.createElement('p');
+                p.innerHTML = results[n].passage;
+
+                var article = document.createElement('article');
+                article.appendChild(link);
+                article.appendChild(p);
+
+                oldNotes.append(article);
+            }
+        });
 }
 
 function newNote() {
@@ -77,7 +135,6 @@ function newNote() {
     document.querySelector('#passage').value = '';
     document.querySelector('#noteId').value = uuidv4();
 
-    //document.querySelector('#noteSearch').style.display = 'none';
     document.querySelector('#ref-list').innerHTML = '';
     document.querySelector('#ref').innerHTML = '';
     document.querySelector('.toggle').click();
@@ -95,10 +152,15 @@ function saveNote(event) {
     }
 
     if (!textDirty || !validateNote()) {
-        setTimeout(saveNote, saveTimeout);
+        clearTimeout(to);
+        to = setTimeout(saveNote, saveTimeout);
         return;
     }
 
+    let saveCheck = document.querySelector('#save-check');
+
+    startSave();
+
     var note = {
         id: document.querySelector("#noteId").value,
         date: document.querySelector('#noteDate').value,
@@ -109,24 +171,40 @@ function saveNote(event) {
         note: document.querySelector('#notes').value,
         refs: references
     };
-    fetch('/index.php/save-note', {
+    $.ajax({
+        url: '/index.php/save-note',
         method: 'POST',
-        headers: {
-            "Content-Type": 'application/json'
-        },
-        body: JSON.stringify(note)
+        contentType: 'application/json',
+        data: JSON.stringify(note),
+        dataType: 'json',
+        timeout: 5000
     })
-        .then(response => response.json())
-        .then(data => {
+        .done(function (data) {
             if (data.msg == 'saved' && !saved) {
+                saveCheck.classList.remove('saving');
                 showSave();
                 saved = true;
                 textDirty = false;
                 document.querySelector('#note-header-left h2').classList.remove('dirty');
+
+                if (data.new) {
+                    document.querySelector('#noteId').value = data.id;
+                }
             }
         })
-        .catch(error => console.log(error))
-        .finally(() => setTimeout(saveNote, saveTimeout));
+        .fail(function (data) {
+            saveCheck.classList.remove('saving');
+            saveCheck.classList.add('error');
+            console.error(data);
+        })
+        .always(function (xhr, status) {
+            if (status == 'timeout') {
+                saveCheck.classList.remove('saving');
+                saveCheck.classList.add('error');
+            }
+            clearTimeout(to);
+            to = setTimeout(saveNote, saveTimeout);
+        });
 }
 
 function validateNote() {
@@ -135,27 +213,28 @@ function validateNote() {
     const speaker = document.querySelector('#speaker');
     const series = document.querySelector('#series');
     const title = document.querySelector('#noteTitle');
-    const id = document.querySelector('#noteId');
     const psg = document.querySelector('#passage');
-    const user = document.querySelector('#user');
 
-    if (!isUuidV4Valid(id.value)) { return false; }
     if (!title.value.length) { return false; }
     if (!date.value) { return false; }
     if (!parseInt(speaker.value)) { return false; }
     if (!parseInt(series.value)) { return false; }
     if (!psg.value) { return false; }
     if (!note.value.length) { return false; }
-    if (!user.value) { return false; }
 
     return true;
 }
 
-function isUuidV4Valid(uuid) {
-    const regex = /^[a-f0-9]{8}-[a-f0-9]{4}-4[a-f0-9]{3}-[8|9|a|b][a-f0-9]{3}-[a-f0-9]{12}$/i;
+function isUuidValid(uuid) {
+    const regex = /^[a-f0-9]{8}-[a-f0-9]{4}-[a-f0-9]{4}-[8|9|a|b][a-f0-9]{3}-[a-f0-9]{12}$/i;
     return regex.test(uuid);
 }
 
+function startSave() {
+    document.querySelector('#save-check').classList.add('saving');
+    document.querySelector('#save-check').style.opacity = 1;
+}
+
 /**
  * Displays a checkmark animation on the screen.
  *
@@ -171,10 +250,10 @@ function showSave() {
     var si = setInterval(function () {
         // Increment the opacity of the checkmark by 0.01 each time
         op = parseFloat(checkmark.style.opacity);
-        checkmark.style.opacity = op + 0.1;
+        checkmark.style.opacity = op - 0.1;
 
         // If the opacity is greater than or equal to 1, reset it back to 0 and stop the animation
-        if (checkmark.style.opacity >= 1) {
+        if (checkmark.style.opacity == 0.1) {
             checkmark.style.opacity = 0;
             clearInterval(si);
             saved = false;
@@ -301,23 +380,36 @@ function openRef(closeSidebar = true) {
 }
 
 function closeRef() {
-    refQuery = document.querySelector('#refQuery');
-    refQuery.style.display = 'none';
+    document.querySelector('#referenceSearch').value = '';
+    document.querySelector('#referenceSearch').style.display = '';
+    document.querySelector('#referenceType').value = '';
+    document.querySelector('#referenceBook').value = '';
+    document.querySelector('#referenceBook').style.display = 'none';
+    document.querySelector('#chapter-range').innerText = '';
+    document.querySelector('#verse-range').innerText = '';
+
+    document.querySelector('#refQuery').style.display = 'none';
 }
 
-function queryRef() {
-    var input = document.querySelector('#refQuery #search');
-    var type = document.querySelector('#referenceType');
-    var book = document.querySelector('#referenceBook');
+function queryRef(type = null, book = null, input = null) {
+    if (!input) {
+        var input = document.querySelector('#refQuery #referenceSearch').value;
+    }
+    if (!type) {
+        var type = document.querySelector('#referenceType').value;
+    }
+    if (!book) {
+        var book = document.querySelector('#referenceBook').value;
+    }
     fetch('/index.php/retrieve-reference', {
         method: 'POST',
         headers: {
             'Content-Type': 'application/json'
         },
         body: JSON.stringify({
-            'type': type.value,
-            'book': book.value,
-            'reference': input.value,
+            'type': type,
+            'book': book,
+            'reference': input,
         })
     })
         .then(response => response.json())
@@ -334,10 +426,6 @@ function queryRef() {
 
             references[results.title] = results.text;
 
-            input.value = '';
-            document.querySelector('#referenceType').value = '';
-            document.querySelector('#referenceBook').value = '';
-            document.querySelector('#referenceBook').style.display = 'none';
             closeRef();
 
             saved = false;
@@ -430,21 +518,23 @@ function toggleFields() {
     const showHideBtn = document.getElementById('show-hide-btn');
 
     if (fieldsContainer.classList.contains('show')) {
-        // Hide the fields when the button says "Show Fields"
         fieldsContainer.classList.remove('show');
         fieldsContainer.style.display = 'none';
-        showHideBtn.textContent = 'Show';
+        showHideBtn.classList.remove('active');
     } else {
-        // Show the fields when the button says "Hide Fields"
         fieldsContainer.classList.add('show');
         fieldsContainer.style.display = 'block';
-        showHideBtn.textContent = 'Hide';
+        showHideBtn.classList.add('active');
     }
 
     setHeight();
 }
 
 function retrieveBooks() {
+    document.querySelector('#chapter-range').innerText = '';
+    document.querySelector('#verse-range').innerText = '';
+    document.querySelector('#referenceSearch').value = '';
+    document.querySelector('#referenceSearch').style.display = 'none';
     const selectedType = document.querySelector('#referenceType').value;
     if (!selectedType) { return; }
 
@@ -452,13 +542,14 @@ function retrieveBooks() {
     bookList.style.display = "block";
     bookList.innerHTML = '';
     if (selectedType == 'bible') {
+        document.querySelector('#referenceSearch').style.display = 'block';
         var none = document.createElement("option");
         none.value = '';
         none.text = '-- Select --';
         bookList.appendChild(none);
         for (var x in BOOKS.bible) {
             var newBook = document.createElement("option");
-            newBook.text = BOOKS.bible[x];
+            newBook.text = x;
             bookList.appendChild(newBook);
         }
     } else if (selectedType == 'creed') {
@@ -498,6 +589,39 @@ function retrieveBooks() {
     }
 }
 
+function filterBooks() {
+    document.querySelector('#chapter-range').innerText = '';
+    document.querySelector('#verse-range').innerText = '';
+    if (document.querySelector('#referenceType').value != 'bible') {
+        return;
+    }
+
+    var bookList = document.querySelector('#referenceBook');
+    var book = BOOKS.bible[bookList.value];
+    var max = Object.keys(book).length;
+
+    var chapterRange = document.querySelector('#chapter-range');
+    chapterRange.innerText = 'Chapters: ' + max;
+}
+
+function filterVerse() {
+    if (document.querySelector('#referenceType').value != 'bible') {
+        return;
+    }
+
+    var bookList = document.querySelector('#referenceBook').value;
+    var search = document.querySelector('#referenceSearch').value;
+    var chapter = search.split(':')[0];
+    var verseRange = document.querySelector('#verse-range');
+
+    if (!BOOKS.bible[bookList] || !BOOKS.bible[bookList][chapter]) {
+        verseRange.innerText = 'Unknown Chapter';
+        return;
+    }
+    var verse = BOOKS.bible[bookList][chapter];
+    verseRange.innerText = 'Verse: ' + verse;
+}
+
 function retrieveReference(el) {
     fetch('/index.php/get-reference', {
         method: "POST",
@@ -551,14 +675,14 @@ function previewNote() {
 
     notePreview.innerHTML = md.render(markdownPreview);
 
-    if (previewButton.value == 'Preview') {
-        previewButton.value = 'Hide Preview';
-        noteText.style.display = 'none';
-        notePreview.style.display = 'block';
-    } else {
-        previewButton.value = 'Preview';
+    if (previewButton.classList.contains('active')) {
         noteText.style.display = 'block';
         notePreview.style.display = 'none';
+        previewButton.classList.remove('active');
+    } else {
+        noteText.style.display = 'none';
+        notePreview.style.display = 'block';
+        previewButton.classList.add('active');
     }
 
     findLinks();
@@ -568,9 +692,9 @@ function findLinks() {
     var links = document.querySelector('#notePreview').querySelectorAll('a');
 
     for (var i = 0; i < links.length; i++) {
-        links[i].addEventListener('mouseover', function (e) {
+        links[i].addEventListener('click', function (e) {
             e.preventDefault();
-            if (!this.href.contains('notes\.rkprather\.com')) {
+            if (!this.href.includes('get-passage')) {
                 return;
             }
             var passage = this.href.split('/');
@@ -599,7 +723,7 @@ function findLinks() {
                     showPassage(
                         e,
                         "<button onclick='closePopup()'>Close</button>&nbsp;&nbsp;" +
-                        "<button onclick=\"getRef('" + book + "', '" + cv + "')\">Open Ref</button><br/>" +
+                        "<button onclick=\"queryRef('bible', '" + book + "', '" + cv + "')\">Open Ref</button><br/>" +
                         result);
                 });
         });
@@ -610,9 +734,9 @@ function findRefLinks() {
     var links = document.querySelector('#ref').querySelectorAll('a');
 
     for (var i = 0; i < links.length; i++) {
-        links[i].addEventListener('mouseover', function (e) {
+        links[i].addEventListener('click', function (e) {
             e.preventDefault();
-            if (!this.href.contains('get-passage')) {
+            if (!this.href.includes('get-passage')) {
                 return;
             }
             var passage = this.href.split('/');
@@ -641,7 +765,7 @@ function findRefLinks() {
                     showPassage(
                         e,
                         "<button onclick='closePopup()'>Close</button>&nbsp;&nbsp;" +
-                        "<button onclick=\"getRef('" + book + "', '" + cv + "')\">Open Ref</button><br/>" +
+                        "<button onclick=\"queryRef('bible', '" + book + "', '" + cv + "')\">Open Ref</button><br/>" +
                         result);
                 });
         });
@@ -654,8 +778,8 @@ function showPassage(event, text) {
     popup.innerHTML = md.render(text);
 
     // Position the popup relative to the cursor
-    let x = event.clientX + window.pageXOffset;
-    let y = event.clientY + window.pageYOffset;
+    let x = event.clientX + window.scrollX;
+    let y = event.clientY + window.scrollY;
 
     // Set the position of the popup element
     popup.style.top = `${y}px`;
@@ -669,7 +793,7 @@ function closePopup() {
     popup.style.display = 'none';
 }
 
-function openNote() {
+function openNote(openSidebar = true) {
     const noteList = document.querySelector('#note-list');
     const refs = document.querySelector('#ref');
 
@@ -681,10 +805,12 @@ function openNote() {
         refs.style.display = 'none';
     }
 
-    document.querySelector('.toggle').click();
+    if (openSidebar) {
+        document.querySelector('.toggle').click();
+    }
 }
 
-function retrieveNote(id) {
+function retrieveNote(id, runOpen = true) {
     fetch('/index.php/get-note', {
         method: 'POST',
         header: {
@@ -696,23 +822,26 @@ function retrieveNote(id) {
     })
         .then(response => response.json())
         .then(result => {
-            var dt = new Date(result.date);
+            var dt = new Date(result.date.date);
 
             document.querySelector('#notes').value = result.text;
             document.querySelector('#passage').value = result.passage;
             document.querySelector('#series').value = result.series.id;
             document.querySelector('#speaker').value = result.speaker.id;
             document.querySelector('#noteTitle').value = result.title;
-            document.querySelector('#noteDate').value = dt.getFullYear() + '-' +
-                (dt.getMonth() < 9 ? '0' + (dt.getMonth() + 1) : (dt.getMonth() + 1)) + '-' +
-                (dt.getDate() < 10 ? '0' + dt.getDate() : dt.getDate());
+            document.querySelector('#noteDate').value = '';
+            document.querySelector('#noteDate').value =
+                (dt.getMonth() < 9 ? '0' + (dt.getMonth() + 1) : (dt.getMonth() + 1)) + '/' +
+                (dt.getDate() < 10 ? '0' + dt.getDate() : dt.getDate()) + '/' +
+                dt.getFullYear();
             document.querySelector('#noteId').value = result.id;
 
-            if (result.references) {
-                references = result.references;
+            if (result.refs) {
+                references = result.refs;
             }
 
             const list = document.querySelector('#ref-list');
+            list.innerHTML = '';
             var newList = null;
             for (var x in references) {
                 var newList = document.createElement('li');
@@ -722,7 +851,9 @@ function retrieveNote(id) {
                 list.appendChild(newList);
             }
 
-            openNote();
+            if (runOpen) {
+                openNote(false);
+            }
         });
 }
 

public/theme/assets/css/jquery-ui.structure.css

@@ -0,0 +1,886 @@
+/*!
+ * jQuery UI CSS Framework 1.13.3
+ * https://jqueryui.com
+ *
+ * Copyright OpenJS Foundation and other contributors
+ * Released under the MIT license.
+ * https://jquery.org/license
+ *
+ * https://api.jqueryui.com/category/theming/
+ */
+.ui-draggable-handle {
+	-ms-touch-action: none;
+	touch-action: none;
+}
+/* Layout helpers
+----------------------------------*/
+.ui-helper-hidden {
+	display: none;
+}
+.ui-helper-hidden-accessible {
+	border: 0;
+	clip: rect(0 0 0 0);
+	height: 1px;
+	margin: -1px;
+	overflow: hidden;
+	padding: 0;
+	position: absolute;
+	width: 1px;
+}
+.ui-helper-reset {
+	margin: 0;
+	padding: 0;
+	border: 0;
+	outline: 0;
+	line-height: 1.3;
+	text-decoration: none;
+	font-size: 100%;
+	list-style: none;
+}
+.ui-helper-clearfix:before,
+.ui-helper-clearfix:after {
+	content: "";
+	display: table;
+	border-collapse: collapse;
+}
+.ui-helper-clearfix:after {
+	clear: both;
+}
+.ui-helper-zfix {
+	width: 100%;
+	height: 100%;
+	top: 0;
+	left: 0;
+	position: absolute;
+	opacity: 0;
+	-ms-filter: "alpha(opacity=0)"; /* support: IE8 */
+}
+
+.ui-front {
+	z-index: 100;
+}
+
+
+/* Interaction Cues
+----------------------------------*/
+.ui-state-disabled {
+	cursor: default !important;
+	pointer-events: none;
+}
+
+
+/* Icons
+----------------------------------*/
+.ui-icon {
+	display: inline-block;
+	vertical-align: middle;
+	margin-top: -.25em;
+	position: relative;
+	text-indent: -99999px;
+	overflow: hidden;
+	background-repeat: no-repeat;
+}
+
+.ui-widget-icon-block {
+	left: 50%;
+	margin-left: -8px;
+	display: block;
+}
+
+/* Misc visuals
+----------------------------------*/
+
+/* Overlays */
+.ui-widget-overlay {
+	position: fixed;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
+}
+.ui-resizable {
+	position: relative;
+}
+.ui-resizable-handle {
+	position: absolute;
+	font-size: 0.1px;
+	display: block;
+	-ms-touch-action: none;
+	touch-action: none;
+}
+.ui-resizable-disabled .ui-resizable-handle,
+.ui-resizable-autohide .ui-resizable-handle {
+	display: none;
+}
+.ui-resizable-n {
+	cursor: n-resize;
+	height: 7px;
+	width: 100%;
+	top: -5px;
+	left: 0;
+}
+.ui-resizable-s {
+	cursor: s-resize;
+	height: 7px;
+	width: 100%;
+	bottom: -5px;
+	left: 0;
+}
+.ui-resizable-e {
+	cursor: e-resize;
+	width: 7px;
+	right: -5px;
+	top: 0;
+	height: 100%;
+}
+.ui-resizable-w {
+	cursor: w-resize;
+	width: 7px;
+	left: -5px;
+	top: 0;
+	height: 100%;
+}
+.ui-resizable-se {
+	cursor: se-resize;
+	width: 12px;
+	height: 12px;
+	right: 1px;
+	bottom: 1px;
+}
+.ui-resizable-sw {
+	cursor: sw-resize;
+	width: 9px;
+	height: 9px;
+	left: -5px;
+	bottom: -5px;
+}
+.ui-resizable-nw {
+	cursor: nw-resize;
+	width: 9px;
+	height: 9px;
+	left: -5px;
+	top: -5px;
+}
+.ui-resizable-ne {
+	cursor: ne-resize;
+	width: 9px;
+	height: 9px;
+	right: -5px;
+	top: -5px;
+}
+.ui-selectable {
+	-ms-touch-action: none;
+	touch-action: none;
+}
+.ui-selectable-helper {
+	position: absolute;
+	z-index: 100;
+	border: 1px dotted black;
+}
+.ui-sortable-handle {
+	-ms-touch-action: none;
+	touch-action: none;
+}
+.ui-accordion .ui-accordion-header {
+	display: block;
+	cursor: pointer;
+	position: relative;
+	margin: 2px 0 0 0;
+	padding: .5em .5em .5em .7em;
+	font-size: 100%;
+}
+.ui-accordion .ui-accordion-content {
+	padding: 1em 2.2em;
+	border-top: 0;
+	overflow: auto;
+}
+.ui-autocomplete {
+	position: absolute;
+	top: 0;
+	left: 0;
+	cursor: default;
+}
+.ui-menu {
+	list-style: none;
+	padding: 0;
+	margin: 0;
+	display: block;
+	outline: 0;
+}
+.ui-menu .ui-menu {
+	position: absolute;
+}
+.ui-menu .ui-menu-item {
+	margin: 0;
+	cursor: pointer;
+	/* support: IE10, see #8844 */
+	list-style-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7");
+}
+.ui-menu .ui-menu-item-wrapper {
+	position: relative;
+	padding: 3px 1em 3px .4em;
+}
+.ui-menu .ui-menu-divider {
+	margin: 5px 0;
+	height: 0;
+	font-size: 0;
+	line-height: 0;
+	border-width: 1px 0 0 0;
+}
+.ui-menu .ui-state-focus,
+.ui-menu .ui-state-active {
+	margin: -1px;
+}
+
+/* icon support */
+.ui-menu-icons {
+	position: relative;
+}
+.ui-menu-icons .ui-menu-item-wrapper {
+	padding-left: 2em;
+}
+
+/* left-aligned */
+.ui-menu .ui-icon {
+	position: absolute;
+	top: 0;
+	bottom: 0;
+	left: .2em;
+	margin: auto 0;
+}
+
+/* right-aligned */
+.ui-menu .ui-menu-icon {
+	left: auto;
+	right: 0;
+}
+.ui-button {
+	padding: .4em 1em;
+	display: inline-block;
+	position: relative;
+	line-height: normal;
+	margin-right: .1em;
+	cursor: pointer;
+	vertical-align: middle;
+	text-align: center;
+	-webkit-user-select: none;
+	-moz-user-select: none;
+	-ms-user-select: none;
+	user-select: none;
+
+	/* Support: IE <= 11 */
+	overflow: visible;
+}
+
+.ui-button,
+.ui-button:link,
+.ui-button:visited,
+.ui-button:hover,
+.ui-button:active {
+	text-decoration: none;
+}
+
+/* to make room for the icon, a width needs to be set here */
+.ui-button-icon-only {
+	width: 2em;
+	box-sizing: border-box;
+	text-indent: -9999px;
+	white-space: nowrap;
+}
+
+/* no icon support for input elements */
+input.ui-button.ui-button-icon-only {
+	text-indent: 0;
+}
+
+/* button icon element(s) */
+.ui-button-icon-only .ui-icon {
+	position: absolute;
+	top: 50%;
+	left: 50%;
+	margin-top: -8px;
+	margin-left: -8px;
+}
+
+.ui-button.ui-icon-notext .ui-icon {
+	padding: 0;
+	width: 2.1em;
+	height: 2.1em;
+	text-indent: -9999px;
+	white-space: nowrap;
+
+}
+
+input.ui-button.ui-icon-notext .ui-icon {
+	width: auto;
+	height: auto;
+	text-indent: 0;
+	white-space: normal;
+	padding: .4em 1em;
+}
+
+/* workarounds */
+/* Support: Firefox 5 - 40 */
+input.ui-button::-moz-focus-inner,
+button.ui-button::-moz-focus-inner {
+	border: 0;
+	padding: 0;
+}
+.ui-controlgroup {
+	vertical-align: middle;
+	display: inline-block;
+}
+.ui-controlgroup > .ui-controlgroup-item {
+	float: left;
+	margin-left: 0;
+	margin-right: 0;
+}
+.ui-controlgroup > .ui-controlgroup-item:focus,
+.ui-controlgroup > .ui-controlgroup-item.ui-visual-focus {
+	z-index: 9999;
+}
+.ui-controlgroup-vertical > .ui-controlgroup-item {
+	display: block;
+	float: none;
+	width: 100%;
+	margin-top: 0;
+	margin-bottom: 0;
+	text-align: left;
+}
+.ui-controlgroup-vertical .ui-controlgroup-item {
+	box-sizing: border-box;
+}
+.ui-controlgroup .ui-controlgroup-label {
+	padding: .4em 1em;
+}
+.ui-controlgroup .ui-controlgroup-label span {
+	font-size: 80%;
+}
+.ui-controlgroup-horizontal .ui-controlgroup-label + .ui-controlgroup-item {
+	border-left: none;
+}
+.ui-controlgroup-vertical .ui-controlgroup-label + .ui-controlgroup-item {
+	border-top: none;
+}
+.ui-controlgroup-horizontal .ui-controlgroup-label.ui-widget-content {
+	border-right: none;
+}
+.ui-controlgroup-vertical .ui-controlgroup-label.ui-widget-content {
+	border-bottom: none;
+}
+
+/* Spinner specific style fixes */
+.ui-controlgroup-vertical .ui-spinner-input {
+
+	/* Support: IE8 only, Android < 4.4 only */
+	width: 75%;
+	width: calc( 100% - 2.4em );
+}
+.ui-controlgroup-vertical .ui-spinner .ui-spinner-up {
+	border-top-style: solid;
+}
+
+.ui-checkboxradio-label .ui-icon-background {
+	box-shadow: inset 1px 1px 1px #ccc;
+	border-radius: .12em;
+	border: none;
+}
+.ui-checkboxradio-radio-label .ui-icon-background {
+	width: 16px;
+	height: 16px;
+	border-radius: 1em;
+	overflow: visible;
+	border: none;
+}
+.ui-checkboxradio-radio-label.ui-checkboxradio-checked .ui-icon,
+.ui-checkboxradio-radio-label.ui-checkboxradio-checked:hover .ui-icon {
+	background-image: none;
+	width: 8px;
+	height: 8px;
+	border-width: 4px;
+	border-style: solid;
+}
+.ui-checkboxradio-disabled {
+	pointer-events: none;
+}
+.ui-datepicker {
+	width: 17em;
+	padding: .2em .2em 0;
+	display: none;
+}
+.ui-datepicker .ui-datepicker-header {
+	position: relative;
+	padding: .2em 0;
+}
+.ui-datepicker .ui-datepicker-prev,
+.ui-datepicker .ui-datepicker-next {
+	position: absolute;
+	top: 2px;
+	width: 1.8em;
+	height: 1.8em;
+}
+.ui-datepicker .ui-datepicker-prev-hover,
+.ui-datepicker .ui-datepicker-next-hover {
+	top: 1px;
+}
+.ui-datepicker .ui-datepicker-prev {
+	left: 2px;
+}
+.ui-datepicker .ui-datepicker-next {
+	right: 2px;
+}
+.ui-datepicker .ui-datepicker-prev-hover {
+	left: 1px;
+}
+.ui-datepicker .ui-datepicker-next-hover {
+	right: 1px;
+}
+.ui-datepicker .ui-datepicker-prev span,
+.ui-datepicker .ui-datepicker-next span {
+	display: block;
+	position: absolute;
+	left: 50%;
+	margin-left: -8px;
+	top: 50%;
+	margin-top: -8px;
+}
+.ui-datepicker .ui-datepicker-title {
+	margin: 0 2.3em;
+	line-height: 1.8em;
+	text-align: center;
+}
+.ui-datepicker .ui-datepicker-title select {
+	font-size: 1em;
+	margin: 1px 0;
+}
+.ui-datepicker select.ui-datepicker-month,
+.ui-datepicker select.ui-datepicker-year {
+	width: 45%;
+}
+.ui-datepicker table {
+	width: 100%;
+	font-size: .9em;
+	border-collapse: collapse;
+	margin: 0 0 .4em;
+}
+.ui-datepicker th {
+	padding: .7em .3em;
+	text-align: center;
+	font-weight: bold;
+	border: 0;
+}
+.ui-datepicker td {
+	border: 0;
+	padding: 1px;
+}
+.ui-datepicker td span,
+.ui-datepicker td a {
+	display: block;
+	padding: .2em;
+	text-align: right;
+	text-decoration: none;
+}
+.ui-datepicker .ui-datepicker-buttonpane {
+	background-image: none;
+	margin: .7em 0 0 0;
+	padding: 0 .2em;
+	border-left: 0;
+	border-right: 0;
+	border-bottom: 0;
+}
+.ui-datepicker .ui-datepicker-buttonpane button {
+	float: right;
+	margin: .5em .2em .4em;
+	cursor: pointer;
+	padding: .2em .6em .3em .6em;
+	width: auto;
+	overflow: visible;
+}
+.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
+	float: left;
+}
+
+/* with multiple calendars */
+.ui-datepicker.ui-datepicker-multi {
+	width: auto;
+}
+.ui-datepicker-multi .ui-datepicker-group {
+	float: left;
+}
+.ui-datepicker-multi .ui-datepicker-group table {
+	width: 95%;
+	margin: 0 auto .4em;
+}
+.ui-datepicker-multi-2 .ui-datepicker-group {
+	width: 50%;
+}
+.ui-datepicker-multi-3 .ui-datepicker-group {
+	width: 33.3%;
+}
+.ui-datepicker-multi-4 .ui-datepicker-group {
+	width: 25%;
+}
+.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header,
+.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {
+	border-left-width: 0;
+}
+.ui-datepicker-multi .ui-datepicker-buttonpane {
+	clear: left;
+}
+.ui-datepicker-row-break {
+	clear: both;
+	width: 100%;
+	font-size: 0;
+}
+
+/* RTL support */
+.ui-datepicker-rtl {
+	direction: rtl;
+}
+.ui-datepicker-rtl .ui-datepicker-prev {
+	right: 2px;
+	left: auto;
+}
+.ui-datepicker-rtl .ui-datepicker-next {
+	left: 2px;
+	right: auto;
+}
+.ui-datepicker-rtl .ui-datepicker-prev:hover {
+	right: 1px;
+	left: auto;
+}
+.ui-datepicker-rtl .ui-datepicker-next:hover {
+	left: 1px;
+	right: auto;
+}
+.ui-datepicker-rtl .ui-datepicker-buttonpane {
+	clear: right;
+}
+.ui-datepicker-rtl .ui-datepicker-buttonpane button {
+	float: left;
+}
+.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current,
+.ui-datepicker-rtl .ui-datepicker-group {
+	float: right;
+}
+.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header,
+.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header {
+	border-right-width: 0;
+	border-left-width: 1px;
+}
+
+/* Icons */
+.ui-datepicker .ui-icon {
+	display: block;
+	text-indent: -99999px;
+	overflow: hidden;
+	background-repeat: no-repeat;
+	left: .5em;
+	top: .3em;
+}
+.ui-dialog {
+	position: absolute;
+	top: 0;
+	left: 0;
+	padding: .2em;
+	outline: 0;
+}
+.ui-dialog .ui-dialog-titlebar {
+	padding: .4em 1em;
+	position: relative;
+}
+.ui-dialog .ui-dialog-title {
+	float: left;
+	margin: .1em 0;
+	white-space: nowrap;
+	width: 90%;
+	overflow: hidden;
+	text-overflow: ellipsis;
+}
+.ui-dialog .ui-dialog-titlebar-close {
+	position: absolute;
+	right: .3em;
+	top: 50%;
+	width: 20px;
+	margin: -10px 0 0 0;
+	padding: 1px;
+	height: 20px;
+}
+.ui-dialog .ui-dialog-content {
+	position: relative;
+	border: 0;
+	padding: .5em 1em;
+	background: none;
+	overflow: auto;
+}
+.ui-dialog .ui-dialog-buttonpane {
+	text-align: left;
+	border-width: 1px 0 0 0;
+	background-image: none;
+	margin-top: .5em;
+	padding: .3em 1em .5em .4em;
+}
+.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
+	float: right;
+}
+.ui-dialog .ui-dialog-buttonpane button {
+	margin: .5em .4em .5em 0;
+	cursor: pointer;
+}
+.ui-dialog .ui-resizable-n {
+	height: 2px;
+	top: 0;
+}
+.ui-dialog .ui-resizable-e {
+	width: 2px;
+	right: 0;
+}
+.ui-dialog .ui-resizable-s {
+	height: 2px;
+	bottom: 0;
+}
+.ui-dialog .ui-resizable-w {
+	width: 2px;
+	left: 0;
+}
+.ui-dialog .ui-resizable-se,
+.ui-dialog .ui-resizable-sw,
+.ui-dialog .ui-resizable-ne,
+.ui-dialog .ui-resizable-nw {
+	width: 7px;
+	height: 7px;
+}
+.ui-dialog .ui-resizable-se {
+	right: 0;
+	bottom: 0;
+}
+.ui-dialog .ui-resizable-sw {
+	left: 0;
+	bottom: 0;
+}
+.ui-dialog .ui-resizable-ne {
+	right: 0;
+	top: 0;
+}
+.ui-dialog .ui-resizable-nw {
+	left: 0;
+	top: 0;
+}
+.ui-draggable .ui-dialog-titlebar {
+	cursor: move;
+}
+.ui-progressbar {
+	height: 2em;
+	text-align: left;
+	overflow: hidden;
+}
+.ui-progressbar .ui-progressbar-value {
+	margin: -1px;
+	height: 100%;
+}
+.ui-progressbar .ui-progressbar-overlay {
+	background: url("data:image/gif;base64,R0lGODlhKAAoAIABAAAAAP///yH/C05FVFNDQVBFMi4wAwEAAAAh+QQJAQABACwAAAAAKAAoAAACkYwNqXrdC52DS06a7MFZI+4FHBCKoDeWKXqymPqGqxvJrXZbMx7Ttc+w9XgU2FB3lOyQRWET2IFGiU9m1frDVpxZZc6bfHwv4c1YXP6k1Vdy292Fb6UkuvFtXpvWSzA+HycXJHUXiGYIiMg2R6W459gnWGfHNdjIqDWVqemH2ekpObkpOlppWUqZiqr6edqqWQAAIfkECQEAAQAsAAAAACgAKAAAApSMgZnGfaqcg1E2uuzDmmHUBR8Qil95hiPKqWn3aqtLsS18y7G1SzNeowWBENtQd+T1JktP05nzPTdJZlR6vUxNWWjV+vUWhWNkWFwxl9VpZRedYcflIOLafaa28XdsH/ynlcc1uPVDZxQIR0K25+cICCmoqCe5mGhZOfeYSUh5yJcJyrkZWWpaR8doJ2o4NYq62lAAACH5BAkBAAEALAAAAAAoACgAAAKVDI4Yy22ZnINRNqosw0Bv7i1gyHUkFj7oSaWlu3ovC8GxNso5fluz3qLVhBVeT/Lz7ZTHyxL5dDalQWPVOsQWtRnuwXaFTj9jVVh8pma9JjZ4zYSj5ZOyma7uuolffh+IR5aW97cHuBUXKGKXlKjn+DiHWMcYJah4N0lYCMlJOXipGRr5qdgoSTrqWSq6WFl2ypoaUAAAIfkECQEAAQAsAAAAACgAKAAAApaEb6HLgd/iO7FNWtcFWe+ufODGjRfoiJ2akShbueb0wtI50zm02pbvwfWEMWBQ1zKGlLIhskiEPm9R6vRXxV4ZzWT2yHOGpWMyorblKlNp8HmHEb/lCXjcW7bmtXP8Xt229OVWR1fod2eWqNfHuMjXCPkIGNileOiImVmCOEmoSfn3yXlJWmoHGhqp6ilYuWYpmTqKUgAAIfkECQEAAQAsAAAAACgAKAAAApiEH6kb58biQ3FNWtMFWW3eNVcojuFGfqnZqSebuS06w5V80/X02pKe8zFwP6EFWOT1lDFk8rGERh1TTNOocQ61Hm4Xm2VexUHpzjymViHrFbiELsefVrn6XKfnt2Q9G/+Xdie499XHd2g4h7ioOGhXGJboGAnXSBnoBwKYyfioubZJ2Hn0RuRZaflZOil56Zp6iioKSXpUAAAh+QQJAQABACwAAAAAKAAoAAACkoQRqRvnxuI7kU1a1UU5bd5tnSeOZXhmn5lWK3qNTWvRdQxP8qvaC+/yaYQzXO7BMvaUEmJRd3TsiMAgswmNYrSgZdYrTX6tSHGZO73ezuAw2uxuQ+BbeZfMxsexY35+/Qe4J1inV0g4x3WHuMhIl2jXOKT2Q+VU5fgoSUI52VfZyfkJGkha6jmY+aaYdirq+lQAACH5BAkBAAEALAAAAAAoACgAAAKWBIKpYe0L3YNKToqswUlvznigd4wiR4KhZrKt9Upqip61i9E3vMvxRdHlbEFiEXfk9YARYxOZZD6VQ2pUunBmtRXo1Lf8hMVVcNl8JafV38aM2/Fu5V16Bn63r6xt97j09+MXSFi4BniGFae3hzbH9+hYBzkpuUh5aZmHuanZOZgIuvbGiNeomCnaxxap2upaCZsq+1kAACH5BAkBAAEALAAAAAAoACgAAAKXjI8By5zf4kOxTVrXNVlv1X0d8IGZGKLnNpYtm8Lr9cqVeuOSvfOW79D9aDHizNhDJidFZhNydEahOaDH6nomtJjp1tutKoNWkvA6JqfRVLHU/QUfau9l2x7G54d1fl995xcIGAdXqMfBNadoYrhH+Mg2KBlpVpbluCiXmMnZ2Sh4GBqJ+ckIOqqJ6LmKSllZmsoq6wpQAAAh+QQJAQABACwAAAAAKAAoAAAClYx/oLvoxuJDkU1a1YUZbJ59nSd2ZXhWqbRa2/gF8Gu2DY3iqs7yrq+xBYEkYvFSM8aSSObE+ZgRl1BHFZNr7pRCavZ5BW2142hY3AN/zWtsmf12p9XxxFl2lpLn1rseztfXZjdIWIf2s5dItwjYKBgo9yg5pHgzJXTEeGlZuenpyPmpGQoKOWkYmSpaSnqKileI2FAAACH5BAkBAAEALAAAAAAoACgAAAKVjB+gu+jG4kORTVrVhRlsnn2dJ3ZleFaptFrb+CXmO9OozeL5VfP99HvAWhpiUdcwkpBH3825AwYdU8xTqlLGhtCosArKMpvfa1mMRae9VvWZfeB2XfPkeLmm18lUcBj+p5dnN8jXZ3YIGEhYuOUn45aoCDkp16hl5IjYJvjWKcnoGQpqyPlpOhr3aElaqrq56Bq7VAAAOw==");
+	height: 100%;
+	-ms-filter: "alpha(opacity=25)"; /* support: IE8 */
+	opacity: 0.25;
+}
+.ui-progressbar-indeterminate .ui-progressbar-value {
+	background-image: none;
+}
+.ui-selectmenu-menu {
+	padding: 0;
+	margin: 0;
+	position: absolute;
+	top: 0;
+	left: 0;
+	display: none;
+}
+.ui-selectmenu-menu .ui-menu {
+	overflow: auto;
+	overflow-x: hidden;
+	padding-bottom: 1px;
+}
+.ui-selectmenu-menu .ui-menu .ui-selectmenu-optgroup {
+	font-size: 1em;
+	font-weight: bold;
+	line-height: 1.5;
+	padding: 2px 0.4em;
+	margin: 0.5em 0 0 0;
+	height: auto;
+	border: 0;
+}
+.ui-selectmenu-open {
+	display: block;
+}
+.ui-selectmenu-text {
+	display: block;
+	margin-right: 20px;
+	overflow: hidden;
+	text-overflow: ellipsis;
+}
+.ui-selectmenu-button.ui-button {
+	text-align: left;
+	white-space: nowrap;
+	width: 14em;
+}
+.ui-selectmenu-icon.ui-icon {
+	float: right;
+	margin-top: 0;
+}
+.ui-slider {
+	position: relative;
+	text-align: left;
+}
+.ui-slider .ui-slider-handle {
+	position: absolute;
+	z-index: 2;
+	width: 1.2em;
+	height: 1.2em;
+	cursor: pointer;
+	-ms-touch-action: none;
+	touch-action: none;
+}
+.ui-slider .ui-slider-range {
+	position: absolute;
+	z-index: 1;
+	font-size: .7em;
+	display: block;
+	border: 0;
+	background-position: 0 0;
+}
+
+/* support: IE8 - See #6727 */
+.ui-slider.ui-state-disabled .ui-slider-handle,
+.ui-slider.ui-state-disabled .ui-slider-range {
+	filter: inherit;
+}
+
+.ui-slider-horizontal {
+	height: .8em;
+}
+.ui-slider-horizontal .ui-slider-handle {
+	top: -.3em;
+	margin-left: -.6em;
+}
+.ui-slider-horizontal .ui-slider-range {
+	top: 0;
+	height: 100%;
+}
+.ui-slider-horizontal .ui-slider-range-min {
+	left: 0;
+}
+.ui-slider-horizontal .ui-slider-range-max {
+	right: 0;
+}
+
+.ui-slider-vertical {
+	width: .8em;
+	height: 100px;
+}
+.ui-slider-vertical .ui-slider-handle {
+	left: -.3em;
+	margin-left: 0;
+	margin-bottom: -.6em;
+}
+.ui-slider-vertical .ui-slider-range {
+	left: 0;
+	width: 100%;
+}
+.ui-slider-vertical .ui-slider-range-min {
+	bottom: 0;
+}
+.ui-slider-vertical .ui-slider-range-max {
+	top: 0;
+}
+.ui-spinner {
+	position: relative;
+	display: inline-block;
+	overflow: hidden;
+	padding: 0;
+	vertical-align: middle;
+}
+.ui-spinner-input {
+	border: none;
+	background: none;
+	color: inherit;
+	padding: .222em 0;
+	margin: .2em 0;
+	vertical-align: middle;
+	margin-left: .4em;
+	margin-right: 2em;
+}
+.ui-spinner-button {
+	width: 1.6em;
+	height: 50%;
+	font-size: .5em;
+	padding: 0;
+	margin: 0;
+	text-align: center;
+	position: absolute;
+	cursor: default;
+	display: block;
+	overflow: hidden;
+	right: 0;
+}
+/* more specificity required here to override default borders */
+.ui-spinner a.ui-spinner-button {
+	border-top-style: none;
+	border-bottom-style: none;
+	border-right-style: none;
+}
+.ui-spinner-up {
+	top: 0;
+}
+.ui-spinner-down {
+	bottom: 0;
+}
+.ui-tabs {
+	position: relative;/* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */
+	padding: .2em;
+}
+.ui-tabs .ui-tabs-nav {
+	margin: 0;
+	padding: .2em .2em 0;
+}
+.ui-tabs .ui-tabs-nav li {
+	list-style: none;
+	float: left;
+	position: relative;
+	top: 0;
+	margin: 1px .2em 0 0;
+	border-bottom-width: 0;
+	padding: 0;
+	white-space: nowrap;
+}
+.ui-tabs .ui-tabs-nav .ui-tabs-anchor {
+	float: left;
+	padding: .5em 1em;
+	text-decoration: none;
+}
+.ui-tabs .ui-tabs-nav li.ui-tabs-active {
+	margin-bottom: -1px;
+	padding-bottom: 1px;
+}
+.ui-tabs .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor,
+.ui-tabs .ui-tabs-nav li.ui-state-disabled .ui-tabs-anchor,
+.ui-tabs .ui-tabs-nav li.ui-tabs-loading .ui-tabs-anchor {
+	cursor: text;
+}
+.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor {
+	cursor: pointer;
+}
+.ui-tabs .ui-tabs-panel {
+	display: block;
+	border-width: 0;
+	padding: 1em 1.4em;
+	background: none;
+}
+.ui-tooltip {
+	padding: 8px;
+	position: absolute;
+	z-index: 9999;
+	max-width: 300px;
+}
+body .ui-tooltip {
+	border-width: 2px;
+}

public/theme/assets/css/main.css

@@ -105,6 +105,7 @@ hgroup,
 menu,
 nav {
     display: block;
+    width: 250px;
 }
 
 body {
@@ -2232,7 +2233,7 @@ a.image:hover img {
 ol {
     list-style: decimal;
     margin: 0 0 2em 0;
-    padding-left: 1.25em;
+    padding-left: 1.5em;
 }
 
 ol li {
@@ -2245,10 +2246,6 @@ ul {
     padding-left: 1em;
 }
 
-ul li {
-    /*padding-left: 0.5em;*/
-}
-
 ul.alt {
     list-style: none;
     padding-left: 0;
@@ -3109,16 +3106,12 @@ button:disabled,
     #main>.inner {
         padding: 0 0 0 2em;
     }
-
-    #main>.inner>section {}
 }
 
 @media screen and (max-width: 1280px) {
     #main>.inner {
         padding: 0 0 0 2em;
     }
-
-    #main>.inner>section {}
 }
 
 @media screen and (max-width: 736px) {
@@ -3198,7 +3191,7 @@ button:disabled,
 }
 
 #sidebar>.inner {
-    padding: 2.22222em 2.22222em 2.44444em 2.22222em;
+    padding: 2.22em 2.22em 2.44em 2.22em;
     position: relative;
     width: 26em;
 }
@@ -3222,9 +3215,9 @@ button:disabled,
 #sidebar>.inner>.alt {
     background-color: #eff1f2;
     border-bottom: 0;
-    margin: -2.22222em 0 4.44444em -2.22222em;
-    padding: 2.22222em;
-    width: calc(100% + 4.44444em);
+    margin: -2.22em -2.33em 1.0em -2.22em;
+    padding: 2.22em;
+    width: calc(100% + 4.44em);
 }
 
 #sidebar .toggle {
@@ -3419,8 +3412,6 @@ button:disabled,
 }
 
 @media screen and (max-width: 736px) {
-    #header {}
-
     #header .logo {
         font-size: 1.25em;
         margin: 0;

public/theme/assets/js/main.js

@@ -1,262 +1,262 @@
 /*
-	Editorial by HTML5 UP
-	html5up.net | @ajlkn
-	Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+    Editorial by HTML5 UP
+    html5up.net | @ajlkn
+    Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
 */
 
-(function($) {
+(function ($) {
 
-	var	$window = $(window),
-		$head = $('head'),
-		$body = $('body');
+    var $window = $(window),
+        $head = $('head'),
+        $body = $('body');
 
-	// Breakpoints.
-		breakpoints({
-			xlarge:   [ '1281px',  '1680px' ],
-			large:    [ '981px',   '1280px' ],
-			medium:   [ '737px',   '980px'  ],
-			small:    [ '481px',   '736px'  ],
-			xsmall:   [ '361px',   '480px'  ],
-			xxsmall:  [ null,      '360px'  ],
-			'xlarge-to-max':    '(min-width: 1681px)',
-			'small-to-xlarge':  '(min-width: 481px) and (max-width: 1680px)'
-		});
+    // Breakpoints.
+    breakpoints({
+        xlarge: ['1281px', '1680px'],
+        large: ['981px', '1280px'],
+        medium: ['737px', '980px'],
+        small: ['481px', '736px'],
+        xsmall: ['361px', '480px'],
+        xxsmall: [null, '360px'],
+        'xlarge-to-max': '(min-width: 1681px)',
+        'small-to-xlarge': '(min-width: 481px) and (max-width: 1680px)'
+    });
 
-	// Stops animations/transitions until the page has ...
+    // Stops animations/transitions until the page has ...
 
-		// ... loaded.
-			$window.on('load', function() {
-				window.setTimeout(function() {
-					$body.removeClass('is-preload');
-				}, 100);
-			});
+    // ... loaded.
+    $window.on('load', function () {
+        window.setTimeout(function () {
+            $body.removeClass('is-preload');
+        }, 100);
+    });
 
-		// ... stopped resizing.
-			var resizeTimeout;
+    // ... stopped resizing.
+    var resizeTimeout;
 
-			$window.on('resize', function() {
+    $window.on('resize', function () {
 
-				// Mark as resizing.
-					$body.addClass('is-resizing');
+        // Mark as resizing.
+        $body.addClass('is-resizing');
 
-				// Unmark after delay.
-					clearTimeout(resizeTimeout);
+        // Unmark after delay.
+        clearTimeout(resizeTimeout);
 
-					resizeTimeout = setTimeout(function() {
-						$body.removeClass('is-resizing');
-					}, 100);
+        resizeTimeout = setTimeout(function () {
+            $body.removeClass('is-resizing');
+        }, 100);
 
-			});
+    });
 
-	// Fixes.
+    // Fixes.
 
-		// Object fit images.
-			if (!browser.canUse('object-fit')
-			||	browser.name == 'safari')
-				$('.image.object').each(function() {
+    // Object fit images.
+    if (!browser.canUse('object-fit')
+        || browser.name == 'safari')
+        $('.image.object').each(function () {
 
-					var $this = $(this),
-						$img = $this.children('img');
+            var $this = $(this),
+                $img = $this.children('img');
 
-					// Hide original image.
-						$img.css('opacity', '0');
+            // Hide original image.
+            $img.css('opacity', '0');
 
-					// Set background.
-						$this
-							.css('background-image', 'url("' + $img.attr('src') + '")')
-							.css('background-size', $img.css('object-fit') ? $img.css('object-fit') : 'cover')
-							.css('background-position', $img.css('object-position') ? $img.css('object-position') : 'center');
+            // Set background.
+            $this
+                .css('background-image', 'url("' + $img.attr('src') + '")')
+                .css('background-size', $img.css('object-fit') ? $img.css('object-fit') : 'cover')
+                .css('background-position', $img.css('object-position') ? $img.css('object-position') : 'center');
 
-				});
+        });
 
-	// Sidebar.
-		var $sidebar = $('#sidebar'),
-			$sidebar_inner = $sidebar.children('.inner');
+    // Sidebar.
+    var $sidebar = $('#sidebar'),
+        $sidebar_inner = $sidebar.children('.inner');
 
-		// Inactive by default on <= large.
-			breakpoints.on('<=large', function() {
-				$sidebar.addClass('inactive');
-			});
+    // Inactive by default on <= large.
+    breakpoints.on('<=large', function () {
+        $sidebar.addClass('inactive');
+    });
 
-			breakpoints.on('>large', function() {
-				$sidebar.removeClass('inactive');
-			});
+    breakpoints.on('>large', function () {
+        $sidebar.removeClass('inactive');
+    });
 
-		// Hack: Workaround for Chrome/Android scrollbar position bug.
-			if (browser.os == 'android'
-			&&	browser.name == 'chrome')
-				$('<style>#sidebar .inner::-webkit-scrollbar { display: none; }</style>')
-					.appendTo($head);
+    // Hack: Workaround for Chrome/Android scrollbar position bug.
+    if (browser.os == 'android'
+        && browser.name == 'chrome')
+        $('<style>#sidebar .inner::-webkit-scrollbar { display: none; }</style>')
+            .appendTo($head);
 
-		// Toggle.
-			$('<a href="#sidebar" class="toggle">Toggle</a>')
-				.appendTo($sidebar)
-				.on('click', function(event) {
+    // Toggle.
+    $('<a href="#sidebar" class="toggle">Toggle</a>')
+        .appendTo($sidebar)
+        .on('click', function (event) {
 
-					// Prevent default.
-						event.preventDefault();
-						event.stopPropagation();
+            // Prevent default.
+            event.preventDefault();
+            event.stopPropagation();
 
-					// Toggle.
-						$sidebar.toggleClass('inactive');
+            // Toggle.
+            $sidebar.toggleClass('inactive');
 
-				});
+        });
 
-		// Events.
+    // Events.
 
-			// Link clicks.
-				$sidebar.on('click', 'a', function(event) {
+    // Link clicks.
+    $sidebar.on('click', 'a', function (event) {
 
-					// >large? Bail.
-						if (breakpoints.active('>large'))
-							return;
+        // >large? Bail.
+        if (breakpoints.active('>large'))
+            return;
 
-					// Vars.
-						var $a = $(this),
-							href = $a.attr('href'),
-							target = $a.attr('target');
+        // Vars.
+        var $a = $(this),
+            href = $a.attr('href'),
+            target = $a.attr('target');
 
-					// Prevent default.
-						event.preventDefault();
-						event.stopPropagation();
+        // Prevent default.
+        event.preventDefault();
+        event.stopPropagation();
 
-					// Check URL.
-						if (!href || href == '#' || href == '')
-							return;
+        // Check URL.
+        if (!href || href == '#' || href == '')
+            return;
 
-					// Hide sidebar.
-						$sidebar.addClass('inactive');
+        // Hide sidebar.
+        $sidebar.addClass('inactive');
 
-					// Redirect to href.
-						setTimeout(function() {
+        // Redirect to href.
+        setTimeout(function () {
 
-							if (target == '_blank')
-								window.open(href);
-							else
-								window.location.href = href;
+            if (target == '_blank')
+                window.open(href);
+            else
+                window.location.href = href;
 
-						}, 500);
+        }, 500);
 
-				});
+    });
 
-			// Prevent certain events inside the panel from bubbling.
-				$sidebar.on('click touchend touchstart touchmove', function(event) {
+    // Prevent certain events inside the panel from bubbling.
+    $sidebar.on('click touchend touchstart touchmove', function (event) {
 
-					// >large? Bail.
-						if (breakpoints.active('>large'))
-							return;
+        // >large? Bail.
+        if (breakpoints.active('>large'))
+            return;
 
-					// Prevent propagation.
-						event.stopPropagation();
+        // Prevent propagation.
+        event.stopPropagation();
 
-				});
+    });
 
-			// Hide panel on body click/tap.
-				$body.on('click touchend', function(event) {
+    // Hide panel on body click/tap.
+    $body.on('click touchend', function (event) {
 
-					// >large? Bail.
-						if (breakpoints.active('>large'))
-							return;
+        // >large? Bail.
+        if (breakpoints.active('>large'))
+            return;
 
-					// Deactivate.
-						$sidebar.addClass('inactive');
+        // Deactivate.
+        $sidebar.addClass('inactive');
 
-				});
+    });
 
-		// Scroll lock.
-		// Note: If you do anything to change the height of the sidebar's content, be sure to
-		// trigger 'resize.sidebar-lock' on $window so stuff doesn't get out of sync.
+    // Scroll lock.
+    // Note: If you do anything to change the height of the sidebar's content, be sure to
+    // trigger 'resize.sidebar-lock' on $window so stuff doesn't get out of sync.
 
-			$window.on('load.sidebar-lock', function() {
+    $window.on('load.sidebar-lock', function () {
 
-				var sh, wh, st;
+        var sh, wh, st;
 
-				// Reset scroll position to 0 if it's 1.
-					if ($window.scrollTop() == 1)
-						$window.scrollTop(0);
+        // Reset scroll position to 0 if it's 1.
+        if ($window.scrollTop() == 1)
+            $window.scrollTop(0);
 
-				$window
-					.on('scroll.sidebar-lock', function() {
+        $window
+            .on('scroll.sidebar-lock', function () {
 
-						var x, y;
+                var x, y;
 
-						// <=large? Bail.
-							if (breakpoints.active('<=large')) {
+                // <=large? Bail.
+                if (breakpoints.active('<=large')) {
 
-								$sidebar_inner
-									.data('locked', 0)
-									.css('position', '')
-									.css('top', '');
+                    $sidebar_inner
+                        .data('locked', 0)
+                        .css('position', '')
+                        .css('top', '');
 
-								return;
+                    return;
 
-							}
+                }
 
-						// Calculate positions.
-							x = Math.max(sh - wh, 0);
-							y = Math.max(0, $window.scrollTop() - x);
+                // Calculate positions.
+                x = Math.max(sh - wh, 0);
+                y = Math.max(0, $window.scrollTop() - x);
 
-						// Lock/unlock.
-							if ($sidebar_inner.data('locked') == 1) {
+                // Lock/unlock.
+                if ($sidebar_inner.data('locked') == 1) {
 
-								if (y <= 0)
-									$sidebar_inner
-										.data('locked', 0)
-										.css('position', '')
-										.css('top', '');
-								else
-									$sidebar_inner
-										.css('top', -1 * x);
+                    if (y <= 0)
+                        $sidebar_inner
+                            .data('locked', 0)
+                            .css('position', '')
+                            .css('top', '');
+                    else
+                        $sidebar_inner
+                            .css('top', -1 * x);
 
-							}
-							else {
+                }
+                else {
 
-								if (y > 0)
-									$sidebar_inner
-										.data('locked', 1)
-										.css('position', 'fixed')
-										.css('top', -1 * x);
+                    if (y > 0)
+                        $sidebar_inner
+                            .data('locked', 1)
+                            .css('position', 'fixed')
+                            .css('top', -1 * x);
 
-							}
+                }
 
-					})
-					.on('resize.sidebar-lock', function() {
+            })
+            .on('resize.sidebar-lock', function () {
 
-						// Calculate heights.
-							wh = $window.height();
-							sh = $sidebar_inner.outerHeight() + 30;
+                // Calculate heights.
+                wh = $window.height();
+                sh = $sidebar_inner.outerHeight() + 30;
 
-						// Trigger scroll.
-							$window.trigger('scroll.sidebar-lock');
+                // Trigger scroll.
+                $window.trigger('scroll.sidebar-lock');
 
-					})
-					.trigger('resize.sidebar-lock');
+            })
+            .trigger('resize.sidebar-lock');
 
-				});
+    });
 
-	// Menu.
-		var $menu = $('#menu'),
-			$menu_openers = $menu.children('ul').find('.opener');
+    // Menu.
+    var $menu = $('#menu'),
+        $menu_openers = $menu.children('ul').find('.opener');
 
-		// Openers.
-			$menu_openers.each(function() {
+    // Openers.
+    $menu_openers.each(function () {
 
-				var $this = $(this);
+        var $this = $(this);
 
-				$this.on('click', function(event) {
+        $this.on('click', function (event) {
 
-					// Prevent default.
-						event.preventDefault();
+            // Prevent default.
+            event.preventDefault();
 
-					// Toggle.
-						$menu_openers.not($this).removeClass('active');
-						$this.toggleClass('active');
+            // Toggle.
+            $menu_openers.not($this).removeClass('active');
+            $this.toggleClass('active');
 
-					// Trigger resize (sidebar lock).
-						$window.triggerHandler('resize.sidebar-lock');
+            // Trigger resize (sidebar lock).
+            $window.triggerHandler('resize.sidebar-lock');
 
-				});
+        });
 
-			});
+    });
 
 })(jQuery);

src/Controller/AjaxController.php

@@ -97,8 +97,8 @@ class AjaxController extends AbstractController
         $user = $this->getUser();
 
         $speaker = new Speaker();
-        $speaker->setName($data->speakerName);
-        $speaker->setUser($user);
+        $speaker->setName($data->speakerName)
+                ->setUser($user);
 
         $emi->persist($speaker);
         $emi->flush();
@@ -138,8 +138,8 @@ class AjaxController extends AbstractController
         $user = $this->getUser();
 
         $series = new Series();
-        $series->setName($data->seriesName);
-        $series->setUser($user);
+        $series->setName($data->seriesName)
+               ->setUser($user);
 
         $emi->persist($series);
         $emi->flush();
@@ -238,12 +238,14 @@ class AjaxController extends AbstractController
         return $res;
     }
 
-    #[Route('/search-note', name: 'app_open_note')]
-    public function openNote(Request $req, EntityManagerInterface $emi): Response
+    #[Route('/search', name: 'app_search_note')]
+    public function searchNote(Request $req, EntityManagerInterface $emi): Response
     {
+        /** @var User $user */
+        $user = $this->getUser();
         $res = new Response();
         $data = json_decode($req->getContent());
-        $note = $emi->getRepository(Note::class)->findNote($data->search);
+        $note = $emi->getRepository(Note::class)->findNote($data->query, $user->getId()->toBinary());
         $res->setContent(json_encode($note));
 
         return $res;
@@ -264,25 +266,28 @@ class AjaxController extends AbstractController
     public function saveNote(Request $req, EntityManagerInterface $emi): Response
     {
         $data = json_decode($req->getContent());
-        $note = $emi->getRepository(Note::class)->find($data->id);
+        $newNote = false;
+        if (isset($data->id) && $data->id) {
+            /** @var Note|array $note */
+            $note = $emi->getRepository(Note::class)->findBy(['id' => $data->id, 'user' => $this->getUser()]);
 
-        if (!$note) {
+            if (is_array($note) && count($note) > 0) {
+                /** @var Note $note */
+                $note = $note[0];
+            }
+        } else {
             $note = new Note();
-            $note->setId($data->id);
+            $newNote = true;
+            $note->setUser($this->getUser());
         }
 
         $refs = json_decode(json_encode($data->refs), true);
 
         $series = $emi->getRepository(Series::class)->find($data->series);
         $speaker = $emi->getRepository(Speaker::class)->find($data->speaker);
-        $user = $emi->getRepository(User::class)->findBy(['email' => $data->user]);
 
-        if (is_array($user)) {
-            $user = $user[0];
-        }
-
-        $note->setUser($user)
-             ->setTitle($data->title)
+        /** @var Note $note */
+        $note->setTitle($data->title)
              ->setDate(new DateTime($data->date))
              ->setSeries($series)
              ->setSpeaker($speaker)
@@ -296,7 +301,8 @@ class AjaxController extends AbstractController
         $res = new Response();
         $res->setContent(json_encode([
             'msg' => 'saved',
-            'id' => $note->getId()
+            'id' => $note->getId(),
+            'new' => $newNote,
         ]));
 
         return $res;
@@ -330,12 +336,14 @@ class AjaxController extends AbstractController
         $verse = Bible::findVerse($passage);
         $verseArr = [];
 
-        if (is_bool($verse)) {
+        if (is_bool($verse) && $verse === false) {
             $verseArr[0] = 1;
             $verseArr[1] = 176;
         } elseif (is_int($verse)) {
             $verseArr[0] = $verse;
             $verseArr[1] = $verse;
+        } else {
+            $verseArr = $verse;
         }
 
         $ret = $emi->getRepository(Bible::class)->findRange($bible, $verseArr);

src/Controller/DefaultController.php

@@ -26,11 +26,11 @@ class DefaultController extends AbstractController
     {
         $this->denyAccessUnlessGranted('IS_AUTHENTICATED_FULLY');
         $last4Notes = $emi->getRepository(Note::class)->getLast4Notes($user);
-        $uuid = Uuid::v4();
+        $openNotes = $emi->getRepository(Note::class)->reverseNoteSort($user);
 
         return $this->render('default/home.html.twig', [
             'last4Notes' => $last4Notes,
-            'id' => $uuid,
+            'reverseNoteSort' => $openNotes,
             'isAdmin' => $this->isGranted('ROLE_ADMIN'),
         ]);
     }

src/Controller/ReferenceController.php

@@ -39,13 +39,13 @@ class ReferenceController extends AbstractController
 
             $bible = self::$emi->getRepository(Bible::class)->findRange($bible, [$passage_start, $passage_end]);
             $passage = "{$passage_start}-{$passage_end}";
-            $label = "{$bible[0]->getLabel()} {$bible[0]->getChapter()}:{$passage}";
+            $label = "{$bible[0]->getLabel()}\n{$bible[0]->getChapter()}:{$passage}";
         } elseif (is_int($passage)) {
             $bible = self::$emi->getRepository(Bible::class)->findBy(['book' => $book, 'chapter' => $chapter, 'verse' => $passage]);
-            $label = "{$bible[0]->getLabel()} {$bible[0]->getChapter()}:{$passage}";
+            $label = "{$bible[0]->getLabel()}\n{$bible[0]->getChapter()}:{$passage}";
         } elseif ($passage === false) {
             $bible = self::$emi->getRepository(Bible::class)->findBy(['book' => $book, 'chapter' => $chapter]);
-            $label = "{$bible[0]->getLabel()} {$bible[0]->getChapter()}";
+            $label = "{$bible[0]->getLabel()}\n{$bible[0]->getChapter()}";
 
             $passage = null;
         }

src/Controller/RegistrationController.php

@@ -20,6 +20,11 @@ class RegistrationController extends AbstractController
 
         $form = $this->createForm(RegistrationFormType::class, $user);
         $form->handleRequest($request);
+        $role = ['ROLE_USER'];
+
+        if ($entityManager->getRepository(User::class)->getUserCount() == 0) {
+            $role = ['ROLE_ADMIN'];
+        }
 
         if ($form->isSubmitted() && $form->isValid()) {
             // encode the plain password
@@ -28,8 +33,8 @@ class RegistrationController extends AbstractController
                     $user,
                     $form->get('plainPassword')->getData()
                 )
-            )
-            ->setRoles(['ROLE_USER']);
+            );
+            $user->setRoles($role);
 
             $entityManager->persist($user);
             $entityManager->flush();

src/Entity/Bible.php

@@ -133,7 +133,7 @@ class Bible implements JsonSerializable
         $book = "{$tmp[0]}";
 
         if(count($tmp) > 2) {
-            $book = "{$tmp[0]}{$tmp[1]}";
+            $book = "{$tmp[0]} {$tmp[1]}";
         }
 
         return $book;

src/Repository/NoteRepository.php

@@ -17,15 +17,52 @@ class NoteRepository extends ServiceEntityRepository
         parent::__construct($registry, Note::class);
     }
 
-    public function getLast4Notes(?User $user): array
+    public function reverseNoteSort(?User $user): array
     {
+        if (!$user) {
+            return [];
+        }
+
         $ret = $this->createQueryBuilder('n')
             ->where('n.user = :user')
-            ->setParameter('user', (string) $user->getId())
+            ->setParameter('user', $user->getId()->toBinary())
+            ->orderBy('n.date', 'DESC')
+            ->getQuery()
+            ->getResult();
+
+        return $ret;
+    }
+
+    public function getLast4Notes(?User $user): array
+    {
+        if (!$user) {
+            return [];
+        }
+        $ret = $this->createQueryBuilder('n')
+            ->where('n.user = :user')
+            ->setParameter('user', $user->getId()->toBinary())
             ->orderBy('n.date', 'DESC')
             ->setMaxResults(4)
             ->getQuery()
             ->getResult();
+
+        return $ret;
+    }
+
+    public function findNote(string $query, string $userId): array
+    {
+        $ret = $this->createQueryBuilder('n')
+            ->where('n.title LIKE :query')
+            ->orWhere('n.passage LIKE :query')
+            ->orWhere('n.text LIKE :query')
+            ->andWhere('n.user = :user')
+            ->setParameter('query', "%{$query}%")
+            ->setParameter('user', $userId)
+            ->orderBy('n.date', 'DESC')
+            ->setMaxResults(3)
+            ->getQuery()
+            ->getResult();
+
         return $ret;
     }
 

src/Repository/UserRepository.php

@@ -33,6 +33,15 @@ class UserRepository extends ServiceEntityRepository implements PasswordUpgrader
         $this->getEntityManager()->flush();
     }
 
+    public function getUserCount(): int
+    {
+        return $this->createQueryBuilder('u')
+            ->select('COUNT(u.id)')
+            ->getQuery()
+            ->getSingleScalarResult()
+        ;
+    }
+
     //    /**
     //     * @return User[] Returns an array of User objects
     //     */

templates/base.html.twig

@@ -10,13 +10,10 @@
         <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
 
         <title>{% block title %}Welcome!{% endblock %}</title>
-        {% block stylesheets %}
-        {% endblock %}
+        {% block stylesheets %}{% endblock %}
     </head>
     <body class='is-preload' onload='setHeight()' onresize='setHeight()'>
         {% block body %}{% endblock %}
-        {% block javascripts %}
-            {% block importmap %}{{ importmap('app') }}{% endblock %}
-        {% endblock %}
+        {% block javascripts %}{% endblock %}
     </body>
 </html>

templates/default/home.html.twig

@@ -4,13 +4,15 @@
 
 {% block stylesheets %}
 <link href="/theme/assets/css/main.css" rel="stylesheet" />
+<link href='/theme/assets/css/jquery-ui.theme.css' rel='stylesheet' />
+<link href='/theme/assets/css/jquery-ui.structure.css' rel='stylesheet' />
 <link href='/css/style.css' rel='stylesheet' />
 {% endblock %}
 
 {% block javascripts %}
-<script src='/js/data.js'></script>
 <script src='/js/script.js'></script>
 <script src="/theme/assets/js/jquery.min.js"></script>
+<script src='/theme/assets/js/jquery-ui.js'></script>
 <script src="/theme/assets/js/browser.min.js"></script>
 <script src="/theme/assets/js/breakpoints.min.js"></script>
 <script src="/theme/assets/js/util.js"></script>
@@ -21,19 +23,20 @@
 {% block body %}
 <div id='wrapper'>
     <div id='main'>
-        <div class='inner' style='padding-left:0;'>
+        <div class='inner'>
             <section class='ref-tab'>
                 <ul id='ref-list'>
                 </ul>
             </section>
 
             <section class='ref'>
-                <h2 style='display:inline-block'>Reference</h2>
+                <h2>Reference</h2>
                 <div style='display:inline-block'>
                     <button onclick='increaseFont()'><i class='fa fa-plus'></i></button>&nbsp;
-                    <button onclick='decreaseFont()'><i class='fa fa-minus'></i></button>
+                    <button onclick='decreaseFont()'><i class='fa fa-minus'></i></button>&nbsp;
+                    <button onclick='openRef(false)'><i class='fa fa-book'></i></button>
                 </div>
-                <div id="ref" style='font-size:12pt'></div>
+                <div id="ref" style='font-size:12pt;'></div>
                 <div id='note-list'>
                     <table>
                         <thead>
@@ -45,9 +48,9 @@
                             </tr>
                         </thead>
                         <tbody>
-                    {% for n in app.user.notes %}
-                    {{ n.toTableRow() | raw }}<br />
-                    {% endfor %}
+                        {% for n in reverseNoteSort %}
+                        {{ n.toTableRow()|raw }}
+                        {% endfor %}
                         </tbody>
                     </table>
                 </div>
@@ -56,7 +59,7 @@
             <section class="notes">
                 <div id='note-header-left'>
                     <h2>Notes</h2>
-                    <i id='save-check' class='fa fa-check' style='opacity:0;'></i>
+                    <i id='save-check' class='fa fa-check'></i>
                 </div>
                 <div id='note-header-right'>
                     <select id='template' onchange="retrieveTemplate('template','notes')">
@@ -65,14 +68,19 @@
                         <option value="{{ t.id }}">{{ t.name }}</option>
                         {% endfor %}
                     </select>&nbsp;
-                    <input type="button" id="previewBtn" class='button' value="Preview" onclick='previewNote()' />&nbsp;
-                    <input type='button' id='show-hide-btn' class='button' value='Show' onclick='toggleFields()' />
+                    <button id="previewBtn" class='button' onclick='previewNote()'>
+                        <i class='fa fa-eye'></i>
+                    </button>
+                    &nbsp;
+                    <button id='show-hide-btn' class='button' onclick='toggleFields()'>
+                        <i class='fa fa-table'></i>
+                    </button>
                 </div>
 
                 <div id='fields-container'>
-                    <input type="hidden" id="noteId" value="{{ id }}" />
+                    <input type="hidden" id="noteId" value="" />
                     <input type="text" id="noteTitle" placeholder="Title..." />
-                    <input type='date' id='noteDate' onchange='textDirty=true;saved=false;' />
+                    <input type='text' id='noteDate' onchange='textDirty=true;saved=false;' />
                     <input type='text' id='newSpeaker' placeholder='Name...' onkeyup='saveSpeaker(event)' style='display:none;' />
                     <select id="speaker" onchange='newSpeaker()'>
                         <option value=0>-- Speaker --</option>
@@ -106,18 +114,22 @@
     <select id='referenceType' onchange='retrieveBooks()'>
         <option>-- Select --</option>
         <option value='bible'>Bible</option>
-        <option value='creed'>Creed</option>
-        <option value='bc'>Belgic</option>
-        <option value='hc'>Heidelberg</option>
+        <option value='creed'>Various Creed</option>
+        <option value='bc'>Belgic Confession</option>
+        <option value='hc'>Heidelberg Catechism</option>
         <option value='cd'>Canons of Dort</option>
-        <option value='wcf'>Westminster CF</option>
-        <option value='wsc'>Shorter Catechism</option>
-        <option value='wlc'>Larger Catechism</option>
+        <option value='wcf'>Westminster Confession of Faith</option>
+        <option value='wsc'>Westminster Shorter Catechism</option>
+        <option value='wlc'>Westminster Larger Catechism</option>
     </select>
-    <select id='referenceBook' style='display:none;'>
-    </select><br/>
-    <input type="text" id="search" placeholder="Search"><br />
-    <button id="searchBtn" onclick="queryRef()">Search</button>
+    <select id='referenceBook' onchange='filterBooks()'>
+    </select>
+    <span id='chapter-range' style='color:white;'></span>
+    <input type="text" id="referenceSearch" placeholder="Search" onkeyup='filterVerse()'>
+    <span id='verse-range' style='color:white;'></span>
+    <br />
+    <button id="searchBtn" onclick="queryRef()">Search</button>&nbsp;
+    <button id='closeSearch' onclick='closeRef()'>Close</button>
 </div>
 
 <div id='passage-popup'>

templates/default/sidebar.html.twig

@@ -5,21 +5,16 @@
         <!-- Search -->
         {% if app.user %}
         <section id="search" class="alt">
-            <form method="post" action="#">
-                <input type="text" name="query" id="query" placeholder="Search" />
-            </form>
+            <input type="text" name="query" id="query" placeholder="Search by title, passage, or note" />
         </section>
         {% endif %}
 
         <!-- Menu -->
         <nav id="menu">
             <header class="major">
-                <h2>Menu</h2>
                 {% if app.user %}
                 <h3>Welcome {{ app.user.name }}</h3>
-                <ul>
-                    <li><a href='/index.php/logout'>Logout</a>
-                </ul>
+                <a href='/index.php/logout'>Logout</a>
                 {% endif %}
             </header>
             <ul>
@@ -29,7 +24,7 @@
                 <li><a href='#' onclick='openNote()'>Open Note</a></li>
                 <li><a href="#" onclick="saveNote()">Save Note</a></li>
                 <li><a href='#' onclick='discardNote()'>Delete Note</a></li>
-                {% if isAdmin %}
+                {% if isAdmin is defined and isAdmin %}
                 <li><a href='/index.php/reference-editor'>Reference Editor</a></li>
                 {% endif %}
                 <li><a href='#' onclick="openRef()">Open Reference</a></li>
@@ -48,10 +43,11 @@
             <header class="major">
                 <h2>Recent Notes</h2>
             </header>
-            <div class="mini-posts">
-                {% for n in app.user.notes %}
+            <div class="mini-posts" id='old-notes'>
+                {% for n in last4Notes %}
                 <article>
-                    <a href="#">{{ n.title }}</a>
+                    <p>{{ n.date|date("m/d/Y") }}</p>
+                    <a href="#" onclick="retrieveNote('{{ n.id }}');openNote();">{{ n.title }}</a>
                     <p>{{ n.passage }}</p>
                 </article>
                 {% endfor %}