no-brainer-webpage

Easy to install webpage using markdown and optionally providing full text search, password protection, links that will expire, content encryption and more.

Features

What features are available?

• navigation is generated
• protect your web site optionally by a password
• links expire if the site is password protected
• encrypted content if the site is password protected
• search with AND/OR, case sensitive/insensitive
• last modified date
• settings... let the user make choices
  • use OR for searches, default is AND
  • use case insensitive search, default is case sensitive
  • use the search to create a token (for password protected sites)
• Images as navigation links
• horizontal rulers to separate navigation levels

How to enable/disable Features?

Change the values in index.html

1... for enabled
0... for disabled

<div class="features"> 
 <span id="feature_restricted">1</span>
 <!-- change this hash to login -->
 <span id="feature_restricted_hash">00f6faeda324073d9981b54c8f72b40e2c57fd0f0cf98ad39a7c71381bd93586</span>
 <span id="feature_restricted_pass">tozaNH72ykyb09Bpp3qGXe+GCDaI5ymuBwtVGRGlXN1B+9yUK98huW/Emnty1q9FnNap4qiq</span>
 <span id="feature_token_expire_days">7</span>
 <span id="feature_search">1</span>
 <span id="feature_modified">1</span>
 <span id="feature_settings">1</span>
 <span id="feature_hr_navigation">1</span>
</div>

Real World Examples

Webpage of an artist. The page uses images as navigation links.

• disabled password protection
• disabled search field
• disabled settings
• disabled modified time
• disabled horizontal rulers to separate navigation levels

Demo page.

• enabled password protection
  • password is "easy"
  • link expiration 1 day (..same day)
• enabled search field
• enabled settings
• enabled modified time
• encrypted content (in index.txt visible in index.md = start page)
• images as navigation links (in philosophy.md)

How to install

Your webserver must have PHP enabled.

Copy the files of this repostitory into the file system of your webserver.

That's it.

If you are familiar with git, use...

git clone https://codeberg.org/ojrandom/no-brainer-webpage

for updates...

git pull

To change pages or add new new ones...

• Please see under directory "pages" and it's subdirectories.
• Follow the pattern there, create subdirectories and files *.md.
• Use markdown inside the pages.
• Enable/disable the features, see above.

How to use Password Protection

Enable Password Protection

Set the value for feature_restricted to 1 in index.html

<span id="feature_restricted">1</span>

Create and Enable your Password

Open your webpage in your webrowser and show the console via the "developer options", mostly likely by pressing F12.

In the console enter

getHash("easy")

...or whatever your password is. It should show you

00f6faeda324073d9981b54c8f72b40e2c57fd0f0cf98ad39a7c71381bd93586

for "pass". Use this for index.html, in our example...

<span id="feature_restricted_hash">00f6faeda324073d9981b54c8f72b40e2c57fd0f0cf98ad39a7c71381bd93586</span>

The next time you try to access your webpage the browser will ask for your password "easy" (in our case).

How to give others access?

Expiration

The access for others will expire after some days, default 7 days. If you want to change it use...

<span id="feature_token_expire_days">7</span>

Option 1: Single Page

Open a page.

Copy the URL.

Send the URL to somebody.

The URL will only show this single page without the navigation links or any other feature.

The access will expire after some days, see chapter above.

Option 2: Pages of a Search Result

Enable in index.html...

<span id="feature_settings">1</span>

Open the settings via the button in the left upper corner of your webpage and select "Token: use search"

Enable the search in in index.html...

<span id="feature_search">1</span>

A search field should show up in your webpage. Do a search. Click one of the pages found and copy the URL.

Send this URL to somebody.

If somebody opens the URL he will only see the pages the search has found. The access will expire after some days, see chapter above.

How to use Encrypted Content

Enable login with password.

Open the encryption tool under settings or open pages/enc.html

Use the login password to encrypt your password for your encrypted content.

Example values for our example

• Type the login password "easy" in the text field password.

• Type the password for your encrypted content "simplepass" in text field Plain text.

• Press Encrypt.

• The base64 representation of the AES-GCM encrypted password should be "tozaNH72ykyb09Bpp3qGXe+GCDaI5ymuBwtVGRGlXN1B+9yUK98huW/Emnty1q9FnNap4qiq"

• Copy "tozaNH72ykyb09Bpp3qGXe+GCDaI5ymuBwtVGRGlXN1B+9yUK98huW/Emnty1q9FnNap4qiq" into index.html

  tozaNH72ykyb09Bpp3qGXe+GCDaI5ymuBwtVGRGlXN1B+9yUK98huW/Emnty1q9FnNap4qiq

To write encrypted content in a webpage...

Provided you have a webpage index.md and you want to show encrypted content there, then

Create a file *.txt that has the same name as the *.md, in our example index.txt.

Encrypt some text with the same procedure as you used above, in our example...

• Passwort: "simplepass"
• Plain text: Any text you like. Also markdown including links are possible.
• Encrypt
• Copy the encrypted text into your *.txt (in our example index.txt).

To make the encryption more convenient you will see both

• password
• encrypted markdown

in the browser console.

How to use Images as Navigation Links

Provided you have a page "Kant.md".

Copy an image "Kant.webp" into the same directory of "Kant.md".

It is important to use

• The same name (Kant) and
• The suffix webp.