Theme: clean canvas

marshfire

Joined: 2010-07-20
Posts: 43
Posted: Tue, 2010-07-20 13:30

Hey guys,

thanks a lot for developing Gallery 3. I was looking for something like that and it already nearly does all I'm looking for. (Maybe a five star rating system per user is missing).

Anyway, I invested some time to understand the theming, since I didn't find a theme suited for my purpose (some family photos of my newborn son). It took a while to get into it, but I took a deep dive into it and into CSS3 and finally made it work. The theme I designed will stay private, but I thought, based on it, I could contribute to the development and give you another theme for G3.

I worked on it with RC2, designed and tested it using Chrome mainly, but I also checked with Safari, Firefox, Opera and Internet Explorer. While the webkit based browsers worked best, I think Firefox and Opera also do a pretty good job. But Internet Explorer is very limited. I can't get it to look similar enough and I experience some strange behaviour with the hovers of the thumbnails, where the layout jumps when moving the mouse. If anyone has some idea how to fix it, it would be appreciated.

Since I can't demo the theme because of ISP limitations, I can only provide a zip of it (see attachments).

Feedback is welcome.

Enjoy!

 
nivekiam
nivekiam's picture

Joined: 2002-12-10
Posts: 16504
Posted: Tue, 2010-07-20 13:34

Can you post a screenshot?
____________________________________________
Like Gallery? Like the support? Donate now!!! See G2 live here

 
marshfire

Joined: 2010-07-20
Posts: 43
Posted: Tue, 2010-07-20 13:38

Sure, could have thought of that myself ;-). See attachment.

 
nivekiam
nivekiam's picture

Joined: 2002-12-10
Posts: 16504
Posted: Tue, 2010-07-20 13:47

that's cool! Great! We'll make a page on the codex for you so others can find the theme easily too!
____________________________________________
Like Gallery? Like the support? Donate now!!! See G2 live here

 
marshfire

Joined: 2010-07-20
Posts: 43
Posted: Wed, 2010-07-21 12:20

Thanks, let me know when you need additional information.

 
meb0

Joined: 2010-07-21
Posts: 1
Posted: Wed, 2010-07-21 21:28

Marshfire, I love your theme, it looks awesome. Do you think you could make a wide version like widewind? I tried to see if I could edit a few variables but I never got it to work (I'm not php/css literate). I can't go back to 3 columns of images after having 6.

 
mamouneyya

Joined: 2009-11-02
Posts: 337
Posted: Wed, 2010-07-21 22:37
meb0 wrote:
Marshfire, I love your theme, it looks awesome. Do you think you could make a wide version like widewind? I tried to see if I could edit a few variables but I never got it to work (I'm not php/css literate). I can't go back to 3 columns of images after having 6.

http://gallery.menalto.com/node/88511#comment-311330

 
floridave
floridave's picture

Joined: 2003-12-22
Posts: 27300
Posted: Thu, 2010-07-22 04:48

Then you will need to change some css:
http://gallery.menalto.com/node/89414#comment-315687

I will get round to making a codex page for the cool themm, when I get home from this road trip.

Dave
_____________________________________________
Blog & G2 || floridave - Gallery Team

 
marshfire

Joined: 2010-07-20
Posts: 43
Posted: Thu, 2010-07-22 09:49
meb0 wrote:
Marshfire, I love your theme, it looks awesome. Do you think you could make a wide version like widewind? I tried to see if I could edit a few variables but I never got it to work (I'm not php/css literate). I can't go back to 3 columns of images after having 6.

Thanks, meb0, glad you like it ;-). Ok, here you go. Thanks to the hints from mamouneyya and floridave I was able to adapt to the flexible layout. See attachments (new screenshot and theme).

Problems with layout jumps in internet explorer still apply. Someone able to help here?

See codex or http://gallery.menalto.com/node/97030?page=6#comment-393566 for updates. floridave

 
floridave
floridave's picture

Joined: 2003-12-22
Posts: 27300
Posted: Thu, 2010-07-22 15:01

marshfire,
I have created 2 codex pages:
http://codex.gallery2.org/Gallery3:Themes:clean_canvas_wide
http://codex.gallery2.org/Gallery3:Themes:clean_canvas

Please feel free to login to the codex and edit as you see fit.

Let me know if you have issues.

Dave
_____________________________________________
Blog & G2 || floridave - Gallery Team

 
nivekiam
nivekiam's picture

Joined: 2002-12-10
Posts: 16504
Posted: Thu, 2010-07-22 18:11

Thanks Dave!
____________________________________________
Like Gallery? Like the support? Donate now!!! See G2 live here

 
brewster

Joined: 2010-07-12
Posts: 47
Posted: Mon, 2010-07-26 20:48

One of my favorites so far! Nice work!!

 
marshfire

Joined: 2010-07-20
Posts: 43
Posted: Mon, 2010-07-26 22:23

Thanks ;-) Out of curiosity, what browser are you using brewster?

 
brewster

Joined: 2010-07-12
Posts: 47
Posted: Tue, 2010-07-27 01:00
marshfire wrote:
Thanks ;-) Out of curiosity, what browser are you using brewster?

