Idea for module: View more

Gork

Joined: 2008-09-09
Posts: 85
Posted: Fri, 2012-08-17 06:52

I have an idea for a module in case anyone ever looks for such a thing. I don't have the knowledge to write it or it'd be my pleasure to contribute.

I have several albums with very long descriptons. In these albums the comments take up half or sometimes as much as the entire browser, forcing the user to scroll down on every page to see the photos.

Would it even be possible to write a module to limit what shows on the screen to five or so lines with a button to "show all" type of a thing?

 
suprsidr
suprsidr's picture

Joined: 2005-04-17
Posts: 8339
Posted: Fri, 2012-08-17 10:41

There is a tiny jQuery plugin I've used on a couple of projects in the past.
It was written in the days of jQuery 1.2.6, but I don't see any depreciated functions, so it should still be viable.
Include it in your page and in the $(document).ready function instantiate it like:
$('.g-description').truncate({max_length: 400});

Examples

-s
All New jQuery Minislideshow for G2/G3

 
Gork

Joined: 2008-09-09
Posts: 85
Posted: Sat, 2012-08-18 02:39

Thank you for your time.

Just so I'm clear, when you indicate to "include it in your page" are you referring to the code of a module or actually changing the code in Gallery3 itself?

I'm sorry, I'm sure you can tell just from my question that coding is not my forte. /sigh

 
suprsidr
suprsidr's picture

Joined: 2005-04-17
Posts: 8339
Posted: Sat, 2012-08-18 05:27
Gork wrote:
Thank you for your time.

Just so I'm clear, when you indicate to "include it in your page" are you referring to the code of a module or actually changing the code in Gallery3 itself?

I'm sorry, I'm sure you can tell just from my question that coding is not my forte. /sigh

Well, you cannot just read about it and have it work, somehow the proper code has to make it into your page's structure.

  • Save this page as jquery.truncator.js and upload it to your gallery3 directory
  • Edit your gallery3/themes/your theme/views/page.html.php just before </head> add:
    <script type="text/javascript" src="/your/gallery3/jquery.truncator.js"></script>
    <script>
    $(document).ready(function(){
        $('.g-description').truncate({max_length: 400});
    });
    </script>
    

-s
All New jQuery Minislideshow for G2/G3

 
Gork

Joined: 2008-09-09
Posts: 85
Posted: Sat, 2012-08-18 12:13
suprsidr wrote:
Well, you cannot just read about it and have it work, somehow the proper code has to make it into your page's structure.

This much I understood. You answered my question, but I was just asking if you were talking about adding your script to g3 by directly editing g3 code or if you were referring to "hooking into to it" in some way via a module.

Thank you for your help.

 
floridave
floridave's picture

Joined: 2003-12-22
Posts: 27300
Posted: Sun, 2012-08-19 07:48

This can be a simple module. What would be a good name? Does the max length want to be configurable? What about other selectors other than description?

Dave
_____________________________________________
Blog & G2 || floridave - Gallery Team

 
Gork

Joined: 2008-09-09
Posts: 85
Posted: Sun, 2012-08-19 17:02

The only place I can see a need for it is for the album description. I've turned off the description in the sidebar because my long-windedness really makes a mess of that, but I don't know if that would be a concern at all. I can't think of any other areas which are kind of designed to hold an amount of text that would cause a similar "layout problem."

I think something equal to about 6-7 lines showing before clickable "show more" text would be displayed would work, at least for me and how I have Wind layed out. I think if making the max length configurable weren't too much of a hassle though it would add to the useability of the module for a great number of folks.

Were you hoping for a fancier name than "view more" or "show more?" Perhaps "hide text" or maybe even "spoiler" or "spoiler box?" (In thinking of the spoiler buttons often found on bulletin boards.) Maybe "invisible text" or "text on demand?" I know, how about "text explode!" hehe

 
suprsidr
suprsidr's picture

Joined: 2005-04-17
Posts: 8339
Posted: Sun, 2012-08-19 17:13

