Welcome to the Invelos forums. Please read the forum rules before posting.

Read access to our public forums is open to everyone. To post messages, a free registration is required.

If you have an Invelos account, sign in to post.
    Invelos Forums->DVD Profiler: Layouts and Reports Page: 1... 5 6 7 8 9 ...16  Previous   Next
HTML Window - Galleries
Author Message
DVD Profiler Unlimited Registrantgoodguy
Sita Sings the Blues
Registered: March 14, 2007
Reputation: Superior Rating
Germany Posts: 1,029
Posted:
PM this userDirect link to this postReply with quote
Quoting mithirandir:
Quote:
Quoting RossRoy:
Quote:
Some much more knowledgeable people might help you more with that, but since this script only uses Javascript (mithi's and roolku's used Java, well Mithi's I'm sure, roolku's I don't know), Javascript cannot check for the existance or not of a file.


Yes, this is correct. By the way, Roolku's skin behaves similar by using the java class to find out if a file exists or not. 


For image files, you can check the fileSize property to see if a file exists, e.g.

var oImg;
oImg = document.getElementById("Id_of_IMG_tag");
oImg.src = "c:\\full\\image\\path\\name.jpg";
if (oImg.fileSize < 0) {
  // img doesn't exist
} else {
  // img does exist
}
Matthias
DVD Profiler Unlimited RegistrantRossRoy
Registered: March 13, 2007
Posts: 793
Posted:
PM this userDirect link to this postReply with quote
I've made some modifications to my own gallery script. I've changed the header a bit, but the biggest change is for when a profile doesn't have a gallery.

Here's what it looks like now:



And here's the changed code, if anybody is interested:
Quote:

<HTML>
<HEAD>
<style type="text/css">
* { color: white; font-family: verdana; font-size: 11pt; }
html, body { margin: 5pt; background-color: rgb(0, 0, 83); background-repeat: repeat-x; background-image:url($DPIMAGES.bgimage.jpg); }
H1 { font-size: 12pt; font-weight: bold; margin-top: 15pt; margin-bottom: 6pt; width: 100%; text-align: center; }
EM { font-size: 16pt; }
.images { padding: 5pt; }
img { margin: 5pt; width: 145px; height: 100px; cursor: hand; }
.thumb { }
</style>
<script type="text/javascript">
<!--
<DP NAME="HEADER_VARS" Language="JavaScript" Comments="True" IncludeCast="False" IncludeCrew="False">
//-->
</script>
</HEAD>
<BODY>
<h1 class="title">Image Gallery for <em><DP NAME="TITLE" ShowDesc="NO"></em></h1>
<div class="images">
<script type="text/javascript">
<!--
/*
  ######## Gallery Viewer ########
  @title - Gallery Viewer
  @filename - GalleryViewer_1.1.html
  @version - 1.1
  @date - 2007-05-19
  @author - xyrano
  @dependencies - DVD Profiler v3+, IE.

  @1.1 Update
  - Configuration block added
  - gsl (Gallery Storage Location) changed see loc.
  - loc Locality option added.

  @1.0 inital release
  */
// -------- Configuration block - Start --------
var gsl = DP_ProgramPathDatabase + "/images/gallery/";
var loc = false; // 5050582449433? var loc = false;. 5050582449433.4? var loc = true;.
// -------- Configuration block - The End --------

var int = DP_Notes.indexOf("<gallery=");
if (int != -1) {
  var ims = DP_Notes.substring(int, DP_Notes.indexOf(">", int));
  ims = ims.replace("<gallery=","");

  // 1.1 Clean UPC from Locality?
  var upc = DP_UPC;
  if (loc == false && upc.indexOf(".") != -1)  upc = upc.substring(0, upc.lastIndexOf("."));
  gsl += upc;

  for (var i = 1; i <= ims; i++) {
    var img = (i <= 9) ? '0' + i: i;
    var imp = gsl + "\\" + img + ".jpg";
    document.write('<img src="' + imp + '" onClick="newWindow(\'' + img + '\');return false;"'+
      ' title="' + imp + '"' +
      ' class="thumb"' +
      '>');
  }
} else {
  document.write("<br /><br />No Gallery Available for UPC # <DP NAME="UPC" Formatted="NO">");
  var imdbStart = DP_Notes.toLowerCase().search("\<imdb\>") + 6;
  var imdbEnd = DP_Notes.toLowerCase().search("\<\/imdb\>");
  var imdbCode = DP_Notes.slice(imdbStart, imdbEnd);
  if (imdbEnd > 1) {
    document.write("<br /><br />IMDb code for Mithirandir's skin, just in case: " + imdbCode); }


}

