These forums are provided for community interactions only. For official support please submit a support ticket.

You are not logged in.

#1 2009-11-26 10:28:21

liske
Senior Member
Registered: 2007-12-24
Posts: 60

Fullscreen Garden & Architecture

Utilizing SSPro, and SSPro Director, I went with a drop down top navbar to preserve a 'Fullscreen' feel while still allowing for a little formality.  Uses permalinks, and custom captions that appear when available.

http://www.jasonliske.com/

Thanks to the forums here, and SSPro which makes my update cycle something not to dread smile

Last edited by liske (2009-11-26 10:29:11)

Offline

 

#2 2009-11-30 00:22:02

wings
Senior Member
Registered: 2007-04-23
Posts: 98
Website

Re: Fullscreen Garden & Architecture

ooookkkaaay.... where is the gallery?  All I see is your into text..?


Helping people Develop Wings

Offline

 

#3 2009-11-30 05:14:10

liske
Senior Member
Registered: 2007-12-24
Posts: 60

Re: Fullscreen Garden & Architecture

All Good Now.

http://www.jasonliske.com/

Thanks for the Wings. JL

Last edited by liske (2009-11-30 22:27:40)

Offline

 

#4 2009-12-01 07:03:50

jimmymusic
Member
Registered: 2007-09-02
Posts: 31

Re: Fullscreen Garden & Architecture

Your site is very nice and exactly what I'm trying to do!  I've got so many questions:  Do you use SSP for Flash?  Are the 'permalinks' you use the links that appear in the drop down caption bar?   What size original image do you upload?  How do you tell Flash to make the stage fill a window 100%?  Feel free not to answer any of those questions, but if you decide to, I would greatly appreciate it!  Your site rocks, and the photography is great as well!

Offline

 

#5 2009-12-01 18:43:28

liske
Senior Member
Registered: 2007-12-24
Posts: 60

Re: Fullscreen Garden & Architecture

Hi Jimmy;

Thanks for the site look. I did use SSPro for Flash and I liked the permalinks if I need to send someone to a specific image. In general I uploaded images around 1600 wide, if you look around in the forum there are scalable code examples. In my case I used something like the following.... [my_ssp as the Slideshowpro instance].

Code:

import flash.display.StageScaleMode;
import flash.display.StageAlign;
import flash.events.Event;

//liquid
stage.scaleMode = StageScaleMode.NO_SCALE;
stage.align = StageAlign.TOP_LEFT;
stage.addEventListener(Event.RESIZE, resizeHandler);

// initialize sizing
resizeHandler (null);

function resizeHandler (event:Event):void 
{
  var sw:Number = stage.stageWidth;
  var sh:Number = stage.stageHeight;
  my_ssp.width = sw;
  my_ssp.height = sh;
}

