NIHVIVO-1176. Removed themeStylesheetDir from template model, and replaced with themeDir. Also modified stylesheet and script addFromTheme methods so the prepend only the theme directory; the specific stylesheet or css directory must be added to the path argument.

This commit is contained in:
rjy7 2010-10-01 14:55:03 +00:00
parent 535691ee11
commit 5bc5c0b93c
12 changed files with 80 additions and 108 deletions

View file

@ -351,10 +351,7 @@ public class FreemarkerHttpServlet extends VitroHttpServlet {
map.put("urls", getUrls(themeDir, urlBuilder)); map.put("urls", getUrls(themeDir, urlBuilder));
// This value will be available to any template as a path for adding a new stylesheet. map.put("themeDir", themeDir);
// It does not contain the context path, because the methods to generate the href
// attribute from the string passed in by the template automatically add the context path.
map.put("themeStylesheetDir", themeDir + "/css");
map.put("stylesheets", getStylesheetList(themeDir)); map.put("stylesheets", getStylesheetList(themeDir));
map.put("scripts", getScriptList(themeDir)); map.put("scripts", getScriptList(themeDir));

View file

@ -40,7 +40,7 @@ public abstract class Files extends BaseTemplateModel {
if (!path.startsWith("/")) { if (!path.startsWith("/")) {
path = "/" + path; path = "/" + path;
} }
path = themeDir + getThemeSubDir() + path; path = themeDir + path;
add(path); add(path);
} }
@ -63,7 +63,6 @@ public abstract class Files extends BaseTemplateModel {
return list.toString(); return list.toString();
} }
protected abstract String getThemeSubDir();
protected abstract String getTag(String url); protected abstract String getTag(String url);
} }

View file

