Bash, Sed, taking lines from one file and stick them into another.

Cyrusm · 2010-02-07 14:27:31

So I'm writing a bash script to simplify the creation of photo galleries for my family website.
basically what I've been doing is putting all of the desired photos into a directory and then
manually editing an HTML template I have for my gallery pages.

then yesterday I tried the following code to create my image tags for me.

#!/bin/bash
for FILES in * ; do
          echo "<img src=\"$GALLERY/$FILES\" alt=\"\" />" >> outputfile
done

so now I can just copy and paste the tags, cutting out a lot of editing.

but what I'd like to do is create a script that takes these image tags and inserts them directly into the HTML
in the proper place so all I have to to is pick out the photos I like, type in one command,
and watch the magic happen.

my 2 ideas are:

1.) do something with sed (which is probably the best/right way to go about things.)
2) split the HTML template in two, concatenate the top-half, with the script output code, with the bottom-half (think like a sandwich) > resulting HTML file.

if I can't find a sed way to do it, I think the second option (however un-elegant) will do the trick.

any ideas?

Profjim · 2010-02-07 14:53:36

I'm quite fond of sed.

However, your second option is not inelegant. You'd be able to do what you want in sed, yes, but only by duplicating the second option in sed. That would be less pretty than I think you're imagining. Especially because in sed you'd have to wrestle with the need to escape special regexp chars. (This can be minimized, if you're careful, but you have to think about it.) Honestly, the second version is fine and will be easier to implement.

Cyrusm · 2010-02-07 19:06:28

sweet. basically, using the sandwich method stated above, I've made a shell script easy enough for my computer illiterate wife to use to post photo galleries to our website

all it does is copy the template HTML code and insert the appropriate image tags, and it creates a directory of resized source images, then it moves this to my local sandbox.
I still need to link it all to the main page, but that's no big deal. basically, I've just saved myself like a million keystrokes and made my wife less reliant on me for posting pics.

#!/bin/bash
TOP=template/top.html
BOTTOM=template/bottom.html