function newWindow(img) {
  var imp = gsl + "\\" + img + ".jpg";
  var doc = '<html><body style="margin:0;padding:0;background-color:black;"><img src="' + imp + '"></body></html>';
  var win = window.open("", 'Gallery', 'scrollbars=no, resizable, dependent, status=no');
  win.document.write(doc);
  win.document.close();
  var imw = win.document.images[0].width;
  var imh = win.document.images[0].height;
  win.resizeTo(imw + 12, imh + 38);
  win.focus();
}

//-->
</script>
</div>
</BODY>
</HTML>


You might want to remove the bolded part from the script, about the background image from the styles under body, or download this image and add it to your layout. The image needs to be called bgimage.jpg (unfortunately, ImageShack changes the file names).
DVD Profiler Unlimited Registrantxyrano
41215.reg 70320.urk
Registered: March 13, 2007
Sweden Posts: 646
Posted:
PM this userView this user's DVD collectionDirect link to this postReply with quote
Nice! 

I've uploaded my layout and the Gallery Viewer 1.2 is right smack in the middle of it, with clip and all... Oh, and you do not have to use the tag options   

RossRoy: In your Overview HTML (which looks real nice) you have a different font for the title, what is the name of that font? I would like to have my overview like yours. Another question, is the imdb value always the same length (tt + number of digits) or does it vary?
 Last edited: by xyrano
DVD Profiler Unlimited RegistrantRossRoy
Registered: March 13, 2007
Posts: 793
Posted:
PM this userDirect link to this postReply with quote
Quoting xyrano:
Quote:
RossRoy: In your Overview HTML (which looks real nice) you have a different font for the title, what is the name of that font?


Here's the CSS I used for the title on my Overview HTML
H1 {
  padding: 0px;
  margin: 0px;
  color: white;
  font: bold 26pt "Monotype Corsiva";
}

Quote:
I would like to have my overview like yours. Another question, is the imdb value always the same length (tt + number of digits) or does it vary?


