Add all static website files.

This commit is contained in:
2020-12-14 20:07:31 +09:00
parent 96d04f0f3f
commit 422ee2fd23
136 changed files with 23212 additions and 0 deletions

View File

@@ -0,0 +1,183 @@
/*
BoxController
Note: Requires boxSettings.js also be included
Revisions
2003-09-13: Jeff edited. Added expand all of type.
2003-09-15: Jeff added cookie code.
Boxes are the bordered divs with a header and body, and a expand/collapse button.
Box types:
partialMap, subTopic, callouts, comments, taskInformation, legend.
If you collapse a subTopic box on one page, you collapse all subTopic boxes that and other pages. Same with expanding.
Note: There can be more than one box of each type on the page.
In HTML, the structure expected is:
div.{boxType}Area (useful for CSS selector of different types of boxes, e.g. div.{boxType}Area div.box)
div class="collapsiblebox" id="{boxType}{index}" (1+)
div.header onclick = "boxController.expandOrCollapse(this,'{boxType}')" (0-1)
span.title
span.commands ? (mike)
span.command ? (mike)
img.expandOrCollapseButton src="{buttonsPath}{collapseButtonUrl} or {expandButtonUrl}"
div.body
(varies)
Note: Visibility of div.body (i.e. style="display:block" or style="display:none") is overwritten by code.
Note: Button graphics as well.
*/
function init() {
boxController = new BoxController("Res/images/", "box_collapse_button.gif","box_expand_button.gif", true);
boxController.init();
}
// BoxController class
function BoxController (buttonsPath, collapseButtonFilename,expandButtonFilename, changeAllOfType) {
this.objectClass = "BoxController";
this.buttonsPath = buttonsPath;
this.collapseButtonUrl = buttonsPath + collapseButtonFilename;
this.expandButtonUrl = buttonsPath + expandButtonFilename;
this.changeAllOfType = changeAllOfType; // if true, all boxes of a type are expanded or collapsed together, not just clicked one
this.boxTypes = null;
}
BoxController.prototype.init = function() {
// initialize boxTypes
this.boxTypes = INITIAL_BOX_SETTINGS; // defaults loaded from boxSettings.js
// check if cookie has stored states
var cookieString = this.getCookieString();
if (cookieString!=null) {
// for each boxType, get stored value from cookie
for (var i=0; i < this.boxTypes.length; i++) {
var boxType = this.boxTypes[i];
var value = getValueFromCookieString ( cookieString, boxType.name );
if (value!=null) {
boxType.state = value=="true" ? true : false;
}
}
}
// for each boxType, change state of all boxes of that type
for (var i=0; i < this.boxTypes.length; i++) {
this.changeStateOfAllBoxesOfType( this.boxTypes[i].name, this.boxTypes[i].state );
}
}
BoxController.prototype.dumpBoxTypes = function() {
var s = "BoxTypes\n";
for (var i=0; i < this.boxTypes.length; i++) {
s += this.boxTypes[i].name + "," + this.boxTypes[i].state+ "\n";
}
return s;
}
BoxController.prototype.saveStateToCookie = function() {
// stores state of controller in cookie
var cookieString = "";
// for each box type...
for (var i=0; i < this.boxTypes.length; i++ ) {
var boxType = this.boxTypes[i];
if (cookieString!="") cookieString += "&";
cookieString += boxType.name + ":" + escape(boxType.state);
}
// Cookie properties (if needed)
// Currently assumes that all html pages are in the same directory together, otherwise cookie's path property would need to be set
// Currently that cookie should expire when user closes the browser (expires property)
// save cookie; will be only accessible to this html page
var cookieName = this.objectClass;
document.cookie = cookieName + "=" + cookieString;
}
BoxController.prototype.getCookieString = function() {
// checks saved state of controller from cookie; returns string of values or null if desired cookie does not exist
var cookieName = this.objectClass;
var allCookies = document.cookie;
if (allCookies=="") return null;
// extract the named cookie we want
var start = allCookies.indexOf(cookieName + "=");
if (start == -1) return null;
start += cookieName.length + 1; // skip over name and = sign
var end = allCookies.indexOf(";", start);
if (end==-1) end = allCookies.length;
var cookieString = allCookies.substring(start,end);
return cookieString;
}
BoxController.prototype.changeStateOfAllBoxesOfType = function( boxType, newState ) {
// changes all boxes on the page of boxType to newState ("expand" or "collapse")
// loop through all boxes of boxType
var boxIndex = 0;
while (document.getElementById (boxType + boxIndex) ) {
// change state
this.changeStateOfBoxOnPage ( document.getElementById (boxType + boxIndex), newState );
boxIndex++;
}
// store new state in array
for (var i=0; i < this.boxTypes.length; i++ ) {
var boxTypeItem = this.boxTypes[i];
if (boxTypeItem.name == boxType) {
boxTypeItem.state = newState;
break;
}
}
}
BoxController.prototype.expandOrCollapse = function( headerElement, boxType ) {
// Note: Having one routine for both expand and collapse let's the function that html calls be the same
// Uses img's src attribute to determine which command is being called
// First get the button element; may be the elementActivated or within the elementActivated (like an anchor element)
var buttonElement = getFirstDescendentOrSelfOfClass ( headerElement, "expandOrCollapseButton");
if (!buttonElement) return;
var currentImageUrl = buttonElement.src;
if (!currentImageUrl) return;
// if src value contains url of collapse button, this is, presumably a collapse command
var newState = false;
if (currentImageUrl.lastIndexOf(this.collapseButtonUrl)==-1) newState = true;
// change state of all boxes of this type ...
if (this.changeAllOfType) {
this.changeStateOfAllBoxesOfType (boxType,newState);
this.saveStateToCookie();
}
// or just this one box
else {
var boxElement = headerElement.parentNode;
if (boxElement) this.changeStateOfBoxOnPage(boxElement,newState);
}
}
BoxController.prototype.changeStateOfBoxOnPage = function( boxElement, makeOpen) {
// change UI of box on the html page
// get button element
var buttonElement = getFirstDescendentOrSelfOfClass( boxElement, "expandOrCollapseButton");
if (!buttonElement) return false; // if not found, give up
// get body element
var bodyElement = getFirstDescendentOrSelfOfClass( boxElement, "body");
if (!bodyElement) return false; // if not found, give up
// expand or collapse body element
showOrHideElement(bodyElement,makeOpen);
// update img to be an appropriate button
if (buttonElement.src) {
// if opening, make it the collapse button; if not opening, make it the expand button
buttonElement.src = makeOpen ? this.collapseButtonUrl : this.expandButtonUrl;
}
}