mkdir $1
cp pics/* $1
mogrify -resize 20% $1/*
cd $1/
for FILES in * ; do
    echo "      <img src=\"$1/$FILES\" alt=\"\" />" >> ../output.html
done
cd ..
cat $TOP output.html $BOTTOM > $1.html
rm output.html
mv  $1* ~/sandbox/Web/

as always, still needs a little refining, and some error checking/idiot-proofing, but it's a functional prototype.

I know I'm preaching to the choir here, but man I Love Shell Scripts!

sdolim · 2010-02-07 22:19:58

Possibly useless bash trivia, but you can combine output redirection for multiple commands like so:

{
    cat template/top.html
    for FILES in $1/* ; do
        echo "      <img src=\"$FILES\" alt=\"\" />"
    done
    cat template/bottom.html
} > $1.html

Xyne · 2010-02-07 22:27:56

This seems to be the wrong approach to me. Is there any reason that you're not scripting this on the server itself? The server should be generating the html output using your templates and simple file lists.

Cyrusm · 2010-02-08 00:30:34

well, I'm hosting the website on my personal computer with apache, and it's the first website I've ever really done anything with, plus I just started working on it the day before yesterday so
I'm still getting a feel for the right and wrong way to go about things. essentially I just started with a basic template that I downloaded from somewhere and started customizing away.

if your curious in taking a peek at it there's not much to see yet, You can take a look here , but anyways, that's why I've been doing all the
grunt work, I've pretty much been coding all of the content by hand, and now now that I have a good base set of code to work with I'm trying to come up with scripts to automate the maintenance and uploading of most of the material. it's sort of a hobby thing, it's been fun

if you have any tips or pointers I'd greatly appreciate any input, I'm still pretty new to this and I'd like it to be a learning experience.

Last edited by Cyrusm (2010-02-08 00:32:23)

Xyne · 2010-02-08 01:10:29

If you're running Apache, you should start looking at some simple PHP tutorials.

In your case, I would create a directory named "galleries" or something similar and then write a single PHP page which would accept the name of a gallery to view. If the name matches a subdirectory of gallery, then it would output an HTML page which contains the images found in the given subdirectory.

For example, you would place all of your Halloween images in "/galleries/halloween/" (relative to the server root). Then someone could visit "http://metcalf.homeftp.org/gallery.php?name=halloween" and it would load all of the images from the halloween directory. To add or remove galleries, all you would need to do is create or remove subdirectories in /galleries/.

The code to do it would be fairly simple. First you would create a page named "gallery.php" (or whatever you want). The page would be the template that you currently use, but in the middle where you normally insert the images, you would have a block of PHP code, e.g.

<html>
[your html code]

<?php
[php code]
?>

[the rest of your html code]
</html>

To get the name of the gallery requested with the example link above (http://metcalf.homeftp.org/gallery.php?name=halloween), you would use the $_GET variable, e.g.

$name = $_GET['name']

Then you use $name to check if there is a directory with that name in /galleries/. If there is, generate the html code that you're currently inserting manually by reading the directory.

Finally, if someone tries to access gallery.php without requesting a specific gallery, simply read the names of directories in /galleries/ and create an index page. This way you would never have to remember to update your index page when you add, move or remove a gallery.

After that you could start looking into restricting direct access /galleries/ with Apache's mod_access, which you can also use to make the URLs prettier (e.g. http://metcalf.homeftp.org/galleries/halloween instead of http://metcalf.homeftp.org/gallery.php?name=halloween).

Btw, the galleries fail if javascript (and thus flash) is disabled. The images load on top of each other and do not display properly.

crouse · 2010-02-08 01:51:37

Xyne wrote:

This seems to be the wrong approach to me. Is there any reason that you're not scripting this on the server itself? The server should be generating the html output using your templates and simple file lists.

Static html pages usually load faster than server generated pages, especially if your using something to edit the images on the fly as well.
Maybe not dynamic, but you don't need php, and you don't have any {albeit small} extra server load for generating the pages on the fly.

Dynamic content could be produced with php, python, perl, ruby, and yes, even bash... but you don't have to worry about future injection attacks with static html, it has it's place I think. Not to mention it's fun to play with bash and learn to do things from the command line.

Here is a bash script I wrote several years ago, that I've used for very quick photogallerys of my own.
My other bash scripts to manipulate images are here: http://bashscripts.org/forum/viewforum.php?f=34
Might give you something to start with so you can edit to suit your own taste.

    #!/bin/bash
    # FILE : bbgallery
    # Function: Creates a photogallery of .jpg images in the directory.
    #Crouse

    Create_Gallery ()
    {
    clear
    echo "    __    __    _
       / /_  / /_  (_)___  _____
      / __ \/ __ \/ / __ \/ ___/
    / /_/ / /_/ / / /_/ (__  )
    /_.___/_.___/_/ .___/____/
                 /_/
    "
    echo "----------------------------------"
    echo "Bash Batch Image Processing Script"
    echo "Image Gallery Creation Function"

    echo "----------------------------------"

    # Input the gallery name that will be displayed on the webpage.
    read -p "Please enter a name for the gallery: " galleryname
    echo " "
    echo " "
    echo "Now we need information regarding color scheme"
    echo "We will need color for the background of the webpage"
    echo "and the color of the borders around the images,"
    echo "and text underneath the images."
    echo " "
    read -p "Please enter a color for the webpage background: " backgroundcolor
    read -p "Please enter a color for the borders around the images: " bordercolor
    read -p "Please enter a color for the text underneath the images: " textcolor
    echo " "
    echo " "
    echo " "
    # Create thumbnail gallery
    echo "Thumbnail creation starting"
    mkdir thumbnails
    sleep 1
    echo "Thumbnail directory has been created"
    sleep 1
    #for i in *.JPG ;
    #changed to next line for various image types
    #for i in *.* ;
    # change [.jpg,.JPG] to something else if you want to work with some other image formats
    for i in *[.jpg,.JPG] ;
    do convert -size 120x120 ${i} -resize 120x120 -quality 100 tn_${i};
    mv tn_${i} thumbnails/${i} ;
    echo "Creating thumbnail ${i} " ;
    done
    echo "All thumbnails created"
    echo " "
    # Create white borders on images in thumbnail gallery
    echo "Creating borders on all images"
    echo " "
    cd thumbnails
    # for i in *.* ;
    # change [.jpg,.JPG] to something else if you want to work with some other image formats
    for i in *[.jpg,.JPG] ;
    do convert -bordercolor ${bordercolor} -border 2x2 ${i} ${i}
    echo "Border put on image ${i} " ;
    done
    echo " "
    echo "Borders created on all images"
    cd ..

    # need check to see if an index file already exists ......
    # if we are rerunning the script... the next line removes the previous version of the index file.
    # rm index.html

    # Create the html header
    echo " "
    echo "Creating index file"
    # Below is the start of the html file. You can change the meta tags to reflect YOUR information if you wish.
    # Spceifically the description and keywords sections.
    echo "<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">" >> index.html
    echo "<html>" >> index.html
    echo "<head>" >> index.html
    echo "<title>${galleryname} ................ Image gallery created using bbips version ${bbips_version} </title>" >> index.html
    echo "<meta http-equiv=\"Content-Type\" content=\"text/html; charset=iso-8859-1\">" >> index.html
    echo "<meta http-equiv=\"Content-Style-Type\" content=\"text/css\">" >> index.html
    echo "<meta name=\"Author\" content=\"http://www.bbips.org\">" >> index.html
    echo "<meta name=\"generator\" content=\"Created by the Bash Batch Image Processing Script\">" >> index.html
    echo "<meta name=\"robots\" content=\"all\">" >> index.html
    echo "<meta name=\"revisit-after\" content=\"15 days\">" >> index.html
    echo "<meta name=\"MSSmartTagsPreventParsing\" content=\"true\">" >> index.html
    echo "<meta name=\"description\" content=\"BBIPS - a Bash Batch Image ProcessingScript.\">" >> index.html
    echo "<meta name=\"keywords\" content=\"USA, LUG, Forum, usalug, Linux, bbips, bash, bashscripts.org, bbips.org, usalug.org \
    ">" >> index.html
    echo "</head>" >> index.html

    echo "<body bgcolor='${backgroundcolor}' link='${textcolor}' vlink='${textcolor}' text='${textcolor}'><center>" >> index.html
    echo "<br>" >> index.html
    echo "<h3>${galleryname}</h3>"  >> index.html
    echo "<table cellpadding='3' cellspacing='5'>"  >> index.html
    echo "<tr>"  >> index.html

    # Create the table of images
    count=0
    # for badname in *jpg
    # change [.jpg,.JPG] to something else if you want to work with some other image formats
    for badname in *[.jpg,.JPG] ;
    do
      if [ $count -eq 5 ] ; then
        echo "</td>"  >> index.html
        echo "</tr>"  >> index.html
    echo " "  >> index.html
        echo "<tr>"  >> index.html
        echo "<td align='center'>"  >> index.html
        count=1
      else
        echo "</td>"  >> index.html
        echo "<td align='center'>"  >> index.html
        count=$(( $count + 1 ))
      fi

      rename="$(echo ${badname} | sed 's/.jpg//;s/-/ /g')"

      echo "   <a href='${badname}' target=_new><img style='padding:2px' src='thumbnails/${badname}' border='0'></a>"  >> index.html
      echo "   <br>"  >> index.html
      echo "   <font size=-3>${rename}</font>"  >> index.html
    done

    echo "</td>"  >> index.html
    echo "</tr>"  >> index.html
    echo "</table>"  >> index.html
    echo "<br>" >> index.html
    echo "<br>" >> index.html
    echo "<br>" >> index.html
    echo "<font size=-5>Gallery created on " >> index.html;  date '+%D' >> index.html
    echo "<br>" >> index.html
    echo " using <a href=\"http://usalug.org/\">BBGALLERY</a> version 1.0" >> index.html
    echo "</font></center>"  >> index.html
    echo "</body>"  >> index.html
    echo " "
    echo " "
    echo "";
    }

    Create_Gallery
    #sleep 2
    #sed 's/<\/td>/ /' index.html > index2.html
    #mv index2.html index.html
    echo "Image Gallery Created Successfully"
    exit 0

Last edited by crouse (2010-02-08 02:03:52)

Cyrusm · 2010-02-08 02:48:21

Xyne wrote:

If you're running Apache, you should start looking at some simple PHP tutorials.

thanks for the advice! I figured this was good for getting me started, and then I was planning on moving onto PHP next.
To be honest with you I have no experience with PHP, so I'm not really familiar with all that can be done with it, it's nice to
know that a proper implementation with PHP seems like it's going to make my life much easier!

Xyne wrote:

Btw, the galleries fail if javascript (and thus flash) is disabled. The images load on top of each other and do not display properly.

as far as this goes, I thought it was a cool widget so I thought I'd try it out, but it's a little heavy on processor usage,
and as you say, it doesn't display correctly if javascript is disabled, so I'm currently researching other options.

well, thanks for all of the useful advice

Arch Linux

#1 2010-02-07 14:27:31

Bash, Sed, taking lines from one file and stick them into another.

#2 2010-02-07 14:53:36

Re: Bash, Sed, taking lines from one file and stick them into another.

#3 2010-02-07 19:06:28

Re: Bash, Sed, taking lines from one file and stick them into another.

#4 2010-02-07 22:19:58

Re: Bash, Sed, taking lines from one file and stick them into another.

#5 2010-02-07 22:27:56

Re: Bash, Sed, taking lines from one file and stick them into another.

#6 2010-02-08 00:30:34

Re: Bash, Sed, taking lines from one file and stick them into another.

#7 2010-02-08 01:10:29

Re: Bash, Sed, taking lines from one file and stick them into another.

#8 2010-02-08 01:51:37

Re: Bash, Sed, taking lines from one file and stick them into another.

#9 2010-02-08 02:48:21

Re: Bash, Sed, taking lines from one file and stick them into another.

Board footer