Re: Need More Control Over Text Displayed

  •  06-10-2011, 1:32 AM

    Re: Need More Control Over Text Displayed

    Hi mikek40,
     
     
    I put the thumbnails and the accompanying photos in an arbitrary order of my choosing
     
    1. Open file "\CuteSoft_Client\Gallery\Layout\Classic\Code.js"
     
    2. Add the section below to the top of the page above
     
    function BubbleSort(arr)
        {
            var temp;
            var exchange;
            for(var i=0; i<arr.length; i++)
            {
                exchange = false;
                for(var j=arr.length-2; j>=i; j--)
                {
                    if((arr[j+1].Thumbnail) >(arr[j].Thumbnail))
                    {
                        temp = arr[j+1];
                        arr[j+1] = arr[j];
                        arr[j] = temp;
                        exchange = true;
                    }
                }
                if(!exchange) break;
            }
            return arr;
         }
     
    3. Find section below
     
        for(var i=0;i<this._categories.length;i++)
        {
            photos=photos.concat(this._categories[i].Photos);
        }
     
    4. Change to
     
        for(var i=0;i<this._categories.length;i++)
        {
            photos=photos.concat(this._categories[i].Photos);
        }
        photos=BubbleSort(photos);
     ----------------------------------------------------------------------------
    Now the photos order by the name.
     
    You can change the ">" below to switch the order
     
     if((arr[j+1].Thumbnail) >(arr[j].Thumbnail))
     ----------------------------------------------------------------------------
     
    5. Open file "\CuteSoft_Client\Gallery\Viewer\LightBox\Code.js "
     
    6. Add the code below to the top of the page 
     
    function BubbleSort(arr)
        {
            var temp;
            var exchange;
            for(var i=0; i<arr.length; i++)
            {
                exchange = false;
                for(var j=arr.length-2; j>=i; j--)
                {
                    if((arr[j+1].Thumbnail) >(arr[j].Thumbnail))
                    {
                        temp = arr[j+1];
                        arr[j+1] = arr[j];
                        arr[j] = temp;
                        exchange = true;
                    }
                }
                if(!exchange) break;
            }
            return arr;
         }
     
    7. Find section below
     
    for(var i=0;i<cs.length;i++)
        {
            photos=photos.concat(cs[i].Photos);
        }
     
    8. Change to
     
    for(var i=0;i<cs.length;i++)
        {
            photos=photos.concat(cs[i].Photos);
        }
        photos=BubbleSort(photos);
     
     ----------------------------------------------------------------------------
    Step 5-8 change the order when you click on the image to open the viewer mode
     
     ----------------------------------------------------------------------------
     
    Each thumbnail had a title
     
    Each photo had a centered title under the photo
     
    Each photo had a centered description in a smaller font under the title
     
    1. Open file "\CuteSoft_Client\Gallery\Layout\Classic\Code.js"
     
    2. Find section below
     
    for(var i=0;i<photos.length;i++)
        {
            var div=this.CreatePhotoDiv(photos[i]);
            this.AttachItemEvent(div);
            this.dng_photolist.appendChild(div);
         }
     
    3. Change to 
     
    for(var i=0;i<photos.length;i++)
        {
            var div=this.CreatePhotoDiv(photos[i]);
            this.AttachItemEvent(div);
            var divTitle=document.createElement("DIV");
            divTitle.innerHTML="MyTitle";
            var divDescription =document.createElement("DIV");
            divDescription.innerHTML="MyDescription";
            divDescription.style.fontSize="xx-small";
            div.appendChild(divTitle);
            div.appendChild(divDescription);
            this.dng_photolist.appendChild(div);
        
        }
     
     
     ----------------------------------------------------------------------------

    string MyTitle is the image title
    string MyDescriptionis the image description

      ----------------------------------------------------------------------------
     
    File names, photo sizes, and file dates were intentionally kept hidden from the viewer.
     
    Hide the file name
     
    1. Open file "CuteSoft_Client\Gallery\Viewer\LightBox\Code.js"
     
    2. Find section below and comment it
     
    this.phototext.appendChild(document.createTextNode(photo.Title));
     
    Hide the photo size
     
    1. Open file "CuteSoft_Client\Gallery\Viewer\LightBox\Code.js"
     
    2. Find section below and comment it
     
    this.toolbar.appendChild(this.photoinfo);
     
    Hide the photo comment
     
    Just need to set AllowShowComment="false" AllowPostComment="false"
     
     <DotNetGallery:GalleryBrowser runat="server" ID="GalleryBrowser1" Width="720" Height="430"
                Layout="Classic" AllowShowComment="false" AllowPostComment="false" />
     
     
    Regards,
     
    ken
View Complete Thread