A text-based bookmark manager rendered in a web page
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

271 lines
8.4 KiB

10 months ago
*FR → LISEZMOI.md*
10 months ago
**Work in progress, if you encounter any issues regarding
installation or understanding what this is all about, please send an
email to contact@martinlemaire.fr or open an issue here and i'll be
happy to answer**
A browsable webpage generated from a textual database you might want to
use as a browser homepage. You can edit the database by editing the file
called BOOKMARKS or by running the provided script called
10 months ago
edit_bookmarks_dmenu.sh (requires dmenu). Signet.sh is the name of the
repository in reference to the name of the core script (more on the naming bellow). The script can be ran from the command line but I suggest to bind it to a keystroke combination.
It produces the following html document :
10 months ago
index.html
![a browsable bookmark manager](https://www.martinlemaire.fr/signet.sh/demo.png)
A sample of its corresponding textual database, in the form of blankline
10 months ago
separated records with ```Key: value``` fields :
10 months ago
BOOKMARKS
```
URL: http://fileformats.archiveteam.org/wiki/HEX_(Unifont)
Name: HEX (Unifont) - Just Solve the File Format Problem
Description:
Tags: bbb, hex
Date: 1704636690
Color: Pink
URL: http://robhagemans.github.io/monobit/
Name: Hoard of bitfonts
Description: Bitmap fonts collection
10 months ago
Tags: bitmap, fonts
Date: 1704639859
URL: https://en.wikipedia.org/wiki/Wish_(Unix_shell)
Name: wish (Unix shell) - Wikipedia
Description: a Tcl interpreter extended with Tk commands for unix.
Tags: gui, wish, tcl
Date: 1704646543
URL: https://www.kreativekorp.com/
Name: Rebecca G. Bettencourt
Description:
Tags: RGB, people, hide
Date: 1704648764
```
Given this database, signet will color the first link in pink and hide
the last one because of its "hide" tag.
10 months ago
10 months ago
# Get started
1. First step
10 months ago
Clone this repository, make signet.sh executable and run signet.sh by
specifying a file of bookmarks to process and redirect its output to an
html file.
```
git clone https://git.vvvvvvaria.org/clemtre/signet.sh.git
cd signet.sh
chmod +x signet.sh
./signet.sh BOOKMARKS > index.html
```
2. A sample database of bookmarks
10 months ago
You can try signet.sh with this 32kb example BOOKMARKS database :
```
curl -O https://martinlemaire.fr/signet.sh/BOOKMARKS
```
3. Junicode typeface
10 months ago
You might be in search of a condensed font in order to fit more
characters per line, if that's the case I can recommend the condensed
light version of **Junicode**, an OFL typeface drawn by Peter Baker. You
can get mirrored versions Junicode-Condensed.otf and
Junicode-CondensedLight.otf (1.8Mb total) from the 50Mb archive here :
```
# from https://github.com/psb1558/Junicode-font/releases/tag/v2.206
curl -O https://martinlemaire.fr/fonts/Junicode-Condensed.otf
curl -O https://martinlemaire.fr/fonts/Junicode-CondensedLight.otf
```
4. jquery
10 months ago
Signet.sh webpage requires jquery, you can curl the 72Kb slim, minified
version over :
```
curl -O https://code.jquery.com/jquery-3.7.1.slim.min.js
```
5. dmenu
10 months ago
https://askubuntu.com/questions/828450/how-to-install-dmenu
10 months ago
# Presentation
## signet.sh
Signet.sh is a shell script parsing a bookmark database to a webpage.
It uses awk inside a here-doc declaration redirected to an html file.
I have created this script because I found the bookmarks manager from
firefox not great to use, to the point where I did not have the habit to
10 months ago
bookmark my browsing journeys. Firefox stores bookmarks in a sqlite
which is not human readable. Although it allows an export in json and
html, I wanted something text based and personal.
10 months ago
## Bookmarks database format
Only a Url is required, the rest of the fields are optional :
10 months ago
* URL : the url pasted from the clipboard (exits if no url given)
* Name : grabs </title> from the bookmarked page with curl
* Description : a description from the user
10 months ago
* Tags : comma separated keywords
10 months ago
* Date : posix time of the bookmarked link
10 months ago
* Color : css color (name, hex, rgb etc...)
10 months ago
10 months ago
## index.html structure generated by signet.sh
```
\<!DOCTYPE html>
10 months ago
<html>
<head>
<title>⛵ → YY-MM-DD, H:M</title>
<script defer src="jquery-3.6.4.js"></script>
<script defer src="script.js"></script>
<link rel="stylesheet" href="style.css">
<meta charset="utf-8" />
</head>
<body>
<div id="cc"></div>
<textarea autofocus></textarea>
<nav>
<p>tag (amount)</p>
</nav>
<ol>
<li>
<a href="URL">
<section color="Color">
<h5>URL</h5>
<h1>Name</h1>
<h2>Description</h2>
<h3>Tags</h3>
<h4>Date</h4>
</section>
<a>
</li>
</ol>
<footer></footer>
</body>
</html>
10 months ago
```
10 months ago
# Usage
## Add a bookmark :
10 months ago
10 months ago
To add a link, I select the URL of the page with Ctrl + l, then copy to
clipboard and run add.sh with Super + i.
10 months ago
10 months ago
__If anyone knows how to retrieve the url of the current browser page
without having to copy it and send it to clipboard, this would save two
steps out of three.__
In short : Ctrl + l, Ctrl + c, Super + i
(or shorter : Ctrl + l + c, Super + i)
Super + i because in my window manager (awesomewm) configuration file
located in ~/.config/awesome/rc.lua, I have the following lines:
```
awful.key({modkey}, "i", function()
10 months ago
awful.util.spawn_with_shell("edit_bookmarks_dmenu.sh ~/BOOKMARKS") end,
{description = "Add a bookmark to my database of bookmarks"}),
10 months ago
```
10 months ago
## Edit a bookmark :
10 months ago
10 months ago
Use your text editor of choice. Open the BOOKMARKS file and edit the
entry. The last entry is at the bottom.
10 months ago
10 months ago
If you use vim, with BOOKMARKS opened you can press in normal mode m +
B and it will save a mark to the file you can then access with ' + B
# Installation
10 months ago
Works on Ubuntu 20 LTS, it should work on POSIX
compliant machines, macOS, linux* or bsd*. I'm curious to know how it
10 months ago
goes on windows :^)
10 months ago
# Dependency :
10 months ago
10 months ago
To add a link via the proposed interface, we will need
to install dmenu ~~and htmlq~~.
* dmenu https://tools.suckless.org/dmenu/ (MIT/X)
* ~~htmlq https://github.com/mgdm/htmlq (MIT)~~ replaced by one
awk command
10 months ago
* xclip ?
10 months ago
## dmenu
Dmenu is an interactive menu that allows us to select and write
values in a menu. These values can come from a program
provided as input from a pipe "|", for example:
```
ls | dmenu
```
displays a drop-down menu with the files in my directory.
In our script, to store the given tags in a variable, we can do:
```
tags=$(echo "" | dmenu -p "Enter comma-separated tags:")
```
10 months ago
10 months ago
## ~~htmlq~~
Htmlq is an HTML parser written in Go. It doesn't matter which parser we
10 months ago
use, it seems that each language has its own.
10 months ago
We give to the program an html string and it filters through it using css
selectors returning the found html elements
Using javascript, retrieving all the \<h1> children of a \<section> can
be done with :
```
document.querySelectorAll('section h1')
```
10 months ago
In shell, it's more complicated since we don't have document object
model we can query. Htmlq is made for that:
10 months ago
```
cat fichier.html | htmlq 'section h1'
```
And to output only the text -- the javascript equivalent of .innerHTML:
```
cat fichier.html | htmlq 'section h1' --text
```
We use it to retrieve the title tag of the page to add:
```
curl page.html | htmlq 'title' --text
```
Pre-release patch:
```
curl $url | awk -v RS='</title>' \
'/<title>/ {gsub(/.*<title>/, ""); print}' |\
tr -d '\n'
```
For the moment this step is blocking. In case internet cuts while
bookmarking a link, you will have to wait for the end of the curl
attempt to move to the next field in the script :/ sorry!
10 months ago
# Repository structure :
10 months ago
* BOOKMARKS → A textual database of bookmarks
10 months ago
* edit_bookmarks_dmenu.sh → A script to add a link to the database using
dmenu
10 months ago
* Usage : ./edit_bookmarks_dmenu.sh BOOKMARKS
* signet.sh → The shell script itself
* It generates a new html page from the database of bookmarks
* Usage : ./signet.sh BOOKMARKS > index.html
10 months ago
* style.css → Stylesheet for index.html
10 months ago
* script.js → A bit of jquery for:
10 months ago
* search in the \<textarea>
* add background colors to entries that have them
* if the description field is empty, do not display it
* format posix time dates to YY-MM-DD format
10 months ago
# Naming
The name is subject to change.
10 months ago
Victor suggested *signet*, it stands for the actual pieces of paper used
as bookmarks inserted between the pages of a bound object →
https://www.cnrtl.fr/definition/signet
10 months ago
# Other bookmark managers:
- nb https://xwmx.github.io/nb/ (AGPL-3.0)
- ??
10 months ago
# Credits
10 months ago
* Junicode (OFL-1.1)
10 months ago
https://psb1558.github.io/Junicode-font/
10 months ago
* dmenu (MIT/X)
10 months ago
https://tools.suckless.org/dmenu/
10 months ago
* jquery (MIT)
https://jquery.com/
10 months ago