notable/notable-insiders v1.9.0-alpha.0

on GitHub

Overview

• Most of the app has been completely rewritten, with the following goals in mind
  • Bringing the app closer to supporting plugins
    • Many built-in features are now implemented as internal plugins
    • The app is now foundamentally based on VS Code-like primitives like settings, context keys, commands and shortcuts, which will be the building blocks of future plugins
  • Bringing the app closer to being able to run in the browser and on smartphones
    • Electron's "main" and "renderer" processes have been almost completely decoupled from each other
    • Electron's "renderer" process is close to being completely sandboxed, which would make it not that much different from a regular browser tab, once that happens the app will be able to run in the browser with some minor modifications
  • The codebase is now in a much better state, which overall should lead to fewer bugs and faster iteration speed
• This release will require some exploration to fully master
  • With 448 commands, 241 shortcuts, 83 context keys, 177 customizable colors, 19 standalone palettes and 18 context menus implemented this changelog can only attempt to cover a fraction of what's new
• The codebase grew from 14k lines of code to 26k lines of code

New Features

• Online presence
  • New domain: notable.app
    • That is a much more premium domain, which the previous owner gifted to us
    • The updated website serves ~98% fewer JavaScript (~40kb -> ~1kb) and ~40% fewer bytes overall (~550kb -> ~350kb)
  • Public Discord chat: chat.notable.app
  • Twitter handle: @TheNotableApp
  • YouTube channel: Notable
  • Snap store: Notable
• Redesign
  • The UI has been redesigned to be cleaner and more pleasant to look at
  • Mainly lists and trees now have their items more spaced out
  • Sidebar
    • The sidebar is now divided into sections, both for more easily distinguishing them and for making space for some future buttons
    • All "All Notes" sections, except for "Notes/All Notes", are now hidden to discourage their usage, but they can still be selected from the palette
    • The chevron used for collapsing and expanding tags now is animated too
    • Tags can now be recursively collapased and expanded by CmdOrCtrl+Click-ing their chevrons
• Commands (help page)
  • 448 commands have been implemented
  • Almost every action you can take in the app is now exposed as a command, you can think of commands as like functions in a programming language
  • Any command can be assigned to custom shortcuts
  • Any command can be triggered via notable:// URLs from outside of the app too
  • Some commands accept one or more arguments, which make them expecially flexible and powerful
  • All commands that don't require any arguments can be triggered from the command palette
  • All buttons and menu items throughout the app behind the scene just trigger a specific command
  • Some commands are visible in the command palette depending on the evaluation of some context keys expressions
  • Some notable commands:
    • macro: this is a simple but powerful command that executes a sequence of other commands, potentially passing arguments to each of those commands
    • note.tag.toggle: this command will show you a searchable list of tags that can be added or removed from the current note, it will also display a dynamic item for adding a new custom tag. When passing arguments to it you could also use it to configure shortcuts that toggle specific tags quickly
    • settings.cycle: this command receives an array of settings objects, and cycles through them, it could be used for implementing a custom "Focus" mode that works like you want, or in combination with notable:// URLs it could be used for creating a link that when clicked changes the whole theme of the app
    • edit.write: this command simply writes the passed string in the currently focused editable element, it could be used in combination with shortcuts to make a bare-bones snippets manager
    • contextKey.set: this advanced command can be used for definying new custom context keys, which you might want to play with for adding vim- or emacs-like shortcuts to the app
• Shortcuts (help page)
  • 241 shortcuts have been implemented
  • Custom shortcuts can be added
  • Shortcuts trigger commands, optionally passing them some arguments
  • Shortcuts can be enabled dynamically depending on the evaluation of a context keys expression
  • Shortcuts using special tokens like CmdOrCtrl are resolved dynamically depending on the OS the app is running on
  • Any built-in shortcut can be removed
  • Both global-level and data-directory-level shortcuts can be added
  • Shortcut sequences, like Cmd+K Cmd+1, are fully supported
  • Shortcut hints are provided throughout the app in menu items and in buttons' tooltips
    • If you add some custom shortcuts then your custom shortcuts will be displayed as hints instead, when possible
  • Some notable shortcuts:
    • CmdOrCtrl+Esc: it triggers view.reset, which resets the view to its original state
    • Alt+Tab: it triggers note.go.heading.next, which navigates to the next heading in the note
    • CmdOrCtrl+T: it triggers tab.new, which asks you to select a note to open in a new tab
    • CmdOrCtrl+K CmdOrCtrl+W: it triggers tabs.close, which closes all tabs
    • CmdOrCtrl+Shift+S: it triggers export, which will export your active notes
