final update for the night

tfleish · Apr 10, 2011 · 26a0cc5 · 26a0cc5
1 parent 850b17a
commit 26a0cc5
Show file tree

Hide file tree

Showing 6 changed files with 254 additions and 20 deletions.
diff --git a/.tmp_newIndex.html.62350~ b/.tmp_newIndex.html.62350~
@@ -0,0 +1,107 @@
+<!DOCTYPE>
+<html>
+	<head>
+		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
+		<title>BucketList</title>
+
+		<link rel="stylesheet" href="css/newbucketList.css" type="text/css">
+
+		<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
+    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
+		<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
+
+		<script src="3rdparty/jquery_1.4.2/jquery_libraries/ui/jquery.ui.core.js"></script>
+ 		<script src="3rdparty/jquery_1.4.2/jquery_libraries/ui/jquery.ui.widget.js"></script>
+ 		<script src="3rdparty/jquery_1.4.2/jquery_libraries/ui/jquery.ui.mouse.js"></script>
+		<script src="3rdparty/jquery_1.4.2/jquery_libraries/ui/jquery.ui.draggable.js"></script>
+
+		<script type="text/javascript" src="js/newbucketList.js"></script>
+		<script type="text/javascript" src="js/Bucket.js"></script>
+		<script type="text/javascript" src="js/Task.js"></script>
+		<script type="text/javascript" src="js/Note.js"></script>
+
+		<script type="text/javascript" language="JavaScript">
+			var nBuckets = 1;
+			var firstBucket = new Bucket("My First Bucket", 0);
+			var organizer=[firstBucket];
+			var currentView=null;
+		</script>
+	</head>
+
+
+  <body>
+    <div id="container">
+    	<div id="dropDownBar">
+
+				<div id="nameDropDown">
+    		  <input type="button" id="nameButton" value = "Alice Packer" class="menu_class" style="background-color:#bbfb66">
+							<ul name = "nameMenu" class="the_menu menu1">
+								<li>My Account</li>
+								<li>Settings</li>
+							</ul>
+					</input>
+    	  </div>
+				<div id="rightSideDropDowns">
+					<div id="alertDropDown">
+					  <input type="button" id="alertButton" value = "My Alerts" class="menu_class" style="background-color: #e83b94">
+							<ul name = "alertMenu" class="the_menu menu2">
+								<li>My First Alert</li>
+								<li>My Second Alert</li>
+							</ul>
+						</input>
+				  </div>
+
+					 <div id="myTasksDropDown">
+	    	   	<input type="button" id="tasksButton" value = "My Tasks" class="menu_class" style="background-color: #fcf589">
+							<ul id = "tasksMenu" class="the_menu menu3">
+								<li><textarea id="bucketInput" class='new bucket' onfocus='bucketFocus(nBuckets)' onblur="bucketBlur(nBuckets)" onkeypress="ifEnter('#bucketInput', event)">New Bucket</textarea></li>
+								<li onclick="addBucketToPaper('0','My First Bucket')">My First Bucket</li>
+							</ul>
+						</input>
+	      	</div>
+				</div>
+			</div>
+
+		<div id="welcomeHolder" class="draggable" style="top: 150px; left: 150px;">
+			<img src="img/nobucketLogo.gif" style="width: 100%; padding-top: 5%;"></img>
+			<div style="text-align: center; padding: 15px; font-size: 10pt;"> To get started, click in "My Tasks" to create a new Bucket!</div>
+		</div>
+
+		<div id="paperHolder" class="hidden draggable">	
+			<div id="textHolder" class="hidden">
+				<div id="leftBox" style="width: 65%; float: left;">
+					<div id="topLeftBox" style="height: 9%; border-bottom: 1px solid black;">
+						<div width=20 style="float: left;">
+							 <img id="bucketIcon" class='hidden icon'></img>
+						</div>
+						<div>
+							<h5 id="paperTitle" style="position: relative;"></h5>
+						</div>
+					</div>
+					<div id="bottomLeftBox" style="height: 70%; border-right: 1px solid black;">
+					</div>
+				</div>
+				<div id="rightBox" style="width: 35%; float: right;">
+					<div id="topRightBox" style="height: 9%; border-bottom: 1px solid black;">
+						<div>
+					 		<h5 id="collabsTitle" style="float: left;"><b>Collaborators</b></h5>
+						</div>
+						<div>
+					 		<input type="button" class="menu_class" id="addCollabButton" value="+" style="width: 20%; float: right; padding-top: 0px; padding-bottom: 0px;">
+								<ul id = "collabsMenu" class="the_menu menu4" style="float: left;">
+									<li><textarea id="collabInput" class='new collab' onfocus='collabFocus()' onblur="collabBlur()" onkeypress="ifEnter('#collabInput', event)">Enter name</textarea></li>
+								</ul>
+							</input>
+						</div>
+					</div>
+					<div id="bottomRightBox" style="height: 70%">
+					</div>
+				</div>
+			</div>
+		</div>
+   </div>
+  </div> <!-- END container -->
+  </body>
+
+
+</html>
diff --git a/.tmp_newIndex.html.95287~ b/.tmp_newIndex.html.95287~
@@ -0,0 +1,107 @@
+<!DOCTYPE>
+<html>
+	<head>
+		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
+		<title>BucketList</title>
+
+		<link rel="stylesheet" href="css/newbucketList.css" type="text/css">
+
+		<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
+    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
+		<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
+
+		<script src="3rdparty/jquery_1.4.2/jquery_libraries/ui/jquery.ui.core.js"></script>
+ 		<script src="3rdparty/jquery_1.4.2/jquery_libraries/ui/jquery.ui.widget.js"></script>
+ 		<script src="3rdparty/jquery_1.4.2/jquery_libraries/ui/jquery.ui.mouse.js"></script>
+		<script src="3rdparty/jquery_1.4.2/jquery_libraries/ui/jquery.ui.draggable.js"></script>
+
+		<script type="text/javascript" src="js/newbucketList.js"></script>
+		<script type="text/javascript" src="js/Bucket.js"></script>
+		<script type="text/javascript" src="js/Task.js"></script>
+		<script type="text/javascript" src="js/Note.js"></script>
+
+		<script type="text/javascript" language="JavaScript">
+			var nBuckets = 1;
+			var firstBucket = new Bucket("My First Bucket", 0);
+			var organizer=[firstBucket];
+			var currentView=null;
+		</script>
+	</head>
+
+
+  <body>
+    <div id="container">
+    	<div id="dropDownBar">
+
+				<div id="nameDropDown">
+    		  <input type="button" id="nameButton" value = "Alice Packer" class="menu_class" style="background-color:#bbfb66">
+							<ul name = "nameMenu" class="the_menu menu1">
+								<li>My Account</li>
+								<li>Settings</li>
+							</ul>
+					</input>
+    	  </div>
+				<div id="rightSideDropDowns">
+					<div id="alertDropDown">
+					  <input type="button" id="alertButton" value = "My Alerts" class="menu_class" style="background-color: #e83b94">
+							<ul name = "alertMenu" class="the_menu menu2">
+								<li>My First Alert</li>
+								<li>My Second Alert</li>
+							</ul>
+						</input>
+				  </div>
+
+					 <div id="myTasksDropDown">
+	    	   	<input type="button" id="tasksButton" value = "My Tasks" class="menu_class" style="background-color: #fcf589">
+							<ul id = "tasksMenu" class="the_menu menu3">
+								<li><textarea id="bucketInput" class='new bucket' onfocus='bucketFocus(nBuckets)' onblur="bucketBlur(nBuckets)" onkeypress="ifEnter('#bucketInput', event)">New Bucket</textarea></li>
+								<li onclick="addBucketToPaper('0','My First Bucket')">My First Bucket</li>
+							</ul>
+						</input>
+	      	</div>
+				</div>
+			</div>
+
+		<div id="welcomeHolder" class="draggable" style="top: 150px; left: 150px;">
+			<img src="img/nobucketLogo.gif" style="width: 100%; padding-top: 5%;"></img>
+			<div style="text-align: center; padding: 15px; font-size: 10pt;"> To get started, click in "My Tasks" to create a new Bucket!</div>
+		</div>
+
+		<div id="paperHolder" class="hidden draggable">	
+			<div id="textHolder" class="hidden">
+				<div id="leftBox" style="width: 65%; float: left;">
+					<div id="topLeftBox" style="height: 9%; border-bottom: 1px solid black;">
+						<div width=20 style="float: left;">
+							 <img id="bucketIcon" class='hidden icon'></img>
+						</div>
+						<div>
+							<h5 id="paperTitle" style="position: relative;"></h5>
+						</div>
+					</div>
+					<div id="bottomLeftBox" style="height: 70%; border-right: 1px solid black;">
+					</div>
+				</div>
+				<div id="rightBox" style="width: 35%; float: right;">
+					<div id="topRightBox" style="height: 9%; border-bottom: 1px solid black;">
+						<div>
+					 		<h5 id="collabsTitle" style="float: left;"><b>Collaborators</b></h5>
+						</div>
+						<div>
+					 		<input type="button" class="menu_class" id="addCollabButton" value="+" style="width: 20%; float: right; padding-top: 0px; padding-bottom: 0px;">
+								<ul id = "collabsMenu" class="the_menu menu4" style="float: left;">
+									<li><textarea id="collabInput" class='new collab' onfocus='collabFocus()' onblur="collabBlur()" onkeypress="ifEnter('#collabInput', event)">Enter name</textarea></li>
+								</ul>
+							</input>
+						</div>
+					</div>
+					<div id="bottomRightBox" style="height: 70%">
+					</div>
+				</div>
+			</div>
+		</div>
+   </div>
+  </div> <!-- END container -->
+  </body>
+
+
+</html>
diff --git a/css/newbucketList.css b/css/newbucketList.css
@@ -1,5 +1,5 @@
 #container {
