balance/search.php at master · simonzheng/balance · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
<?php
	//'session_check.php' checks if the session is active and if not
	// redirects to the splash page
	include("session_check.php");
?>
<!-- SESSION: ABOVE MUST BE PLACED AT VERY BEGINNING OF FILE BEFORE ANYTHING GET'S OUTPUTTED TO BROWSER -->


<!DOCTYPE html>
<html>

<!-- SEARCH.PHP -->

	<?php
	//'head.php' includes all header information for all of our pages
	// ie. everything that lives within <head>...info..</head>
	include("head.php");
	?>

	<body>

		<?php
		//partial for the top banner of the page
		$home='""';
		$search='"active"';
		$profile='""';
		$settings='""';
		include("banner.php");
		?>

		<!-- PLACE BODY INSIDE HERE - this is within the header and the footer-->
		<div class="container firstOffset">


			<form class="form-search searchForm searchForm1" action="search_result.php" id="search" name="search" method="post">
  			   <div class="input-append searchBox">
			    <input type="text" class="span2 search-query" id="query" name="query" placeholder="Search..." onkeyup="query_onkeyup()">
			    <button type="submit" class="btn searchBtn"><i class="icon-search"></i></button>
			  </div>
			</form>
			<div class="muted" style="margin-left:auto; margin-right:auto; width:83%;">Begin your search for a story above.</p>

		</div>

		<!-- Footer -->
		<?php
		//partial for the footer of the page
		$story=false;
		include("footer.php");
		?>


		<script type="text/javascript">
		$("a").click(function (event) {
		    event.preventDefault();
		    window.location = $(this).attr("href");
		});

		//document.getElementById("clearer").style.display = "none";


		//The following function appends some html containers and an icon that clears the text field when pressed
		//inspiration for this was take from: http://jsfiddle.net/PvFSF/  - creative commons
		(function ($, undefined) {
		    $.fn.clearable = function () {
		        var $this = this;
		        $this.wrap('<div class="clear-holder" />');
		        var helper = $('<span class="clear-helper" id="clearer" style="display:none;"><img src="img/icons/clear.png" class="clearImg"></span>');
		        $this.parent().append(helper);
		        helper.click(function(){
		            $this.val("");
		            $("#clearer").fadeOut("fast");
		        });
		    };
		})(jQuery);

		$("#query").clearable();


		function query_onkeyup()
		{
			var text = document.getElementById("query");
		   	if (text.value == "") {
		   		$("#clearer").fadeOut("fast");
		   	} else if (text.value != "") {
		   		$("#clearer").fadeIn("fast");
		   	};

		}


		</script>


				<!-- Below java script from twitter bootstrap-->
		<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
		<script type="text/javascript">
		$("#search").submit(function(){

			// Validation
			$("#search").validate({
				rules:{
				query:{required:true},
				},

				messages:{
					query:"Please specify a username",
				},

				errorClass: "help-inline",
				errorElement: "span",
				highlight:function(element, errorClass, validClass)
				{
				$(element).parents('.control-group').addClass('error');
				},
				unhighlight: function(element, errorClass, validClass)
				{
				$(element).parents('.control-group').removeClass('error');
				//$(element).parents('.control-group').addClass('success');
				}
			});
			if(!$("#search").valid()) {
				return false;
			} else {
				return true;
			}
		});
		</script>


		<script src="js/bootstrap-button.js"></script>
	    <script src="js/jquery.js"></script>
	    <script src="js/bootstrap-transition.js"></script>
	    <script src="js/bootstrap-alert.js"></script>
	    <script src="js/bootstrap-modal.js"></script>
	    <script src="js/bootstrap-dropdown.js"></script>
	    <script src="js/bootstrap-scrollspy.js"></script>
	    <script src="js/bootstrap-tab.js"></script>
	    <script src="js/bootstrap-tooltip.js"></script>
	    <script src="js/bootstrap-popover.js"></script>
	    <script src="js/bootstrap-button.js"></script>
	    <script src="js/bootstrap-collapse.js"></script>
	    <script src="js/bootstrap-carousel.js"></script>
	    <script src="js/bootstrap-typeahead.js"></script>
	    <script src="js/bootstrap-affix.js"></script>
	    <script src="js/application.js"></script>

	</body>
</html>