• Context keys (help page)
  • 83 context keys have been implemented
  • Each context key describes a particular aspect of the state the app is currently in, you can think of context keys as like variables in a programming language
  • Most context keys represent boolean values, they are either true or false
  • You can combine context keys in an expression that will be evaluated dynamically to either true or false
  • Context keys expressions are written in a safe subset of JavaScript
  • Some notable context keys:
    • hasTab: it tells you if there is a tab open
    • settings: maybe the most powerful context key, it provides you with access to the entire settings object
    • isThemeDark: maybe you want to run some shortcuts only if the current theme is dark? Maybe not, but you can if you want
    • isMultiNoteEditorOpen: it tells you if the multi-note editor is currently active
    • editorLanguage: it tells you the language of the text in the current editor, useful for writing Markdown-only or JSON-only shortcuts
• Settings (//TODO: Maybe write an help page for settings too?)
  • Settings, this includes shortcuts too, are represented in the JSON format
  • Settings are stored on disk as JSON files
  • Both global-level and data-directory-level settings can be configured
  • All settings are preserved across restarts
  • Inline comments are supported
  • Path properties are supported (e.g. "theme.active": "dark")
  • Each setting is validated so it's impossible to configure an invalid setting that breaks the app, the app would just ignore it
  • Settings can be edited from outside the app too with any standalone text editor
  • Some notable settings:
    • editor.indentation.guides.enabled: it sets whether indentation guides are visible or not in the editor
    • katex.macro: you can define custom macros for KaTeX here
    • tabs.alwaysPersistent: it lets you always open persistent tab, without requiring double-clicks
• Theming (help page)
  • 177 colors have been implemented
  • All themes are entirely generated from those configurable colors
  • Colors can be customized by configuring the "theme.colors" setting
  • Both global-level and theme-level custom colors can be configured
    • Global-level colors should be provided at "theme.colors"
    • Theme-level colors should be provided at ``"theme.colors.[Title]"`, where "Title" is the title of a particular theme you want to customize the colors of
  • Built-in themes generate most of their colors from some other colors, so you only need to customize a handful of them to get a totally different-looking theme
  • Any valid CSS color can be used
  • Some notable colors:
    • colors:primary:background: this is probably the most dependend on color in each theme, changing it will have a ripple effect throughout the theme
    • window:border: when this color is not transparent a border will be added to your window, it could be useful for more easily distringuishing between data directories when configuring a different color for each one
    • editor:guide:backgroundActive: if you have indentation guides enabled you can configure this color to be different than editor:guide:background, this way the editor will tell you which indentation level is currently active
    • editor:fold:background: you can customize this color to have folded lines colored specially
• Themes
  • All built-in themes have been rewritten
  • The Dark theme in particular is now much more polished
  • A new, special, "Print" theme has been implemented
    • It's the theme used for priting
    • It's designed to reduce ink usage
    • It don't support global-level colors customizations but only theme-level customizations
• Palette
  • 19 standalone palettes have been implemented
  • All these palettes are available also from the main palette
  • The actual palette that will be searched into depends on the prefix used in your query
  • Shortcut hints for quickly picking results are provided
  • Many more palette-like widgets will be opened on demand by various commands for prompting you for a selection
  • Some notable palette prefixes:
    • ?: it shows you all available palette prefixes
    • >: it shows you all active commands that don't require any arguments, this is more commonly referred to as the "Command Palette"
    • :: it lets you jump to a specific line (and optionally column too)
    • $: it lets you quickly jump to another heading
    • language: it shows you all available languages for syntax highlighting
• Context menus
  • 18 context menus have been implemented
  • Pretty much anything that can be linked to has a dedicated context menu
  • A special "Inspect" item will become visible under any context menu when the Developer Tools window is open
• App menu
  • Shortcuts hints are synchronized with custom shortcuts, when possible
  • There's a new "Go" submenu, for opening palettes and navigating search results, tabs, tags etc.
  • Many new external links are available from the "Help" submenu
  • Many new help pages, including a version of the tutorial that you don't need to import, are available under the "Help" submenu
• Editor
  • 88 editor-specific commands have been implemented
  • The state of the last 50 editors is now preserved
  • Added a quick notification when explicitly manually saving an editor
  • Added support for folding
  • Added support for jumping to specific lines
  • Added support for navigating between headings
  • Added support for showing indentation guides
  • Added support for triggering links right from the editor with an Alt+Click
  • Aligned built-in shortcuts that trigger editor-specific commands much more with VS Code
  • Some notable editor commands:
    • editor.selection.next.cursor.add: it add a cursor to the next match of the current selection, you can use this for renaming multiple things at once, or as a bare-bones search replacement
    • editor.selection.highlight.all: like the previous command, but it executes the action for all matches
    • editor.selection.export: export the current selection as if it was a note
    • editor.cursor.undo: did you move the cursor by mistake or maybe you just want to go back to where it was before? This command lets you do that
• Multi-note editor
  • Added many more actions to it
    • Including copying links, markdown links and paths of notes
    • Including exporting, sharing and printing notes
  • Added support for adding/removing tags with just an Enter, without requring a click on the button, when the input is empty
• Markdown (help page)
  • The state of the last 50 rendered Markdown documents is preserved, including selections
  • Added support for notable:// URLs
  • Added support for all standard IANA TLDs
  • Added support for automatic Table of Contents generation ([[@toc]])
  • Added support for jumping to specific lines
  • Added support for jumping to the line in the editor that corresponds to the rendered element that receives a CmdOrCtrl+Click on it
  • Added support for inserting a forced page break ([[@break]])
  • Added support for navigating between headings
  • Added support for rendering PDFs, with page navigation support too
  • Added support for rendering PlantUML diagrams
  • Added support for rendering Prezi/Vimeo/YouTube links
  • Added support for rendering multimedia links at specific dimensions by appending a modifier to them (e.g. =300x200)
  • Generalized and renamed wiki-style links into quick-links, which are now links wrapped in double brackes that can be used to link to notes, attachments, searches, commands, headings, tags, regular urls and relative paths
  • Headings can now be clicked to navigate to them
  • Scrolling smoothly when triggering a target-based URL
• Tabs
  • An arbitrary number of tabs can now be opened
  • By default notes are opened in a non-persistent tab, which gets reused when opening new notes
  • Tabs can be made persistent by double-clicking a note, enabling the setting that makes them persistent by default, and in many other ways
• Custom scheme (help page)
  • Custom URLs starting with notable:// are supported
  • They can be used to link to notes, attachments, commands, headings, searches, shortcuts and tags
  • They can be used from outside the app too
  • They can be used to perform some form of scripting, since they can trigger commands in the app from the terminal for example
• Exporting
  • Added new export formats: JPEG, JSON and PNG
  • Added new export modes
    • Single: it will always only export one file
    • Separate: it will export each note and attachment to their own file
  • When only one note with no attachments is exported Single mode gets automatically selected, avoiding the creation of unnecessary wrapper folders
• Telemetry (help page)
  • Added an option for disabling it
  • Added support for logging telemetry events in the Developer Tools window
  • Flushing telemetry events in batches, minimizing network requests
• Updater
  • Notifying of available updates even when the built-in auto-updater is unavailable
  • Added support for manually checking for updates
  • Updating the app menu item dynamically to better reflect the state of the updater
• Miscellaneous
  • Upgraded Electron to v8.3.1
  • Upgraded Mermaid to v8.5.2
  • Added a built-in shortcuts screencaster
  • Added a "Centered" mode that centers and limits previews and editors to a certain width
  • Added a process explorer
  • Added support for hiding only the middlebar too
  • Added support for pasting images right from the clipboard from Windows and Linux too
  • Added support for printing one or multiple notes directly from the app
  • Added support for selecting multiple tags at the same time
  • Added support for sharing multiple notes at once
  • Displaying the changelog for each release in its own section
  • Replaced native dialogs with custom ones, that we'll be able to use in the browser too

Improvements

• Context menus: significantly improved performance
• Data directory: changed default path to ~/Notable/Default
• Editor: loading supported languages dynamically when needed rather than all at once
• Emoji: replaced built-in emoji table with a searchable emoji palette
• File system: always attempting to move files to the OS' trash rather than deleting them
• File system: logging errors in the Developer Tools console
• File system: queuing operations to the same target path, ensuring they don't conflict with each other
• Front matter: improved end token detection
• Front matter: using OS-specific newline characters
• Import: listing all extensions each import format supports
• Markdown: caching rendered Markdown when safe to do so
• Markdown: greatly improved Markdown stripping performance
• Markdown: greatly improved rendering performance in many cases
• Metadata: stricter and more reliable sanitization
• Resizable panes: saving the widths of resized panes much more reliably
• Sharing: the confirmation dialog now explicitly states that the link will be valid for 24h
• Snap: switched to the "classic" confinement, which enables the app to work properly
• Sorting: accounting for depth and extensions when sorting tags and attachments
• Sorting: accounting for emojis when sorting naturally
• Tutorial: importing data faster
• Tutorial: importing data more reliably
• Zoom: updating the minimum dimensions allowed for the app when the zoom level changes
• Zoom: updating the sempahore spacers' dimensions in order to always provide enough space for the semaphore buttons (macOS)
• Enforcing that only one instance of the app is open at any given time
• Improved OS-level theme change adaptation
• Repositioning popovers more accurately when their anchor element gets moved or removed

Bug Fixes

• App menu: ensuring all displayed checkmarks are consistent with the state of the app
• Context menus: ensuring only visible elements can show a context menu
• Emoji: fixed a rendering issue with ligated emojis
• Export: ensuring notes larger than 2MB can be exported
• Export: ensuring the export recovers if for any reason errors are encountered or the app hangs
• Export: queuing up multiple exports in order not to blow up RAM usage
• Fixed a crash when reopening a window
• Fixed an issue where having a package.json file in a parent folder could have caused the app to crash
• Markdown: ensuring complex HTML outputted by plugins don't get interpreted as Markdown later on
• Resizable panes: ensuring while resizing panes only the appropriate resize-specific cursor is shown all the time
• Sharing: ensuring the generated HTML is not minified unsafely
• Updater: ensuring only one check is being performed at any given time