Permlink Replies: 34 - Pages: 3 [ Previous | 1 2 3 | Next ] - Last Post: 20-Apr-2019 22:56 Last Post By: RobM Threads: [ Previous | Next ]
AndreWolff

Posts: 1,694
Registered: 14-Dec-2007
Re: Template Pages
Posted: 07-Oct-2014 20:06   in response to: RobM in response to: RobM
  Click to reply to this thread Reply
Rob, I have next problem with your Minimal Slide Show skin:

If I click on the Sample Album button, your Sample album index page with 3 thumbnails is opened.
If I next click on the link About this album I come on your About This Album Page.

But where is the link or button to return to the Sample Album index page with the 3 thumbnails where I came from?
RobM

Posts: 3,169
Registered: 4-Aug-2006
Re: Template Pages
Posted: 07-Oct-2014 20:45   in response to: AndreWolff in response to: AndreWolff
  Click to reply to this thread Reply
There is no link back to the sample album's 'Home' page from the About page, I never put one in the template. You just click any of the links, like Jesrey or Lichfield to go to the other pages (those pages are where you would get to by clicking on the thumbnails, so it is just one click instead of two), from there you can click on an 'up' button to get back to that landing page.

If you really want a link back to the top level index then you could add one to each template.
RobM

Posts: 3,169
Registered: 4-Aug-2006
Re: Template Pages
Posted: 07-Oct-2014 21:08   in response to: RobM in response to: RobM
  Click to reply to this thread Reply
The other thing is that the sample album is actually embedded within my main site, but not as a subproject. If you look at my actual site the top level links work as you expect, that is clicking on a top level menu will always take you to the 'Home' index page of each project.

Those 'Sample Albums' are actually standalone projects with no links to my site, this is what I have done. Create the sample albums, one for each of my skins, with a few images and standard template pages. In each album you can only navigate within that album.

Now, I create my project of projects website and in one project, the jAlbum pages, I have a special template page. That page sits within a folder called sample albums and it 'looks' for any content in the corresponding output folder. So I move all of those sample albums into that output folder and make the jAlbum pages album again. Now if you navigate to the jAlbum pages 'Sample albums' page you see links to all of those sample albums.

They appear to be part of my website because the template links to them, but as far as a project of projects goes they are both!
AndreWolff

Posts: 1,694
Registered: 14-Dec-2007
Re: Template Pages
Posted: 07-Oct-2014 22:28   in response to: RobM in response to: RobM
  Click to reply to this thread Reply
Well Rob, I saw that problemen of the link back to the first index page in my skin which I did extend with your navigation.inc code.

I thougth that it was caused by the line which had been removed on your advice:

if(defaultShowSettings)

What was that statement doing?
RobM

Posts: 3,169
Registered: 4-Aug-2006
Re: Template Pages
Posted: 07-Oct-2014 22:34   in response to: AndreWolff in response to: AndreWolff
  Click to reply to this thread Reply
AndreWolff wrote:
if(defaultShowSettings)
What was that statement doing?
That includes a link to the album wide slide show, if selected in the Minimal Slide a show skin's settings. It is specific to that skin.
RobM

Posts: 3,169
Registered: 4-Aug-2006
Re: Template Pages
Posted: 07-Oct-2014 23:37   in response to: AndreWolff in response to: AndreWolff
  Click to reply to this thread Reply
AndreWolff wrote:
Well Rob, I saw that problemen of the link back to the first index page in my skin which I did extend with your navigation.inc code.
It is worth remembering that with templates you can override the index page for any folder. For example you could add the About template at the root level but rename it to index.htt, with a title set to 'About'. When the album is made the index.html page becomes the About page and the top links take users to the different top level parts of your album.

Have a look at my Home page http://robm.jalbum.net/RobM/index.html as an example.
AndreWolff

Posts: 1,694
Registered: 14-Dec-2007
Re: Template Pages
Posted: 09-Oct-2014 13:19   in response to: RobM in response to: RobM
  Click to reply to this thread Reply
If I click with the right mouse in the jAlbum Explore, I can select in the pop-up menu New page / Empty page. If I do that, a new_page.htt file is added with the next contents:
<ja:include page="page-header.inc" /> <%-- Keep this --%>
 
<%-- Replace this with your html --%>
<h1>${title}</h1>
<div>${comment}</div>
 
<ja:include page="page-footer.inc" /> <%-- Keep this --%>
Because I add a Close button to all generated extra pages, see my test album, the contents of a new empty page should be:
<ja:include page="page-header.inc" /> <%-- Keep this --%>
 