Tested in both IE8, v8.0.7600.16385 and FF v3.6.8. Seems to work in both without a hitch. BTW, I'm using the wide version of your program. Hope this helps. If you'd like me to test your other version, let me know and I'll give it a try. Thx!

 
brewster

Joined: 2010-07-12
Posts: 47
Posted: Tue, 2010-07-27 03:46

marshfire - just wanted to include that I've added the register, reCAPTCHA, image block, and comments modules - all working without any problems. I set the register user to send a confirmation email, which it did, and worked as expected.

Did notice that when I go into advanced settings, it is set as:
gallery active_admin_theme admin_wind
gallery active_site_theme clean_canvas_wide

Should I change active_admin_theme to the clean_canvas_wide value?

Thanks,
Brewster

 
marshfire

Joined: 2010-07-20
Posts: 43
Posted: Tue, 2010-07-27 05:44

Brewster, thanks for the info. Good to hear, that it works, though I am surprised, that IE is not showing the strange layout jumps that I'm experiencing. Might be it is content related. Hmm. Maybe you could PM me a link to your site, so I can make some analysis of it.

Regarding the admin theme, leave it as it is. Clean Canvas is not (yet) suitable for it. I did not spent time into admin themes so far. If there are requests for it, I might have a look into it.

Thanks,
marshfire

 
hukoeth

Joined: 2009-03-20
Posts: 127
Posted: Tue, 2010-07-27 07:12

Hi,
Really nice theme. I just made it my standard :-)

I have found a problem though at least on my install and I can't figure it out. When I try to rotate and image from the top menu I get as result

{"src":"\/var\/resizes\/some album\/IMG_6667.JPG?m=1280214231","width":640,"height":427}

When I go back it is rotated.

Trying the same from the Options menu under the photo works without problems.

Thanks,
Uli

 
marshfire

Joined: 2010-07-20
Posts: 43
Posted: Tue, 2010-07-27 07:46

Hukoeth, I can reproduce the behaviour with my installation. It works with the gallery wind theme, but is somehow broken with mine. I currently have no idea why that happens, but I'll have a look into it.

marshfire

 
marshfire

Joined: 2010-07-20
Posts: 43
Posted: Tue, 2010-07-27 09:54

Ok, I found the problem. I missed to adapt some of the changes from RC1 to RC2. So, now I removed the photo menu in the photo page, since it is in the menu already, added the fixed ui-init, which fixes the wrong behaviour, and did some minor changes. Attached you can find the new versions (named 1.01).

Have fun!

 
hukoeth

Joined: 2009-03-20
Posts: 127
Posted: Tue, 2010-07-27 10:27

Wow that was fast. Thank you very much will try now.

 
floridave
floridave's picture

Joined: 2003-12-22
Posts: 27300
Posted: Tue, 2010-07-27 13:20

marshfire,
Thanks for keeping the docs up to date as well it really helps the community.

Dave
_____________________________________________
Blog & G2 || floridave - Gallery Team

 
marshfire

Joined: 2010-07-20
Posts: 43
Posted: Tue, 2010-07-27 14:43
Quote:
Thanks for keeping the docs up to date as well it really helps the community