the options for that jQuery plugin are:

    max_length: 100,
    more: 'more',
    less: 'less'

In one of the projects I used it in, I even added a little image to indicate the more/less

-s
All New jQuery Minislideshow for G2/G3

 
floridave
floridave's picture

Joined: 2003-12-22
Posts: 27300
Posted: Sun, 2012-08-19 20:54

suprsidr,
The

<script>
$(document).ready(function(){
    $('.g-description').truncate({max_length: 400});
});
</script>

does the description on the album view.
is this the best way to select the others:

        $('.g-description').truncate({max_length: 400}); // album description
	$('#g-sidebar .g-block li').truncate({max_length: 400}); //sidebar
	$('#g-info').truncate({max_length: 400});  // photo description

seems to work but though that you might have a better way to select the content.

Dave
_____________________________________________
Blog & G2 || floridave - Gallery Team

 
suprsidr
suprsidr's picture

Joined: 2005-04-17
Posts: 8339
Posted: Sun, 2012-08-19 21:22

you can separate them with commas unless you are setting different max-length for each:
$('.g-description, ul.g-metadata>li:contains("Description:"), #g-info').truncate({max_length: 400});

to target the description in the sidebar I used: ul.g-metadata>li:contains("Description:") but that would break on non English sites, so you'd have to translate()

-s
All New jQuery Minislideshow for G2/G3

 
floridave
floridave's picture

Joined: 2003-12-22
Posts: 27300
Posted: Mon, 2012-08-20 05:47

Test and report back the attached module. I will create a codex page later.

Dave
_____________________________________________
Blog & G2 || floridave - Gallery Team

 
Gork

Joined: 2008-09-09
Posts: 85
Posted: Mon, 2012-08-20 07:29

Wow! Very nice... That's exactly what I was looking for, and more. And "Text Truncate?" Perfect. Very professional looking and acting result. And I love how you made the "truncate level" adjustable - nice touch.

One oddity I noticed. When I installed the module and activated it from the module page it didn't work. I went to several different pages and there was no change. I went to the settings -> text truncate page and changed the default of 400 to 200 in the album description field. After doing this the module seemed to work fine. I then changed the 200 back to 400 and it still works fine. Changing that one setting also enabled the description in the sidebar as well.

I didn't have any photo descriptions to test with, so I copy/pasted one of my longer gallery descriptions to a photo description. I changed the default 400 setting around a bit and everything worked prefectly for me.

A very small thing: On the module page in the description field there is a typo - "discription".

I like how if I choose "more" then either refresh the page or move to a new page the setting is reset to "less" again.

One thought I had which I didn't think of before, since I wasn't thinking along the lines of using the module for the three different text areas, is that it might be nice to have a check box by each option (album/sidebar/photo). This isn't a huge deal for obvious reasons, but just an idea in case you were interested.

This idea works so much better in the sidebar description than I thought it would that I'm actually considering using the sidebar comments section instead of the album description comments seciton in Wind.

Speaking of Wind, I should say that Wind is the only theme I used in testing. I've never used any other.

Impressive. Thank you. Both of you.

 
floridave
floridave's picture

Joined: 2003-12-22
Posts: 27300
Posted: Mon, 2012-08-20 15:47

Gork, Thanks for the feedback. I will fix the typo on the module page.
I thought of a check-box to turn off and on the different settings and in the end thought that a large number would be good enough keeping the code smaller/simpler and the usability easier.

I will work on making the defaults work out of the box without having to save the settings the first time.

It should be easy to expand to different selectors if there is call for any more than the three I have now. Perhaps very long comments?

Dave
_____________________________________________
Blog & G2 || floridave - Gallery Team

 
suprsidr
suprsidr's picture

Joined: 2005-04-17
Posts: 8339
Posted: Mon, 2012-08-20 16:49
Quote:
It should be easy to expand to different selectors if there is call for any more than the three I have now. Perhaps very long comments?