As far as I know, it is fixed tt + 7 numbers, but the way I've coded the script (well, actually, they way someone else (don'T know who)), it handles variable length codes.
DVD Profiler Unlimited RegistrantRossRoy
Registered: March 13, 2007
Posts: 793
Posted:
PM this userDirect link to this postReply with quote
Here's my current gallery, modified from 1.2:



  • I've changed the font (Monotype Corsiva)

  • removed the "Image Gallery" from the title as I felt it a bit redundant.

  • I've added a light purple to blue gradient at the top.

  • White borders around the thumbnails.


    • Here's the code for it:
    Quote:

    <HTML>
    <HEAD>
    <style type="text/css">
    * { color: white; font-family: "Monotype Corsiva"; font-size: 14pt; }
    html, body { margin: 5pt; background-color: rgb(0, 0, 83);  background-repeat: repeat-x; background-image:url($DPIMAGES.bgimage.jpg); }
    .title { font-size: 26pt; font-weight: bold; margin-top: 10pt; margin-bottom: 10pt; width: 100%; text-align: center; border-bottom: 3px solid #ffffff; }
    .images { padding: 5pt; }
    span { margin: 5pt; background-color: black; border: 5px double #ffffff;}
    img {  cursor: hand; }
    </style>
    <script type="text/javascript">
    <!--
    <DP NAME="HEADER_VARS" Language="JavaScript" Comments="True" IncludeCast="False" IncludeCrew="False">
    /*
    ######## Gallery Viewer ########
    @title - Gallery Viewer
    @filename - GalleryViewer_1.2.html
    @version - 1.2
    @date - 2007-05-29
    @author - xyrano
    @dependencies - DVD Profiler v3+, IE.

    @1.2 Update
    - Added option to choose first gallery image name (start from number)
    - Added option to thumbnail width/height

    @1.1 Update
    - Configuration block added
    - gsl (Gallery Storage Location) changed see loc.
    - loc Locality option added.

    @1.0 inital release
    */
    // -------- Configuration block - Start --------
    var gsl = DP_ProgramPathDatabase + "/gallery/";
    var loc = false; // 5050582449433? var loc = false;. 5050582449433.4? var loc = true;.
    var ist = 1; // First gallery image name: 00.jpg? var ist = 0;. 01.jpg? var ist = 1;
    var tnv = 169; // ThumbNail Value
    var bw = true; // tnv by width? var bw = true;. tnv by height? var bw = false;.


    // Clipping
    var c13 = false; // Clip 1 third
    var c23 = false; // Clip 2 thirds

    // Full resizing
    var cfull = true; // stretches the opposite side of bw
    var cfullvalue = 100; // pixels width:height depending on bw value

    // Tags
    var useTags = false;
    var tagByHeight = "9: Preferences/Gallery Viewer/By height";
    var tagClip1 = "9: Preferences/Gallery Viewer/Clip 1";
    var tagClip2 = "9: Preferences/Gallery Viewer/Clip 2";
    // -------- Configuration block - The End --------
    //-->
    </script>
    </HEAD>
    <BODY scroll="auto">
    <h1 class="title"><DP NAME="TITLE" ShowDesc="NO"></h1>
    <div class="images">
    <script type="text/javascript">
    <!--
    var int = DP_Notes.indexOf("<gallery=");
    if (int != -1) {

    // 1.2 Get image count.
    var ims = DP_Notes.substring(int, DP_Notes.indexOf(">", int));
    ims = ims.replace("<gallery=","");
    ims = parseInt(ims);

    // 1.1 Clean UPC from Locality?
    var upc = DP_UPC;
    if (loc == false && upc.indexOf(".") != -1)  upc = upc.substring(0, upc.lastIndexOf("."));
    gsl += upc;

    // 1.2  Tags
    if (useTags == true) {
    for (var i = 0;  i < DP_Tags.length;  i++) {
    if (tagByHeight.length != 0 && DP_Tags[i].toLowerCase() == tagByHeight.toLowerCase()) bw = false;
    if (tagClip1.length != 0 && DP_Tags[i].toLowerCase() == tagClip1.toLowerCase()) c13 = true;
    if (tagClip2.length != 0 && DP_Tags[i].toLowerCase() == tagClip2.toLowerCase()) c23 = true;
    }
    }

    // 1.2 Render images
    for (var i = ist; i < (ims + ist); i++) {//class="thumb"
    var img = (i <= 9) ? '0' + i: i;
    var imp = gsl + "\\" + img + ".jpg";
    var span = '<span style="'+ ((bw == true) ? ' width': 'height') +': ' + tnv + ';';
    if (cfull) {
    span += ' '+ ((bw == true) ? 'height': ' width') +': ' + cfullvalue + ';';
    } else {
    if (c13) span += ' '+ ((bw == true) ? 'height': ' width') +': ' + parseInt((tnv / 3) * 2) + ';';
    if (c23) span += ' '+ ((bw == true) ? 'height': ' width') +': ' + parseInt(tnv / 3) + ';';
    if (c13 || c23) span += ' overflow: hidden;';
    }
    span += '">';
    document.write(span);
    document.write('<img src="' + imp + '"');
    document.write((bw == true) ? ' width': 'height');
    document.write('="' + tnv + '"');
    if (cfull) {
    document.write((bw == false) ? ' width': 'height');
    document.write('="' + cfullvalue + '"');
    }
    document.write(' title="' + imp + '" onClick="newWindow(\'' + img + '\');return false;">');
    document.write('</span>');// align="middle"
    }
    } else {
      document.write("<br /><br />No Gallery Available for UPC # <DP NAME="UPC" Formatted="NO">");
      var imdbStart = DP_Notes.toLowerCase().search("\<imdb\>") + 6;
      var imdbEnd = DP_Notes.toLowerCase().search("\<\/imdb\>");
      var imdbCode = DP_Notes.slice(imdbStart, imdbEnd);
      if (imdbEnd > 1) {
        document.write("<br /><br />IMDb code for Mithirandir's skin, just in case: " + imdbCode); }

    }

    function newWindow(img) {

    var imp = gsl + "\\" + img + ".jpg";
    var doc = '<html><body style="margin:0;padding:0;background-color:black;"><img src="' + imp + '"></body></html>';
    var win = window.open("", 'Gallery', 'scrollbars=no, resizable, dependent, status=no');
    win.document.write(doc);
    win.document.close();
    var imw = win.document.images[0].width;
    var imh = win.document.images[0].height;
    win.resizeTo(imw + 12, imh + 38);
    win.focus();
    }
    //-->
    </script>
    </div>
    </BODY>
    </HTML>


    I've bolded what I've changed. Well, what I remember changing anyway 

    I've also remodified the thumbnail handling to bring back the previous behaviour. Sorry about that Xyrano.

    What happens is the clipping works great, only thing is it clips from the very top, so I have quite a few thumbnails that show a bland uni-color background or only part of the hair on people's head because the interesting stuff is towards the center-bottom of the image.

    Since you are putting the image within a span and hide the parts of the image that exceed the size of the span, would it be possible to specify of position of say -33% for the top of the image, to make it start rendering the image above the span, so the span would contain the middle part of the image?
     Last edited: by RossRoy
    DVD Profiler Desktop and Mobile RegistrantStar ContributorNewEnglander
    Registered: 11/13/2003
    Registered: March 13, 2007
    Reputation: High Rating
    United States Posts: 1,911
    Posted:
    PM this userEmail this userView this user's DVD collectionDirect link to this postReply with quote
    Ross, can you post the new code?
    Signature banned: Reason out of date...
    DVD Profiler Unlimited RegistrantRossRoy
    Registered: March 13, 2007
    Posts: 793
    Posted:
    PM this userDirect link to this postReply with quote
    Added the code to my previous post
    DVD Profiler Desktop and Mobile RegistrantStar ContributorNewEnglander
    Registered: 11/13/2003
    Registered: March 13, 2007
    Reputation: High Rating
    United States Posts: 1,911
    Posted:
    PM this userEmail this userView this user's DVD collectionDirect link to this postReply with quote
    Quoting RossRoy:
    Quote:
    Added the code to my previous post


    Thank you, quick question....

    var gsl = DP_ProgramPathDatabase + "/gallery/"; = Documents and Settings location

    How would you just specify the program directory without typing out e:/program files/dvd profiler? Tried a lot of combos but none worked
    Signature banned: Reason out of date...
    DVD Profiler Unlimited RegistrantRossRoy
    Registered: March 13, 2007
    Posts: 793
    Posted:
    PM this userDirect link to this postReply with quote
    Use the variable : DP_ProgramPathProgram

    This should resolve to wherever DVD Profiler is installed.
    DVD Profiler Desktop and Mobile RegistrantStar ContributorNewEnglander
    Registered: 11/13/2003
    Registered: March 13, 2007
    Reputation: High Rating
    United States Posts: 1,911
    Posted:
    PM this userEmail this userView this user's DVD collectionDirect link to this postReply with quote
    Quoting RossRoy:
    Quote:
    Use the variable : DP_ProgramPathProgram

    This should resolve to wherever DVD Profiler is installed.


    DOH! Thanks, I didn't try that variation Works like a charm.
    Signature banned: Reason out of date...
    DVD Profiler Unlimited RegistrantRossRoy
    Registered: March 13, 2007
    Posts: 793
    Posted:
    PM this userDirect link to this postReply with quote
    Quoting pplchamp:
    Quote:
    DOH! Thanks, I didn't try that variation Works like a charm.


    Here's a copy/paste of a post by Ken showing all the different DP_ProgramPath variants:

    Quote:

    3.0.1 has the following new variables generated for the DP_HEADER_VARS tags:
    DP_ProgramLayoutName
    DP_ProgramDatabaseName
    DP_ProgramPathDatabase
    DP_ProgramPathImages
    DP_ProgramPathThumbnails
    DP_ProgramPathLayouts
    DP_ProgramPathReports
    DP_ProgramPathTemp
    DP_ProgramPathProgram

    Additionally, I've doubled the \ chars in the paths.


    It's in the "Mithirandir's Skin" thread in the Layout forum.
     Last edited: by RossRoy
    DVD Profiler Desktop and Mobile Registrantpauls42
    Reg: 31/01/2003
    Registered: March 13, 2007
    United Kingdom Posts: 2,692
    Posted:
    PM this userEmail this userVisit this user's homepageView this user's DVD collectionDirect link to this postReply with quote
    Many thanks for this.

    One small change I have done..

    I have changed

    // 1.2 Render images
    for (var i = ist; i < (ims + ist); i++) {//class="thumb"
    var img = (i <= 9) ? '0' + i: i;

    to

    // 1.2 Render images
    for (var i = ist; i < (ims + ist); i++) {//class="thumb"
    var img = (i <= 9) ?  + i: i;

    so that it looks for images starting from 1.jpg ->
    Paul
    DVD Profiler Unlimited RegistrantRossRoy
    Registered: March 13, 2007
    Posts: 793
    Posted:
    PM this userDirect link to this postReply with quote
    Quoting pauls42:
    Quote:
    // 1.2 Render images
    for (var i = ist; i < (ims + ist); i++) {//class="thumb"
    var img = (i <= 9) ?  + i: i;

    so that it looks for images starting from 1.jpg ->


    Interesting change, although there's no way I'm going through my files renaming it all without the 0
    DVD Profiler Desktop and Mobile RegistrantStar ContributorNewEnglander
    Registered: 11/13/2003
    Registered: March 13, 2007
    Reputation: High Rating
    United States Posts: 1,911
    Posted:
    PM this userEmail this userView this user's DVD collectionDirect link to this postReply with quote
    Quoting RossRoy:
    Quote:
    Quoting pauls42:
    Quote:
    // 1.2 Render images
    for (var i = ist; i < (ims + ist); i++) {//class="thumb"
    var img = (i <= 9) ?  + i: i;

    so that it looks for images starting from 1.jpg ->


    Interesting change, although there's no way I'm going through my files renaming it all without the 0


    That would be a pain as I just renamed all mine to start at 01, I am wishing I never decided to do that
    Signature banned: Reason out of date...
    DVD Profiler Unlimited RegistrantRossRoy
    Registered: March 13, 2007
    Posts: 793
    Posted:
    PM this userDirect link to this postReply with quote
    Quoting pplchamp:
    Quote:
    That would be a pain as I just renamed all mine to start at 01, I am wishing I never decided to do that


    Actually, if you really wanted to, there's a very easy way to rename the file to 1.jpg, 2.jpg, etc.

    A utility I posted about earlier in this thread, called Bulk Rename Utility. Set it up, navigate to each individual folder, and click rename. As simple as that.
    DVD Profiler Desktop and Mobile RegistrantStar ContributorNewEnglander
    Registered: 11/13/2003
    Registered: March 13, 2007
    Reputation: High Rating
    United States Posts: 1,911
    Posted:
    PM this userEmail this userView this user's DVD collectionDirect link to this postReply with quote
    Quoting RossRoy:
    Quote:
    Quoting pplchamp:
    Quote:
    That would be a pain as I just renamed all mine to start at 01, I am wishing I never decided to do that


    Actually, if you really wanted to, there's a very easy way to rename the file to 1.jpg, 2.jpg, etc.

    A utility I posted about earlier in this thread, called Bulk Rename Utility. Set it up, navigate to each individual folder, and click rename. As simple as that.


    Thanks, but I'll pass, i like the 01, 02, 03 scheme, keeps images in order.
    Signature banned: Reason out of date...
        Invelos Forums->DVD Profiler: Layouts and Reports Page: 1... 5 6 7 8 9 ...16  Previous   Next
      Copyright © 2000-2024 Invelos Software, Inc. All rights reserved. Contact Us | Privacy Policy | Account Settings | Invite a Friend | FAQ