of course, what worth is a documentation and download page that is not up to date ;-). Some of the themes for G3 need some workovers anyway, they are presented not very consistently and some are not working with RC2.

I'm not sure if linking to the forum is always the best way. Some themes feel abandoned. I guess a rework will be necessary for G3 to go final...

If I can be of help, let me know.

marshfire

 
nameht

Joined: 2004-11-21
Posts: 47
Posted: Tue, 2010-07-27 19:16

any way to incorporate Lightbox 2 with this great theme

http://www.huddletogether.com/projects/lightbox2/

This is how it was implemented in G2 but I am new to G3 and not very good with coding

http://codex.gallery2.org/Gallery2:Modules:Lightbox

 
floridave
floridave's picture

Joined: 2003-12-22
Posts: 27300
Posted: Tue, 2010-07-27 19:21
Quote:
Some themes feel abandoned.

Yes some modules do as well. It is up to the community to continue on if summer, jobs, kids, freetime get in the way. The small Gallery core team has enough on the plate to contend with.
If you find something is you are interested in maintaining then you are more than welcome to help out. That is what community involved open source is all about.

Dave
____________________________________________
Blog & G2 || floridave - Gallery Team

 
hukoeth

Joined: 2009-03-20
Posts: 127
Posted: Tue, 2010-07-27 21:09
nameht wrote:
any way to incorporate Lightbox 2 with this great theme

http://www.huddletogether.com/projects/lightbox2/

This is how it was implemented in G2 but I am new to G3 and not very good with coding

http://codex.gallery2.org/Gallery2:Modules:Lightbox

I incorporated shadowbox since there was already a module for it. If you want to give it a try:
- Download the modded version attached to this post and install (I moved the initialization from the shadowbox module to the photo page of the theme and added the loading animation - which unfortunately doesn't work that well but I'll look into it)
- Download the attached "photo.html.php" file and use it to replace the one in "themes/clean_canvas(_wide)/views"

Good luck (haven't tested this a great deal),
Uli

 
nameht

Joined: 2004-11-21
Posts: 47
Posted: Tue, 2010-07-27 21:27

any way to make it work on album pages? So in an album when you click on a photo it pops up the shadowbox, instead of taking you to the photo page

 
marshfire

Joined: 2010-07-20
Posts: 43
Posted: Wed, 2010-07-28 09:57

hukoeth,

good work, since I don't know shadow box that good, I don't see the problem with the loading animation. I took your chages from photo.html.php and incorporated it into the original one with a check, if shadowbox is available. If it is not, it takes the default fullsize js. Also, I added the other pictures from the album to the display group. It's a first attempt and the view menu full size option behaves a bit different now, which I need to fix.

However, please give it a try everyone, and tell me, what you think.

install as described by hukoeth.

If there would be a module lightbox, I would also include that.

Good luck

 
dmolavi
dmolavi's picture

Joined: 2002-12-05
Posts: 573
Posted: Tue, 2010-08-03 13:29

One problem I've found is that if an album has a portrait-oriented highlight, the owner/count info gets truncated. See the screenshot attached.

--
For PHPNuke, phpBB2, and phpBB3 integration help, please visit NukedGallery.net.
[img]http://www.nukedgallery.net/signature.jpg[/img]

 
marshfire

Joined: 2010-07-20
Posts: 43
Posted: Tue, 2010-08-03 14:33

Hmm, took me a while to reproduce it. Looks like this problem only occurs when using the context menu to rotate the image. As soon as I hit refresh, the layout fits again. Could you check if it is the same with your site?

Thanks!

 
dmolavi
dmolavi's picture

Joined: 2002-12-05
Posts: 573
Posted: Tue, 2010-08-03 14:52

Nope, i've refreshed over and over, no dice. FWIW, that image was already rotated before it was uploaded...

--
For PHPNuke, phpBB2, and phpBB3 integration help, please visit NukedGallery.net.
[img]http://www.nukedgallery.net/signature.jpg[/img]

 
nivekiam
nivekiam's picture

Joined: 2002-12-10
Posts: 16504
Posted: Tue, 2010-08-03 17:44

Ah, I think I see what might be going on. I can share a URL privately if needed.

I'm able to duplicate this. If I have a thumb that isn't in landscape and it's on the bottom row and I have views and the "owner", it's not expanding beyond or over the container for the album-grid.

____________________________________________
Like Gallery? Like the support? Donate now!!! See G2 live here

 
marshfire

Joined: 2010-07-20
Posts: 43
Posted: Tue, 2010-08-03 18:30

nivekiam, please send it to me via PM so I can have a deeper look into it. Since this code is copy/pasted from wind, the problem might be there too.

 
nameht

Joined: 2004-11-21
Posts: 47
Posted: Wed, 2010-08-04 04:34
marshfire wrote:
hukoeth,

good work, since I don't know shadow box that good, I don't see the problem with the loading animation. I took your chages from photo.html.php and incorporated it into the original one with a check, if shadowbox is available. If it is not, it takes the default fullsize js. Also, I added the other pictures from the album to the display group. It's a first attempt and the view menu full size option behaves a bit different now, which I need to fix.

However, please give it a try everyone, and tell me, what you think.

install as described by hukoeth.

If there would be a module lightbox, I would also include that.

Good luck

Hello, are you able to make this work on album pages? So that when I click a photo on the album page shadowbox shows up instead of taking me to the photo page?

Thanks everyone for there help!

 
engineer

Joined: 2005-09-13
Posts: 84
Posted: Wed, 2010-08-04 15:51

This is a really nice theme so I want to use it as my default theme. I find a problem to watch movie files. Only Chrome 3.x can play movie well, Firefox 3.6.x shows nothing, IE 8 can play it but ratio of video width and height is incorrect. There is no such problem on default wind theme.

 
marshfire

Joined: 2010-07-20
Posts: 43
Posted: Wed, 2010-08-04 16:05

Hi engineer,

I did not yet test any movie files with it, so I think there might be some problems. In fact, I don't even know yet, what formats are supported (I'll check the documentation). I will investigate on it, but I might need a bit of time for it.

