Skip to content

Commit 55509e3

Browse files
williamdeswilliamdes
committed
Resucite demo file and make it more bootstrap like
1 parent 80feb13 commit 55509e3

File tree

2 files changed

+183
-1526
lines changed

2 files changed

+183
-1526
lines changed

‎demo/flavorzoom.html

+183-182
Original file line numberDiff line numberDiff line change
@@ -3,191 +3,192 @@
33

44
<head>
55

6-
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
7-
<title>Check off the foods you want to eat today.</title>
8-
9-
<link href="flavorzoom_files/flavorzoom.css" rel="stylesheet" type="text/css">
10-
<script type="text/javascript" src="flavorzoom_files/jquery.js"></script>
11-
<script type="text/javascript" src="flavorzoom_files/my_food_plan_pick_foods.js"></script>
12-
<script type="text/javascript" src="flavorzoom_files/jquery.uitablefilter.js"></script>
6+
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
7+
<title>Check off the foods you want to eat today.</title>
8+
9+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.4.1/css/bootstrap.min.css"
10+
integrity="sha256-L/W5Wfqfa0sdBNIKN9cG6QA5F2qx4qICmU2VgLruv9Y=" crossorigin="anonymous" />
11+
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.slim.js"
12+
integrity="sha256-sCexhaKpAfuqulKjtSY7V9H7QT0TCN90H+Y5NlmqOUE=" crossorigin="anonymous"></script>
13+
<script type="text/javascript" src="flavorzoom_files/my_food_plan_pick_foods.js"></script>
14+
<script type="text/javascript" src="../jquery.uitablefilter.js"></script>
1315
</head>
1416

