Re: [greenstone-users] Image display problem

From Richard Managh
DateMon, 16 Jan 2006 14:36:58 +1300
Subject Re: [greenstone-users] Image display problem
In-Reply-To (20060113161242-75598-qmail-web32210-mail-mud-yahoo-com)
Hi Jasmine,

>Currently I am preparing for the design of the collection and i
checked that it is possible to use a cascading style sheet to customise
the collection design. I also read that in order to edit the iimages/
design for the collection, i have to edit the macros. Does this mean
that i have to apply both CSS and the macros to change my layout or
apply one?

The macros in greenstone help to generate the html for each page that
greenstone displays.

As a simple example, lets say for a certain page greenstone spits out
the contents of the following macros, which form a html page.

GSDL Error

{
<html>
<head>
<title>Sample page</title>
</head>
<body>
}

oops

The requested page could not be found. Please use your browsers 'back' button or the above home button to return to the Greenstone Digital Library. {

<p>This is some content</p>

}

{
</body>
</html>
}

You do need to change the macros to change the way the page looks. But
whether you use css, is up to you. (You might use <b> </b> tags which
are not considered css)

Lets say you wanted to change the color of the text in the content of
the page to blue.

This is an example of changing the look of the page using css, but with
an *inline style*, that is without using an external stylesheet.

You might change the

oops

The requested page could not be found. Please use your browsers 'back' button or the above home button to return to the Greenstone Digital Library. macro to be as follows

oops

The requested page could not be found. Please use your browsers 'back' button or the above home button to return to the Greenstone Digital Library.{

<p style="color: blue;">This is some content</p>

}


Here are a few more examples:

Changing the content text color to blue *using an internal style sheet:*

You would change the GSDL Error

macro to something like:

GSDL Error

{
<html>
<head>
<title>Sample page</title>
<style type="text/css">
<!--
.bluetext { color: blue; }
-->
</style>
</head>
<body>
}

oops

The requested page could not be found. Please use your browsers 'back' button or the above home button to return to the Greenstone Digital Library. {

<p class="bluetext">This is some content</p>

}

You need the <!-- and --> if you want to be compatible with older browsers.

*Using an external stylesheet:*

Contents of lets say a file called style.css
--------Start Contents----------
.bluetext { color: blue; }
--------End Contents-----------

You could have header and content macros like:

GSDL Error

{
<html>
<head>
<title>Sample page</title>
<link rel="stylesheet" type="text/css"
href="/gsdl/collect/apples/macros/style.css" />
</head>
<body>
}

oops

The requested page could not be found. Please use your browsers 'back' button or the above home button to return to the Greenstone Digital Library. {

<p class="bluetext">This is some content</p>

}

In the above example the collection name is "apples", and the style.css
file would be placed in the <greenstone install
dir>collectapplesmacros directory

If at all possible prefer external stylesheets before internal
stylesheets before inline styles. This is because external stylesheets
are more powerful, as they can be used to change hundreds of pages, by
just modifying the one css file that all of those pages specify as their
stylesheet. For more information on stylesheets see

http://www.w3schools.com/css/css_howto.asp or
http://www.w3schools.com/css/default.asp

So, from the above examples, you can see that if you want to use css to
change the look of your page, you need to modify the macros to apply css
to the final generated html.


>And if i were to use CSS which part of folder am i suppose to insert
into for my collection folder in Greenstone.

A simple example:

Lets say your collection is about apples, and you have an apples
collection directory, you might have a macro file called apples.dm in
your applesmacros directory, you might also have a css file called
style.css in that same directory. You would need to make sure in your
collect.cfg that you include apples.dm in the listed macro files to use
for your collection, something like:

macrofiles style.dm base.dm query.dm about.dm document.dm
english.dm *apples.dm*

Now you have a macrofile that you can use to modify the macros in your
collection.

You might put in this apples.dm macrofile:

---------------------------------------------------
package Style

GSDL Error [c=apples] {
<html>
<head>
<title>GSDL Error</title>
<link rel="stylesheet" href="/gsdl/collect/apples/macros/style.css">

</head>

<body>
}
--------------------------------------------------

There are different macro "packages" which control display for different
pages in greenstone.
Here we are "overriding" the default GSDL Error macro in the Style
package, when it applies to the apples collection [c=apples]. This would
change many of the pages of greenstone (the Style macro package applies
to many pages) to have your style.css cascading stylesheet available,
you would of course need to override other macros such as

oops

The requested page could not be found. Please use your browsers 'back' button or the above home button to return to the Greenstone Digital Library.
macros to apply your css rules to your content. You might look at the

oops

The requested page could not be found. Please use your browsers 'back' button or the above home button to return to the Greenstone Digital Library. macros of different default macro files, such as query.dm or
document.dm in your <greenstone install dir>macros directory. In these
files, you might find many macros that you might override in your
collection to get the desired display results in your collection.

