generated from akshatvg/template
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
181 lines (170 loc) · 8.83 KB
/
index.html
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
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Bhoomi | Home</title>
<link href="https://fonts.googleapis.com/css?family=Poppins:300,400,700" rel="stylesheet">
<link rel="stylesheet" href="./css/materialize.css">
<link rel="stylesheet" href="css/loader.css">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link rel="stylesheet" href="./node_modules/sal.js/dist/sal.css ">
<link rel="stylesheet" href="./css/style.css">
</head>
<body>
<!-- Landing Section -->
<section class="landing" id="home">
<!-- Navigation -->
<div class="navbar-fixed" style="height: 100px;">
<nav id="staticNav" class="transparent z-depth-0" style="display: flex;
/*height: 100px;*/
position: fixed;
top: 0px;
padding-top: 16px;
height: 64px;">
<!-- Left -->
<div class="show-on-small hide-on-med-and-up"
style=" position: absolute; top: 4px; left: 0px;">
<a href="#" data-target="slide-out" class="sidenav-trigger"><i
class="large material-icons">menu</i></a>
</div>
<!-- <a href="#" onclick="scroll2('home')" style="margin-top: -10px;"> -->
<ul class="nav-left" style=" height: 56px;">
<li>
<img style="height: 50px;" src="img/logo.png" alt="logo">
</li>
<li class="logo-text" style="margin-top: -14px;">Bhoomi</li>
</ul>
<!-- </a> -->
<!-- Right -->
<ul class="nav-right hide-on-small-only">
<li style="margin-top: -5px;"><a onclick="scroll2('about')" href="#">About</a></li>
<li style="margin-top: -5px;"><a onclick="scroll2('predict')" href="#">Predict</a></li>
<!-- <li style="margin-top: -5px;"><a href="alert.html" target="blank">Alerts</a></li> -->
<!-- <li style="margin-top: -14px;"><a href="#">Admin</a></li> -->
</ul>
</nav>
</div>
<ul id="slide-out" class="sidenav" style="padding-top:50px">
<li><a onclick="scroll2('about')" href="#">About</a></li>
<li><a onclick="scroll2('predict')" href="#">Predict</a></li>
<!-- <li><a href="alert.html" target="blank">Alerts</a></li> -->
<!-- <li><a href="#">Admin</a></li> -->
</ul>
<div data-sal-duration="1200" data-sal="slide-up" data-sal-delay="300" data-sal-easing="ease-out-bounce">
<p>
Predict the right time to store <br> your crops & make <strong>Maximum Profits!</strong>
</p>
<a class="home-button" id="btn" href="#" onclick="scroll2('predict')">GET STARTED</a>
<!-- <button class="home-button" id="btn">GET STARTED</button> -->
</div>
</section>
<!-- About us -->
<section class="section-margin section-ht-center1">
<div id="about">
<h2 data-sal-duration="1200" data-sal="fade" data-sal-delay="1100" data-sal-easing="ease-out-bounce">
ABOUT
</h2>
<p align="justify" class="text" data-sal-duration="1200" data-sal="fade" data-sal-delay="1050"
data-sal-easing="ease-out-bounce">
It has been quite often observed that there has been a bumper crop in a particular region at a
particular
time due to which the price of the crop falls heavily.There have been innumerable such scenarios where
a
big amount of crop yield gets wasted due to bumper crop in one season and then rises heavily in another
season. All this happens due to poor management and storage facilities by government due to lack of
contingency measures and planning for such situations. These calamities causes massive losses to both
general citizens as well as the farmers.
We as a team are planning to use soil data, weather information and market information for prices of
crop
to build predictive models that will tackle these situations by making the government aware in advance
to
take necessary action to save such crops in times of bumper crop and to use them at times of shortages.
In
this way the government can pre plan to build effective storage solutions for the particular crop that
may
have bumper production and use this at times of crisis. This will save a lot of farmers and citizens
from
market exploitation and thus will create a balance to meet the food demands of the nation.
</p>
</div>
</section>
<!-- Predict -->
<section id="predict" class="target">
<h2 data-sal-duration="1200" data-sal="fade" data-sal-delay="1100" data-sal-easing="ease-out-bounce">
PREDICT
</h2>
<div class="row" id="select" style="display:nne;padding:20px;height: 500px;" data-sal-duration="1200"
data-sal="fade" data-sal-delay="1100" data-sal-easing="ease-out-bounce">
<div class="col s12 m8 l6 offset-m2 offset-l3" style="text-align: center;">
<input id="search" type="text" placeholder=" Search Box" style=" background: rgba(255,255,255,0.7);
height:40px;
width: 20em;
font-size: 16px;
font-weight: bold;
margin: 1.5% 5.5%">
<div class="card-content" style="height:300px; border-radius: 4px;" id="gm1"></div>
<div class="input-field col s8 offset-s2">
<select name="area" id="crop">
<option value="0" selected disabled>Choose a crop</option>
<option value="rice">Rice</option>
<option value="bajra">Bajra</option>
<option value="maize">Maize</option>
</select>
<!-- <label>Materialize Select</label> -->
</div>
<button class="home-button" style="color:white;cursor: pointer;" onclick="submit()">Submit</button>
</div>
</div>
<div class="row">
<div id="loader" class="col s12 m8 l6 offset-m2 offset-l3"
style="display: none; height: 500px;background-color: white; padding: 20px; ">
<div class="lds-css ng-scope" style="width: 200px;height: 200px;position: relative;top: 10%;left: 50%;
margin-left: -100px;">
<div class="lds-rolling">
<div></div>
</div>
</div>
</div>
</div>
<div id="result" class="row" style="height: 500px; display: none;">
<div class="col s12 m8 l6 offset-m2 offset-l3">
<div id="card-color" class="green" style="display:flow-root;padding: 20px">
<h3 style="width:100%"><b>Total Yield</b> </h3>
<div style="font-size:20px"><span style="width:100%" id="totalyield">123</span>kg/hectre </div>
</div>
<div class="grey lighten-3" style="display:flow-root;padding: 60px 0px;">
<div id="lowYield" class="red-text" style="display:none">
<h3><b>Low Yield</b></h3>
</div>
<div id="normalYield" class="green-text" style="display:none">
<h3><b>Normal Yield</b></h3>
</div>
<div id="highYield" class="red-text" style="display:none">
<h3><b>High Yield</b></h3>
</div>
</div>
<button class="home-button" style="margin-top: 30px;color:white" onclick="back()">Back</button>
</div>
</div>
</section>
<!-- Footer -->
<footer style="display:flex">
<p>
Made with ♡ by Akshat & Nishi
</p>
</footer>
<script src="js/sal.js"></script>
<script>
sal();
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="js/MapSelect.js"></script>
<script
src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDrx8Uaya_n2adaXBiiuMHiS2sxo8c0wUY&libraries=places&callback=initAutocomplete"
async defer></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.js"></script>
<script src="./js/defined.js"></script>
</body>
</html>