- added slide out menu for tag processing and other things in the future.

css/bible.css

@@ -156,7 +156,8 @@ h3 {
 	
 	background-color: #fff;
 }
-.removeresult 
+
+.removeresult
 {
     float: left;
     display: block;
@@ -184,3 +185,73 @@ h3 {
 	padding: 0px 12px;
 	margin: 0px;
 }
+
+
+
+.input-addtag {width: 200px; height: 36px;}
+.btn-addtag {width: 80px; height: 44px; margin-left: 3px;}
+
+
+
+
+a.trigger{
+	position: absolute;
+	background: url(images/open.png) 6% 55% no-repeat;
+	text-decoration: none;
+	font-size: 16px;
+	letter-spacing:-1px;
+	font-family: verdana, helvetica, arial, sans-serif;
+	color:#fff;
+	font-weight: bold;
+	border-bottom: none;
+	margin-left: 2px;
+	
+	z-index:2;
+}
+a.trigger.left {
+	left: 12px;
+}
+a.trigger.right {
+	right: 12px;
+}
+a.trigger:hover {
+	text-decoration: none;
+	border-bottom: none;
+}
+a.active.trigger {
+	background: url(images/close.png) 6% 55% no-repeat;
+}
+.panel {
+	color:#000;
+	position: absolute;
+	display: none;
+	background: #eee;
+	width: 300px;
+	height: auto;
+
+	z-index:1;
+}
+.panel.left {
+	left: 10px;
+	padding: 10px 20px 10px 60px;
+	border-top-right-radius: 15px;
+	-moz-border-radius-topright: 15px;
+	-webkit-border-top-right-radius: 15px;
+	-moz-border-radius-bottomright: 15px;
+	-webkit-border-bottom-right-radius: 15px;
+	border-bottom-right-radius: 15px;
+}
+.panel.right {
+	right: 10px;
+	padding: 10px 60px 10px 20px;
+	border-bottom-left-radius: 15px;
+	border-top-left-radius: 15px;
+	-moz-border-radius-bottomleft: 15px;
+	-moz-border-radius-topleft: 15px;
+	-webkit-border-bottom-left-radius: 15px;
+	-webkit-border-top-left-radius: 15px;
+}
+.panel p {
+	font-size:11px;
+}
+a:focus { outline: none;}

js/common.js

@@ -187,7 +187,11 @@ define(['jquery', 'reference', 'jquery.ui'],
                     if (localStorage.Results !== "undefined" && localStorage.SearchResults !== "undefined") {
                         $("#resultwrap").html(localStorage.Results);
                         $("#searchresultswrap").html(localStorage.SearchResults);
-                        Bible.AttachEvents($("#resultwrap"));
+                        
+                        $(".result").each(function(i, val) {
+                            Bible.AttachEvents($(val));
+                        });
+                        
                         Words.AttachEvents($("#searchresultswrap"));
                     }
                 }
@@ -289,8 +293,10 @@ define(['jquery', 'reference', 'jquery.ui'],
                             r += "<br />";
                         }
                     }
-                    var t = $("<div class='passage result'><a href='javascript:void();' class='removeresult' style='border: 0;'><img style='border: 0px;' src='images/delete.png' width='48' height='48' /></a><span class='resultbody'>" + "<h2><a href='http://www.dynamicbible.com/?r="+ ref.toString() + "'>" + ref.toString() + "</a></h2>" + r + "</span><br clear='all' /></div>");
-
+                    var t = $("<div class='passage result'><a href='javascript:void();' class='removeresult' style='border: 0;'><img style='border: 0px;' src='images/delete.png' width='48' height='48' /></a><a href='#' class='trigger left'>&nbsp;</a><div class='tags panel left'></div><span class='resultbody'>" + "<h2><a href='http://www.dynamicbible.com/?r="+ ref.toString() + "'>" + ref.toString() + "</a></h2>" + r + "</span><br clear='all' /></div>");
+                    var tagsform = $("<p>put tags here.... <br /><input type='text' class='input-addtag' /><button class='btn-addtag' type='button'>Add Tag</button></p>");
+                    t.find(".panel").append(tagsform);
+                    
                     Bible.AttachEvents(t);
                     
                     $("#result").prepend(t);
