Toggles the visibility of completed and canceled to-dos

Overview

Logseq Wide Eyed Plugin

Toggles the visibility of completed and canceled to-dos.

Toggling is controlled by the eye appearing in the toolbar. It has opened and closed states which determine the appearance of matching blocks. This is useful for showing/hiding content such as completed/canceled to-dos, but it can be configured for other purposes.

If any matching content is found on the page or its linked references the eye is underlined.

The opened styling rules are in effect only while hovering over the page body.

See the Style Carousel Plugin as it is similar and may better suit your needs. Read the Design Notes if you're not sure.

Configurable Settings

  • status — a preferred initial status of opened or closed
  • match — a regular expression string which matches against text content
  • closed — stylesheet rules applied against matched blocks when the eye is closed
  • opened — stylesheet rules applied against matched blocks when the eye is opened
  • targets — what contexts are evaluated?
  • refreshRate — how often in seconds to check for changes to current page? 0 to disable

Default Settings

  • status — "closed"
  • match — "(^DONE|^CANCELED) "
  • closed — "display: none;"
  • opened — "text-decoration: underline wavy;"
  • targets — ["journals", "page-body", "linked-refs"]
  • refreshRate — 5

Design Notes

The primary difference between Wide Eyed and Style Carousel is the manner of content matching. The former matches directly against block objects as they exist in browser memory while the latter matches against what gets rendered to the DOM. Because Style Carousel relies purely on CSS selectors, it is simpler and quicker. But it is also weaker in that it can only match against what can be detected in the DOM with CSS selectors. In most situations this will be sufficient for your needs.

The block matching approach of Wide Eyed has the potential to be far more powerful than DOM matching, but since the Logseq Plugin api lacks rendering events it has to work unnecessarily hard to sychronize the UI with whatever blocks flow into a page. And, in some cases, like the Journals page, certain blocks sneak lazily into the page. Since Logseq keeps this information to itself, rather than sharing it, the plugin cannot react. Please vote for these suggestions if you'd like this to be improved. With more hooks Wide Eyed could do everything Style Carousel does and more, but without them it's just not possible.

While both plugins by default toggle TODO visibility, it was never meant to be their sole purpose. Rather it was meant to offer an example of what's possible. The purpose is to allow you to configure buttons which conditionally find and style content in whatever manner you dream up.

Manual installation

  • Download this repo
  • In Logseq:
    • Ensure Developer Mode is on
    • Open Plugins
    • Select Load unpacked plugin

License

MIT

You might also like...

Microverse Module 02 Project: This is an educational project to make a TodoList web application, where the users can add new todo, remove todo, edit todo, mark todo as completed, and remove all completed todo. Built with Webpack

todo-list This project is about building a list of To Do tasks. Where you can save your daily activities and help in daily evaluation. Live demo you v

Jan 3, 2023

The project focused on creating To do list structure for organising the daily completed or non-completed activities.

Project to build a simple HTML list of To Do tasks. The list will be styled according to the specifications given by Microverse This simple web page will be built using webpack and served by a webpack dev server.

May 20, 2022

Uma aplicação criada com react-native para armazenar as skills dos usuários cadastrados.

Uma aplicação criada com react-native para armazenar as skills dos usuários cadastrados.

SkillsClass Aplicação focada no gerenciamento de skills dos usuários cadastrados. Uma aplicação desenvolvida no ignite da Rocketseat com alguns toques

Dec 25, 2021

Educare é um projeto que visa auxiliar os estudos dos alunos por meio da resolução de questões. Front-end construído com Next.js.

This is a Next.js project bootstrapped with create-next-app. Getting Started First, run the development server: npm run dev # or yarn dev Open http://

Feb 6, 2022

Overlay dos brasileiros, a partir do Discord, no r/place 2022

[Instruction available in English below] - Instruções de uso do overlay do r/brasil no r/place 2022 INSTRUÇÕES PARA USAR O OVERLAY: Instale o TamperMo

Sep 20, 2022

Uma Api dos 151 primeiros pokemons utilizando NodeJS, Typescript, Docker, MongoDB e Mongoose.

Uma Api dos 151 primeiros pokemons utilizando NodeJS, Typescript, Docker, MongoDB e Mongoose.

Pokedex API Tópicos Preview Sobre o Pokedex Api Tecnologias Instalação e uso Preview Clique aqui para ter acesso a um preview da Api. Sobre o Pokedex

Nov 27, 2022

Aplicativo web para apurações dos resultados da eleições de 2022 para presidente.

Aplicativo web para apurações dos resultados da eleições de 2022 para presidente.

APP de Apurações dos Resultados das Eleições de 2022 https://apuracoes-eleicoes-2022.netlify.app/ Trata-se de um aplicativo minimalista com o objetivo

Oct 31, 2022

Código-fonte do site dos Guardians UFCG.

Guardians UFCG Esse é o repositório com o código-fonte do site dos Guardians UFCG. User Interface Nosso Front-end será baseado nesse documento do Figm

Oct 22, 2022

