-<html>
-<head>
- <title> Memories - Photo Sharing </title>
- <link title="Maypole" href="[%base%]/static/memories.css" type="text/css" rel="stylesheet"/>
- <script type="text/javascript" src="[%base%]/tag/list_js"></script>
- <script type="text/javascript" src="[%base%]/static/upload.js"></script>
-</head>
-<body onload="init()">
-[% INCLUDE nav %]
-<table width="100%">
- <tr>
- <td valign="top">
- [% IF messages %]
- <div class="messages">
- <ul> [% FOR m = messages %] <li> [%m%] </li> [% END %]
- </ul></div>
- [% END %]
- <div id="main">
+[% INCLUDE header %]
<h1> Upload a photo </h1>
<p>
This is where you can upload your photographs. At the moment, you must
<td><input name="tags" id="tags"></td>
<tr><td> </td> <td>
<div class="messages"><small>
+<script type="text/javascript"> addHandler($("tags")) </script>
<b>Tagging advice</b>: Tags should be words, (<i>portrait</i>, <i>henry</i>) or
phrases surrounded by double quotes. (<i>"tall buildings"</i>) You can
put any number of tags in the "add tags" box, like this:
String.prototype.trim = function(){ return this.replace(/^\s+|\s+$/g,'') }
String.prototype.escRegExp = function(){ return this.replace(/[\\$*+?()=!|,{}\[\]\.^]/g,'\\$&') }
String.prototype.unescHtml = function(){ var i,t=this; for(i in e) t=t.replace(new RegExp(i,'g'),e[i]); return t }
-function Suggestions() { this.length=0; this.picked=0 }
-var suggestions = new Suggestions();
-var tagSearch='', lastEdit='';
-var h={}, sections=[{},{},{},{},{},{}], selected={}, currentTag={},
-e={'<':'<','>':'>','&':'&','"':'"'};
-
-function init () {
- document.onkeydown = document.onkeypress = document.onkeyup = handler
- h.suggest = document.getElementById("suggestionlist");
- h.tags = document.getElementById("tags");
-}
-
-function handler(event) { var e=(event||window.event) //w3||ie
- if (e.type == 'keyup') {
+var availhash = {};
+var tags = tagList.split(/\s+/);
+for (t in tags) { availhash[tags[t]] = 1 }
+
+function addHandler( elt ) {
+ var params = {
+ elt: elt,
+ oldvalue: elt.value
+ };
+ document.onkeyup = function (event) {
+ var e=(event||window.event) //w3||ie
switch(e.keyCode) {
- //case 8: //backspace
- //case 46: //delete
case 35: //end
case 36: //home
case 39: // right
case 37: // left
case 32: // space
- hideSuggestions(); break
- case 38: case 40: break;
- case 9: break;
- case 13: break;
+ params.elt.style.background = "#fff";
+ $("suggestionlist").style.visibility='hidden';
+ break
+ case 38: case 40: case 9: case 13: break;
default:
- updateSuggestions()
-}}
- else if (e.type == "keypress") { lastEdit = h.tags.value }
-}
-
-function makeTag(parent, tag, js) {
- parent.appendChild(document.createTextNode(" "+ tag))
-}
-
-function updateSuggestions() {
- while (h.suggest.hasChildNodes()) h.suggest.removeChild(h.suggest.firstChild)
- if(!getCurrentTag() || !currentTag.text) {
- hideSuggestions(); return false
- }
- var tagArray = h.tags.value.toLowerCase().split(' '),
- txt=currentTag.text.trim().escRegExp(), tagHash={}, t
- for(t in tagArray) tagHash[tagArray[t]] = true;
-
- var search = tagList.match(new RegExp(("(?:^| )("+txt+"[^ ]+)"), "gi"))
- if(search){
- var i;
- for (i=0; i<search.length; i++) {
- var tl = search[i].trim()
- if(tagHash[tl]) continue // do not suggest already typed tag
- suggestions[suggestions.length] = makeTag(h.suggest, tl, 'complete')
- suggestions.length++
- }}
- if (suggestions.length > 0) { showSuggestions() }
- else { hideSuggestions(); }
-}
-
-function getCurrentTag() {
- if(h.tags.value == lastEdit) return true // no edit
- if(h.tags == '') return false
- currentTag = {}
- var tagArray=h.tags.value.toLowerCase().split(' '), oldArray=lastEdit.toLowerCase().split(' '), currentTags = [], matched=false, t,o
- for (t in tagArray) {
- for (o in oldArray) {
- if(typeof oldArray[o] == 'undefined') { oldArray.splice(o,1); break }
- if(tagArray[t] == oldArray[o]) { matched = true; oldArray.splice(o,1); break; }
+ var tagArray = params.elt.value.toLowerCase().split(' '),
+ txt=tagArray[tagArray.length-1].trim().escRegExp(), tagHash={}, t
+ for(t in tagArray) tagHash[tagArray[t]] = true;
+ var sl = $("suggestionlist");
+ if (!txt) { sl.style.visibility = 'hidden'; return; }
+
+ var search = tagList.match(new RegExp(("(?:^| )("+txt+"[^ ]+)"), "gi"))
+ if(search){
+ params.elt.style.background = availhash[txt] ? "#dfd" : "#fff";
+ while(sl.childNodes.length > 0) { sl.removeChild(sl.firstChild) }
+ sl.style.visibility='visible';
+ var i;
+ for (i in search) {
+ if (!tagHash[search[i]]) {
+ var tn = document.createTextNode(search[i]);
+ var a = document.createElement("a");
+ var elt = params.elt;
+ var closureTxt = txt;
+ a.onclick = function () {
+ elt.value = elt.value.replace(new RegExp(closureTxt+"$"),this.firstChild.nodeValue+" ");
+ elt.focus();
+ sl.style.visibility='hidden';
+ };
+ a.appendChild(tn);
+ sl.appendChild(a);
+ }
+ }
+ } else {
+ params.elt.style.background = availhash[txt] ? "#dfd" : "#fdd";
+ sl.style.visibility='hidden';
+ }
}
- if(!matched) currentTags[currentTags.length] = t
- matched=false
}
- // more than one word changed... abort
- currentTag = { text:tagArray[currentTags[0]], index:currentTags[0] }
- return true
}
-
-
-function hideSuggestions() { h.suggest.style.visibility='hidden' }
-function showSuggestions() { h.suggest.style.visibility='visible' }