</head>
<body>
<ja:include page="navigation-bar.inc" />
 
<%-- Replace this with your html --%>
<h1>${title}</h1>
<div>${comment}</div>
 
<ja:include page="page-footer.inc" /> <%-- Keep this --%>
How can I implement this as empty page? Is there somewhere a template file for an empty place which I can modify?
RobM

Posts: 3,169
Registered: 4-Aug-2006
Re: Template Pages
Posted: 09-Oct-2014 17:17   in response to: AndreWolff in response to: AndreWolff
  Click to reply to this thread Reply
Copy your modified empty page to your skin, place it in folder called templates. Reload the skin and the modified template should appear in the page templates menu.
AndreWolff

Posts: 1,694
Registered: 14-Dec-2007
Re: Template Pages
Posted: 09-Oct-2014 21:56   in response to: RobM in response to: RobM
  Click to reply to this thread Reply
Attachment NewPage.png (31.3 KB)
RobM wrote:
Copy your modified empty page to your skin, place it in folder called templates.
Yes I did already what you advises, but the user can still select the first item above the line, in which case you get the wrong template see enclosed screendump.
RobM

Posts: 3,169
Registered: 4-Aug-2006
Re: Template Pages
Posted: 09-Oct-2014 22:45   in response to: AndreWolff in response to: AndreWolff
  Click to reply to this thread Reply
I called my empty page "Blank" just to differentiate it from the default empty page, which shows for all skins. However, skin specific templates, as in your attached screenshot, are grouped below the horizontal dividing line. That is how users can tell if they are using the jAlbum default empty page template or a skin's own set of templates.
AndreWolff

Posts: 1,694
Registered: 14-Dec-2007
Re: Template Pages
Posted: 12-Nov-2014 09:22   in response to: RobM in response to: RobM
  Click to reply to this thread Reply
Hi Rob,

I use in the current version of the Slide Show 4 skin the contact.htt and about.htt templates of the base skin, but because your proposed templates have a nice user interface to fill the contents, I am going to use your templates.

I have a number of questions about your templates:

1. In the first attempt to use your contact.htt templates I got a complaint the properties of my skin did not contain the statement fullSiteSupport=true. Nobody told me to add such a statement and it is not indicated in the documentation I could find. The Base skin templates are correct working without that statement, so my question is: Who is using that fullSiteSupport variable?
2. If I use your contact.htt template, I must apparently add an image contact.png, but that is not indicated in the user interface as you do in the about.htt template. Why do you not add the same construction in contact.htt?
3. I like to extend the contact,htt with the URL of a company website. You have of course already the jAlbum site URL included, but most commercial users will like to add another website. So I have to figure out how to do that. I see that you use images from ShareIcons. Where does that come from? Where is it stored? Is there an icon available for a company website? Or do you like to extend your contact.htt with a field for the URL of the company website?
4. Just for your information: I guess I have the same problem as the Notable skin: my resources are not always in the res sub-directory but it is possible to store the resources in a central directory for all images indicated in a variable rootresPath.
5. You assume in all your templates that there is a CSS selector #pageContent. That selector is not yet available in my skin, but still it works. I wonder whether it is wise to use the same id for all template files, may be that will lead to conflicts. Why don't you use as default Laza's #contact-page for the contact page, #about-page for the about page, #sitemap-page for the sitemap page etc.? I even wonder whether it according CSS rules it should not be a class instead of an id.
6. I did not implement the use TemplateHeader checkbox and I did not change anything in page-header.inc file and still it works, So what is the advantage of the construction you propose?

Anyhow thanks for sharing your templates!

Regards André
RobM

Posts: 3,169
Registered: 4-Aug-2006
Re: Template Pages
Posted: 12-Nov-2014 16:47   in response to: AndreWolff in response to: AndreWolff
  Click to reply to this thread Reply
AndreWolff wrote:
Hi Rob,

I use in the current version of the Slide Show 4 skin the contact.htt and about.htt templates of the base skin, but because your proposed templates have a nice user interface to fill the contents, I am going to use your templates.

I have a number of questions about your templates:

1. In the first attempt to use your contact.htt templates I got a complaint the properties of my skin did not contain the statement fullSiteSupport=true. Nobody told me to add such a statement and it is not indicated in the documentation I could find. The Base skin templates are correct working without that statement, so my question is: Who is using that fullSiteSupport variable?