View File

@@ -0,0 +1,11 @@
// exported by program to supply initial settings for boxes
var INITIAL_BOX_SETTINGS = [
{name:"partialMap", state:true},
{name:"subTopics", state:true},
{name:"callouts", state:true},
{name:"comments", state:false},
{name:"relationships", state:true},
{name:"taskInformation", state:true},
{name:"legend", state:true}
];

View File

@@ -0,0 +1,232 @@
// MapController class
// Scrollable, switchable (in amount of detail) map
// Uses functions from shared.js
// Requires html page with two imgs for each level of detail; one of which is style="display:none" at start
// Requires mainFrame is scrollable (for Netscape/Mozilla to work
// MapController class
function MapController (frameObject, dragMultiplier) {
this.objectClass = "MapController"; // used as name for cookie
this.DRAG_THRESHOLD = 4; // minimum distance before a drag can not be treated as a click; in pixels
this.DRAG_MAX_FIRST_STEP = 10; // largest distance permitted within single mousemove; used to detect invalid drag on IE
this.frameObject = frameObject; // scrollable frame containing mapImages
this.mapImages = []; // array storing each mapImage (2 images)
this.activeMapImage = 1; // index of active/visible image; default to first map image
this.dragMultiplier = dragMultiplier ? dragMultiplier : 1; // 1 = default; 2 = 2x speed dragging; can be any number
//this.temp = 0;
//this.systemInfo = new SystemInfo();
}
MapController.prototype.init = function(initialMap) {
// setup dragScrolling
this.dragScrolling = false; // indicates that user is dragging image around
this.wasDraggedEnoughToNotBeAClick = false;
this.mouseJustPressed = false;
this.mouseDownX, this.mouseDownY = null;
this.oldScrollX, this.oldScrollY = null;
// Note: Changed following from document.onmousedown; fixes dragging on scroll bar triggering onmousedown in Mozilla/NS
var mapContentElement = this.frameObject.document.getElementById("mapContent");
if (!mapContentElement) mapContentElement = this.frameObject.document;
mapContentElement.onmousedown = this.onMouseDown;
//this.frameObject.document.onmousedown = this.onMouseDown;
this.frameObject.document.onmousemove = this.onMouseMove;
this.frameObject.document.onmouseup = this.onMouseUp;
this.frameObject.document.onclick = this.onClick;
this.frameObject.document.onscroll = this.onScroll;
//
var cookieValue = this.getCookieValue();
//window.status = cookieValue;
if (cookieValue==false) {
// there was no saved state, so the map is presumably loading for the first time
this.selectMapImage(initialMap); // select active map
}
else {
// the state is saved; use the cookieValue to figure out the state
this.initFromCookieValue(cookieValue);
}
//trace(this.systemInfo);
}
// Note: In following, e = event object passed in automatically
MapController.prototype.onMouseDown = function(e) {
// Note: Ends up running in context of the frame, so this = frameObject, not mapController
// Get a reference mapController object to be able to use it here.
var mc = parent.topFrame.mapController; // HACK: Must be more elegant way to get reference.
if (!e) var e = mc.frameObject.event;
if (wasLeftButton(e)) { // TODO: Double-check wasLeftButton code; now only works for IE?
mc.mouseDownX = /* e.x ? e.x : */ e.screenX;
mc.mouseDownY = /* e.y ? e.y : */ e.screenY;
// Note: In Mozilla/NS, the mainFrame must be scrollable for the .scrollLeft and .scrollTop properties to be accessible
mc.oldScrollX = mc.frameObject.document.body.scrollLeft;
mc.oldScrollY = mc.frameObject.document.body.scrollTop;
//window.status = "mc.frameObject.document.body.scrollTop:"+mc.frameObject.document.body.scrollLeft;
mc.dragScrolling = true;
mc.mouseJustPressed = true;
mc.wasDraggedEnoughToNotBeAClick = false;
//window.status = "mouseDown: " + " | " + mc.mouseDownX + "," + mc.mouseDownY+ " | " + mc.oldScrollX + "," + mc.oldScrollY;
}
return false; // stops browser behavior of dragging image to copy it to the desktop (at least on Mac Safari)
}
MapController.prototype.onMouseMove = function(e) {
var mc = parent.topFrame.mapController; // HACK: Must be more elegant way to get reference.
if (!e) var e = mc.frameObject.event;
//window.status = "MouseMove:" + mapController.temp++;
if (mc.dragScrolling) {
if (!e) var e = mc.frameObject.event;
var newMouseX = /* e.x ? e.x :*/ e.screenX;
var newMouseY = /* e.y ? e.y : */ e.screenY;
var newOffsetX = newMouseX - mc.mouseDownX;
var newOffsetY = newMouseY - mc.mouseDownY;
// Test if move from old to new position is unreasonably large, as in the case when
// user drags scroll bar in IE -- then dragScrolling is true, but mouseUp is lost.
// So, this code stops dragScrolling in that case.
if (mc.mouseJustPressed) {
if (Math.abs(newOffsetX) > mc.DRAG_MAX_FIRST_STEP | Math.abs(newOffsetY) > mc.DRAG_MAX_FIRST_STEP) {
mc.dragScrolling = false;
return false;
}
mc.mouseJustPressed = false;
}
//window.status = '(' + newOffsetX +',' + newOffsetY+')'
if (Math.abs(newOffsetX) > mc.DRAG_THRESHOLD | Math.abs(newOffsetY) > mc.DRAG_THRESHOLD) mc.wasDraggedEnoughToNotBeAClick = true;
var newScrollX = mc.oldScrollX - mc.dragMultiplier * newOffsetX;
var newScrollY = mc.oldScrollY - mc.dragMultiplier * newOffsetY;
mc.frameObject.scrollTo(newScrollX,newScrollY);
//window.status = "dragging: " + " | " + newMouseX + "," + newMouseY+ " | " + newScrollX + "," + newScrollY;
return false;
}
else {
//window.status = "not dragging "+ mapController.temp++;
}
}
MapController.prototype.onMouseUp = function(e) {
//window.status = "up";
var mc = parent.topFrame.mapController; // HACK: Must be more elegant way to get reference.
mc.dragScrolling = false;
return false; // Doesn't seem to have any useful affect
}
MapController.prototype.onClick = function(e) {
var mc = parent.topFrame.mapController; // HACK: Must be more elegant way to get reference.
//window.status = "onclick";
if (mc.wasDraggedEnoughToNotBeAClick) {
//window.status = "onclick return false";
return false; // cancels onClick event; if mouseUp was on hotshop, navigation can not happen
}
return true;
}
MapController.prototype.onScroll = function(e) {
//window.status = "scroll";
// Opera: Triggered when mapContent dragged
// Mozilla/NS: Triggered when scroll bar dragged (but not mapContent dragged)
// IE: Never triggered
//var mc = parent.topFrame.mapController; // HACK: Must be more elegant way to get reference.
//mc.dragScrolling = false;
//return false; // Doesn't seem to have any useful affect
}
MapController.prototype.addMapImage = function(imgId, centerX, centerY) {
this.mapImages.push( new MapImage ( this.frameObject, imgId, centerX, centerY) );
}
MapController.prototype.selectMapImage = function(newActiveMapImage) {
// make mapImageToSelect active and make others inactive
var lastImage = this.mapImages.length - 1;
for (var i=0; i <= lastImage; i++ ) {
this.mapImages[i].makeActive( i==newActiveMapImage );
}
this.activeMapImage = newActiveMapImage;
this.saveStateToCookie();
this.scrollToCenter();
}
MapController.prototype.scrollToCenter = function() {
// scrolls to the center of active map image
var activeMapImage = this.mapImages[this.activeMapImage];
var frameObject = this.frameObject;
//trace(activeMapImage);
this.frameObject.scrollTo( activeMapImage.centerX - (getWindowWidth(frameObject)/2), activeMapImage.centerY - (getWindowHeight(frameObject)/2));
}
MapController.prototype.saveStateToCookie = function() {
// stores state of controller in cookie
var cookieName = this.objectClass;
var cookieValue = "";
// save which map is selected/active
cookieValue += "active:" + this.activeMapImage;
// TODO: save scroll position
// save cookie; will be only accessible to this html page
document.cookie = cookieName + "=" + cookieValue;
}
/*
MapController.prototype.savedStateExists = function() {
// returns true is saved state (cookie) exists
}
*/
MapController.prototype.getCookieValue = function() {
// checks saved state of controller from cookie; returns string of values or false if desired cookie does not exist
var cookieName = this.objectClass;
var allCookies = document.cookie;
if (allCookies=="") return false;
// extract the named cookie we want
var start = allCookies.indexOf(cookieName + "=");
if (start == -1) return false;
start += cookieName.length + 1; // skip over name and = sign
var end = allCookies.indexOf(";", start);
if (end==-1) end = allCookies.length;
var cookieValue = allCookies.substring(start,end);
return cookieValue;
}
MapController.prototype.initFromCookieValue = function(cookieValue) {
// parses cookieValue; initializes object accorded to saved values
/*
var a = cookieValue.split("&"); // create array from name/value pairs delimited by ampersand
for (var i=0; i < a.length; i++) { // then break each pair into an array
a[i] = a[i].split(":");
}
*/
// TODO: Rewrite. Currently a hack.
if (cookieValue=="active:1") this.selectMapImage(1);
else this.selectMapImage(0);
// this.selectMapImage(initialMap);
}
/*
MapController.prototype.moveTo = function(x,y) {
// move image (i.e. scroll window)
window.scrollTo(x,y);
}
*/
// MapImage class - one for each img/view of the map
function MapImage ( frameObject, imgId, centerX, centerY ) {
this.objectClass = "MapImage";
this.centerX = centerX;
this.centerY = centerY;
// get image reference
this.imgElement = getElement(frameObject,imgId);
this.imgStyle = getElementsStyleObject(frameObject,imgId);
}
MapImage.prototype.makeActive = function (newIsActiveState) {
//this.trace();
var newDisplayStyle = newIsActiveState ? "block" : "none";
this.imgStyle.display = newDisplayStyle;
}