1517
<body>
16-
17-
18-
<div id="fz_header">
19-
<table width="100%">
20-
<tbody>
21-
<tr>
22-
<td>
23-
Thanks to <a href="http://www.flavorzoom.com">flavorzoom.com</a> for providing a nice example
24-
</td>
25-
<td>
26-
<a href="http://www.flavorzoom.com/"><img
27-
src="http://www.flavorzoom.com/images/FZ-Logo-4c-transparent-bg.gif" alt="FlavorZoom"></a>
28-
</td>
29-
</tr>
30-
</tbody>
31-
</table>
32-
</div>
33-
34-
35-
<div id="mainbody">
36-
37-
<code>
38-
$(function () {
39-
var theTable = $('table.food_planner')
40-
41-
theTable.find("tbody > tr").find("td:eq(1)").mousedown(function () {
42-
$(this).prev().find(":checkbox").click()
43-
});
44-
45-
$("#filter").keyup(function () {
46-
$.uiTableFilter(theTable, this.value);
47-
})
48-
49-
$('#filter-form').submit(function () {
50-
theTable.find("tbody > tr:visible > td:eq(1)").mousedown();
51-
return false;
52-
}).focus(); //Give focus to input field
53-
});
54-
</code>
55-
56-
<h2>Check off the foods you want to eat today.</h2>
57-
58-
<form id="filter-form">Filter: <input name="filter" id="filter" value="" maxlength="30" size="30" type="text">
59-
</form><br>
60-
61-
<table class="food_planner">
62-
<thead>
63-
<tr>
64-
<th colspan="2">Your Food List</th>
65-
<tr>
66-
</thead>
67-
<tbody>
68-
<tr style="display: table-row;">
69-
</tr>
70-
<tr>
71-
<td><input name="food_id_1" value="23558" checked="checked" type="checkbox"></td>
72-
<td>
73-
&nbsp; &nbsp; &nbsp;Beef, ground, 95% lean meat / 5% fat, patty, cooked, broiled<input
74-
name="food_source_row_1" value="USDA" type="hidden"></td>
75-
</tr>
76-
<tr>
77-
<td><input name="food_id_2" value="18061" checked="checked" type="checkbox"></td>
78-
<td>
79-
&nbsp; &nbsp; &nbsp;Bread, rye, toasted<input name="food_source_row_2" value="USDA" type="hidden"></td>
80-
</tr>
81-
<tr>
82-
<td><input name="food_id_3" value="11742" checked="checked" type="checkbox"></td>
83-
<td>
84-
&nbsp; &nbsp; &nbsp;Broccoli, cooked, boiled, drained, with salt<input name="food_source_row_3" value="USDA"
85-
type="hidden"></td>
86-
</tr>
87-
<tr>
88-
<td><input name="food_id_4" value="1001" checked="checked" type="checkbox"></td>
89-
<td>
90-
&nbsp; &nbsp; &nbsp;Butter, salted<input name="food_source_row_4" value="USDA" type="hidden"></td>
91-
</tr>
92-
<tr>
93-
<td><input name="food_id_5" value="6242" checked="checked" type="checkbox"></td>
94-
<td>
95-
&nbsp; &nbsp; &nbsp;CAMPBELL Soup Company, CAMPBELL'S CHUNKY Microwavable Bowls, Chicken and Dumplings
96-
Soup<input name="food_source_row_5" value="USDA" type="hidden"></td>
97-
</tr>
98-
<tr>
99-
<td><input name="food_id_6" value="6396" type="checkbox"></td>
100-
<td>
101-
&nbsp; &nbsp; &nbsp;CAMPBELL Soup Company, CAMPBELL'S CHUNKY Soups, Fajita Chicken with Rice &amp; Beans
102-
Soup<input name="food_source_row_6" value="USDA" type="hidden"></td>
103-
</tr>
104-
<tr>
105-
<td><input name="food_id_7" value="11960" checked="checked" type="checkbox"></td>
106-
<td>
107-
&nbsp; &nbsp; &nbsp;Carrots, baby, raw<input name="food_source_row_7" value="USDA" type="hidden"></td>
108-
</tr>
109-
<tr style="display: table-row;">
110-
<td><input name="food_id_8" value="1040" checked="checked" type="checkbox"></td>
111-
<td>
112-
&nbsp; &nbsp; &nbsp;Cheese, swiss<input name="food_source_row_8" value="USDA" type="hidden"></td>
113-
</tr>
114-
<tr>
115-
<td><input name="food_id_9" value="7933" checked="checked" type="checkbox"></td>
116-
<td>
117-
&nbsp; &nbsp; &nbsp;Chicken breast, oven-roasted, fat-free, sliced<input name="food_source_row_9"
118-
value="USDA" type="hidden"></td>
119-
</tr>
120-
<tr>
121-
<td><input name="food_id_10" value="14209" checked="checked" type="checkbox"></td>
122-
<td>
123-
&nbsp; &nbsp; &nbsp;Coffee, brewed from grounds, prepared with tap water<input name="food_source_row_10"
124-
value="USDA" type="hidden"></td>
125-
</tr>
126-
<tr style="display: table-row;">
127-
<td><input name="food_id_11" value="1130" checked="checked" type="checkbox"></td>
128-
<td>
129-
&nbsp; &nbsp; &nbsp;Egg, whole, cooked, omelet<input name="food_source_row_11" value="USDA" type="hidden">
130-
</td>
131-
</tr>
132-
<tr style="display: table-row;">
133-
<td><input name="food_id_12" value="18265" checked="checked" type="checkbox"></td>
134-
<td>
135-
&nbsp; &nbsp; &nbsp;English muffins, wheat, toasted<input name="food_source_row_12" value="USDA"
136-
type="hidden"></td>
137-
</tr>
138-
<tr>
139-
<td><input name="food_id_13" value="15092" type="checkbox"></td>
140-
<td>
141-
&nbsp; &nbsp; &nbsp;Fish, sea bass, mixed species, cooked, dry heat<input name="food_source_row_13"
142-
value="USDA" type="hidden"></td>
143-
</tr>
144-
<tr style="display: table-row;">
145-
<td><input name="food_id_14" value="18640" checked="checked" type="checkbox"></td>
146-
<td>
147-
&nbsp; &nbsp; &nbsp;HEINZ, WEIGHT WATCHER, Chocolate Eclair, frozen<input name="food_source_row_14"
148-
value="USDA" type="hidden"></td>
149-
</tr>
150-
<tr style="display: table-row;">
151-
<td><input name="food_id_15" value="42138" checked="checked" type="checkbox"></td>
152-
<td>
153-
&nbsp; &nbsp; &nbsp;Mayonnaise, reduced-calorie or diet, cholesterol-free<input name="food_source_row_15"
154-
value="USDA" type="hidden"></td>
155-
</tr>
156-
<tr style="display: table-row;">
157-
<td><input name="food_id_16" value="4053" type="checkbox"></td>
158-
<td>
159-
&nbsp; &nbsp; &nbsp;Oil, olive, salad or cooking<input name="food_source_row_16" value="USDA" type="hidden">
160-
</td>
161-
</tr>
162-
<tr style="display: table-row;">
163-
<td><input name="food_id_17" value="9203" checked="checked" type="checkbox"></td>
164-
<td>
165-
&nbsp; &nbsp; &nbsp;Oranges, raw, Florida<input name="food_source_row_17" value="USDA" type="hidden"></td>
166-
</tr>
167-
<tr>
168-
<td><input name="food_id_18" value="20047" checked="checked" type="checkbox"></td>
169-
<td>
170-
&nbsp; &nbsp; &nbsp;Rice, white, long-grain, parboiled, enriched, cooked<input name="food_source_row_18"
171-
value="USDA" type="hidden"></td>
172-
</tr>
173-
<tr>
174-
<td><input name="food_id_19" value="18350" checked="checked" type="checkbox"></td>
175-
<td>
176-
&nbsp; &nbsp; &nbsp;Rolls, hamburger or hotdog, plain<input name="food_source_row_19" value="USDA"
177-
type="hidden"></td>
178-
</tr>
179-
<tr>
180-
<td><input name="food_id_20" value="14476" type="checkbox"></td>
181-
<td>
182-
&nbsp; &nbsp; &nbsp;Tea, ready-to-drink, LIPTON BRISK iced tea, with lemon flavor<input
183-
name="food_source_row_20" value="USDA" type="hidden"></td>
184-
</tr>
185-
</tbody>
186-
</table><br><br></form>
187-
188-
189-
</div>
18+
<main role="main">
19+
<div class="container-fluid">
20+
<div class="row">
21+
<div class="col-6">
22+
<h2>Check off the foods you want to eat today.</h2>
23+
24+
<form id="filter-form">
25+
<div class="form-inline">
26+
<div class="form-group">
27+
<label for="filter">Filter:</label>
28+
<input name="filter" id="filter" type="text" class="form-control ml-1"
29+
placeholder="Text to search">
30+
</div>
31+
</div>
32+
</form>
33+
34+
<table class="table table-sm table-striped food_planner">
35+
<thead>
36+
<tr>
37+
<th colspan="2">Your Food List</th>
38+
<tr>
39+
</thead>
40+
<tbody>
41+
<tr>
42+
</tr>
43+
<tr>
44+
<td><input name="food_id_1" value="23558" checked="checked" type="checkbox"></td>
45+
<td>
46+
Beef, ground, 95% lean meat / 5% fat, patty, cooked, broiled<input
47+
name="food_source_row_1" value="USDA" type="hidden"></td>
48+
</tr>
49+
<tr>
50+
<td><input name="food_id_2" value="18061" checked="checked" type="checkbox"></td>
51+
<td>
52+
Bread, rye, toasted<input name="food_source_row_2" value="USDA" type="hidden"></td>
53+
</tr>
54+
<tr>
55+
<td><input name="food_id_3" value="11742" checked="checked" type="checkbox"></td>
56+
<td>
57+
Broccoli, cooked, boiled, drained, with salt<input name="food_source_row_3"
58+
value="USDA" type="hidden"></td>
59+
</tr>
60+
<tr>
61+
<td><input name="food_id_4" value="1001" checked="checked" type="checkbox"></td>
62+
<td>
63+
Butter, salted<input name="food_source_row_4" value="USDA" type="hidden"></td>
64+
</tr>
65+
<tr>
66+
<td><input name="food_id_5" value="6242" checked="checked" type="checkbox"></td>
67+
<td>
68+
CAMPBELL Soup Company, CAMPBELL'S CHUNKY Microwavable Bowls, Chicken and Dumplings
69+
Soup<input name="food_source_row_5" value="USDA" type="hidden"></td>
70+
</tr>
71+
<tr>
72+
<td><input name="food_id_6" value="6396" type="checkbox"></td>
73+
<td>
74+
CAMPBELL Soup Company, CAMPBELL'S CHUNKY Soups, Fajita Chicken with Rice &amp; Beans
75+
Soup<input name="food_source_row_6" value="USDA" type="hidden"></td>
76+
</tr>
77+
<tr>
78+
<td><input name="food_id_7" value="11960" checked="checked" type="checkbox"></td>
79+
<td>
80+
Carrots, baby, raw<input name="food_source_row_7" value="USDA" type="hidden"></td>
81+
</tr>
82+
<tr>
83+
<td><input name="food_id_8" value="1040" checked="checked" type="checkbox"></td>
84+
<td>
85+
Cheese, swiss<input name="food_source_row_8" value="USDA" type="hidden"></td>
86+
</tr>
87+
<tr>
88+
<td><input name="food_id_9" value="7933" checked="checked" type="checkbox"></td>
89+
<td>
90+
Chicken breast, oven-roasted, fat-free, sliced<input name="food_source_row_9"
91+
value="USDA" type="hidden"></td>
92+
</tr>
93+
<tr>
94+
<td><input name="food_id_10" value="14209" checked="checked" type="checkbox"></td>
95+
<td>
96+
Coffee, brewed from grounds, prepared with tap water<input name="food_source_row_10"
97+
value="USDA" type="hidden"></td>
98+
</tr>
99+
<tr>
100+
<td><input name="food_id_11" value="1130" checked="checked" type="checkbox"></td>
101+
<td>
102+
Egg, whole, cooked, omelet<input name="food_source_row_11" value="USDA"
103+
type="hidden">
104+
</td>
105+
</tr>
106+
<tr>
107+
<td><input name="food_id_12" value="18265" checked="checked" type="checkbox"></td>
108+
<td>
109+
English muffins, wheat, toasted<input name="food_source_row_12" value="USDA"
110+
type="hidden">
111+
</td>
112+
</tr>
113+
<tr>
114+
<td><input name="food_id_13" value="15092" type="checkbox"></td>
115+
<td>
116+
Fish, sea bass, mixed species, cooked, dry heat<input name="food_source_row_13"
117+
value="USDA" type="hidden"></td>
118+
</tr>
119+
<tr>
120+
<td><input name="food_id_14" value="18640" checked="checked" type="checkbox"></td>
121+
<td>
122+
HEINZ, WEIGHT WATCHER, Chocolate Eclair, frozen<input name="food_source_row_14"
123+
value="USDA" type="hidden"></td>
124+
</tr>
125+
<tr>
126+
<td><input name="food_id_15" value="42138" checked="checked" type="checkbox"></td>
127+
<td>
128+
Mayonnaise, reduced-calorie or diet, cholesterol-free<input
129+
name="food_source_row_15" value="USDA" type="hidden"></td>
130+
</tr>
131+
<tr>
132+
<td><input name="food_id_16" value="4053" type="checkbox"></td>
133+
<td>
134+
Oil, olive, salad or cooking<input name="food_source_row_16" value="USDA"
135+
type="hidden">
136+
</td>
137+
</tr>
138+
<tr>
139+
<td><input name="food_id_17" value="9203" checked="checked" type="checkbox"></td>
140+
<td>
141+
Oranges, raw, Florida<input name="food_source_row_17" value="USDA" type="hidden">
142+
</td>
143+
</tr>
144+
<tr>
145+
<td><input name="food_id_18" value="20047" checked="checked" type="checkbox"></td>
146+
<td>
147+
Rice, white, long-grain, parboiled, enriched, cooked<input name="food_source_row_18"
148+
value="USDA" type="hidden"></td>
149+
</tr>
150+
<tr>
151+
<td><input name="food_id_19" value="18350" checked="checked" type="checkbox"></td>
152+
<td>
153+
Rolls, hamburger or hotdog, plain<input name="food_source_row_19" value="USDA"
154+
type="hidden">
155+
</td>
156+
</tr>
157+
<tr>
158+
<td><input name="food_id_20" value="14476" type="checkbox"></td>
159+
<td>
160+
Tea, ready-to-drink, LIPTON BRISK iced tea, with lemon flavor<input
161+
name="food_source_row_20" value="USDA" type="hidden"></td>
162+
</tr>
163+
</tbody>
164+
</table>
165+
</div>
166+
<div class="col-6 mt-5">
167+
<pre>
168+
<code>
169+
$(function () {
170+
var theTable = $('table.food_planner')
171+
172+
theTable.find("tbody > tr").find("td:eq(1)").mousedown(function () {
173+
$(this).prev().find(":checkbox").click()
174+
});
175+
176+
$("#filter").keyup(function () {
177+
$.uiTableFilter(theTable, this.value);
178+
})
179+
180+
$('#filter-form').submit(function () {
181+
theTable.find("tbody > tr:visible > td:eq(1)").mousedown();
182+
return false;
183+
}).focus(); //Give focus to input field
184+
});
185+
</code>
186+
</pre>
187+
</div>
188+
</div>
189+
</div>
190+
</main>
190191

191192
</body>
192193

193-
</html>
194+
</html>

0 commit comments

Comments
 (0)