For more information about working with macros, see

Section 2.4 of the Greenstone Developers guide, available here:
http://www.greenstone.org/cgi-bin/library?e=p-en-faq-utfZz-8&a=p&p=docs

There is also a link to customising the greenstone interface on that page.


Hope this helps,


Richard
--
DL Consulting
Greenstone Digital Library and Digitisation Specialists
contact@dlconsulting.co.nz
www.dlconsulting.co.nz


Hi Richard,

Thank you for the answer again. Currently I am preparing for the design
of the collection and i checked that it is possible to use a cascading
style sheet to customise the collection design. I also read that in
order to edit the iimages/ design for the collection, i have to edit the
macros. Does this mean that i have to apply both CSS and the macros to
change my layout or apply one? And if i were to use CSS which part of
folder am i suppose to insert into for my collection folder in Greenstone.

Thank You.

Regards,
Jasmine

*/Richard Managh <richard@dlconsulting.co.nz>/* wrote:

Hi Jasmine,

If you want to support 50 users, you should definately use the web
library version of greenstone. The local library version uses a
small cut down webserver that pales in performance comparison to a
webserver such as apache.

Richard.
--
DL Consulting
Greenstone Digital Library and Digitisation Specialists
contact@dlconsulting.co.nz
<http://sg.f322.mail.yahoo.com/ym/contact@dlconsulting.co.nz>
www.dlconsulting.co.nz
<http://sg.f322.mail.yahoo.com/ym/www.dlconsulting.co.nz>


Lenneth Valkyrie wrote:
Hi Richard,

Thank you very much for the help again. The images appear now ^_^. I
was wondering, is the local library strong enough to support 50
users locally (intranet) or web library would have been a better
choice. But i read from the guide manual, it said that web library
is for public access, which is suitable to be put up on world wide
web. Local library is intended for use on standalone computers or
computers that do not already have webserver software and it allows
other computer on the same network to access the library. However,
there are limited configurability.

Thank you.

Regards,
Jasmine

*/Richard Managh <richard@dlconsulting.co.nz>/* wrote:

Hi Jasmine,

I've created a small collection of images, tried using the
ImagePlug
plugin in this way, and it appears that the plugin creates "Screen"
metadata:

screenview.jpg

giving you the location of an additional image it creates with
the size
you specified with:

plugin ImagePlug -screenviewsize 400

The "screenviewsize" option creates a new image for each
provided image
called screenview.jpg, but you need to specifically link to this
image.
So for each image document, you need to change the relevant
links in
format statements to use this new Screen metadata item provided,
to link
to the new image created.

For example:

would become

In addition, the ImagePlug creates a metadata item called
screenicon,
which contains the html code for displaying the custom image.

Using [screenicon] produces something like:


width=[ScreenWidth] height=[ScreenHeight]>

You can see this metadata item in the doc.xml for each image
document.


Hope this is helpful,


Richard.
--
DL Consulting
Greenstone Digital Library and Digitisation Specialists
contact@dlconsulting.co.nz
www.dlconsulting.co.nz

Lenneth Valkyrie wrote:

> Hi Richard,
>
> I tried and it does not work. My image still appear to be
very big
> after i click onto the thumbnail which was suppose to bring
me to a
> page with metadata details and the image. The image appears
still the
> same size even though after i set the configuration of the of
the
> imageplug.
>
> Thank you.
>
> Regards,
> Jasmine
>
> */Richard Managh /* wrote:
>
> Hi Jasmine,
>
> Yes, you can use the "screenviewsize" option of ImagePlug to
set the
> width of your imported images. The height of the images will be
> automatically determined in proportion to the width.
>
> You configure this option in the GLI from the Design tab, under
> "Document Plugins", choosing ImagePlug and clicking the configure
> button, or you can edit your collection configuration file, and
> change
> the line which would be something like
>
> plugin ImagePlug
>
> to
>
> plugin ImagePlug -screenviewsize 400
>
> for 400 pixel width images.
>
> Then rebuild the collection.
>
> Hope this helps,
>
>
> Richard.
> --
> DL Consulting
> Greenstone Digital Library and Digitisation Specialists
> contact@dlconsulting.co.nz
> www.dlconsulting.co.nz
>
>
> Lenneth Valkyrie wrote:
>
> > Hi Richard,
> >
> > Thank you so much, i finally understand what is the problem now
> and my
> > image appeared ^_^. I have a another question, is it
possible to
> > resize the image using greenstone instead of having to use
other
> image
> > editing software to resize the image?
> >
> > Regards,
> > Jasmine
> >
> > */Richard Managh /* wrote:
> >
> > Hi Jasmine,
> >
> > I would suggest that instead of the following in the top of
your
> > DocumentText format statement:
> >
> > format DocumentText "
> >
> >
>
src='/gsdl/collect/SCCCI/index/assoc/[assocfilepath]/[sc.AccessionNumber]'>
> >
> > You substitute [Source] for [sc.AccessionNumber]
> >
> > Which would give you:
> >
> > format DocumentText "
> >
> >
> >
src='/gsdl/collect/SCCCI/index/assoc/[assocfilepath]/[Source]'>
> >
> > This is because in your doc.xml file [sc.AccessionNumber]
in the
> > example
> > you sent, would evaluate to "49" when what you probably want is
> > "49.jpg"
> >
> > So, for your image, instead of: **
> >
> >
> >
>
src='/gsdl/collect/SCCCI/index/assoc/[assocfilepath]/[sc.AccessionNumber]'>
> >
> > Which gives:
> > src='/gsdl/collect/SCCCI/index/assoc/*HASH0b7e.dir*/*49*'>
> >
> >
> > You would have:
> >
src='/gsdl/collect/SCCCI/index/assoc/[assocfilepath]/[Source]'>
> >
> > Which gives:
> >
src='/gsdl/collect/SCCCI/index/assoc/*HASH0b7e.dir*/*49.jpg*'>
> >
> >
> > Hope this helps,
> >
> >
> > Richard.
> > --
> > DL Consulting
> > Greenstone Digital Library and Digitisation Specialists
> > contact@dlconsulting.co.nz
> > www.dlconsulting.co.nz
> >
> >
> >
> > Jasmine wrote:
> >
> > > Hi,
> > > I had been figuring out how to solve the image display
problem for
> > > days and still couldn't find where the fault lies. My
image still
> > > could not appear. I looked into my doc.xml file and this
is how it
> > > looks like
> > >
> > > * * *importGeneral Affairs
> > > CommitteeBefore 1982Celebrations, Ceremonies &
> > > Festivals49.jpg*
> > > * * *indexed_doc*
> > > * * *ImagePlug*
> > > * * *49.jpg*
> > > * * *49.jpg*
> > > * * *JPEG*
> > > * * *unknown*
> > > * * *JPEG*
> > > * * *1052*
> > > * * *1672*
> > > * * *unknown*
> > > * * *
> > >
> >
>
href="/gsdl/collect/gsarch/index/assoc/[assocfilepath]/[sc.AccessionNumber]">*
> >
> > >
> > > * * **
> > > * * *
> > >
> >
>
src="/gsdl/collect/gsarch/index/assoc/[assocfilepath]/[sc.AccessionNumber]"
> >
> > > width=100>*
> > > * * *gif*
> > > * * *thumbnail.gif*
> > > * * *
> > > src="/gsdl/collect/gsarch/index/assoc/[assocfilepath]/[Thumb]"
> > > width=[ThumbWidth] height=[ThumbHeight]>*
> > > * * *63*
> > > * * *100*
> > > * * *General Affairs Committee*
> > > * * *19640920*
> > > * * *Temasek Polytechnic, Information
> > > Management student*
> > > * * *49*
> > > * * *SCCCI (General Affairs
> > > Committee)*
> > > * * *General Affairs Committee-Before
> > > 1982-Celebrations, Ceremonies & Festivals*
> > > * * *NA*
> > > * * *49*
> > > * * *HASH0b7e3412832ce54061a81e*
> > > * * *HASH0b7e.dir*
> > > * * *49.jpg:image/JPEG:*
> > > * *
> > > name="*gsdlassocfile*">*thumbnail.gif:image/gif:*
> > > * *
> > > * * *This document has no text.*
> > >
> > >
> > > and this is what my collect.cfg file look like for the format
> > feature:
> > >
> > > format DateList " [link][icon][/link]
> > >
> >
>
[highlight]{Or}{[dls.Title],[dc.Title],[ex.Title],Untitled}[/highlight]
> >
> > > [ex.Date] "
> > >
> > > format HList "[link][highlight][ex.Title][/highlight][/link]"
> > > format DocumentButtons ""
> > >
> > > format VList " [link][thumbicon][/link]
> > > *Event Title: *[sc.Title]
> > *Date of Event:
> > > *[sc.Date]
> > *Description: *[sc.Description]
> > > "
> > > format DocumentHeading ""
> > >
> > > format DocumentText "
> >
> >
> > >
> >
>
src='/gsdl/collect/SCCCI/index/assoc/[assocfilepath]/[sc.AccessionNumber]'>
> > >
> > *Event Title: *[sc.Title]
> > >
> > *Date of Event: *[sc.Date]
> > *Description:
> > > *[sc.Description]
> > >
> > *Event Organiser: *[sc.Organiser]
> > >
> > *Notes: *[sc.Notes]
> >
> > "
> > >
> > >
> > > Thank you, i will be looking forward to the reply.
> > >
> > > Best Regards,
> > > Jasmine
> > >
> > >