marshfire

 
nivekiam
nivekiam's picture

Joined: 2002-12-10
Posts: 16504
Posted: Wed, 2010-08-04 16:12

FLV and MP4 are the only supported movie formats for G3 at this time.
____________________________________________
Like Gallery? Like the support? Donate now!!! See G2 live here

 
BOFHMike

Joined: 2010-01-05
Posts: 22
Posted: Thu, 2010-08-05 18:38

I just grabed this theme and I love* the look of it. :) good work!

 
dmolavi
dmolavi's picture

Joined: 2002-12-05
Posts: 573
Posted: Thu, 2010-08-05 18:40
dmolavi wrote:
One problem I've found is that if an album has a portrait-oriented highlight, the owner/count info gets truncated. See the screenshot attached.

Any luck getting this resolved? It's the only kink I can find that's impacting me..

--
For PHPNuke, phpBB2, and phpBB3 integration help, please visit NukedGallery.net.
[img]http://www.nukedgallery.net/signature.jpg[/img]

 
marshfire

Joined: 2010-07-20
Posts: 43
Posted: Thu, 2010-08-05 18:51

Not yet found, but I have the same issue with the brown wind theme. It is not only on portrait-oriented, but also happens on some landscape pictures. I'm still looking.

 
BOFHMike

Joined: 2010-01-05
Posts: 22
Posted: Fri, 2010-08-06 19:14

The thumbnails jump around as I mouse over. Viewing w/IE 7 using clean-canvas wide 1.01. Screen shot attached.
Thanks!
-=mike=-
check it out yourself: http://www.slash-temp.com/gallery3

 
BOFHMike

Joined: 2010-01-05
Posts: 22
Posted: Wed, 2010-08-11 13:21
BOFHMike wrote:
The thumbnails jump around as I mouse over. Viewing w/IE 7 using clean-canvas wide 1.01. Screen shot attached.
Thanks!
-=mike=-
check it out yourself: http://www.slash-temp.com/gallery3

Follow up: Images jump around just as bad w/ the default Wind. Somethings up w/ the base CSS.

 
marshfire