An app to manage tasks. A user can add, delete and edit a task and mark it as completed, It uses simple GUI and relies on DOM manipulation in pure JS and using local storage.

An app to manage tasks. A user can add, delete and edit a task and mark it as completed, It uses simple GUI and relies on DOM manipulation in pure JS and using local storage.

An app to manage tasks. A user can add, delete and edit a task and mark it as completed, It uses simple GUI and relies on DOM manipulation in pure JS and using local storage.

Aug 20, 2022
Comments
  • Ability to choose particular pages where plugin works

    Ability to choose particular pages where plugin works

    First of all, thank you for your plugin. It really useful and save my eyes from visual noise. ❤️

    But, I use several pages with different scenarios so for some of pages is OK to be hidden when completed, but for some of them - NOT.

    I see the option target, but it doesn't allow to choose particular page, just opt out all pages or all journal pages.

    It would be really nice to have an ability to (at least) exclude some of pages by their name. Because it's quite annoying to toggle plugin every time you switch the page.

    opened by kamilmodest 3
  • Remove wavy line

    Remove wavy line

    Is it possible to remove the following code?

        opened: logseq.settings.opened || "text-decoration: underline wavy;"
    

    I really love this plugin, but the wavy lines really interfere with my ability to read text when I'm not hiding completed tasks. I would prefer not to have any additional styles applied to them other than what is already in the theme I'm using. Thanks.

    opened by kerim 2
  • Hide checked TODOs in embeded block refs

    Hide checked TODOs in embeded block refs

    I have no idea if this is technically possible, but if it is that would be great, because I often use embedded block refs on my project pages and currently they are not hidden by the plugin.

    opened by kerim 2
Owner
Mario T. Lanza
Husband, Father, Web Developer, Eurogamer
Mario T. Lanza
Uma Intranet que permite um acesso restrito e promove a integração dos processos de uma empresa, facilitando o dia-a-dia dos seus colaboradores.

Intranet ANÁLISE E DESENVOLVIMENTO DE SISTEMAS PROJETO: DESENVOLVIMENTO WEB FRONT-END 1 SEMESTRE Uma Intranet que permite um acesso restrito e promove

Análise e Desenvolvimento de Sistemas - PUC Minas Virtual 5 Jun 1, 2022
A simple To Do List application that allows users to save, edit, mark completed, and delete their to-dos, and save their list when application is closed. Build with JavaScript.

To Do List A simple To Do List online application that allows users to save, and manipulate their to-dos, and save their list when application is clos

Mahmoud Rizk 10 Dec 20, 2022
High performance and SEO friendly lazy loader for images (responsive and normal), iframes and more, that detects any visibility changes triggered through user interaction, CSS or JavaScript without configuration.

lazysizes lazysizes is a fast (jank-free), SEO-friendly and self-initializing lazyloader for images (including responsive images picture/srcset), ifra

Alexander Farkas 16.6k Jan 1, 2023
GraphQL Hive provides all the tools the get visibility of your GraphQL architecture at all stages, from standalone APIs to composed schemas (Federation, Stitching)

GraphQL Hive GraphQL Hive provides all the tools the get visibility of your GraphQL architecture at all stages, from standalone APIs to composed schem

Kamil Kisiela 184 Dec 21, 2022
This is a simple web application of a To-do List in which you can add, remove and edit all your tasks and also you can mark each task as completed and delete all completed ones.

To-Do List A simple web application of a to do list Built With HTML, CSS, JS, ES6 & Webpack Getting Started In this repository I created To-Do List SP

Juan Sebastian Sotomayor 12 Apr 11, 2022
A to-do list Web application that lets the user add, remove and reorder to do lists and checks a task when completed with a button to delete all completed task

TO DO LISTS A Web application that lets the user add, remove and reorder to do lists Built With Html,JS,CSS Webpack and other dependencies Git, Github

Promise Okechukwu 14 Nov 1, 2022
A single-page application that allow users to add their To Do items. The items could be checked as completed and the completed task can be removed. Built with JavaScript, HTML and CSS

To Do list Application This is a single page application that allows users to keep track of their tasks. Users can add the task and also check the che

Micheal Oguntayo 4 Oct 14, 2022
A to do list where you can add tasks, mark completed tasks and clear all completed tasks.

To Do List A to do list where you can add tasks, mark completed tasks and clear all completed tasks. You can rearrange the order of the tasks by doubl

Amira 7 Mar 4, 2022
This is a To-Do List. It shows a minimalist design with the next features: Add new tasks, edit tasks, markup completed tasks, and erase all completed tasks. Built with JavaScript.

Project Name To Do List Built With HTML CSS JavaScript Live Demo To do List Live Demo Link Getting Started This is a To Do List. It shows a minimalist

Santiago Cárdenas 6 Jun 9, 2022
A daily activity tracking application that helps to organize your daily tasks and keep track of tasks that have been completed, or yet to be completed.

To-Do-List This is my To-Do List project in the Microverse curriculum. Built With HTML CSS Javascript (Webpack) GitHub Live Demo Live Demo Link Gettin

Hammed Adisa 8 May 7, 2022