[you can also add X Y coordinates to pin specific movie clips if you don't want those to scale]

Best
JL

Last edited by liske (2009-12-01 18:47:06)

Offline

 

#6 2009-12-01 19:32:29

tweaked_eye
Veteran Member
Registered: 2007-04-20
Posts: 177

Re: Fullscreen Garden & Architecture

Nice images...but, not sure why everyone is buying into the full screen deployment.  I have a large monitor and I actually find it annoying.

Last edited by tweaked_eye (2009-12-01 19:32:42)

Offline

 

#7 2009-12-01 20:20:38

XXNephilim
Veteran Member
Registered: 2008-07-19
Posts: 163
Website

Re: Fullscreen Garden & Architecture

tweaked_eye wrote:

Nice images...but, not sure why everyone is buying into the full screen deployment.  I have a large monitor and I actually find it annoying.

I agree...

Full screen approach is so yesterday thing and can be very annoying indeed!

Specially when sites are done in such way so you have to flick image by image in order to get to one you like + usually sites like this have no deeplinking = fail in my eyes...

Full screen should be OPTIONAL and if you really insist on fullscreen site than at least make sure that navigation is sorted in proper way (perhaps via ThumbGrid)...

Last edited by XXNephilim (2009-12-01 20:22:15)


Web & Graphic Design, Photography & Video Production

Flash Site: www.thecliffsoncape.com .::. Html Site: www.thecliffsoncape.com/html/

Offline

 

#8 2009-12-02 06:58:07

jimmymusic
Member
Registered: 2007-09-02
Posts: 31

Re: Fullscreen Garden & Architecture

I'm looking at this website with 1920x1200 resolution on a 22" monitor and feel like the full screen ssp is a great way to showcase the photography. 

I do agree that thumbnails are nice to have so long as with Jason's site, they don't take away from the simple qualities.  Perhaps a hidden thumbgrid on the bottom until mouseover or something would be nice. 

At any rate, thanks, Jason for doing some actual telling and not just showing-- kudos for that!  Thanks again for the code, and information and I still think your site is very NICE!

Offline

 

#9 2009-12-02 07:35:16

liske
Senior Member
Registered: 2007-12-24
Posts: 60

Re: Fullscreen Garden & Architecture

I added a thumbgrid instance on bottom rollover. See whatcha think.

http://www.jasonliske.com/

JL

Offline

 

#10 2009-12-05 02:56:36

jimmymusic
Member
Registered: 2007-09-02
Posts: 31

Re: Fullscreen Garden & Architecture

Oh yeah, that's exactly how I envisioned it!  Lookin' good, lookin' good!

Offline

 

#11 2009-12-06 14:48:16

vojtan
New Member
Registered: 2007-03-15
Posts: 11

Re: Fullscreen Garden & Architecture

liske wrote:

I added a thumbgrid instance on bottom rollover. See whatcha think.

http://www.jasonliske.com/

JL

I tried repeatedly to have the thumbgrid instance and automatically placed at the bottom of the page with a width of 100% but it does not work for me.

Could you send me the code to make it work?

thanks and good job !

Offline

 

#12 2009-12-07 12:13:57

dougfree
New Member
Registered: 2009-11-24
Posts: 1

Re: Fullscreen Garden & Architecture

I really like the full screen w/thumb nails.  I mostly shoot real estate photography and I need to sell agents on "WoW factor" over the crappy images you see on MLS.  My problem is figuring out where to start!

I have publisher running and a demo up under the samples button.  I did this one with lightroom but I am switching over to Flash.
http://www.ntxrealpix.com
What I want to accomplish is the full screen look set to a size, the very nice center nav buttons and the thumb nails on the bottom.

So lisky, where does your code go and what else do I need to do to accomplish what I want?

A lots to ask so thanks,
Doug

If I ever learn the flash part then I will build the whole site in a gallery.

Offline

 

#13 2009-12-12 06:13:43

jimmymusic
Member
Registered: 2007-09-02
Posts: 31

Re: Fullscreen Garden & Architecture

How did you create the hyper links that appear in the caption/header?  I only know how to enter plain text in that field.

Offline

 

#14 2009-12-13 03:42:41

liske
Senior Member
Registered: 2007-12-24
Posts: 60

Re: Fullscreen Garden & Architecture

jimmymusic wrote:

How did you create the hyper links that appear in the caption/header?  I only know how to enter plain text in that field.

There's one button that calls a contact email.

Code:

// URLs for home / contact
contact.addEventListener(MouseEvent.CLICK, ButtonFunction);
function ButtonFunction(event: MouseEvent) {
var request:URLRequest = new URLRequest("ANY_URL");
navigateToURL(request, "_self");
}

And there are buttons that call albums within SS_Pro.

Code:

arch.addEventListener(MouseEvent.CLICK, buttonClickHandler);
pub.addEventListener(MouseEvent.CLICK, buttonClickHandler);
garden.addEventListener(MouseEvent.CLICK, buttonClickHandler);
function buttonClickHandler(event:MouseEvent):void {
if( event.target == garden)
{my_ssp.loadAlbum ('album-9', 0);}
else if (event.target == arch)
{my_ssp.loadAlbum ('album-10',0);}
else if (event.target == pub)
{my_ssp.loadAlbum ('album-12',0);
}
}

Offline

 

#15 2009-12-15 06:01:09

jimmymusic
Member
Registered: 2007-09-02
Posts: 31

Re: Fullscreen Garden & Architecture

That's great, thanks for the info!  I actually have one other question about the navbar: Are you using the Header/caption option in ssp and simply inserting that code into that area somehow?

Offline

 

#16 2009-12-15 06:23:02

liske
Senior Member
Registered: 2007-12-24
Posts: 60

Re: Fullscreen Garden & Architecture

I'm not sure what you mean by 'header',  but yes the caption is driven by SSPro, and displays if a caption is present - if not it is not displayed.

Offline

 

#17 2009-12-15 14:07:12

jimmymusic
Member
Registered: 2007-09-02
Posts: 31

Re: Fullscreen Garden & Architecture

In the Component Inspector under the CAPTION section, next to Elements, you have choices of Header and Caption, Header only or Caption only.  Is that the same caption you are talking about?  I'm just trying to figure out if you have to use that code as the "Caption" of each image, or how do you go about entering that information since it seems to be the same with every slide.  Is that something that you do by pasting the code on each image in Director?

Offline

 

#18 2009-12-16 22:10:18

nermin
New Member
Registered: 2009-11-05
Posts: 6

Re: Fullscreen Garden & Architecture

Hi Liske.

Very nice photos, and a very interesting design solution you have chosen. I like it a lot. I have a questions you might be able and willing to answer for me. I have been working with pretty much the same navigation buttons; the plus and minus as 'next' and 'previous' buttons. I managed to create the movie clips as buttons and got it working, but I have problems hiding the minus button on the first slide as well as hiding the plus button on the last slide. I can see that you on your site have solved this. I would be  very grateful if you could help me to a solution. Have tried, but cannot find the answer anywhere.
Thanks a lot /N

Offline

 

#19 2009-12-27 21:47:51

mmarkuz
Member
Registered: 2009-12-26
Posts: 22

Re: Fullscreen Garden & Architecture

liske wrote:

Code:

import flash.display.StageScaleMode;
import flash.display.StageAlign;
import flash.events.Event;

//liquid
stage.scaleMode = StageScaleMode.NO_SCALE;
stage.align = StageAlign.TOP_LEFT;
stage.addEventListener(Event.RESIZE, resizeHandler);

// initialize sizing
resizeHandler (null);

function resizeHandler (event:Event):void 
{
  var sw:Number = stage.stageWidth;
  var sh:Number = stage.stageHeight;
  my_ssp.width = sw;
  my_ssp.height = sh;
}

Hi Jason, thanks for sharing your code. I have included it my_ssp action layer, but no change. can you also share your publishing settings (html/flash).

Thanks, Markus

Offline

 

#20 2009-12-27 22:01:55

mmarkuz
Member
Registered: 2009-12-26
Posts: 22

Re: Fullscreen Garden & Architecture

any chance you can share your approach / source code?

Thanks, Markus


nermin wrote:

Hi Liske.

Very nice photos, and a very interesting design solution you have chosen. I like it a lot. I have a questions you might be able and willing to answer for me. I have been working with pretty much the same navigation buttons; the plus and minus as 'next' and 'previous' buttons. I managed to create the movie clips as buttons and got it working, but I have problems hiding the minus button on the first slide as well as hiding the plus button on the last slide. I can see that you on your site have solved this. I would be  very grateful if you could help me to a solution. Have tried, but cannot find the answer anywhere.
Thanks a lot /N

Offline

 

#21 2009-12-28 20:50:21

mmarkuz
Member
Registered: 2009-12-26
Posts: 22

Re: Fullscreen Garden & Architecture

got another question:

any chance you can share the code for the thumbgrid, that shows up once the user moves the mouse at the bottom part?

Thanks for your help, much appreciated,
Markus

Offline

 

#22 2009-12-29 18:54:43

liske
Senior Member
Registered: 2007-12-24
Posts: 60

Re: Fullscreen Garden & Architecture

Thumbgrid - I have been getting alot of requests for the thumbgrid portion of the site.... I believed I 'hacked it' by either calling it twice, or maybe by only resizing Y? If you isolate the key criteria please post for others. Mine is still not perfect however, and hopefully this function will work out in future TG release.

[My thumbgrid instance my_tg, columns 14, rows 1. Probably not too important? ]

[Head of script, you may have some of this already, or there may be extra items]

Code:

//___________

import net.slideshowpro.slideshowpro.*;
import net.slideshowpro.thumbgrid.*;
import flash.display.StageScaleMode;
import flash.display.StageAlign;
import flash.events.Event;

//______

stage.addEventListener(Event.RESIZE, setupThumbGrid);

function setupThumbGrid (event:Event):void {
var sw:Number = stage.stageWidth;
var sh:Number = stage.stageHeight;
my_tg.y = sh-80;
my_tg.x = sw-sw;
my_tg.width = sw;
my_tg.height = 80;
}

//_______

//liquid
stage.scaleMode = StageScaleMode.NO_SCALE;
stage.align = StageAlign.TOP_LEFT;
stage.addEventListener(Event.RESIZE, resizeHandler);

// initialize sizing
resizeHandler (null);

function resizeHandler (event:Event):void {
var sw:Number = stage.stageWidth;
var sh:Number = stage.stageHeight;
my_ssp.width = sw;
my_ssp.height = sh;
my_tg.y = sh-80;
}

Regards,
Jason

Last edited by liske (2009-12-29 18:56:34)

Offline

 

#23 2009-12-29 19:45:42

mmarkuz
Member
Registered: 2009-12-26
Posts: 22

Re: Fullscreen Garden & Architecture

thanks for sharing. the important part for me would be the mouse over effect - once you move your mouse to the lower part of the site, the TG shows up. how did you do that?

Thx, Markus

Offline

 

#24 2010-01-08 16:45:35

frescoVA
Senior Member
From: DC
Registered: 2006-03-15
Posts: 92
Website

Re: Fullscreen Garden & Architecture

Very cool site Jason - I'm all for the full screen effect, especially when the photography is as good as yours.

Thanks for sharing your code as well - very much appreciated.

Offline

 

#25 2010-01-11 00:53:01

nandoleira
New Member
Registered: 2007-07-25
Posts: 6

Re: Fullscreen Garden & Architecture

Hey Jason

Really great site, and photos! I am also using a very simple design to display my own work. I am a graphic artist. Please take a look at my portfolio. I use SSPro for Flash and Director. I am thinking of starting my page just like yours... with full screen images!

I upload the SSPro gallery using "MovieClipLoader" and ActionScript 2, so I upload the gallery as a Movie Clip. I am not a Flash expert... but I like working on my codes.

www.nandoleira.com

I saw you published most of your codes here, thanks... but I have a question, why does the address on your site change when we see a different photo? Shouldn't the photos be uploaded inside the SSPro gallery as a one page site?


Thanks!

Last edited by nandoleira (2010-01-11 00:58:22)

Offline

 

#26 2010-01-11 05:28:47

liske
Senior Member
Registered: 2007-12-24
Posts: 60

Re: Fullscreen Garden & Architecture

Permalinks - so I can direct people to an individual image....

Offline

 

#27 2010-01-11 05:54:24

jimmymusic
Member
Registered: 2007-09-02
Posts: 31

Re: Fullscreen Garden & Architecture

liske wrote:

I'm not sure what you mean by 'header',  but yes the caption is driven by SSPro, and displays if a caption is present - if not it is not displayed.

Jason, is the nav bar which appears on mouseover at the top of the page done is SSP?  I guess I'm trying to figure out whether your website was built in Flash, and how much of it is SSP.  Thanks!

Offline

 

#28 2010-01-11 06:07:34

liske
Senior Member
Registered: 2007-12-24
Posts: 60

Re: Fullscreen Garden & Architecture

It's a symbol that comes in over SSP instance in the SSP FLA file.

Offline

 

#29 2010-01-11 13:17:58

jimmymusic
Member
Registered: 2007-09-02
Posts: 31

Re: Fullscreen Garden & Architecture

So if I understand you correctly, you basically have a SSP instance stretching the full frame, and then the nav bar at top is something you conceived in Flash that also stretches full width?

Offline

 

#30 2010-01-17 02:02:44

janspeed
Member
Registered: 2006-04-19
Posts: 45

Re: Fullscreen Garden & Architecture

Nice website.  May i ask what font are u using for the caption on the side?  Thanks.

Offline

 

#31 2010-01-21 08:29:55

liske
Senior Member
Registered: 2007-12-24
Posts: 60

Re: Fullscreen Garden & Architecture

jimmymusic wrote:

So if I understand you correctly, you basically have a SSP instance stretching the full frame, and then the nav bar at top is something you conceived in Flash that also stretches full width?

That's correct -

Offline

 

#32 2010-02-09 19:05:46

cliffordjim
New Member
Registered: 2009-11-23
Posts: 2

Re: Fullscreen Garden & Architecture

HI Jason.  Great site!  I have used your AS3 code for scaling my webpage to the browser and it works wonderfully except the + and - buttons for Next Image and Previous Image don't scale to the sides of the window (they stay in their original location which places them too close together and out of place in the larger scale browser window).   I used the code for my buttons from the ssp wiki and I have placed them on the ssp instance layer.  I would really appreciate any help on this thanks!

Offline

 

#33 2010-02-10 02:48:14

jimmymusic
Member
Registered: 2007-09-02
Posts: 31

Re: Fullscreen Garden & Architecture

Here is how I accomplished aligning buttons vertically centered and on the edges.  The prev button actually stayed on the left side (I'm assuming by default), but the next button was a little trickier. 

The next image button line is simply saying: "next image button's x position is equal to the stage width minus the width of the next button itself."

Code:

function resizeHandler (event:Event):void {
  var sw:Number = stage.stageWidth;
  var sh:Number = stage.stageHeight;
  nextImage_btn.x = sw-nextImage_btn.width;
  nextImage_btn.y = sh / 2;
  prevImage_btn.y = sh / 2;
}

Last edited by jimmymusic (2010-02-10 02:49:31)

Offline

 

#34 2010-02-10 17:47:02

cliffordjim
New Member
Registered: 2009-11-23
Posts: 2

Re: Fullscreen Garden & Architecture

Thanks Jimmy.  Good solution.  The buttons now appear where they should.

Offline

 

#35 2010-02-15 02:02:55

DeniseY
New Member
Registered: 2009-05-17
Posts: 11

Re: Fullscreen Garden & Architecture

Thank you so much for all the info! Very generous ....

Offline

 

#36 2010-02-22 16:04:54

nandoleira
New Member
Registered: 2007-07-25
Posts: 6

Re: Fullscreen Garden & Architecture

Hi Guys

Jason, I have tested the code on my site, and I am very happy with the results. I still want to add Thumb Grid, but I found out in the Forum, it doesn't resize the number of columns dynamically. If we open your site in a small browser window, then stretch it full size, the number of columns doesn't fit the browser size. It stays always the same as launched. The component fits the width but it displays a gray space after the last column. I read it is how Thumb Grid works by design. So it would be a nice enhancement for future versions of Thumb Grid.

http://www.nandoleira.com/SITE.AS3a4/Main.html

One thing. My SSP instance was stretching to fit the browser window ok, but it was leaving a small margin around the movie clip in the browser, so updated the HTML file generated by Flash. I added these lines right before the </head> to force the movie clip to fit the browser.

<style type=”text/css”>
        body  {
    margin:0px;
    padding:0px;
              }
</style>


I also added the X and Y coordinates to my AS file to fix the buttons in place. I still need to add more navigation, site name, contact info etc. I am reading about adding and removing child in AS3.

Thank you guys for all your help.
Cheers
Nando

Last edited by nandoleira (2010-02-22 16:17:02)

Offline

 

#37 2010-02-22 22:52:56

liske
Senior Member
Registered: 2007-12-24
Posts: 60

Re: Fullscreen Garden & Architecture

Nando - Good stuff, thanks for sharing. I agree on the Thumbgrid wishlist. I'd also like thumbgrid to work as a gallery for albums.

By the way - I see that you use Blurb - I love using them as well.

Last edited by liske (2010-02-22 22:54:48)

Offline

 

#38 2010-02-22 23:20:23

nandoleira
New Member
Registered: 2007-07-25
Posts: 6

Re: Fullscreen Garden & Architecture

Hey liske... thanks a lot!

I've been showing my digital work in a few galleries in Chicago. I usually print them on canvas, but I also use Blurb to get it into a book...

http://www.blurb.com/user/store/NandoRJ


: )

Offline

 

#39 2010-03-13 12:43:41

wings
Senior Member
Registered: 2007-04-23
Posts: 98
Website

Re: Fullscreen Garden & Architecture

I checked out your link again - well done!


Helping people Develop Wings

Offline

 

#40 2010-08-02 10:40:09

vivianchung
New Member
Registered: 2008-01-10
Posts: 2

Re: Fullscreen Garden & Architecture

Thanks for all your codes!!

Offline

 

#41 2011-02-23 01:41:06

arossphoto
Senior Member
Registered: 2006-03-15
Posts: 81
Website

Re: Fullscreen Garden & Architecture

mmarkuz wrote:

any chance you can share the code for the thumbgrid, that shows up once the user moves the mouse at the bottom part?

Hi Jason,

I'm really impressed with your site, and I'd also like to know how you did the mouseover effect for the thumbnails. I've been trying to do something similar, but just can't get it to work.

Thanks.

Last edited by arossphoto (2011-02-23 01:41:53)

Offline

 

#42 2011-02-27 19:41:15

thestewartofny
New Member
Registered: 2010-07-15
Posts: 10

Re: Fullscreen Garden & Architecture

anyone figure out how to get the thumbgrid to hide?

Offline

 

Board footer

Powered by PunBB
© Copyright 2002–2005 Rickard Andersson