@ -4,8 +4,6 @@ package edu.cornell.mannlib.vitro.webapp.web.templatemodels.files;
public class Scripts extends Files { public class Scripts extends Files {
protected static final String THEME_SUBDIR = "/js";
public Scripts() { } public Scripts() { }
public Scripts(String themeDir) { public Scripts(String themeDir) {
@ -15,8 +13,4 @@ public class Scripts extends Files {
protected String getTag(String url) { protected String getTag(String url) {
return "<script type=\"text/javascript\" src=\"" + url + "\"></script>\n"; return "<script type=\"text/javascript\" src=\"" + url + "\"></script>\n";
} }
protected String getThemeSubDir() {
return THEME_SUBDIR;
}
} }

View file

@ -4,8 +4,6 @@ package edu.cornell.mannlib.vitro.webapp.web.templatemodels.files;
public class Stylesheets extends Files { public class Stylesheets extends Files {
protected static final String THEME_SUBDIR = "/css";
public Stylesheets() { } public Stylesheets() { }
public Stylesheets(String themeDir) { public Stylesheets(String themeDir) {
@ -16,8 +14,4 @@ public class Stylesheets extends Files {
return "<link rel=\"stylesheet\" href=\"" + url + "\" />\n"; return "<link rel=\"stylesheet\" href=\"" + url + "\" />\n";
} }
protected String getThemeSubDir() {
return THEME_SUBDIR;
}
} }

View file

@ -7,7 +7,7 @@ ${scripts.add("/js/jquery_plugins/jcrop/jquery.Jcrop.js")}
${scripts.add("/js/imageUpload/cropImage.js")} ${scripts.add("/js/imageUpload/cropImage.js")}
${stylesheets.addFromTheme("/uploadImages.css")} ${stylesheets.addFromTheme("/css/uploadImages.css")}
${stylesheets.add("/js/jquery_plugins/jcrop/jquery.Jcrop.css")} ${stylesheets.add("/js/jquery_plugins/jcrop/jquery.Jcrop.css")}
@ -24,31 +24,32 @@ ${stylesheets.add("/js/jquery_plugins/jcrop/jquery.Jcrop.css")}
<div id="photoCroppingContainer"> <div id="photoCroppingContainer">
<h2>Photo Upload</h2> <h2>Photo Upload</h2>
<!-- This is the image we're attaching Jcrop to --> <!-- This is the image we're attaching Jcrop to -->
<div id="photoCroppingPreview"> <div id="photoCroppingPreview">
<h6>Current Photo </h6> <h6>Current Photo </h6>
<p class="photoCroppingTitleBody">Your profile photo will look like the image below. </p> <p class="photoCroppingTitleBody">Your profile photo will look like the image below. </p>
<div style="width:115px;height:115px;overflow:hidden;border:1px solid green;"> <img src="${imageUrl}" id="preview" /> </div> <div style="width:115px;height:115px;overflow:hidden;border:1px solid green;">
<div id="photoCroppingHowTo"> <img src="${imageUrl}" id="preview" />
<p class="photoCroppingNote">To make adjustments, you can drag around and resize the photo to the right. When you are happy with your photo click the "Save Photo" button. </p> </div>
<form id="cropImage" action="${formAction}" method="post"> <div id="photoCroppingHowTo">
<p class="photoCroppingNote">To make adjustments, you can drag around and resize the photo to the right. When you are happy with your photo click the "Save Photo" button. </p>
<form id="cropImage" action="${formAction}" method="post">
<!-- Javascript will populate these values --> <!-- Javascript will populate these values -->
<input type="hidden" name="x" value="" /> <input type="hidden" name="x" value="" />
<input type="hidden" name="y" value="" /> <input type="hidden" name="y" value="" />
<input type="hidden" name="w" value="" /> <input type="hidden" name="w" value="" />
<input type="hidden" name="h" value="" /> <input type="hidden" name="h" value="" />
<input type="submit" value="Save photo"> <input type="submit" value="Save photo">
or <a class="cancelUpload" href="${cancelUrl}">Cancel</a> or <a class="cancelUpload" href="${cancelUrl}">Cancel</a>
</form> </form>
</div>
</div> </div>
<div id="photoCropping"> </div>
<img style="border:1px solid green;" src="${imageUrl}" <#--<@newImageSize/>--> id="cropbox" /> <div id="photoCropping">
<img style="border:1px solid green;" src="${imageUrl}" <#--<@newImageSize/>--> id="cropbox" />
</div> </div>
</div> </div>
<div class="clear"></div> <div class="clear"></div>

View file

@ -5,38 +5,30 @@
${scripts.add("/js/jquery.js")} ${scripts.add("/js/jquery.js")}
${scripts.add("/js/imageUpload/imageUploadUtils.js")} ${scripts.add("/js/imageUpload/imageUploadUtils.js")}
${stylesheets.addFromTheme("/css/uploadImages.css")}
${stylesheets.addFromTheme("/uploadImages.css")}
<div id="photoUploadContainer"> <div id="photoUploadContainer">
<h2>Photo Upload</h2> <h2>Photo Upload</h2>
<#if errorMessage??>
<div id="errorAlert"><img src="${urls.siteIcons}/iconAlert.png"/>
<p>${errorMessage}</p>
</div>
</#if>
<#if errorMessage??> <div id="photoUploadDefaultImageContainer">
<div id="errorAlert"><img src="${urls.siteIcons}/iconAlert.png"/> <h6>Current Photo</h6>
<p>${errorMessage}</p> <img src="${thumbnailUrl}" width="115" height="115" />
</div> </div>
</#if>
<div id="photoUploadForm">
<form action="${formAction}" enctype="multipart/form-data" method="post">
<div id="photoUploadDefaultImageContainer"> <label>Upload a photo <span> (JPEG, GIF or PNG)</span></label>
<h6>Current Photo</h6> <input id="datafile" type="file" name="datafile" size="30" />
<img src="${thumbnailUrl}" width="115" height="115" /> </div> <input type="submit" value="Upload photo"/>
<span class="or"> or
<div id="photoUploadForm"> <a class="cancelUpload" href="${cancelUrl}">Cancel</a></span>
</form>
<form action="${formAction}" enctype="multipart/form-data" method="post"> </div>
<label>Upload a photo <span> (JPEG, GIF or PNG)</span></label>
<input id="datafile" type="file" name="datafile" size="30" />
<input type="submit" value="Upload photo"/>
<span class="or"> or
<a class="cancelUpload" href="${cancelUrl}">Cancel</a></span>
</form>
</div>
</div> </div>

View file

@ -5,32 +5,28 @@
${scripts.add("/js/jquery.js")} ${scripts.add("/js/jquery.js")}
${scripts.add("/js/imageUpload/imageUploadUtils.js")} ${scripts.add("/js/imageUpload/imageUploadUtils.js")}
${stylesheets.addFromTheme("/css/uploadImages.css")}
${stylesheets.addFromTheme("/uploadImages.css")}
<div id="photoUploadContainer"> <div id="photoUploadContainer">
<h2>Photo Upload</h2> <h2>Photo Upload</h2>
<#if errorMessage??> <#if errorMessage??>
<div id="errorAlert"><img src="${urls.siteIcons}/iconAlert.png"/> <div id="errorAlert"><img src="${urls.siteIcons}/iconAlert.png"/>
<p>${errorMessage}</p> <p>${errorMessage}</p>
</div> </div>
</#if> </#if>
<div id="photoUploadDefaultImageContainer"> <div id="photoUploadDefaultImageContainer">
<h6>Current Photo</h6> <h6>Current Photo</h6>
<img src="${thumbnailUrl}" width="115" /> <img src="${thumbnailUrl}" width="115" />
<a class="thumbnail" href="${deleteUrl}">Delete photo</a></div> <a class="thumbnail" href="${deleteUrl}">Delete photo</a>
</div>
<div id="photoUploadForm"> <div id="photoUploadForm">
<form action="${formAction}" enctype="multipart/form-data" method="post"> <form action="${formAction}" enctype="multipart/form-data" method="post">
<label>Replace Photo <span> (JPEG, GIF or PNG)</span></label> <label>Replace Photo <span> (JPEG, GIF or PNG)</span></label>
<input type="file" name="datafile" size="30"> <input type="file" name="datafile" size="30">
<input type="submit" value="Upload photo"> <input type="submit" value="Upload photo">
<span class="or"> or <span class="or"> or
<a class="cancelUpload" href="${cancelUrl}">Cancel</a></span> <a class="cancelUpload" href="${cancelUrl}">Cancel</a></span>
</form>
</form> </div>
</div>
</div> </div>

View file

@ -80,7 +80,7 @@
</div> <!-- #personWrap --> </div> <!-- #personWrap -->
${stylesheets.addFromTheme("/entity.css")} ${stylesheets.addFromTheme("/css/entity.css")}
<#-- RY Figure out which of these scripts really need to go into the head, and which are needed at all (e.g., tinyMCE??) --> <#-- RY Figure out which of these scripts really need to go into the head, and which are needed at all (e.g., tinyMCE??) -->
${headScripts.add("/js/jquery.js", ${headScripts.add("/js/jquery.js",

View file

@ -6,6 +6,5 @@
<#include loginTemplate> <#include loginTemplate>
${stylesheets.add("/css/login.css")} ${stylesheets.add("/css/login.css")}
${stylesheets.addFromTheme("/css/formedit.css")}
${scripts.add("/js/jquery.js", "/js/login/loginUtils.js")} ${scripts.add("/js/jquery.js", "/js/login/loginUtils.js")}
</#if> </#if>

View file

@ -41,7 +41,7 @@
<#-- Paging controls --> <#-- Paging controls -->
<#if (pagingLinks?size > 0)> <#if (pagingLinks?size > 0)>
<div class="searchpages"> <div class="searchpages">
Pages: Pages:
<#if prevPage??><a class="prev" href="${prevPage}">Previous</a></#if> <#if prevPage??><a class="prev" href="${prevPage}">Previous</a></#if>
<#list pagingLinks as link> <#list pagingLinks as link>
<#if link.url??> <#if link.url??>
@ -56,4 +56,4 @@
</div> <!-- end contentsBrowseGroup --> </div> <!-- end contentsBrowseGroup -->
${stylesheets.addFromTheme("search.css")} ${stylesheets.addFromTheme("/css/search.css")}

View file

@ -54,8 +54,8 @@
<@dump var="zoo1" /> <@dump var="zoo1" />
${stylesheets.addFromTheme("/sstest.css", "/sstest2.css")} ${stylesheets.addFromTheme("/css/sstest.css", "/css/sstest2.css")}
${scripts.addFromTheme("/jstest.js")} ${scripts.addFromTheme("/js/jstest.js")}
${scripts.add("/js/script1.js", "/js/script2.js", "/js/script3.js")} ${scripts.add("/js/script1.js", "/js/script2.js", "/js/script3.js")}

View file

@ -41,8 +41,8 @@
Three ways to add a stylesheet: Three ways to add a stylesheet:
A. In theme directory: A. In theme directory:
${stylesheets.addFromTheme("/sample.css")} ${stylesheets.addFromTheme("/css/sample.css")}
${stylesheets.add(themeStylesheetDir + "/sample.css")} ${stylesheets.add(themeDir + "/css/sample.css")}
B. Any location B. Any location
${stylesheets.add("/edit/forms/css/sample.css)"} ${stylesheets.add("/edit/forms/css/sample.css)"}
@ -50,7 +50,7 @@ ${stylesheets.add("/edit/forms/css/sample.css)"}
To add a script: To add a script:
A. In theme directory: A. In theme directory:
${scripts.addFromTheme("/sample.js")} ${scripts.addFromTheme("/css/sample.js")}
B. Any location B. Any location
${scripts("/edit/forms/js/sample.js)"} ${scripts("/edit/forms/js/sample.js)"}