Topic: Help with SimpleViewer ASAP….

hi,  smile

I need help urgent with simpleviewer.  I installed it on my Mac and uploaded the photos.  I also copy and paste the embedded coded from svBuilder into my html page for testing.

When I uploaded all the files such as the index.html and images folders, it does not work in any browser.
my images is under subfolders like about 4 subfolders.

Need to get it to work badly as my boss very upset.

here is the webpage.  http://toronto.jnf.ca/test_gallery.html

HELP!!!

Re: Help with SimpleViewer ASAP….

The gallery on this web page (http://toronto.jnf.ca/test_gallery.html) does not work as the path to the 'simpleviewer.js' file is incorrect.
Your gallery's embedding code uses the following line:

<script type="text/javascript" src="svcore/js/simpleviewer.js">

... so the 'simpleviewer.js' file should be located here: http://toronto.jnf.ca/svcore/js/simpleviewer.js
However, it is not located there on your web server.

As you have uploaded your complete gallery folder to your web server, you can embed the gallery using the baseURL method of embedding as documented here.

Use the following embedding code:

<!--START SIMPLEVIEWER EMBED.-->
<script type="text/javascript" src="/images/harper_photos/test/pm/svcore/js/simpleviewer.js">
<script type="text/javascript">
flashvars={};
flashvars.baseURL="/images/harper_photos/test/pm/";
simpleviewer.ready(function () {
simpleviewer.load("sv-container", "100%", "100%", "222222", true, flashvars);
});
</script>
<div id="sv-container"></div>
<!-- END SIMPLEVIEWER EMBED -->
Steven Speirs
SimpleViewer Support Team.

Re: Help with SimpleViewer ASAP….

Thanks Steven,

I managed to get my gallery working very well on computer and on IOS, Android, Blackberry, iPad.

My boss was very happy with it.  I also removed the title from the actual svBuilder PRO and added a div tag for my title.

Another question.

Lets say if I have more photos to add to existing gallery, how do I do that?  Does it mean I have to upload the whole thing again like start all over????

Hope there is an easy way to do it.

Re: Help with SimpleViewer ASAP….

If you want to add images to a gallery, you can open the gallery in svBuilder-Pro, add images on the 'Images' tab and re-save the gallery on the 'Publish' tab.

You can then re-upload the gallery folder to your webserver.
You should be able to instruct your FTP program to upload only modified or new files so only the new images and the gallery's XML file should be uploaded. The existing unchanged images should not be uploaded and the upload process should be kept to a minimum.

Steven Speirs
SimpleViewer Support Team.

Re: Help with SimpleViewer ASAP….

OK, will try that and see how it goes.

I am using FileZilla to upload the gallery because I am using old version of Dreamweaver 8.0 as it does not support secure FTP.

I am not sure if FileZilla does what you mentioned about only upload the updated files and not touch the others.

If you have any doubt about FileZilla on how to do it, let me know.

Re: Help with SimpleViewer ASAP….

I am not sure if FileZilla does what you mentioned about only upload the updated files and not touch the others.

In Filezilla, go to 'Edit -> Settings' and then select the 'Transfers -> File exists action' in the left hand window pane.
Now in the 'Uploads' drop down menu, select 'Overwrite file if size differs' and click 'OK'.
Now only new or modified files (assuming the file size has changed) will be uploaded.

Steven Speirs
SimpleViewer Support Team.

Re: Help with SimpleViewer ASAP….

Thanks Steven,

Will give that a try and see what happens.

Another issue.... I have looked around in the FORUM for creating a gallery within one html page using links.  I don't want it to open another html page.

In other words, I have about 10 different galleries and wanted to show it in one html page.  Not to have visitors scrolling down to see the different galleries, if you know what I mean.

So either have the links at top of html page and the gallery size is about 640x480 or the links on the left side and beside it is 640x480.

Can you help or direct me to some other post that has it so I can try it.


Thanks

Re: Help with SimpleViewer ASAP….

Take a look at the View Multiple Galleries on Separate HTML Pages Example in the 'Multiple Galleries on Separate HTML Pages' in the Multiple Galleries embedding guide.
There is a header with links to separate galleries. A gallery can be selected (to be displayed below the header) by clicking a link.
You can download the sample web site and modify it (for example to swap the sample galleries for your own) to suit your needs.

For a single-page solution (without having to duplicate the page with the links for each gallery), try the following.
Create two galleries and name the gallery folders 'gallery1' and 'gallery2'.
Now use the following code in a file named 'main.html' and place the file in the same directory as the two gallery folders.
Open the 'main.html' file in a browser and select a gallery by clicking a link.
The 'main.html' page has been kept basic to demonstrate the functionality but can be refined as desired.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <script type="text/javascript" src="gallery1/svcore/js/simpleviewer.js"></script>
    <script type="text/javascript">
        //  Load a gallery using the function's parameter as the baseURL
        function loadGallery(base) {
            flashvars={};
            flashvars.baseURL=base;
            simpleviewer.ready(function () {
                simpleviewer.load('sv-container', '600', '400', '222222', true, flashvars);
            });
        }
        // When the web page is first loaded, display Gallery #1
        $(document).ready(function() {
            loadGallery('gallery1/');
        });
    </script>
    <title>Test</title>
</head>
<body>
    <div id="sv-container"></div>
    <div id="links">
        <a href="#" onclick="javascript: loadGallery('gallery1/'); return false;">Gallery 1</a>
        <br />
        <a href="#" onclick="javascript: loadGallery('gallery2/'); return false;">Gallery 2</a>
    </div>
</body>
</html>
Steven Speirs
SimpleViewer Support Team.

Re: Help with SimpleViewer ASAP….

Hi shawnPJ. Did you solved the problem with the galleries on same page? I'm facing same problem like you and can't go ahead. Pleeease if you found the way, let me know how... or let me see your page. Thanks

Re: Help with SimpleViewer ASAP….

@ernext

Have you tried the code from my post above?
It works as a solution to loading multiple galleries selectively into a single web page.
All it takes to see the code in action is for you to create 2 test galleries with svBuilder and to copy and paste the code to create a new HTML page.

Steven Speirs
SimpleViewer Support Team.

Re: Help with SimpleViewer ASAP….

Hi Steven
Thank you for your directions.
Yes, it works but the menu appears on a different page. I would like to it looks like on the horizontal-template.
Sorry for my ignorance...
Thank you again

Re: Help with SimpleViewer ASAP….

If you have your own menu system (currently on a different page), use it to replace the 'links' div in my code above (using the 'onclick' attribute in your own links to fire the function which loads the gallery).
The code I posted was just for basic functionality. You can adjust the position and style of elements within the page using CSS.

If you want to use a side menu with a resizable gallery (like in the View Horizontal Resizable Gallery with Side Menu Example), try the following template as a basis (replacing the 'wrap' div) with your own menu.

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <meta name="apple-mobile-web-app-capable" content="yes" />
        <style type="text/css">
            html, body {
                height: 100%;
                overflow: hidden;
            }
            body {
                margin: 0px;
                background-color: #222222;
            }
            #menu {
                background-color: #222222;
                color: #666666;
                font-family: sans-serif;
                font-size: 20px;
                float: left;
                padding: 20px 0px 0px 10px;
                text-align: center;
                height: 100%;
                width: 100px;
            }
            #menu a {
                color: #666666;
                text-decoration: none;
            }
            #wrap {
                float: right;
                height: 100%;
            }
        </style>
        <script type="text/javascript" src="gallery1/svcore/js/simpleviewer.js"></script>
        <script type="text/javascript">
            function doLayout() {
                var windowHeight = window.innerHeight ? window.innerHeight : $(window).height();
                var windowWidth = window.innerWidth ? window.innerWidth : $(window).width();
                var menuWidth = $('#menu').outerWidth();
                var galleryHeight = parseInt(windowHeight);
                var galleryWidth = parseInt(windowWidth) - parseInt(menuWidth);
                $('#wrap').height(galleryHeight);
                $('#wrap').width(galleryWidth);    
            }
            function loadGallery(base) {
                flashvars={};
                flashvars.baseURL=base;
                simpleviewer.ready(function () {
                    simpleviewer.load('sv-container', '100%', '100%', '222222', true, flashvars);
                });
            }
            $(document).ready(function () {
                doLayout();
                $(window).bind('resize', doLayout);
                loadGallery('gallery1/');
            });
        </script>
        <title>Test</title>
    </head>
    <body>
        <div id="menu">
            <a href="#" onclick="javascript: loadGallery('gallery1/'); return false;">Gallery 1</a>
            <br />
            <a href="#" onclick="javascript: loadGallery('gallery2/'); return false;">Gallery 2</a>
        </div>
        <div id="wrap">
            <div id="sv-container"></div>
        </div>
    </body>
</html>
Steven Speirs
SimpleViewer Support Team.