Not logged in. · Lost password · Register
Forum: General Help and Support Templates and Layout RSS
AJAX quick search box enhancements
Avatar
FosseWay #1
Member since May 2016 · 102 posts · Location: Canada
Group memberships: Members
Show profile · Link to this post
Subject: AJAX quick search box enhancements
I've posted an Issue on the DokuWiki Github project describing enhancements I would like to see for the AJAX Quick Hits search box.

Here are the 4 goals I have set:

  • Make the quicksearch dialog wider - I don't want titles to be truncated, unless they're very long
  • Make the quicksearch dialog appear directly below the search input box, with its right edge aligned with the search box right edge, rather than floating nearby to the left
  • Allow keyboard up/down followed by ENTER to immediately go to an item which appears in the AJAX quick search results
  • Optionally, two lines per result, with the top line showing the position of the page in the namespace, and the second one showing the page name itself

I got most of the first two points done by hacking about with CSS in about 15 minutes, although items 3 and 4 are certainly more challenging.

Ultimately, I want to go from the current look and feel:

[Image: https://cloud.githubusercontent.com/assets/26946862/24976986/9161bd26-1f99-11e7-8869-cc8cb86feb87.png]

to this:

[Image: https://cloud.githubusercontent.com/assets/26946862/24977813/644f7140-1f9c-11e7-90a5-72af39d5276c.png]

While I'm not a talented designer, nor a DokuWiki back-end expert, I do hack around with both design and server-side stuff, and I have already customized some plug-ins for my own needs. Therefore, over time I hope to make these changes come to life. Of course, I would appreciate any feedback, and especially any information or other practical help.
Avatar
FosseWay #2
Member since May 2016 · 102 posts · Location: Canada
Group memberships: Members
Show profile · Link to this post
I have #1, #2, and #4 (edit - I mistakenly said #3 before!) working in my dev wiki now. Looks like this:

[Image: https://cloud.githubusercontent.com/assets/26946862/25502554/0ba70632-2b65-11e7-8a50-ba3ed0de6fb0.png]

Anyone interested in this?

All I had to do was make a small change to /lib/exe/ajax.php and a few entries in userall.css

I'm hoping to propose it for a future version of DokuWiki. Right now it's just hacked in, but if people are interested, I'll submit something on GitHub - of course the namespace hierarchy display would be optional controlled from config, since I'm sure not everyone wants that.
This post was edited 2 times, last on 2017-05-07, 14:40 by FosseWay.
Avatar
molefunk #3
User title: molefunk
Member since Jul 2010 · 54 posts · Location: Mayapur, India
Group memberships: Members
Show profile · Link to this post
We've had #1 and #2 in our wiki since some time, but I'm interested in #3. The namespace thingy might also be useful...

Looking forward to your contributions!
Avatar
FosseWay #4
Member since May 2016 · 102 posts · Location: Canada
Group memberships: Members
Show profile · Link to this post
Thanks for the feedback, molefunk. I was surprised that #1 and #2 aren't already done in DW core, so I might start by proposing a PR for just those.

I'm already finding the namespace display useful on my own production wiki.

I realise that I said I had #1, #2, and #3 working - this was a mistake, as #3 is the keyboard-up-down-enter idea, and I don't yet have that working. Sorry. I still intend to make this work though. I noticed a while ago that the Link Wizard has this functionality, so I imagine I can borrow it from there with a bit of work.
Avatar
molefunk #5
User title: molefunk
Member since Jul 2010 · 54 posts · Location: Mayapur, India
Group memberships: Members
Show profile · Link to this post
Yes, #1 and #2 seems like a natural addition to Dokuwiki.

If you don't mind sharing #4, I'll be happy to experiment with it. I probably only want top level namespace displayed (to easily discern between books, wiki articles, index entries and user pages), and possibly floated to the right on the same line. I think having this as an option in Dokuwiki would make sense, as I think many people prefer to use useheading (at least for Navigation). But better to make them separate PR's. :)

Regarding #3, whenever, if it comes, that will also be nice. If I had any programming skills, I would try to help out, but alas...
Avatar
FosseWay #6
Member since May 2016 · 102 posts · Location: Canada
Group memberships: Members
Show profile · Link to this post
For sure. Here it is. I only hacked it in for now, so it's not in the unified diff form preferred by GitHub.

73c73,74
<         echo '<li>' . html_wikilink(':'.$id,$name) . '</li>';
---
>         $page_location = implode(' » ', explode(':',$id));
>         echo '<li><span class="qsearch_namespace">' . $page_location .'</span><br />' . html_wikilink(':'.$id,$name) . '</li>';

Not sure about my use of » since it might end up looking more like breadcrumbs that way. On my production wiki I replaced the first line above with:

$page_location = implode('/', explode(':',$id));

so that it matches the directory structure seen in the URLs. I have useslash switched on on my wikis, but any eventual submission to GitHub should probably take useslash into account.

Should also note that anyone well-versed in CSS/web design will probably have a much better way of doing this. I'm presenting this as a hack that does more or less what I want it to, but it may not be great design. For one thing, it would be nice if the whole <li> was a link to the page, so that the user doesn't have to click only on the link. I'll try to get that done this week.
Avatar
Samana Johann #7
Member since Jun 2018 · 123 posts · Location: Aural/Cambodia
Group memberships: Members
Show profile · Link to this post
That looks like a great seek for an solution, FosseWay.

Just asking if it would be welcome to make use of some developments here and how my person could manage such. (having recently opened a topic specially in regard of #4)
Close Smaller – Larger + Reply to this post:
Verification code: VeriCode Please enter the word from the image into the text field below. (Type the letters only, lower case is okay.)
Smileys: :-) ;-) :-D :-p :blush: :cool: :rolleyes: :huh: :-/ <_< :-( :'( :#: :scared: 8-( :nuts: :-O
Special characters:
Go to forum
Imprint
This board is powered by the Unclassified NewsBoard software, 20150713-dev, © 2003-2015 by Yves Goergen
Current time: 2018-12-14, 04:16:14 (UTC +01:00)