@@ -376,6 +382,14 @@ define(['jquery', 'reference', 'jquery.ui'],
                 t.find(".removeresult").click(function(e) {
                     Util.RemoveResult(e);
                 });
+                t.find('.btn-addtag').click(function(e) {
+                    var tags = $(e.target).parent().find(".input-addtag").val();
+                    //TODO(JWALL): add the tags.
+                });
+                t.find('.trigger').slidePanel({
+                    triggerCss: 'margin-top: 60px; display: block; width: 48px; height: 48px;',
+                    panelCss: 'margin-top: 55px; border: 2px solid #666;'
+                });
             }
         };
         var Strongs = {

js/jquery.slidePanel.js

@@ -0,0 +1,58 @@
+/* jQuery slidePanel plugin
+ * Examples and documentation at: http://www.jqeasy.com/
+ * Version: 1.0 (22/03/2010)
+ * No license. Use it however you want. Just keep this notice included.
+ * Requires: jQuery v1.3+
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+ * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
+ * OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+ * NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
+ * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+ * WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+ * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
+ * OTHER DEALINGS IN THE SOFTWARE.
+ */
+(function($){
+    $.fn.slidePanel = function(opts) {
+        opts = $.extend({
+            triggerName: '#trigger',
+            triggerCss: '',
+            panelCss:'',
+            speed: 'fast',
+            clickOutsideToClose: true
+        }, opts || {});
+		
+        
+        var trigger = this;
+        var panel = $(this).parent().find(".panel");
+
+        // set css properties for trigger and panel
+        trigger.attr('style',opts.triggerCss);
+        panel.attr('style',opts.panelCss);
+        panel.css('filter', 'alpha(opacity='+(opts.panelOpacity*100)+')');
+        panel.css('opacity', opts.panelOpacity);
+	
+        // triggerName mousedown event
+        trigger.attr( "href", "javascript:void(0)" ).mousedown(function(e) {
+
+            panel.toggle(opts.speed);
+            trigger.toggleClass("active");
+            
+            return false;
+        });
+	
+        if (opts.clickOutsideToClose) {
+            // bind the 'mousedown' event to the document so we can close panel without having to click triggerName
+            $(document).bind('mousedown',function(){
+                panel.hide(opts.speed);
+                trigger.removeClass('active');
+            });
+			
+            // don't close panel when clicking inside it
+            panel.bind('mousedown',function(e){
+                e.stopPropagation();
+            });
+        };
+    };
+})(jQuery);

js/jquery.slidePanel.min.js

@@ -0,0 +1,16 @@
+/* jQuery slidePanel plugin
+ * Examples and documentation at: http://www.jqeasy.com/
+ * Version: 1.0 (22/03/2010)
+ * No license. Use it however you want. Just keep this notice included.
+ * Requires: jQuery v1.3+
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+ * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
+ * OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+ * NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
+ * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+ * WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+ * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
+ * OTHER DEALINGS IN THE SOFTWARE.
+ */
+(function(a){a.fn.slidePanel=function(d){d=a.extend({triggerName:"#trigger",position:"absolute",triggerTopPos:"80px",panelTopPos:"50px",panelOpacity:0.9,speed:"fast",ajax:false,ajaxSource:null,clickOutsideToClose:true},d||{});var b=this;var c=a(d.triggerName);var e=a.browser.msie&&a.browser.version=="6.0";if(e){d.position="absolute"}c.css("position",d.position);c.css("top",d.triggerTopPos);b.css("position",d.position);b.css("top",d.panelTopPos);b.css("filter","alpha(opacity="+(d.panelOpacity*100)+")");b.css("opacity",d.panelOpacity);c.attr("href","javascript:void(0)").mousedown(function(){if(!d.ajax){b.toggle(d.speed);c.toggleClass("active")}if(d.ajax&&d.ajaxSource!=null){if(!b.is(":visible")){b.load(d.ajaxSource,function(g,f,i){if(f!=="success"){var h="<p>Sorry, but there was an error loading the document.</p>";b.html(h)}b.toggle(d.speed)})}else{b.toggle(d.speed)}c.toggleClass("active")}else{if(d.ajax&&d.ajaxSource==null){alert("You must define an ajaxSource to use Ajax.")}}return false});if(d.clickOutsideToClose){a(document).bind("mousedown",function(){b.hide(d.speed);c.removeClass("active")});b.bind("mousedown",function(f){f.stopPropagation()})}}})(jQuery);

js/main.js

@@ -1,4 +1,4 @@
-require(["jquery", "db", "common", "reference", "jquery.cookie", "jquery.ui"],
+require(["jquery", "db", "common", "reference", "jquery.cookie", "jquery.ui", "jquery.slidePanel"],
     function($, db, common, ref) {
         $(document).ready(function()
         {