FullSiteSupport is a skin property, it is listed in the Java API but is easiest to find in jAlbum with Tools, Skin Developer, Edit skin properties
I have added it to the skin properties documentation http://jalbum.net/help/en/Organization_of_a_skin

2. If I use your contact.htt template, I must apparently add an image contact.png, but that is not indicated in the user interface as you do in the about.htt template. Why do you not add the same construction in contact.htt?

About and Contact are modified versions of Turtle's templates, the contact.png I used is from Turtle's skin. Sorry, I should have stated that, but you can use any image you want, just add it to the res folder.

3. I like to extend the contact,htt with the URL of a company website. You have of course already the jAlbum site URL included, but most commercial users will like to add another website. So I have to figure out how to do that. I see that you use images from ShareIcons. Where does that come from? Where is it stored? Is there an icon available for a company website? Or do you like to extend your contact.htt with a field for the URL of the company website?

Those icons are from the jAlbum application, I'm on my iPad and can't remember the exact location, skins or resources. You can modify the template to add another (url) field if you want, but since the site visitor is already on the site is it worth adding a link there?

4. Just for your information: I guess I have the same problem as the Notable skin: my resources are not always in the res sub-directory but it is possible to store the resources in a central directory for all albums on a site indicated in a variable rootresPath.

I actually have all of my resources in the normal 'res' folder, but I move the folders contents to the parent folder's res directory when using a common resource folder. That meant having my own 'resPath' variable.

5. You assume in all your templates that there is a CSS selector #pageContent. That selector is not yet available in my skin, but still it works. I wonder whether it is wise to use the same id for all template files, may be that will lead to conflicts. Why don't you use as default Laza's #contact-page for the contact page, #about-page for the about page, #sitemap-page for the sitemap page etc.? I even wonder whether it according CSS rules it should not be a class instead of an id.

All of the templates have a single div using #pageContent, unless the user enters an id or custom CSS in the template interface. The CSS file containing the #pageContent selector attributes is generated by the template and saved to a file using the template's name. For example the About template creates a file called 'about_style.css' in the 'res' folder.

If the user wants to use a specific I'd, say '#content-page', then they can enter that. As there is no standard I tried to cover all conditions, skin specific, template specific and user generated CSS.

As there is only one div on each template using that selector an id is valid.

6. I did not implement the use TemplateHeader checkbox and I did not change anything in page-header.inc file and still it works, So what is the advantage of the construction you propose?

Not using the TemplateHeader should not stop it working, it allows the link to the CSS files to be placed in the 'header' section of the page, rather than in the body section.

The advantages, maybe none! It is intended to try to make templates work with any skin that supports templates and to prevent the UI from showing if the user switches to a skin that does not support templates.

It would be better if the templates could be prevented from running with skins that are not site aware, but I can't code for that. How well they work in other skins will depend on the user and the skin designer. If the skin designer documents the id selector they code specifically for a template, then the user can enter that I'd in the template. Otherwise the user uses it as is and hopes for the best, or they examine the skin code and/or write their own CSS. That is why I listed a set of id selectors for different skins that I have tried the templates with.

7. I have also an About_album.htt page, which is almost equal to the About.htt page, only is the image larger. Soto get it working, I had to remove the line
ai = ai.scaleToFit(new Dimension(320,320));
Why is did statement required, if the user defines the image width in the 2nd field?

As above, it was based on Turtle, Laza presumably coded the size for aesthetic reasons, if left to the user I supose someone could use a really big image!

Anyhow thanks for sharing your templates!
You are welcome, I hope some of it is useful and that the above helps.
RobM

Posts: 3,169
Registered: 4-Aug-2006
Re: Template Pages
Posted: 12-Nov-2014 16:58   in response to: RobM in response to: RobM
  Click to reply to this thread Reply
7. I have also an About_album.htt page, which is almost equal to the About.htt page, only is the image larger. Soto get it working, I had to remove the line
ai = ai.scaleToFit(new Dimension(320,320));
Why is did statement required, if the user defines the image width in the 2nd field?
Ah, just read it properly, yes, it should be removed now as the user is intended to specify an image width. I will update the templates as soon as I can.
AndreWolff

Posts: 1,694
Registered: 14-Dec-2007
Re: Template Pages
Posted: 12-Nov-2014 18:14   in response to: RobM in response to: RobM
  Click to reply to this thread Reply
RobM wrote:
FullSiteSupport is a skin property, it is listed in the Java API but is easiest to find in jAlbum with Tools, Skin Developer, Edit skin properties
Yes I know, but my question was: Why? Who is using it?

