Help install Lightwindow

[PolarBear]

I would like to know if someone here, would be willing to help me install light window? I'm having some problems, basically, inserting it etc.

[philjohns]

tell us your problems and I may be able to give you a hand

[philjohns]

ah what the hell, heres a scaled down version of whats found on this site: LightWindow Demo

If it doesnt help you let me know.

1. Create a folder called javascript in the same folder that your index page is in and place into it all of the javascript files - then do this for the css files too and put them into a folder called css.

2. Then copy and paste the following code just below your title tags (or wherever you are putting your other css and javascript files):

 <script type="text/javascript" src="javascript/prototype.js"></script>
<script type="text/javascript" src="javascript/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="javascript/lightwindow.js"></script>
<link rel="stylesheet" href="css/lightwindow.css" type="text/css" media="screen" />

If you were not happy with the folder names and locations in step 1 you will need to change the file roots in the above coding before it will work.

3. For using it with images use the following coding where you want your thumbnail (or text linking to the image) to be:

<a href="images/image-5.jpg" class="lightwindow" title="What is this Plant?" author="Unknown" caption="Whatever it is, it is still a pretty cool picture. .">Link Name</a>

Changing the image file root, the title, the author and the caption along with the text or image that shows on the page (currently Link Name)



Thats it for now I think - it should be working...however let me know if it doesnt.

[PolarBear]

First off are you able to resize the Lightwindow to any site whereas you can have it fit within a box or something ?

[philjohns]

There may be some coding that you adjust to do this but the easiest way I would have thought was to jsut resize your photos so it expands no larger than needed

[PolarBear]

I contact the author of this add-on. In hopes I hear from him shortly about this matter, adjusting the code would be best then it adjust the image it's self otherwise adjusting the size of the image can sometimes lead to cut off images etc depending on how the add-on controls things.

[philjohns]

resize them in photoshop or similiar - that way the file size is also less and therefore a quicker loading time as well

[tommylogic]

The lightwindow will open relative to the size of the picture, unless you define a size in the params. Have you read the entire page instructions? It gives all the info in pretty good detail.

Configuration Options

Below are the possible options you can set and their default values as seen on this page.