-	font-family: Helvetica;
+	font-family: "Handwriting - Dakota";
   background-image: url('../img/bulletin.jpg');
   border: 1px solid gray;
   -moz-border-radius: 15px;
@@ -28,11 +28,15 @@
 	float: right;
 }
 
+#addCollabButton {
+	display: inline-block;
+}
+
 #paperHolder {
 	height: 247px;
 	width: 380px;
 	float: left;
-	backgroud-size: 100%;
+	background-size: 100%;
 	background-repeat: no-repeat;
 	background-image: url('../img/paper2.png');
 }
@@ -51,12 +55,25 @@
 	height: 247px;
 	width: 380px;
 	float: left;
-	backgroud-size: 100%;
+	background-size: 100%;
 	background-repeat: no-repeat;
 	background-image: url('../img/paper2.png');
 	font-size: 11pt;
 }
 
+.collabsBox {
+	border: 1px inset #ececec;
+	height: 94%;
+	padding: 3%;
+}
+
+.noteBox {
+	height: 94%;
+	padding: 3%;
+	border-right: 1px outset #ececec;
+	border-top: 1px inset #ececec;
+}
+
 h5 {
 	font-size: small;
 	margin-top:0px; 
@@ -68,6 +85,10 @@ h5 {
 	width: 15px;
 }
 
+.persona {
+	cursor: pointer;
+}
+
 ul, li {
 	margin:0; 
 	padding:1px; 
@@ -85,7 +106,6 @@ ul, li {
 	display:none;
 	width: auto;
 	border: 1px solid #1c1c1c;
-
 }
 
 .the_menu li {
@@ -99,7 +119,6 @@ ul, li {
 
 .the_menu li:hover {
 	font-weight:bold;
-	color: #F00880;
 }
 
 .sticky {
@@ -130,7 +149,10 @@ ul, li {
 
 
 .stickyButton{
+	width: 15px;
+	height: 15px;
 	cursor: pointer;
+	float: left;
 }
 
 textarea {

diff --git a/img/personIcon.png b/img/personIcon.png
diff --git a/js/newbucketList.js b/js/newbucketList.js
@@ -34,8 +34,6 @@ function addBucketToPaper(bucket) {
 	$("#paperTitle").text(name); // Set the title of the paper
 	$('#welcomeHolder').addClass('hidden');
 	$('#paperHolder').removeClass('hidden');
-//	$('#paperHolder').attr('top','150px');
-//	$('#paperHolder').attr('left', '150px');
 	$('#textHolder').removeClass('hidden'); // Make the paper appear, if it is currently invisible
 	$("#bucketIcon").removeClass('hidden'); // Set icon in corner (will be different for buckets/tasks)
 	$("#bucketIcon").attr('src', "img/bucket.gif")
@@ -46,7 +44,7 @@ function addBucketToPaper(bucket) {
 	//id of notes is assigned as b(bucketNumber)t.
 	//id of taskbox is b(bucketNumber)taskBox
 	//we add just the one New Task line
-	var notes = "<div id='b"+bucket+"t' class='hiddenFloat'>"
+	var notes = "<div id='b"+bucket+"t' class='noteBox'>"
 							+ "<h5 style='float:left'>Tasks</h5>"
 							+ "<h5 style='float:right; padding-right:5px'>Due</h5>"
               + "<textarea class='new task'"
@@ -87,7 +85,7 @@ function addTaskToPaper(b, t) {
 	//notes contains the HTML of the notes section.
 	//id of outer div is b(bucketNum)t(taskNum)n
 	//id of noteBox is b(bucketNum)t(taskNum)noteBox
-	var notes = "<div id='b"+b+"t"+t+"n' class='hiddenFloat'>"
+	var notes = "<div id='b"+b+"t"+t+"n' class='noteBox'>"
 							+ "<h5>Notes</h5>"
               + "<textarea class='new note'"
                            + "id='b"+b+"t"+t+"noteBox'"
@@ -166,12 +164,12 @@ function collabBlur(b, t) {
     $(inp).removeClass('new');
 		name = $(inp).val();
 //		organizer[parseInt(bucket)]=bucketObj; // and add it to the organizer
-
-		$(inp).text('Enter name'); // reset input box
-		$(inp).css('color', '#aaa');
-		$(inp).addClass('new');
-		alert('#'+currentView.objName+"collabs");
-    $('#'+currentView.objName+"collabs").append(name+"<br>");
+	var iconText = "<img src='img/personIcon.png' class='icon persona'></img>"
+
+	$(inp).text('Enter name'); // reset input box
+	$(inp).css('color', '#aaa');
+	$(inp).addClass('new');
+    $('#'+currentView.objName+"collabs").append(iconText+name+"<br>");
   }
 }
 
@@ -218,7 +216,7 @@ function taskBlur(bucket) {
 		$(taskbox).css('color', '#aaa');
 		$(taskbox).addClass('new');
 		$(taskbox).onkeypress="ifEnter('#b"+bucket+"taskBox, event)";
-    $('#bottomLeftBox').append(newIcon+newText);
+    $('#b'+bucket+'t').append(newIcon+newText);
 
 	}
 }
@@ -267,7 +265,7 @@ function noteBlur(bucket, task) {
 				$(notebox).css('color', '#aaa');
 				$(notebox).addClass('new');
 				$(notebox).onkeypress = "ifEnter('#b" + bucket + "t" + task + "noteBox, event)";
-				$('#bottomLeftBox').append(newIcon + newText);
+				$('#b'+bucket+'t'+task+'n').append(newIcon + newText);
 			}
 }
 

diff --git a/newIndex.html b/newIndex.html
@@ -34,7 +34,7 @@
     	<div id="dropDownBar">
 
 				<div id="nameDropDown">
-    		  <input type="button" id="nameButton" value = "Alice Packer" class="menu_class" style="background-color:#73c242">
+    		  <input type="button" id="nameButton" value = "Alice Packer" class="menu_class" style="background-color:#bbfb66">
 							<ul name = "nameMenu" class="the_menu menu1">
 								<li>My Account</li>
 								<li>Settings</li>
@@ -43,7 +43,7 @@
     	  </div>
 				<div id="rightSideDropDowns">
 					<div id="alertDropDown">
-					  <input type="button" id="alertButton" value = "My Alerts" class="menu_class" style="background-color: #e83b94">
+					  <input type="button" id="alertButton" value = "My Alerts" class="menu_class" style="background-color: #ffaaed">
 							<ul name = "alertMenu" class="the_menu menu2">
 								<li>My First Alert</li>
 								<li>My Second Alert</li>
@@ -52,7 +52,7 @@
 				  </div>
 
 					 <div id="myTasksDropDown">
-	    	   	<input type="button" id="tasksButton" value = "My Tasks" class="menu_class" style="background-color: #dee32f">
+	    	   	<input type="button" id="tasksButton" value = "My Tasks" class="menu_class" style="background-color: #fcf589">
 							<ul id = "tasksMenu" class="the_menu menu3">
 								<li><textarea id="bucketInput" class='new bucket' onfocus='bucketFocus(nBuckets)' onblur="bucketBlur(nBuckets)" onkeypress="ifEnter('#bucketInput', event)">New Bucket</textarea></li>
 								<li onclick="addBucketToPaper('0','My First Bucket')">My First Bucket</li>