About and Contact are modified versions of Turtle's templates, the contact.png I used is from Turtle's skin. Sorry, I should have stated that, but you can use any image you want, just add it to the res folder.
I understand, but I like to show a consistent UI to the album user. So if he can chose any picture and name in About.htt, he expects to handle the image in the same way in Contact.htt

All of the templates have a single div using #pageContent, unless the user enters an id or custom CSS in the template interface. The CSS file containing the #pageContent selector attributes is generated by the template and saved to a file using the template's name. For example the About template creates a file called 'about_style.css' in the 'res' folder.
??? I do not see that a 'about_style.css' is created in the 'res' folder!

I have now for my about page and about_album page a differtent style for <p>:
#about_album-page .texts p {
	line-height:1.5em;
}
#about-page .texts p {
	line-height:2.0em;
}
But if I use id pageContent for all templates, this becomes:
#pageContent  .texts p {
	line-height:1.5em;
}
#pageContent  .texts p {
	line-height:2.0em;
}
so both templates do get the same line-height.

You are welcome, I hope some of it is useful and that the above helps.
Very usefull!
RobM

Posts: 3,169
Registered: 4-Aug-2006
Re: Template Pages
Posted: 12-Nov-2014 19:01   in response to: AndreWolff in response to: AndreWolff
  Click to reply to this thread Reply
AndreWolff wrote:
RobM wrote:
FullSiteSupport is a skin property, it is listed in the Java API but is easiest to find in jAlbum with Tools, Skin Developer, Edit skin properties
Yes I know, but my question was: Why? Who is using it?
Well, I use it for all of my skins because it is the property for skins that are site aware.
I would expect any skin developer that uses the skin properties editor to set it to true for site aware skins. It is not mandatory though, but if not set then these templates will not show the UI.
It is a skin property, so I guess any further information would need to come from David.
About and Contact are modified versions of Turtle's templates, the contact.png I used is from Turtle's skin. Sorry, I should have stated that, but you can use any image you want, just add it to the res folder.
I understand, but I like to show a consistent UI to the album user. So if he can chose any picture and name in About.htt, he expects to handle the image in the same way in Contact.htt
the contact page image is more of a watermark type of image
All of the templates have a single div using #pageContent, unless the user enters an id or custom CSS in the template interface. The CSS file containing the #pageContent selector attributes is generated by the template and saved to a file using the template's name. For example the About template creates a file called 'about_style.css' in the 'res' folder.
??? I do not see that a 'about_style.css' is created in the 'res' folder!
The file is created in the output directory's res folder by this code
if(!usePageStyle) {
		//set the DIV container to use an id of pageContent
		pageID = "<div id="\"pageContent\"">";
		// declare a print stream object
		PrintStream pTemplateCSS;
		// declare file output object
		FileOutputStream outTemplateCSS;
		// set the output stream to the CSS file to be made
		outTemplateCSS = new FileOutputStream(rootOutputDirectory + templateStyleFile);
		// Connect print stream to the output stream ready to generate the CSS code
		pTemplateCSS = new PrintStream( outTemplateCSS );
		//check to see if a about_style.css file exists in the 'res' directory, if not make one
		if (!templateCSSFile.exists()) IO.writeTextFile("", new File(rootOutputDirectory.getAbsolutePath(), templateStyleFile));
		
		if(userCSS != void && !"#pageContent{ \n\n}".equals(userCSS)) pTemplateCSS.println(userCSS);
		else
			{
		//Write the CSS code for the supplied styles
		pTemplateCSS.println("#pageContent {");
                ...
                pTemplateCSS.println("}");
		}
		// close the print stream
		pTemplateCSS.close();
	}

So it is created when usePageStyle ("Enter a specific css selector id #") is not checked.
If it is not there can you zip up a small project file for me to try?
I have now for my about page and about_album page a differtent style for <p>:
#about_album-page .texts p {
	line-height:1.5em;
}
#about-page .texts p {
	line-height:2.0em;
}
But if I use id pageContent for all templates, this becomes:
#pageContent  .texts p {
	line-height:1.5em;
}
#pageContent  .texts p {
	line-height:2.0em;
}
so both templates do get the same line-height.
As above, if you have usePageStyle unchecked then the pages make their own stylesheet, if it is checked and you enter a string in templateID, then it uses that selector from the skin.
You are welcome, I hope some of it is useful and that the above helps.
Very usefull!
Legend
Forum admins
Helpful Answer
Correct Answer

Point your RSS reader here for a feed of the latest messages in all forums