maybe just give admin a comma separated list of css selectors to which they can add/subtract eg.
Default selectors: '.g-description, ul.g-metadata>li:contains("Description:"), #g-info'
and you would add it like:
$('<?= $truncate->selectors() ?>').truncate({max_length: <?= $truncate->length() ?>});

-s
All New jQuery Minislideshow for G2/G3

 
Gork

Joined: 2008-09-09
Posts: 85
Posted: Mon, 2012-08-20 19:11

I just ran across a problem. I tried to use the search feature in the gallery and it came back with a blank gray page, no errors in the logs. I tried to go to the Admin -> Maint page, received a blank screen here too. I also received a blank page when trying to access the modules page. I went back to the main URL for the gallery and was able to sign in as admin.

Returning to the modules page worked this time and I was able to deactivate the module. Upon doing so, the ability to search the gallery returned. After I reactivated the module I started receiving blank pages again when trying to search. I tried this several times under different logins and was able to repeat the blank page problem when searching or clicking on tags, but only when Text Truncate was active.

I agree - if it's too much code or too complicated there's certainly no need for the check boxes.

 
floridave
floridave's picture

Joined: 2003-12-22
Posts: 27300
Posted: Tue, 2012-08-21 05:51

I see that and will fix it when I get home. Might be a few days as I have been called out of town.

Dave
_____________________________________________
Blog & G2 || floridave - Gallery Team

 
Gork

Joined: 2008-09-09
Posts: 85
Posted: Tue, 2012-08-21 08:20

Oh I'm in no hurry - I'm just happy you're interested (still). For now I'm using the module (I love it!) and to heck with the search capability, at least for a bit.

Thanks for the update, and travel safely.

 
Gork

Joined: 2008-09-09
Posts: 85
Posted: Wed, 2012-08-22 12:47

Just wanted to quickly add, in case it helps, that with the module installed I received the same "blank page" when g3 sent me to the reauthenticate page.

 
floridave
floridave's picture

Joined: 2003-12-22
Posts: 27300
Posted: Sun, 2012-08-26 20:48

Gork,
Thanks for the feedback, I have fixed the issues you have discovered and added the comment text setting as well.
http://codex.gallery2.org/Gallery3:Modules:text_truncate

Dave
_____________________________________________
Blog & G2 || floridave - Gallery Team

 
Gork

Joined: 2008-09-09
Posts: 85
Posted: Mon, 2012-08-27 03:10

Hey it's lookin' good! I haven't had the chance yet to test out the re-authenticate screen; have to wait until the g3 makes me re-authenticate, naturally. (Though I have no doubt it'll work.) But searching worked fine, as I'm sure you're aware.

At the bottom of the codex screen it says "You must save the settings on the admin page for the settings to used." Is this related to the initial install where I reported the module didn't work at first? And you're just telling peeps they have to go to module's setup screen and save either the default or their own numbers before they'll be applied?

At the top of the codex page it says "Adds the unnecessary JavaScript..." Should this be "necessary" instead? ;)

Nice touch with the addition to truncate the comment text; I didn't think of that since the comments are underneath the photos in the theme I use. (Plus the comments area doesn't get used much on my board.) Does this truncate every comment individually or the whole comment section en total?

So exciting! I think I mentioned before that the problem on my install with my long winded album descriptions is something which has been a thorn in my side since g2. It's so nice to finally have such a simple and yet grand solution. This may very well be the best module to date.

 
floridave
floridave's picture

Joined: 2003-12-22
Posts: 27300
Posted: Mon, 2012-08-27 05:08
Quote:
Is this related to the initial install where I reported the module didn't work at first?

Yes. It was a easy fix to add documentation than add more code to the module.

Quote:
Should this be "necessary" instead? ;)

Fixed.

Quote:
Does this truncate every comment individually

Yes.

Dave

_____________________________________________
Blog & G2 || floridave - Gallery Team

 
Gork

Joined: 2008-09-09
Posts: 85
Posted: Mon, 2012-08-27 11:09

Thanks for the clarification. Fwiw I was able to test the "re-authentication issue" and had no problems. Beautiful. :)