Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feature request: shortcut for search bar toggle #93

Closed
Jocho-Smith opened this issue Mar 6, 2024 · 6 comments
Closed

feature request: shortcut for search bar toggle #93

Jocho-Smith opened this issue Mar 6, 2024 · 6 comments
Labels
enhancement New feature or request

Comments

@Jocho-Smith
Copy link

I use otterwiki almost daily and one thing I've noticed is that when I search for something I know is captured in the wiki (and I know in which article it is), it takes a relatively long time to get to it (compared to other software I use).

When I could use a shortcut for the searching bar and stay with the cursor in the middle of the screen, it would go a lot faster.

If the search bar would already show me the 3 'closest' results it would be even faster.
This 'closeness' would be already perfect if it would just be a grep -i wrapper, so no fancy 'taking typos into consideration' stuff.

Let me know if I can support the feature development somehow.

@redimp
Copy link
Owner

redimp commented Mar 6, 2024

Thanks for opening this request.

To be clear: a) Handling the UI is what slows you down? Or does b) the search in the filesystem take too long?

if a): A shortcut like the Ctrl-K in Linux/Windows or Cmd-K in MacOS that focuses the search bar might help you? I have some hotkeys on my roadmap, will push this up on my list.

I personally don't the like pop up windows showig the search results, that are common in most modern web applications. In my experience they are too often not as useful as a well organizied result page. However, I would be happy to look at a pull request that implements this feature.

@Jocho-Smith
Copy link
Author

Jocho-Smith commented Mar 6, 2024

I would say b), but it's not like it is too long, I just know that I slight tweak will speed it up substantially for me.

I don't know how to do it with Flask, but the functionality I'm asking for is implemented in JS in the following example:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Toggle Search Bar</title>
</head>
<body>
<h1>Test:</h1>

<!-- Search bar -->
<input type="text" id="searchBar" class="search-bar" placeholder="Search...">

<script>
    document.addEventListener("keydown", function(event) {
        var searchBar = document.getElementById("searchBar");
        if (event.ctrlKey && event.key === "/") {
            searchBar.focus(); 
            event.preventDefault(); // Prevent the default action of the key combination (usually opening the browser's search)
        }
    });
</script>

</body>
</html>

if you press CTRL + / is does the thing. Forget about the search results :D

@Jocho-Smith
Copy link
Author

I looked at it a bit now. I think the following should do it:

  1. in otterwiki/templates/layout.html adding the id="searchBar"
  2. somewhere in the templates or in the static/js just adding the script in the code I just provided.

Can you tell me how to do step 2.? Than I would try to do a pull request.

@redimp
Copy link
Owner

redimp commented Mar 10, 2024

Got a solution in the queue:

I'm testing / is the the hotkey of choice, even if it overwrite the search in some browsers (in my tests, there Ctrl-F or CMD-F was still an option)

@redimp redimp added the enhancement New feature or request label Mar 10, 2024
@redimp
Copy link
Owner

redimp commented Mar 12, 2024

/ added as icon in the search bar:

image

Browser Test:

image

@Jocho-Smith
Copy link
Author

uuh, nice!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

2 participants