Joined: 2010-07-20
Posts: 43
Posted: Wed, 2010-08-11 13:31
Quote:
Follow up: Images jump around just as bad w/ the default Wind. Somethings up w/ the base CSS.

Thanks for the update. I still have no idea what is going on there. Though I noticed, that the layouts of lower rows go down another pixel each time I mouse over a most right picture. Don't know if that helps. Maybe we should forward this to the base wind thread (if there is one).

 
nivekiam
nivekiam's picture

Joined: 2002-12-10
Posts: 16504
Posted: Wed, 2010-08-11 15:26

BOFHMike,

It's not happening for me in IE7 from the link you provided. First please verify you are using the latest experimental code and follow the upgrade instructions to ensure you don't have any of the old code around:

Get the latest code here:
http://github.com/gallery/gallery3/zipball/master

Upgrade instructions here:
http://codex.gallery2.org/Gallery3:Upgrading

That behavior was suppose to have been squashed a long time ago and as far as we know has been. I've not seen it in IE 6 or 7 for a long time.

Make sure you've cleared your temporary internet files too. Possibly try reinstalling IE7 or uninstalling any plugins you have for it.
____________________________________________
Like Gallery? Like the support? Donate now!!! See G2 live here

 
floridave
floridave's picture

Joined: 2003-12-22
Posts: 27300
Posted: Wed, 2010-08-11 17:03

Browsing http://www.slash-temp.com/gallery3 with IE8 I do see some occasional jumping. I can't reliably reproduce.
See the gap in the rows:
[img]http://gallery.menalto.com/files/Moved-thumbs.jpg[/img]
I have not seen this behavior in the wind theme for a long time. Perhaps IE needs a bit more padding for the mouse-over effects?

I really like this theme. The only other thing I notice is the slowness of the mouse-over effects. But I think that might be a resource issue on my client with the CSS3 affects.

Dave

_____________________________________________
Blog & G2 || floridave - Gallery Team

 
nameht

Joined: 2004-11-21
Posts: 47
Posted: Wed, 2010-08-11 17:35

The same thing happens with me for this theme in IE8

the images jump around, especially if you mouse over the first album and then move over to the second/third album it reliably occurs

 
sddroog

Joined: 2005-02-01
Posts: 132
Posted: Thu, 2010-08-12 06:08

Same thing happens to me with this theme when using IE8. It doesn't happend with the Wind theme on my site.

 
nivekiam
nivekiam's picture

Joined: 2002-12-10
Posts: 16504
Posted: Thu, 2010-08-12 16:22

There's another person here having the problem:
http://gallery.menalto.com/node/97367

The only way I've been able to replicate it is by zooming my IE browser window to be smaller than 100%

EDIT: So Dave probably nailed it on the head about padding, though I haven't tried messing around with any of the code.

____________________________________________
Like Gallery? Like the support? Donate now!!! See G2 live here

 
jaycam

Joined: 2010-07-16
Posts: 6
Posted: Thu, 2010-08-12 21:15

Hi, I was wondering if any one would be willing to make a dark version of Clean Canvas...I'm still learning Gallery and CSS. Thanks!

 
nivekiam
nivekiam's picture

Joined: 2002-12-10
Posts: 16504
Posted: Thu, 2010-08-12 21:38

No better opportunity to learn than to dig in and try it :) Seriously, you can read all the sites, books and take all the classes you want, but unless you dig in and do it, you're not going to learn it.
____________________________________________
Like Gallery? Like the support? Donate now!!! See G2 live here

 
marshfire

Joined: 2010-07-20
Posts: 43
Posted: Thu, 2010-08-12 21:48

hey jaycam,

I was thinking about a darker version. Just how dark would you like to have it?

marshfire

 
jaycam

Joined: 2010-07-16
Posts: 6
Posted: Fri, 2010-08-13 01:36

Well, I have a general idea of how to do CSS but its just basic text color and backgroung color. I looked at the CSS file for this theme and got lost. Maybe once a dark theme gets created I can compare the two and learn that way.

As for how dark...DARK. Maybe a black background and dark gray for the area where the pictures are. I'm sure whatever you come up with will be good! Thanks!