// The resize speed 0-10 
resizeSpeed : 8, 
contentOffset : { 
    height : 20, 
    width : 20 
}, 
// Default sizes for each type 
dimensions : { 
    image : {height : 250, width : 250}, 
    page : {height : 250, width : 250}, 
    inline : {height : 250, width : 250}, 
    media : {height : 250, width : 250}, 
    external : {height : 250, width : 250}, 
    titleHeight : 25 
}, 
// The class names to look for to create a LightWindow or an action 
classNames : {     
    standard : 'lightwindow', 
    action : 'lightwindow_action' 
}, 
// The file types resepctive to their actions 
fileTypes : { 
    page : ['asp', 'aspx', 'cgi', 'htm', 'html', 'pl', 'php4', 'php3', 'php', 'php5', 'phtml', 'rhtml', 'shtml', 'txt', 'vbs', 'rb'], 
    media : ['aif', 'aiff', 'asf', 'avi', 'divx', 'm1v', 'm2a', 'm2v', 'm3u', 'mid', 'midi', 'mov', 'moov', 'movie', 'mp2', 'mp3', 'mpa', 'mpa', 'mpe', 'mpeg', 'mpg', 'mpg', 'mpga', 'pps', 'qt', 'rm', 'ram', 'swf', 'viv', 'vivo', 'wav'], 
    image : ['bmp', 'gif', 'jpg', 'png', 'tiff'] 
}, 
// Mime types for the file types 
mimeTypes : { 
    avi : 'video/avi', 
    aif : 'audio/aiff', 
    aiff : 'audio/aiff', 
    gif : 'image/gif', 
    bmp : 'image/bmp', 
    jpeg : 'image/jpeg', 
    m1v : 'video/mpeg', 
    m2a : 'audio/mpeg', 
    m2v : 'video/mpeg', 
    m3u : 'audio/x-mpequrl', 
    mid : 'audio/x-midi', 
    midi : 'audio/x-midi', 
    mjpg : 'video/x-motion-jpeg', 
    moov : 'video/quicktime', 
    mov : 'video/quicktime', 
    movie : 'video/x-sgi-movie', 
    mp2 : 'audio/mpeg', 
    mp3 : 'audio/mpeg3', 
    mpa : 'audio/mpeg', 
    mpa : 'video/mpeg', 
    mpe : 'video/mpeg', 
    mpeg : 'video/mpeg', 
    mpg : 'audio/mpeg', 
    mpg : 'video/mpeg', 
    mpga : 'audio/mpeg', 
    pdf : 'application/pdf', 
    png : 'image/png', 
    pps : 'application/mspowerpoint', 
    qt : 'video/quicktime', 
    ram : 'audio/x-pn-realaudio-plugin', 
    rm : 'application/vnd.rn-realmedia', 
    swf    : 'application/x-shockwave-flash', 
    tiff : 'image/tiff', 
    viv : 'video/vivo', 
    vivo : 'video/vivo', 
    wav : 'audio/wav', 
    wmv : 'video/x-ms-wmv'             
},     
// ActiveX Classids for file types 
classids : { 
    mov : 'clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B', 
    swf : 'clsid:D27CDB6E-AE6D-11cf-96B8-444553540000', 
    wmv : 'clsid:6BF52A52-394A-11d3-B153-00C04F79FAA6' 
}, 
// The plugin sources for the file types 
codebases : { 
    mov : 'http://www.apple.com/qtactivex/qtplugin.cab#version=6,0,2,0', 
    swf : 'http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0', 
    wmv : 'http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=6,4,5,715' 
},     
// The default padding for the viewport when a window is to fit the browser 
viewportPadding : 10, 
// What files types should the EOLAS Fix be applied to 
EOLASFix : 'swf,wmv,fla,flv', 
// What are our overlay images and default opacity, the preset has to be prebuilt for firefox as we cannot use an opacity setting 
overlay : { 
    opacity : 0.7, 
    image : 'images/black.png', 
    presetImage : 'images/black-70.png' 
}, 
// The default skin and associate markup, the id's and class are required 
skin :     { 
    main : '
'+ 
                '
'+ 
                    '
'+ 
                        ''+ 
                        'close'+ 
                    '
'+ 
                '
'+ 
                '
'+ 
                    '
'+ 
                    '
'+ 
                    '
'+ 
                        ''+ 
                            ''+ 
                        ''+ 
                        ''+ 
                            ''+ 
                        ''+ 
                        ''+ 
                    '
'+                                 
                    '
'+ 
                        '
'+ 
                            ''+ 
                                'Galleries'+ 
                            ''+ 
                        '
'+ 
                        '
'+ 
                        '
'+ 
                    '
'+ 
                '
'+ 
                '
'+ 
                    '
'+ 
                        '
'+ 
                            '
'+ 
                                ''+ 
                                ' of '+ 
                                ''+ 
                            '
'+ 
                            '
'+ 
                                'by '+ 
                            '
'+ 
                        '
'+ 
                        '
'+ 
                        '
'+ 
                    '
'+ 
                '
'+ 
            '
',     
    loading :     '
'+ 
                    ''+ 
                    'Loading or Cancel'+ 
                    ''+ 
                '
', 
    iframe :     ''+ 
                ''+ 
                    ''+ 
                        '{body_replace}'+ 
                    '


'+ 
                '', 
    gallery : { 
        top :     '
'+ 
                        '
{gallery_title_replace}
'+ 
                        '
', 
        middle :      '
'+ 
                                '{gallery_link_replace}'+ 
                            '
', 
        bottom :     '
'+ 
                   '
' 
    } 
}, 
// What form method should be used 
formMethod : 'get', 
// Should flash objects be hidden on the page when the window opens 
hideFlash : false, 
// Hide the gallery tab 
hideGalleryTab : false, 
// Show the gallery count when viewing a gallery 
showGalleryCount : true 
// Define your own handlers here, see the 'How to Theme Section' 
animationHandler : false, 
navigationHandler : false, 
transitionHandler : false, 
finalAnimationHandler : false, 
formHandler : false, 
galleryAnimationHandler : false

[PolarBear]

Lightwindow is for movies :) I want so tommy you are saying I can have the movie fit within a box on a stylesheet ? I am looking at the web page now I think I have come across what I'm trying to do but not sure.

[PolarBear]

I thought that the example I was after on the page showed something. Unfortunatly it just shows all spanish or something (not helpful) so if someone could answer my question for me ? And possible give me a hand getting this put into HTML code ? Also one last thing correct me if I'm wrong but with lighwindow you just upload the movie to a ftp and it gets placed onto the gallery for you?