169
static/Res/code/shared.js Normal file
View File

@@ -0,0 +1,169 @@
// Shared routines
function openPopup(url,windowName,features) {
window.open(url,windowName,features);
}
function preloadImage(Url) {
var i = new Image();
i.src = Url;
}
function showOrHideElement(element,show) {
element.style.display = show ? "block" : "none";
}
/* unused
function getFirstAncestorOfClass (sourceElement, className) {
// recursively search for ancestor of sourceElement that matches className
var elementBeingTested = sourceElement.parentNode;
if (elementBeingTested.className == className) return elementBeingTested;
if (!elementBeingTested.className) return null; // if run out of elements (like at document) stop
return getFirstAncestorOfClass(elementBeingTested, className);
}
*/
function getFirstDescendentOrSelfOfClass (sourceElement, className) {
// recursively search for descendent of sourceElement that matches className
// test self
if (sourceElement.className == className) return sourceElement;
// test children
var child = sourceElement.firstChild;
if (child) {
while (child) {
var elementBeingTested = getFirstDescendentOrSelfOfClass (child, className);
if (elementBeingTested) return elementBeingTested;
child = child.nextSibling;
}
}
return null;
}
function getElement(frameObject,elementId) {
if (document.getElementById) return frameObject.document.getElementById(elementId);
if (document.all) return frameObject.document.all[elementId];
if (document.layers) return frameObject.document.layers[elementId];
return null;
}
function getElementsStyleObject(frameObject,elementId) {
if (document.getElementById) return frameObject.document.getElementById(elementId).style;
if (document.all) return frameObject.document.all[elementId].style;
if (document.layers) return frameObject.document.layers[elementId];
return null;
}
function getWindowHeight(frameObject) {
if (document.all) return frameObject.document.body.clientHeight; // IE on Mac and Windows
if (document.layers) return frameObject.document.clientHeight;
}
function getWindowWidth(frameObject) {
if (document.all) return frameObject.document.body.clientWidth; // IE on Mac and Windows
if (document.layers) return frameObject.document.clientWidth;
}
function trace (anObject) {
alert(listObject(anObject));
}
function listObject(theObject) {
var m = '';
for (prop in theObject) {
m+= prop + ":" + theObject[prop] + "\n";
//* if theObject[prop] ==
}
return(m);
}
function wasLeftButton(e) {
// takes event object (e) and decides if left button was pressed (as opposed to middle wheel button)
var buttonPressed = /* (navigator.appName=="Netscape") ? e.which : */ e.button;
if (buttonPressed == 1 | buttonPressed == 0 ) return true;
return false;
}
function appendToCookieString ( cookieString, property, value ) {
if (cookieString!="") cookieString += "&";
cookieString += property + ":" + escape(value);
}
function getValueFromCookieString ( cookieString, property) {
// extract value of given property from encoding like this: "property1:value1&property2:value2"
var pos = cookieString.indexOf(property); // at start of property label
if (pos==-1) return null;
pos += property.length + 1; // at start of value
var start = pos;
pos = cookieString.indexOf("&",pos+1);
// if "&" not found, must be last property:value pair -- end of value is end of cookieString
// else end of value is just before "&"
var end = (pos==-1) ? cookieString.length : pos;
var value = cookieString.substring(start,end);
return unescape(value);
}
// SystemInfo Class
// class to handle system check (browser, etc.)
// Thanks to http://www.xs4all.nl/~ppk/js/detect.html for this code
// TODO: Rewrite?
/*
function SystemInfo() {
this.detect = navigator.userAgent.toLowerCase();
this.OS = null;
this.browser = null;
this.version = null;
//this.subVersion = null;
this.total = null;
this.thestring = null;
this.place = null;
if (this.checkIt('konqueror')) {
this.browser = "Konqueror";
this.OS = "Linux";
}
else if (this.checkIt('safari')) {
this.browser = "Safari"
//this.subVersion = this.detect.substring(8,12);
}
else if (this.checkIt('omniweb')) this.browser = "OmniWeb"
else if (this.checkIt('opera')) this.browser = "Opera"
else if (this.checkIt('webtv')) this.browser = "WebTV";
else if (this.checkIt('icab')) this.browser = "iCab"
else if (this.checkIt('msie')) this.browser = "Internet Explorer"
else if (!this.checkIt('compatible')) {
this.browser = "Netscape Navigator"
this.version = this.detect.charAt(8);
}
else this.browser = "An unknown browser";
if (!this.version) this.version = this.detect.charAt(this.place + this.thestring.length);
if (!this.OS) {
if (this.checkIt('linux')) this.OS = "Linux";
else if (this.checkIt('x11')) this.OS = "Unix";
else if (this.checkIt('mac')) this.OS = "Mac"
else if (this.checkIt('win')) this.OS = "Windows"
else this.OS = "an unknown operating system";
}
}
SystemInfo.prototype.checkIt = function(string) {
this.place = this.detect.indexOf(string) + 1;
this.thestring = string;
return this.place; // HACK: Weird
}
*/
// Saving state using cookies
/*
expires
domain
document.cookie = "version=" + escape(document.lastModified) + "; expires=" +
// cookie values may not include semicolons, commas, or whitespace
*/