Frooodle/license (#1994)

2024-10-14 22:34:41 +01:00
parent ceeecc37ab
commit c85463bc18
124 changed files with 4323 additions and 501 deletions
--- a/src/main/resources/templates/account.html
+++ b/src/main/resources/templates/account.html
@@ -278,7 +278,7 @@
                  let allKeys = new Set([...Object.keys(accountSettings), ...Object.keys(localStorage)]);

                  allKeys.forEach(key => {
-                    if(key === 'debug' || key === '0' || key === '1') return;  // Ignoring specific keys
+                    if(key === 'debug' || key === '0' || key === '1' || key.includes('pdfjs') || key.includes('posthog') || key.includes('pageViews')) return;  // Ignoring specific keys

                    const accountValue = accountSettings[key] || '-';
                    const browserValue = localStorage.getItem(key) || '-';
@@ -299,7 +299,7 @@

                    // Then, set the account settings to local storage
                    for (let key in accountSettings) {
-                      if(key !== 'debug' && key !== '0' && key !== '1') { // Only sync non-ignored keys
+                      if(key !== 'debug' && key !== '0' && key !== '1' && !key.includes('pdfjs') && !key.includes('posthog') && !key.includes('pageViews')) { // Only sync non-ignored keys
                        localStorage.setItem(key, accountSettings[key]);
                      }
                    }
@@ -316,7 +316,7 @@

                    for (let i = 0; i < localStorage.length; i++) {
                      const key = localStorage.key(i);
-                      if(key !== 'debug' && key !== '0' && key !== '1') { // Only send non-ignored keys
+                      if(key !== 'debug' && key !== '0' && key !== '1' && !key.includes('pdfjs') && !key.includes('posthog') && !key.includes('pageViews')) { // Only send non-ignored keys
                        let hiddenField = document.createElement("input");
                        hiddenField.type = "hidden";
                        hiddenField.name = key;
--- a/src/main/resources/templates/addUsers.html
+++ b/src/main/resources/templates/addUsers.html
@@ -101,6 +101,8 @@
                  </tbody>
                </table>
              </div>
+              <p th:text="#{enterpriseEdition.ssoAdvert}"></p>
+
              <script th:inline="javascript">
                const delete_confirm_text = /*[[#{adminUserSettings.confirmDeleteUser}]]*/ 'Should the user be deleted?';
                const change_confirm_text = /*[[#{adminUserSettings.confirmChangeUserStatus}]]*/ 'Should the user be disabled/enabled?';
--- a/src/main/resources/templates/fragments/card.html
+++ b/src/main/resources/templates/fragments/card.html
@@ -15,7 +15,7 @@
    </div>
  </a>
  <div class="favorite-icon" onclick="toggleFavorite(this)">
-    <span class="material-symbols-rounded no-fill">
+    <span class="material-symbols-rounded">
      star
    </span>
  </div>
--- a/src/main/resources/templates/fragments/common.html
+++ b/src/main/resources/templates/fragments/common.html
@@ -69,6 +69,49 @@
    <script th:src="@{'/js/cacheFormInputs.js'}"  th:if="${currentPage != 'home'}"></script>
    <script th:src="@{'/js/tab-container.js'}"></script>
    <script th:src="@{'/js/darkmode.js'}"></script>
+    <script th:inline="javascript">
+        const stirlingPDFLabel = /*[[${@StirlingPDFLabel}]]*/ '';
+        const analyticsEnabled = /*[[${@analyticsEnabled}]]*/ false;
+
+        if (analyticsEnabled) {
+            !function (t, e) {
+                var o, n, p, r;
+                e.__SV || (window.posthog = e, e._i = [], e.init = function (i, s, a) {
+                    function g(t, e) {
+                        var o = e.split(".");
+                        2 == o.length && (t = t[o[0]], e = o[1]), t[e] = function () {
+                            t.push([e].concat(Array.prototype.slice.call(arguments, 0)))
+                        }
+                    }
+
+                    (p = t.createElement("script")).type = "text/javascript", p.async = !0, p.src = s.api_host + "/static/array.js", (r = t.getElementsByTagName("script")[0]).parentNode.insertBefore(p, r);
+                    var u = e;
+                    for (void 0 !== a ? u = e[a] = [] : a = "posthog", u.people = u.people || [], u.toString = function (t) {
+                        var e = "posthog";
+                        return "posthog" !== a && (e += "." + a), t || (e += " (stub)"), e
+                    }, u.people.toString = function () {
+                        return u.toString(1) + ".people (stub)"
+                    }, o = "capture identify alias people.set people.set_once set_config register register_once unregister opt_out_capturing has_opted_out_capturing opt_in_capturing reset isFeatureEnabled onFeatureFlags getFeatureFlag getFeatureFlagPayload reloadFeatureFlags group updateEarlyAccessFeatureEnrollment getEarlyAccessFeatures getActiveMatchingSurveys getSurveys getNextSurveyStep onSessionId".split(" "), n = 0; n < o.length; n++) g(u, o[n]);
+                    e._i.push([i, s, a])
+                }, e.__SV = 1)
+            }(document, window.posthog || []);
+            posthog.init('phc_fiR65u5j6qmXTYL56MNrLZSWqLaDW74OrZH0Insd2xq', {
+                api_host: 'https://eu.i.posthog.com',
+                persistence: 'localStorage',
+                person_profiles: 'always',
+                mask_all_text: true,
+                mask_all_element_attributes: true
+            })
+            const baseUrl = window.location.hostname;
+            posthog.register_once({
+                'hostname': baseUrl,
+                'UUID': /*[[${@UUID}]]*/ ''
+            })
+        }
+    </script>
+
+
+
  </th:block>

 <th:block th:fragment="game">
@@ -148,6 +191,7 @@
                  const multipleInputsForSingleRequest = /*[[${multipleInputsForSingleRequest}]]*/ false;
                  const disableMultipleFiles = /*[[${disableMultipleFiles}]]*/ false;
                  const remoteCall = /*[[${remoteCall}]]*/ true;
+                  const sessionExpired = /*[[#{session.expired}]]*/ '';
                </script>
                <script th:src="@{'/js/downloader.js'}"></script>

--- a/src/main/resources/templates/fragments/footer.html
+++ b/src/main/resources/templates/fragments/footer.html
@@ -4,7 +4,7 @@
    <div class="d-flex justify-content-center">
      <ul class="list-unstyled d-flex">
        <li><a class="footer-link px-2" id="licenses" target="_blank" th:href="@{'/licenses'}" th:text="#{licenses.nav}">Licenses</a></li>
-        <li><a class="footer-link px-2" id="survey" target="_blank" href="https://stirlingpdf.info/s/clwzgtfw7000gltkmwz1n212m" th:text="#{survey.nav}">Survey</a></li>
+        <li><a class="footer-link px-2" id="survey" target="_blank" href="https://stirlingpdf.info/s/cm28y3niq000o56dv7liv8wsu" th:text="#{survey.nav}">Survey</a></li>
        <li th:if="${@privacyPolicy != ''}"><a class="footer-link px-2" target="_blank" th:href="${@privacyPolicy}" th:text="#{legal.privacy}">privacyPolicy</a></li>
        <li th:if="${@termsAndConditions != ''}"><a class="footer-link px-2" target="_blank" th:href="${@termsAndConditions}" th:text="#{legal.terms}">termsAndConditions</a></li>
        <li th:if="${@accessibilityStatement != ''}"><a class="footer-link px-2" target="_blank" th:href="${@accessibilityStatement}" th:text="#{legal.accessibility}">accessibilityStatement</a></li>
--- a/src/main/resources/templates/fragments/navbar.html
+++ b/src/main/resources/templates/fragments/navbar.html
@@ -229,6 +229,9 @@
                        <div
                          th:replace="~{fragments/navbarEntry :: navbarEntry ('split-pdf-by-sections', 'grid_on', 'home.split-by-sections.title', 'home.split-by-sections.desc', 'split-by-sections.tags', 'advance')}">
                        </div>
+                        <div
+                                th:replace="~{fragments/navbarEntry :: navbarEntry ('split-pdf-by-chapters', 'book', 'home.splitPdfByChapters.title', 'home.splitPdfByChapters.desc', 'splitPdfByChapters.tags', 'advance')}">
+                        </div>
                        <div
                          th:replace="~{fragments/navbarEntry :: navbarEntry ('split-by-size-or-count', 'vertical_split', 'home.autoSizeSplitPDF.title', 'home.autoSizeSplitPDF.desc', 'autoSizeSplitPDF.tags', 'advance')}">
                        </div>
@@ -357,6 +360,12 @@
            </div>
          </li>

+          <li class="nav-item">
+            <a href="https://stirlingpdf.com/pricing" class="nav-link go-pro-link" target="_blank" rel="noopener noreferrer">
+        <span class="go-pro-badge" th:text="#{enterpriseEdition.button}"></span>
+            </a>
+          </li>
+
          <li class="nav-item">
            <!-- Settings Button -->
            <a href="#" class="nav-link" data-bs-toggle="modal" data-bs-target="#settingsModal">
--- a/src/main/resources/templates/home.html
+++ b/src/main/resources/templates/home.html
@@ -68,11 +68,39 @@
            </div>
          </div>

+
+          <div id="popularTools" class="feature-group">
+            <div
+                    th:replace="~{fragments/featureGroupHeader :: featureGroupHeader(groupTitle=#{navbar.sections.popular})}">
+            </div>
+            <div class="feature-group-container">
+              <div
+                      th:replace="~{fragments/card :: card(id='view-pdf', cardTitle=#{home.viewPdf.title}, cardText=#{home.viewPdf.desc}, cardLink='view-pdf', toolIcon='menu_book', tags=#{viewPdf.tags}, toolGroup='other')}">
+              </div>
+
+              <div
+                      th:replace="~{fragments/card :: card(id='multi-tool', cardTitle=#{home.multiTool.title}, cardText=#{home.multiTool.desc}, cardLink='multi-tool', toolIcon='construction', tags=#{multiTool.tags}, toolGroup='organize')}">
+              </div>
+              <div
+                      th:replace="~{fragments/card :: card(id='pipeline', cardTitle=#{home.pipeline.title}, cardText=#{home.pipeline.desc}, cardLink='pipeline', toolIcon='family_history', tags=#{pipeline.tags}, toolGroup='advance')}">
+              </div>
+              <div
+                      th:replace="~{fragments/card :: card(id='compress-pdf', cardTitle=#{home.compressPdfs.title}, cardText=#{home.compressPdfs.desc}, cardLink='compress-pdf', toolIcon='zoom_in_map', tags=#{compressPdfs.tags}, toolGroup='advance')}">
+              </div>
+            </div>
+          </div>
+
+
+
+
          <div id="groupOrganize" class="feature-group">
            <div
              th:replace="~{fragments/featureGroupHeader :: featureGroupHeader(groupTitle=#{navbar.sections.organize})}">
            </div>
            <div class="feature-group-container">
+              <div
+                      th:replace="~{fragments/card :: card(id='multi-tool', cardTitle=#{home.multiTool.title}, cardText=#{home.multiTool.desc}, cardLink='multi-tool', toolIcon='construction', tags=#{multiTool.tags}, toolGroup='organize')}">
+              </div>
              <div
                th:replace="~{fragments/card :: card(id='merge-pdfs', cardTitle=#{home.merge.title}, cardText=#{home.merge.desc}, cardLink='merge-pdfs', toolIcon='add_to_photos', tags=#{merge.tags}, toolGroup='organize')}">
              </div>
@@ -199,6 +227,9 @@
              <div
                th:replace="~{fragments/card :: card(id='stamp', cardTitle=#{home.AddStampRequest.title}, cardText=#{home.AddStampRequest.desc}, cardLink='stamp', toolIcon='approval', tags=#{AddStampRequest.tags}, toolGroup='security')}">
              </div>
+              <div
+                th:replace="~{fragments/card :: card(id='add-watermark', cardTitle=#{home.watermark.title}, cardText=#{home.watermark.desc}, cardLink='add-watermark', toolIcon='water_drop', tags=#{watermark.tags}, toolGroup='security')}">
+              </div>
            </div>
          </div>

@@ -215,9 +246,7 @@
              <div
                th:replace="~{fragments/card :: card(id='add-image', cardTitle=#{home.addImage.title}, cardText=#{home.addImage.desc}, cardLink='add-image', toolIcon='text_fields', tags=#{addImage.tags}, toolGroup='other')}">
              </div>
-              <div
-                th:replace="~{fragments/card :: card(id='add-watermark', cardTitle=#{home.watermark.title}, cardText=#{home.watermark.desc}, cardLink='add-watermark', toolIcon='water_drop', tags=#{watermark.tags}, toolGroup='security')}">
-              </div>
+
              <div
                th:replace="~{fragments/card :: card(id='change-metadata', cardTitle=#{home.changeMetadata.title}, cardText=#{home.changeMetadata.desc}, cardLink='change-metadata', toolIcon='assignment', tags=#{changeMetadata.tags}, toolGroup='other')}">
              </div>
@@ -227,9 +256,6 @@
              <div
                th:replace="~{fragments/card :: card(id='extract-images', cardTitle=#{home.extractImages.title}, cardText=#{home.extractImages.desc}, cardLink='extract-images', toolIcon='photo_library', tags=#{extractImages.tags}, toolGroup='other')}">
              </div>
-              <div
-                th:replace="~{fragments/card :: card(id='extract-image-scans', cardTitle=#{home.ScannerImageSplit.title}, cardText=#{home.ScannerImageSplit.desc}, cardLink='extract-image-scans', toolIcon='scanner', tags=#{ScannerImageSplit.tags}, toolGroup='advance')}">
-              </div>
              <div
                th:replace="~{fragments/card :: card(id='flatten', cardTitle=#{home.flatten.title}, cardText=#{home.flatten.desc}, cardLink='flatten', toolIcon='layers_clear', tags=#{flatten.tags}, toolGroup='other')}">
              </div>
@@ -263,15 +289,15 @@
              <div
                th:replace="~{fragments/card :: card(id='pipeline', cardTitle=#{home.pipeline.title}, cardText=#{home.pipeline.desc}, cardLink='pipeline', toolIcon='family_history', tags=#{pipeline.tags}, toolGroup='advance')}">
              </div>
-              <div
-                th:replace="~{fragments/card :: card(id='multi-tool', cardTitle=#{home.multiTool.title}, cardText=#{home.multiTool.desc}, cardLink='multi-tool', toolIcon='construction', tags=#{multiTool.tags}, toolGroup='advance')}">
-              </div>
              <div
                th:replace="~{fragments/card :: card(id='adjust-contrast', cardTitle=#{home.adjust-contrast.title}, cardText=#{home.adjust-contrast.desc}, cardLink='adjust-contrast', toolIcon='palette', tags=#{adjust-contrast.tags}, toolGroup='advance')}">
              </div>
              <div
                th:replace="~{fragments/card :: card(id='compress-pdf', cardTitle=#{home.compressPdfs.title}, cardText=#{home.compressPdfs.desc}, cardLink='compress-pdf', toolIcon='zoom_in_map', tags=#{compressPdfs.tags}, toolGroup='advance')}">
              </div>
+              <div
+                      th:replace="~{fragments/card :: card(id='extract-image-scans', cardTitle=#{home.ScannerImageSplit.title}, cardText=#{home.ScannerImageSplit.desc}, cardLink='extract-image-scans', toolIcon='scanner', tags=#{ScannerImageSplit.tags}, toolGroup='advance')}">
+              </div>
              <div
                th:replace="~{fragments/card :: card(id='repair', cardTitle=#{home.repair.title}, cardText=#{home.repair.desc}, cardLink='repair', toolIcon='build', tags=#{repair.tags}, toolGroup='advance')}">
              </div>
@@ -293,6 +319,9 @@
              <div
                th:replace="~{fragments/card :: card(id='split-pdf-by-sections', cardTitle=#{home.split-by-sections.title}, cardText=#{home.split-by-sections.desc}, cardLink='split-pdf-by-sections', toolIcon='grid_on', tags=#{split-by-sections.tags}, toolGroup='advance')}">
              </div>
+              <div
+                th:replace="~{fragments/card :: card(id='split-pdf-by-chapters', cardTitle=#{home.splitPdfByChapters.title}, cardText=#{home.splitPdfByChapters.desc}, cardLink='split-pdf-by-chapters', toolIcon='book', tags=#{splitPdfByChapters.tags}, toolGroup='advance')}">
+              </div>
            </div>
          </div>
        </div>
@@ -303,8 +332,7 @@


  <!-- Survey Modal -->
-  <div class="modal fade" id="surveyModal" tabindex="-1" role="dialog" aria-labelledby="surveyModalLabel"
-    aria-hidden="true">
+  <div class="modal fade" id="surveyModal" tabindex="-1" role="dialog" aria-labelledby="surveyModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered" role="document">
      <div class="modal-content">
        <div class="modal-header">
@@ -312,13 +340,12 @@
          <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
        </div>
        <div class="modal-body">
-          <p th:text="#{survey.description}">Stirling-PDF has no tracking so we want to hear from our users to improve
-            Stirling-PDF!</h5>
+          <p><span th:text="#{survey.changes}">Stirling-PDF has changed since the last survey! To find out more please check our blog post here: </span><a href="https://www.stirlingpdf.com/blog/stirling-pdf-future" target="_blank"> Stirling PDF</a></p>
+
+          <p th:text="#{survey.changes2}">With these changes we are getting paid business support and funding</p>
          <p th:text="#{survey.please}">Please consider taking our survey!</p>
-          <p th:text="#{survey.disabled}">Survey popup will be disabled in following updates but available at foot of
-            page)</p>
-          <a href="https://stirlingpdf.info/s/clwzgtfw7000gltkmwz1n212m" target="_blank" class="btn btn-primary"
-            id="takeSurvey" th:text="#{survey.button}">Take Survey</a>
+          <p th:text="#{survey.disabled}">Survey popup will be disabled in following updates but available at foot of page)</p>
+          <a href="https://stirlingpdf.info/s/cm28y3niq000o56dv7liv8wsu" target="_blank" class="btn btn-primary" id="takeSurvey"th:text="#{survey.button}" >Take Survey</a>
        </div>
        <div class="modal-footer">
          <div class="form-check mb-3">
@@ -333,18 +360,99 @@
    </div>
  </div>

-  <script>
-    /*
+
+  <!-- Analytics Modal -->
+  <div class="modal fade" id="analyticsModal" tabindex="-1" role="dialog" aria-labelledby="analyticsModalLabel" aria-hidden="true" th:if="${@analyticsPrompt}">
+    <div class="modal-dialog modal-dialog-centered" role="document">
+      <div class="modal-content">
+        <div class="modal-header">
+          <h5 class="modal-title" id="analyticsModalLabel" th:text="#{analytics.title}">Do you want make Stirling PDF better?</h5>
+          <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+        </div>
+        <div class="modal-body">
+          <p th:text="#{analytics.paragraph1}">Stirling PDF has opt in analytics to help us improve the product. We do not track any personal information or file contents.</p>
+          <p th:text="#{analytics.paragraph2}">Please consider enabling analytics to help Stirling-PDF grow and to allow us to understand our users better.</p>
+          <p th:text="#{analytics.settings}">You can change the settings for analytics in the config/settings.yml file</p>
+        </div>
+        <div class="modal-footer">
+          <button type="button" class="btn btn-primary" th:text="#{analytics.enable}" onclick="setAnalytics(true)">Enable analytics</button>
+          <button type="button" class="btn btn-secondary" data-bs-dismiss="modal" onclick="setAnalytics(false)" th:text="#{analytics.disable}">Disable analytics</button>
+        </div>
+      </div>
+    </div>
+  </div>
+
+
+
+
+  <script th:inline="javascript">
+
+    /*<![CDATA[*/
+    const analyticsPromptBoolean = /*[[${@analyticsPrompt}]]*/ false;
+
+    document.addEventListener('DOMContentLoaded', function() {
+      if (analyticsPromptBoolean) {
+        const analyticsModal = new bootstrap.Modal(document.getElementById('analyticsModal'));
+        analyticsModal.show();
+      }
+    });
+    /*]]>*/
+    function setAnalytics(enabled) {
+      fetch('api/v1/settings/update-enable-analytics', {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json'
+        },
+        body: JSON.stringify(enabled)
+      })
+              .then(response => {
+                if (response.status === 200) {
+                  console.log('Analytics setting updated successfully');
+                  bootstrap.Modal.getInstance(document.getElementById('analyticsModal')).hide();
+                } else if (response.status === 208) {
+                  console.log('Analytics setting has already been set. Please edit /config/settings.yml to change it.', response);
+                  alert('Analytics setting has already been set. Please edit /config/settings.yml to change it.');
+                } else {
+                  throw new Error('Unexpected response status: ' + response.status);
+                }
+              })
+              .catch(error => {
+                console.error('Error updating analytics setting:', error);
+                alert('An error occurred while updating the analytics setting. Please try again.');
+              });
+    }
+
+
+
+
+
    document.addEventListener("DOMContentLoaded", function() {
-      const surveyVersion = "1.1";
+      const surveyVersion = "2.0";
      const modal = new bootstrap.Modal(document.getElementById('surveyModal'));
      const dontShowAgain = document.getElementById('dontShowAgain');
      const takeSurveyButton = document.getElementById('takeSurvey');

-      if (localStorage.getItem('surveyVersion') !== surveyVersion || !localStorage.getItem('dontShowSurvey')) {
-        modal.show();
+      const viewThresholds = [5, 15, 30, 50, 75, 100, 150, 200];
+      let pageViews = parseInt(localStorage.getItem('pageViews') || '0');
+
+      pageViews++;
+      localStorage.setItem('pageViews', pageViews.toString());
+
+      function shouldShowSurvey() {
+        if (localStorage.getItem('dontShowSurvey') === 'true' || localStorage.getItem('surveyTaken') === 'true') {
+          return false;
+        }
+
+        if (localStorage.getItem('surveyVersion') !== surveyVersion) {
+          return true;
+        }
+
+        return viewThresholds.includes(pageViews);
      }

+      if (shouldShowSurvey()) {
+        modal.show();
+      }

      dontShowAgain.addEventListener('change', function() {
        if (this.checked) {
@@ -357,18 +465,14 @@
      });

      takeSurveyButton.addEventListener('click', function() {
-        localStorage.setItem('dontShowSurvey', 'true');
+        localStorage.setItem('surveyTaken', 'true');
        localStorage.setItem('surveyVersion', surveyVersion);
        modal.hide();
      });
-
-      if (localStorage.getItem('dontShowSurvey')) {
-        modal.hide();
-      }
-    });*/
+    });
  </script>


 </body>

-</html>
+</html>
--- a/src/main/resources/templates/split-pdf-by-chapters.html
+++ b/src/main/resources/templates/split-pdf-by-chapters.html
@@ -0,0 +1,64 @@
+<!DOCTYPE html>
+<html th:lang="${#locale.language}" th:dir="#{language.direction}" th:data-language="${#locale.toString()}"
+      xmlns:th="https://www.thymeleaf.org">
+
+<head>
+  <th:block th:insert="~{fragments/common :: head(title=#{splitByChapters.title}, header=#{splitByChapters.header})}"></th:block>
+</head>
+
+<body>
+<div id="page-container">
+  <div id="content-wrap">
+    <th:block th:insert="~{fragments/navbar.html :: navbar}"></th:block>
+    <br><br>
+    <div class="container">
+      <div class="row justify-content-center">
+        <div class="col-md-6 bg-card">
+          <div class="tool-header">
+            <span class="material-symbols-rounded tool-header-icon organize">book</span>
+            <span class="tool-header-text" th:text="#{splitByChapters.header}"></span>
+          </div>
+          <form th:action="@{'/api/v1/general/split-pdf-by-chapters'}" method="post" enctype="multipart/form-data">
+            <div
+                    th:replace="~{fragments/common :: fileSelector(name='fileInput', multipleInputsForSingleRequest=false, accept='application/pdf')}">
+            </div>
+
+            <div class="mb-3">
+              <label for="bookmarkLevel" th:text="#{splitByChapters.bookmarkLevel}"></label>
+              <input type="number" class="form-control" id="bookmarkLevel" name="bookmarkLevel" min="0" value="0" required>
+            </div>
+
+            <div class="mb-3 form-check">
+              <input type="checkbox" class="form-check-input" id="includeMetadata" name="includeMetadata">
+              <label class="form-check-label" for="includeMetadata" th:text="#{splitByChapters.includeMetadata}"></label>
+            </div>
+
+            <div class="mb-3 form-check">
+              <input type="checkbox" class="form-check-input" id="allowDuplicates" name="allowDuplicates">
+              <label class="form-check-label" for="allowDuplicates" th:text="#{splitByChapters.allowDuplicates}"></label>
+            </div>
+
+            <p>
+              <a class="btn btn-outline-primary" data-bs-toggle="collapse" href="#info" role="button"
+                 aria-expanded="false" aria-controls="info" th:text="#{info}"></a>
+            </p>
+            <div class="collapse" id="info">
+              <p th:text="#{splitByChapters.desc.1}"></p>
+              <p th:text="#{splitByChapters.desc.2}"></p>
+              <p th:text="#{splitByChapters.desc.3}"></p>
+              <p th:text="#{splitByChapters.desc.4}"></p>
+            </div>
+
+            <br>
+            <button type="submit" id="submitBtn" class="btn btn-primary" th:text="#{splitByChapters.submit}"></button>
+          </form>
+
+        </div>
+      </div>
+    </div>
+  </div>
+  <th:block th:insert="~{fragments/footer.html :: footer}"></th:block>
+</div>
+</body>
+
+</html>