Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
GeoInt_SIDT
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
Mario Chirinos Colunga
GeoInt_SIDT
Commits
b0133c01
Commit
b0133c01
authored
Jul 12, 2018
by
Renán Sosa Guillen
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
templates update
parent
c1b6be88
Changes
4
Hide whitespace changes
Inline
Side-by-side
Showing
4 changed files
with
542 additions
and
604 deletions
+542
-604
dataRetrieval.js
catalog/static/js/dataRetrieval.js
+90
-126
base_top.html
catalog/templates/base_top.html
+227
-166
map.html
catalog/templates/map.html
+200
-213
views.py
catalog/views.py
+25
-99
No files found.
catalog/static/js/dataRetrieval.js
View file @
b0133c01
// ------------------------------------------
// Script for managing data with javascript
// ------------------------------------------
var
OPT_LIST_IS_HIDDEN
=
true
;
var
INPUT_ON_FOCUS
=
false
;
var
polygonList
;
...
...
@@ -7,15 +11,17 @@ var PRODUCT_COUNTER = 0;
var
makeRequest
=
function
(
value
)
{
var
pol_element
=
document
.
getElementById
(
'polygon-list'
);
// petición de municipios a base de datos
// variable req_url en map.html
$
.
ajax
({
type
:
"POST"
,
url
:
req_url
,
data
:
{
'csrfmiddlewaretoken'
:
document
.
getElementsByName
(
'csrfmiddlewaretoken'
)[
0
].
value
,
'value'
:
value
type
:
"POST"
,
url
:
req_url
,
data
:
{
'csrfmiddlewaretoken'
:
document
.
getElementsByName
(
'csrfmiddlewaretoken'
)[
0
].
value
,
'value'
:
value
},
dataType
:
'json'
,
success
:
function
(
data
)
{
dataType
:
'json'
,
success
:
function
(
data
)
{
polygonList
=
data
.
polygonList
;
while
(
pol_element
.
firstChild
)
{
...
...
@@ -23,26 +29,16 @@ var makeRequest = function (value) {
}
data
.
polygonList
.
forEach
(
function
(
polygon
)
{
// '<li onclick="drawPolygon(this)" id="'+ polygon.id +'" class="pol">' + polygon.city + ", " + polygon.state + '</li>'
var
html_element
=
'<li id="'
+
polygon
.
id
+
'" onclick="drawPolygon(this)" class="pol">'
+
'<div class="box box-warning box-solid">'
+
'<div class="box-header with-border">'
+
'<span class="pol-title">'
+
polygon
.
city
+
', '
+
polygon
.
state
+
'</span>'
+
'</div>'
+
'<div class="box-body">'
+
'<span class="pol-body">'
+
polygon
.
description
+
'</span><br>'
+
'<div class="pol-src">'
+
'Fuente: '
+
polygon
.
source
+
'</div>'
+
'</div>'
+
'</div>'
+
'</li>'
;
$
(
'#polygon-list'
).
append
(
html_element
);
var
temp
=
document
.
querySelector
(
'#city_list_template'
);
// filling template
temp
.
content
.
querySelector
(
'li'
).
id
=
polygon
.
id
;
temp
.
content
.
querySelectorAll
(
'span'
)[
0
].
textContent
=
polygon
.
city
+
", "
+
polygon
.
state
;
temp
.
content
.
querySelectorAll
(
'span'
)[
1
].
textContent
=
polygon
.
description
;
temp
.
content
.
querySelectorAll
(
'div'
)[
3
].
textContent
=
"Fuente: "
+
polygon
.
source
;
var
clone
=
document
.
importNode
(
temp
.
content
,
true
);
document
.
querySelector
(
'#polygon-list'
).
appendChild
(
clone
);
});
if
(
OPT_LIST_IS_HIDDEN
)
{
...
...
@@ -113,6 +109,7 @@ function drawApiResponse(element) {
})
}
$
(
'#ajax-input'
).
focus
(
function
()
{
console
.
log
(
'in'
);
INPUT_ON_FOCUS
=
true
;
...
...
@@ -151,11 +148,10 @@ $(document).ready(function () {
var
pol_element
=
document
.
getElementById
(
'polygon-list'
);
var
typingTimer
;
var
typingInterval
=
800
;
//milliseconds
var
productListPrev
=
[];
var
typingInterval
=
800
;
//milliseconds
var
productListPrev
=
[];
var
productListGlobe
=
[];
var
productListCart
=
{};
// this array represent DB where products will be stored
var
productListCart
=
{};
// this array represent DB where products will be stored
// On keyup, start the contdown
$
(
'#ajax-input'
).
on
(
'input'
,
function
()
{
...
...
@@ -185,18 +181,20 @@ $(document).ready(function () {
erase_product_list_globe
();
// petición de producto a base de datos
// variable prod_req_url en map.html
$
.
ajax
({
type
:
"POST"
,
url
:
prod_req_url
,
data
:
submit_data
,
dataType
:
'json'
,
success
:
function
(
data
)
{
PRODUCT_IN_LIST
=
false
;
type
:
"POST"
,
url
:
prod_req_url
,
data
:
submit_data
,
dataType
:
'json'
,
success
:
function
(
data
)
{
PRODUCT_IN_LIST
=
false
;
productListGlobe
=
[];
productListPrev
=
[];
productListPrev
=
[];
console
.
log
(
"DATA: "
,
data
);
product_list
=
data
;
productListGlobe
=
data
.
catalog
;
product_list
=
data
;
//
productListGlobe = data.catalog;
console
.
log
(
'GLOBEEE: '
,
productListGlobe
);
if
(
productListPrev
.
length
>
0
)
{
...
...
@@ -214,50 +212,38 @@ $(document).ready(function () {
productListPrev
.
push
(
data
);
// var div_top = 148;
data
.
catalog
.
forEach
(
function
(
data
)
{
console
.
log
(
"DD: "
,
data
);
// petición de imagen a webservice
$
.
ajax
({
type
:
"GET"
,
url
:
img_req_url
,
data
:
{
// 'csrfmiddlewaretoken': document.getElementsByName('csrfmiddlewaretoken')[0].value,
'value'
:
data
.
product
.
link_icon
type
:
"GET"
,
url
:
img_req_url
,
data
:
{
'value'
:
data
.
product
.
link_icon
},
dataType
:
'json'
,
success
:
function
(
res
)
{
// console.log("DIV_TOP: ", div_top);
var
product_html
=
'<li id="'
+
data
.
id
+
'">'
+
'<a href="javascript:void(0)">'
+
'<i class="menu-icon glyphicon glyphicon-bookmark bg-red"></i>'
+
'<div class="menu-info">'
+
'<h4 id="'
+
data
.
id
+
'-h4" class="control-sidebar-subheading" onclick="drawApiResponse(this)">'
+
data
.
product
.
producttype
+
'_'
+
data
.
product
.
tileid
+
'</h4>'
+
'<p>'
+
data
.
product
.
beginposition
+
'</p>'
+
'<input type="checkbox" name="product_selected" value="'
+
data
.
id
+
'" checked>'
+
'</div>'
+
'</a>'
+
// '<div class="info-product-box bg-geo" style="top: ' + div_top + 'px;">' +
'<div class="info-product-box bg-geo">'
+
'<span class="info-product-box-img">'
+
'<img src="data:image/jpeg;base64, '
+
res
.
img
+
'">'
+
'</span>'
+
'<div class="info-product-box-content">'
+
'<span class="info-product-box-text">'
+
data
.
product
.
identifier
+
'</span>'
+
'<span class="info-product-box-number">'
+
data
.
product
.
size
+
'</span>'
+
'<div class="progress">'
+
'<div class="progress-bar" style="width: 100%"></div>'
+
'</div>'
+
'<span class="progress-description">'
+
data
.
product
.
instrumentname
+
'</span>'
+
'</div>'
+
'</div>'
+
'</li>'
;
$
(
'#product-list-globe'
).
append
(
product_html
);
// div_top += 75;
dataType
:
'json'
,
success
:
function
(
res
)
{
data
.
img
=
res
.
img
;
var
temp
=
document
.
querySelector
(
'#product_list_template'
);
// filling template
temp
.
content
.
querySelector
(
'li'
).
id
=
data
.
id
;
temp
.
content
.
querySelector
(
'h4'
).
id
=
data
.
id
+
"-h4"
;
temp
.
content
.
querySelector
(
'h4'
).
textContent
=
data
.
product
.
producttype
+
"_"
+
data
.
product
.
tileid
;
temp
.
content
.
querySelector
(
'p'
).
textContent
=
data
.
product
.
beginposition
;
temp
.
content
.
querySelector
(
'input'
).
value
=
data
.
id
;
temp
.
content
.
querySelector
(
'img'
).
src
=
"data:image/jpeg;base64, "
+
data
.
img
;
temp
.
content
.
querySelectorAll
(
'span'
)[
1
].
textContent
=
data
.
product
.
identifier
;
temp
.
content
.
querySelectorAll
(
'span'
)[
2
].
textContent
=
data
.
product
.
size
;
temp
.
content
.
querySelectorAll
(
'span'
)[
3
].
textContent
=
data
.
product
.
instrumentname
;
var
clone
=
document
.
importNode
(
temp
.
content
,
true
);
document
.
querySelector
(
'#product-list-globe'
).
appendChild
(
clone
);
}
});
console
.
log
(
"DD: "
,
data
);
productListGlobe
.
push
(
data
);
});
$
(
'#cart'
).
removeClass
(
"active"
);
...
...
@@ -288,20 +274,19 @@ $(document).ready(function () {
var
submit_data_array
=
submit_data
.
split
(
"&product_selected="
);
PRODUCT_COUNTER
+=
1
;
// this variable counts the number of products in shopping cart
var
product_html
=
'<li class="treeview">'
+
'<a href="#">'
+
'<i class="fa fa-cubes"></i>'
+
'<span>Product '
+
PRODUCT_COUNTER
+
'</span>'
+
'<span class="pull-right-container">'
+
'<span class="label label-primary pull-right"></span>'
+
'</span>'
+
'</a>'
+
'<ul class="treeview-menu sidebar-form">'
+
'<li>'
+
'<ul id="product-list-cart-items" class="control-sidebar-menu">'
;
var
product_html_li
=
''
;
var
temp_1
=
document
.
querySelector
(
'#product_cart_1'
);
var
prod_id
=
temp_1
.
content
.
querySelectorAll
(
'ul'
)[
1
].
id
+
"-"
+
PRODUCT_COUNTER
.
toString
();
// filling template
temp_1
.
content
.
querySelector
(
'span'
).
textContent
=
"Product "
+
PRODUCT_COUNTER
.
toString
();
temp_1
.
content
.
querySelectorAll
(
'ul'
)[
1
].
id
=
prod_id
;
var
clone_1
=
document
.
importNode
(
temp_1
.
content
,
true
);
document
.
querySelector
(
'#product-list-cart'
).
appendChild
(
clone_1
);
// var div_top = 148;
console
.
log
(
"djdj: "
,
productListGlobe
);
productListGlobe
.
forEach
(
function
(
data
)
{
if
(
submit_data_array
.
indexOf
(
data
.
id
)
>
-
1
)
{
...
...
@@ -309,42 +294,21 @@ $(document).ready(function () {
console
.
log
(
"SS: "
,
data
.
product
.
size
);
erase_product_list_globe_by_id
(
data
.
id
);
product_html_li
+=
'<li id="'
+
data
.
id
+
'">'
+
'<a href="javascript:void(0)">'
+
'<i class="menu-icon glyphicon glyphicon-bookmark bg-red"></i>'
+
'<div class="menu-info">'
+
'<h4 id="'
+
data
.
id
+
'-h4" class="control-sidebar-subheading">'
+
data
.
product
.
producttype
+
'_'
+
data
.
product
.
tileid
+
'</h4>'
+
'<p>'
+
data
.
product
.
beginposition
+
'</p>'
+
'</div>'
+
'</a>'
+
// '<div class="info-product-box bg-geo" style="top: ' + div_top + 'px;">' +
'<div class="info-product-cart-box bg-geo">'
+
'<span class="info-product-box-img">'
+
'<img src="/static/images/sat_preview/sat_test.jpg">'
+
'</span>'
+
'<div class="info-product-box-content">'
+
'<span class="info-product-box-text">'
+
data
.
product
.
identifier
+
'</span>'
+
'<span class="info-product-box-number">'
+
data
.
product
.
size
+
'</span>'
+
'<div class="progress">'
+
'<div class="progress-bar" style="width: 100%"></div>'
+
'</div>'
+
'<span class="progress-description">'
+
data
.
product
.
instrumentname
+
'</span>'
+
'</div>'
+
'</div>'
+
'</li>'
;
// div_top += 52;
}
});
var
temp_2
=
document
.
querySelector
(
'#product_cart_2'
);
product_html_li
+=
'</ul>'
+
'</li>'
+
'</ul>'
+
'</li>'
;
// filling template
temp_2
.
content
.
querySelector
(
'li'
).
id
=
data
.
id
;
temp_2
.
content
.
querySelector
(
'h4'
).
id
=
data
.
id
+
"-h4"
;
temp_2
.
content
.
querySelector
(
'h4'
).
textContent
=
data
.
product
.
producttype
+
"_"
+
data
.
product
.
tileid
;
temp_2
.
content
.
querySelector
(
'p'
).
textContent
=
data
.
product
.
beginposition
;
temp_2
.
content
.
querySelector
(
'img'
).
src
=
"data:image/jpeg;base64, "
+
data
.
img
;
temp_2
.
content
.
querySelectorAll
(
'span'
)[
1
].
textContent
=
data
.
product
.
identifier
;
temp_2
.
content
.
querySelectorAll
(
'span'
)[
2
].
textContent
=
data
.
product
.
size
;
temp_2
.
content
.
querySelectorAll
(
'span'
)[
3
].
textContent
=
data
.
product
.
instrumentname
;
// console.log("DUPLI2: ", product_html + product_html_li);
$
(
'#product-list-cart'
).
append
(
product_html
+
product_html_li
);
var
clone_2
=
document
.
importNode
(
temp_2
.
content
,
true
);
document
.
querySelector
(
'#'
+
prod_id
).
appendChild
(
clone_2
);
}
});
});
});
catalog/templates/base_top.html
View file @
b0133c01
<!DOCTYPE html>
{% load static %}
<html>
<head>
<title>
Repositorio de Imágenes Satelitales
</title>
<meta
http-equiv=
"Content-Type"
content=
"text/html; charset=utf-8"
/>
<meta
content=
"width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"
name=
"viewport"
>
<link
rel=
"icon"
href=
"{% static 'images/satellite.png' %}"
>
<!-- Bootstrap 3.3.7 -->
<link
rel=
"stylesheet"
href=
"{% static 'adminlte/bower_components/bootstrap/dist/css/bootstrap.min.css' %}"
>
<!-- Font Awesome -->
<link
rel=
"stylesheet"
href=
"{% static 'adminlte/bower_components/font-awesome/css/font-awesome.min.css' %}"
>
<link
rel=
"stylesheet"
href=
"https://use.fontawesome.com/releases/v5.0.13/css/all.css"
integrity=
"sha384-DNOHZ68U8hZfKXOrtjWvjxusGo9WQnrNx2sqG0tfsghAvtVlRW3tvkXWZh58N9jp"
crossorigin=
"anonymous"
>
<!-- Theme style -->
<link
rel=
"stylesheet"
href=
"{% static 'adminlte/dist/css/AdminLTE.css' %}"
>
<!-- AdminLTE Skins. Choose a skin from the css/skins folder instead of downloading all of them to reduce the load. -->
<link
rel=
"stylesheet"
href=
"{% static 'adminlte/dist/css/skins/_all-skins.css' %}"
>
<!-- Select2 -->
<link
rel=
"stylesheet"
href=
"{% static 'adminlte/bower_components/select2/dist/css/select2.min.css' %}"
>
{% block headMedia %}{% endblock %}
<head>
<title>
Repositorio de Imágenes Satelitales
</title>
<meta
http-equiv=
"Content-Type"
content=
"text/html; charset=utf-8"
/>
<meta
content=
"width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"
name=
"viewport"
>
<link
rel=
"icon"
href=
"{% static 'images/satellite.png' %}"
>
<!-- Bootstrap 3.3.7 -->
<link
rel=
"stylesheet"
href=
"{% static 'adminlte/bower_components/bootstrap/dist/css/bootstrap.min.css' %}"
>
<!-- Font Awesome -->
<link
rel=
"stylesheet"
href=
"{% static 'adminlte/bower_components/font-awesome/css/font-awesome.min.css' %}"
>
<link
rel=
"stylesheet"
href=
"https://use.fontawesome.com/releases/v5.0.13/css/all.css"
integrity=
"sha384-DNOHZ68U8hZfKXOrtjWvjxusGo9WQnrNx2sqG0tfsghAvtVlRW3tvkXWZh58N9jp"
crossorigin=
"anonymous"
>
<!-- Theme style -->
<link
rel=
"stylesheet"
href=
"{% static 'adminlte/dist/css/AdminLTE.css' %}"
>
<!-- AdminLTE Skins. Choose a skin from the css/skins folder instead of downloading all of them to reduce the load. -->
<link
rel=
"stylesheet"
href=
"{% static 'adminlte/dist/css/skins/_all-skins.css' %}"
>
<!-- Select2 -->
<link
rel=
"stylesheet"
href=
"{% static 'adminlte/bower_components/select2/dist/css/select2.min.css' %}"
>
{% block headMedia %}{% endblock %}
</head>
<body
class=
"hold-transition skin-yellow sidebar-mini"
>
<!-- <div id="map" class="map" tabindex="0"> </div>-->
<!-- <iframe id="catalogFrame" name="catalogFrame">my frame</iframe>-->
<div
class=
"wrmapper"
>
<header
class=
"main-header"
>
<!-- Logo -->
<a
href=
"index2.html"
class=
"logo"
>
<!-- mini logo for sidebar mini 50x50 pixels -->
<span
class=
"logo-mini"
><b>
G
</b>
eo
</span>
<!-- logo for regular state and mobile devices -->
<span
class=
"logo-lg"
><b>
Geo
</b>
int
</span>
</a>
<!-- Header Navbar: style can be found in header.less -->
<nav
class=
"navbar navbar-static-top"
>
<!-- Sidebar toggle button-->
<a
href=
"#"
class=
"sidebar-toggle"
data-toggle=
"push-menu"
role=
"button"
>
<span
class=
"sr-only"
>
Toggle navigation
</span>
</a>
</head>
<body
class=
"hold-transition skin-yellow sidebar-mini"
>
<!-- <div id="map" class="map" tabindex="0"> </div>-->
<!-- <iframe id="catalogFrame" name="catalogFrame">my frame</iframe>-->
<div
class=
"navbar-custom-menu"
>
<ul
class=
"nav navbar-nav"
>
<!-- Messages: style can be found in dropdown.less-->
<!-- <li class="dropdown messages-menu"> -->
{#% block messages %#}{#% endblock %#}
<!-- </li> -->
<!-- Notifications: style can be found in dropdown.less -->
<!-- <li class="dropdown notifications-menu"> -->
{#% block notifications %#}{#% endblock %#}
<!-- </li> -->
<!-- Tasks: style can be found in dropdown.less -->
<!-- <li class="dropdown tasks-menu"> -->
{#% block tasks %}{% endblock %#}
<!-- </li> -->
<!-- User Account: style can be found in dropdown.less -->
<li
class=
"dropdown user user-menu"
>
{% block user %}{% endblock %}
</li>
<!-- Control Sidebar Toggle Button -->
<li>
<a
id=
"product-list-toggle"
href=
"#"
data-toggle=
"control-sidebar"
><i
class=
"fa fa-shopping-cart"
></i></a>
</li>
</ul>
</div>
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside
class=
"main-sidebar"
>
<!-- sidebar: style can be found in sidebar.less -->
<section
class=
"sidebar"
>
{% block sidebar %}{% endblock %}
</section>
<!-- /.sidebar -->
</aside>
<div
class=
"wrapper"
>
<header
class=
"main-header"
>
<!-- Logo -->
<a
href=
"index2.html"
class=
"logo"
>
<!-- mini logo for sidebar mini 50x50 pixels -->
<span
class=
"logo-mini"
><b>
G
</b>
eo
</span>
<!-- logo for regular state and mobile devices -->
<span
class=
"logo-lg"
><b>
Geo
</b>
int
</span>
</a>
<!-- Header Navbar: style can be found in header.less -->
<nav
class=
"navbar navbar-static-top"
>
<!-- Sidebar toggle button-->
<a
href=
"#"
class=
"sidebar-toggle"
data-toggle=
"push-menu"
role=
"button"
>
<span
class=
"sr-only"
>
Toggle navigation
</span>
</a>
<div
class=
"navbar-custom-menu"
>
<ul
class=
"nav navbar-nav"
>
<!-- Messages: style can be found in dropdown.less-->
<!-- <li class="dropdown messages-menu"> -->
{#% block messages %#}{#% endblock %#}
<!-- </li> -->
<!-- Notifications: style can be found in dropdown.less -->
<!-- <li class="dropdown notifications-menu"> -->
{#% block notifications %#}{#% endblock %#}
<!-- </li> -->
<!-- Tasks: style can be found in dropdown.less -->
<!-- <li class="dropdown tasks-menu"> -->
{#% block tasks %}{% endblock %#}
<!-- </li> -->
<!-- User Account: style can be found in dropdown.less -->
<li
class=
"dropdown user user-menu"
>
{% block user %}{% endblock %}
</li>
<!-- Control Sidebar Toggle Button -->
<li>
<a
id=
"product-list-toggle"
href=
"#"
data-toggle=
"control-sidebar"
><i
class=
"fa fa-shopping-cart"
></i></a>
</li>
</ul>
<!-- Content Wrapper. Contains page content -->
<div
class=
"content-wrapper"
style=
"border:0px solid blue;"
>
{% block content %}{% endblock %}
</div>
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside
class=
"main-sidebar"
>
<!-- sidebar: style can be found in sidebar.less -->
<section
class=
"sidebar"
>
{% block sidebar %}{% endblock %}
</section>
<!-- /.sidebar -->
</aside>
<!-- Content Wrapper. Contains page content -->
<div
class=
"content-wrapper"
style=
"border:0px solid blue;"
>
{% block content %}{% endblock %}
</div>
<!-- /.content-wrapper -->
<!-- <footer class="main-footer">-->
<!-- <div class="pull-right hidden-xs">-->
<!-- <b>Version</b> 2.4.0-->
<!-- </div>-->
<!-- <strong>Copyright © 2014-2016 <a href="https://adminlte.io">Almsaeed Studio</a>.</strong> All rights reserved.-->
<!-- </footer>-->
<!-- /.content-wrapper -->
<!-- <footer class="main-footer">-->
<!-- <div class="pull-right hidden-xs">-->
<!-- <b>Version</b> 2.4.0-->
<!-- </div>-->
<!-- <strong>Copyright © 2014-2016 <a href="https://adminlte.io">Almsaeed Studio</a>.</strong> All rights reserved.-->
<!-- </footer>-->
<!-- Control Sidebar -->
<aside
class=
"control-sidebar control-sidebar-dark"
>
<!-- Control Sidebar -->
<aside
class=
"control-sidebar control-sidebar-dark"
>
<!-- Create the tabs -->
<ul
class=
"nav nav-tabs nav-justified control-sidebar-tabs"
>
<li
id=
"globe"
><a
href=
"#control-sidebar-home-tab"
data-toggle=
"tab"
><i
class=
"fa fa-globe"
></i></a></li>
<li
id=
"cart"
><a
href=
"#control-sidebar-settings-tab"
data-toggle=
"tab"
><i
class=
"fa fa-shopping-cart"
></i></a></li>
<li
id=
"globe"
><a
href=
"#control-sidebar-home-tab"
data-toggle=
"tab"
><i
class=
"fa fa-globe"
></i></a></li>
<li
id=
"cart"
><a
href=
"#control-sidebar-settings-tab"
data-toggle=
"tab"
><i
class=
"fa fa-shopping-cart"
></i></a></li>
</ul>
<!-- Tab panes -->
<div
class=
"tab-content"
>
<!-- Home tab content -->
<div
class=
"tab-pane"
id=
"control-sidebar-home-tab"
>
<form
id=
'product-to-cart-form'
role=
"form"
method=
"post"
>
{% csrf_token %}
<div
class=
"container"
>
<div
class=
"sidebar-title"
>
<h3><b>
Products
</b></h3>
</div>
<div
class=
"sidebar-button"
>
<button
type=
"submit"
name=
"search"
id=
"add-cart"
class=
"btn btn-primary"
>
Add to cart
</button>
</div>
<!-- Home tab content -->
<div
class=
"tab-pane"
id=
"control-sidebar-home-tab"
>
<form
id=
'product-to-cart-form'
role=
"form"
method=
"post"
>
{% csrf_token %}
<div
class=
"container"
>
<div
class=
"sidebar-title"
>
<h3><b>
Products
</b></h3>
</div>
<!-- this ul element is filled with data -->
<ul
id=
"product-list-globe"
class=
"control-sidebar-menu"
>
{#
<li
id=
"4569852"
class=
"hover-me"
>
#}
{#
<a
href=
"javascript:void(0)"
>
#}
{#
<i
class=
"menu-icon glyphicon glyphicon-bookmark bg-red"
></i>
#}
{#
<div
class=
"menu-info"
>
#}
{#
<h4
class=
"control-sidebar-subheading"
>
#}
{# S2MSI1C_15QZ#}
{#
</h4>
#}
{#
<p>
2018-05-15T16:18:29.027
</p>
#}
{#
<input
type=
"checkbox"
value=
"4569852"
>
#}
{#
</div>
#}
{#
</a>
#}
{#
<div
class=
"info-product-box bg-geo"
style=
"top: 148px;"
>
#}
{#
<span
class=
"info-product-box-img"
>
#}
{#
<img
src=
"/static/images/sat_preview/sat_test.jpg"
>
#}
{#
</span>
#}
{#
<div
class=
"info-product-box-content"
>
#}
{#
<span
class=
"info-product-box-text"
>
S2B_MSIL1C_20180515T161829_N0206_R040_T15QZD_20180515T194031
</span>
#}
{#
<span
class=
"info-product-box-number"
>
686.51 MB
</span>
#}
{#
<div
class=
"progress"
>
#}
{#
<div
class=
"progress-bar"
style=
"width: 100%"
></div>
#}
{#
</div>
#}
{#
<span
class=
"progress-description"
>
Multi-Spectral Instrument
</span>
#}
{#
</div>
#}
{#
</div>
#}
{#
</li>
#}
</ul>
<!-- /.control-sidebar-menu -->
</form>
</div>
<!-- /.tab-pane -->
<!-- Stats tab content -->
<div
class=
"tab-pane"
id=
"control-sidebar-stats-tab"
>
Stats Tab Content
</div>
<!-- /.tab-pane -->
<!-- Settings tab content -->
<div
class=
"tab-pane"
id=
"control-sidebar-settings-tab"
>
<div
class=
"container"
>
<div
class=
"sidebar-title"
>
<h3><b>
My cart
</b></h3>
</div>
<div
class=
"sidebar-button"
>
<button
type=
"button"
name=
"search"
id=
"add-cart"
class=
"btn btn-primary"
>
Buy products
</button>
</div>
<div
class=
"sidebar-button"
>
<button
type=
"submit"
name=
"search"
id=
"add-cart"
class=
"btn btn-primary"
>
Add to cart
</button>
</div>
<!-- this ul element is filled with data -->
<ul
id=
"product-list-cart"
class=
"sidebar-menu"
data-widget=
"tree"
></ul>
</div>
<!-- this ul element is filled with data -->
<ul
id=
"product-list-globe"
class=
"control-sidebar-menu"
></ul>
<!-- /.control-sidebar-menu -->
</form>
</div>
<!-- /.tab-pane -->
<!-- Stats tab content -->
<div
class=
"tab-pane"
id=
"control-sidebar-stats-tab"
>
Stats Tab Content
</div>
<!-- /.tab-pane -->
<!-- Settings tab content -->
<div
class=
"tab-pane"
id=
"control-sidebar-settings-tab"
>
<div
class=
"container"
>
<div
class=
"sidebar-title"
>
<h3><b>
My cart
</b></h3>
</div>
<div
class=
"sidebar-button"
>
<button
type=
"button"
name=
"search"
id=
"add-cart"
class=
"btn btn-primary"
>
Buy products
</button>
</div>
</div>
<!-- this ul element is filled with data -->
<ul
id=
"product-list-cart"
class=
"sidebar-menu"
data-widget=
"tree"
></ul>
</div>
<!-- /.tab-pane -->
</div>
</aside>
<!-- /.control-sidebar -->
<!-- Add the sidebar's background. This div must be placed immediately after the control sidebar -->
<div
class=
"control-sidebar-bg"
></div>
</div>
<!-- ./wrapper -->
<!-- T E M P L A T E S -->
<!-- city list template -->
<template
id=
"city_list_template"
>
<li
id=
""
onclick=
"drawPolygon(this)"
class=
"pol"
>
<div
class=
"box box-warning box-solid"
>
<div
class=
"box-header with-border"
>
<span
class=
"pol-title"
></span>
</div>
<div
class=
"box-body"
>
<span
class=
"pol-body"
></span><br>
<div
class=
"pol-src"
></div>
</div>
</div>
</li>
</template>
<!-- city list template -->
<!-- product list template -->
<template
id=
"product_list_template"
>
<li
id=
""
>
<a
href=
"javascript:void(0)"
>
<i
class=
"menu-icon glyphicon glyphicon-bookmark bg-red"
></i>
<div
class=
"menu-info"
>
<h4
id=
""
class=
"control-sidebar-subheading"
onclick=
"drawApiResponse(this)"
></h4>
<p></p>
<input
type=
"checkbox"
name=
"product_selected"
value=
""
checked
>
</div>
<!-- /.tab-pane -->
</a>
<div
class=
"info-product-box bg-geo"
>
<span
class=
"info-product-box-img"
>
<img
src=
""
>
</span>
<div
class=
"info-product-box-content"
>
<span
class=
"info-product-box-text"
></span>
<span
class=
"info-product-box-number"
></span>
<div
class=
"progress"
>
<div
class=
"progress-bar"
style=
"width: 100%"
></div>
</div>
<span
class=
"progress-description"
></span>
</div>
</div>
</aside>
<!-- /.control-sidebar -->
<!-- Add the sidebar's background. This div must be placed immediately after the control sidebar -->
<div
class=
"control-sidebar-bg"
></div>
</div>
<!-- ./wrapper -->
</li>
</template>
<!-- product list template -->
<!-- product in cart templates -->
<template
id=
"product_cart_1"
>
<li
class=
"treeview"
>
<a
href=
"#"
>
<i
class=
"fa fa-cubes"
></i>
<span></span>
<span
class=
"pull-right-container"
>
<span
class=
"label label-primary pull-right"
></span>
</span>
</a>
<ul
class=
"treeview-menu sidebar-form"
>
<li>
<ul
id=
"product-list-cart-items"
class=
"control-sidebar-menu"
></ul>
</li>
</ul>
</li>
</template>
<!-- jQuery 3 -->
<script
src=
"{% static 'adminlte/bower_components/jquery/dist/jquery.min.js' %}"
></script>
<!-- jQuery UI 1.11.4 -->
<script
src=
"{% static 'adminlte/bower_components/jquery-ui/jquery-ui.min.js' %}"
></script>
<!-- Bootstrap 3.3.7 -->
<script
src=
"{% static 'adminlte/bower_components/bootstrap/dist/js/bootstrap.min.js' %}"
></script>
<!-- AdminLTE App -->
<script
src=
"{% static 'adminlte/dist/js/adminlte.min.js' %}"
></script>
<template
id=
"product_cart_2"
>
<li
id=
""
>
<a
href=
"javascript:void(0)"
>
<i
class=
"menu-icon glyphicon glyphicon-bookmark bg-red"
></i>
<div
class=
"menu-info"
>
<h4
id=
""
class=
"control-sidebar-subheading"
></h4>
<p></p>
</div>
</a>
<div
class=
"info-product-cart-box bg-geo"
>
<span
class=
"info-product-box-img"
>
<img
src=
""
>
</span>
<div
class=
"info-product-box-content"
>
<span
class=
"info-product-box-text"
></span>
<span
class=
"info-product-box-number"
></span>
<div
class=
"progress"
>
<div
class=
"progress-bar"
style=
"width: 100%"
></div>
</div>
<span
class=
"progress-description"
></span>
</div>
</div>
</li>
</template>
<!-- product in cart templates -->
<!-- T E M P L A T E S -->
<!-- jQuery 3 -->
<script
src=
"{% static 'adminlte/bower_components/jquery/dist/jquery.min.js' %}"
></script>
<!-- jQuery UI 1.11.4 -->
<script
src=
"{% static 'adminlte/bower_components/jquery-ui/jquery-ui.min.js' %}"
></script>
<!-- Bootstrap 3.3.7 -->
<script
src=
"{% static 'adminlte/bower_components/bootstrap/dist/js/bootstrap.min.js' %}"
></script>
<!-- AdminLTE App -->
<script
src=
"{% static 'adminlte/dist/js/adminlte.min.js' %}"
></script>
<!-- Data management file -->
<script
src=
"{% static 'js/dataRetrieval.js' %}"
type=
"text/javascript"
></script>
{% block scripts %}{% endblock %}
</body>
{% block scripts %}{% endblock %}
</body>
</html>
catalog/templates/map.html
View file @
b0133c01
{% extends "base_top.html" %}
{% load staticfiles %}
{% block headMedia %}
<link
rel=
"stylesheet"
href=
"{% static 'css/map.css'%}"
type=
"text/css"
>
<link
rel=
"stylesheet"
href=
"{% static 'css/body.css'%}"
type=
"text/css"
>
<link
rel=
"stylesheet"
href=
"https://openlayers.org/en/v4.6.4/css/ol.css"
type=
"text/css"
>
{% block headMedia %}
<link
rel=
"stylesheet"
href=
"{% static 'css/map.css'%}"
type=
"text/css"
>
<link
rel=
"stylesheet"
href=
"{% static 'css/body.css'%}"
type=
"text/css"
>
<link
rel=
"stylesheet"
href=
"https://openlayers.org/en/v4.6.4/css/ol.css"
type=
"text/css"
>
<script
src=
"https://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList,URL"
></script>
<script
src=
"https://openlayers.org/en/v4.6.4/build/ol.js"
></script>
<script
src=
"https://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList,URL"
></script>
<script
src=
"https://openlayers.org/en/v4.6.4/build/ol.js"
></script>
<script
src=
"{% static 'js/openLayers4.js'%}"
></script>
<script
src=
"{% static 'js/sidtMap.js'%}"
></script>
<script
src=
"{% static 'js/openLayers4.js'%}"
></script>
<script
src=
"{% static 'js/sidtMap.js'%}"
></script>
{% endblock %}
{% block messages %}
<a
href=
"#"
class=
"dropdown-toggle"
data-toggle=
"dropdown"
>
<i
class=
"fa fa-envelope-o"
></i>
<span
class=
"label label-success"
>
4
</span>
</a>
<ul
class=
"dropdown-menu"
>
<li
class=
"header"
>
You have 4 messages
</li>
<li>
<!-- inner menu: contains the actual data -->
<ul
class=
"menu"
>
<li>
<!-- start message -->
<a
href=
"#"
>
<div
class=
"pull-left"
>
<img
src=
"dist/img/user2-160x160.jpg"
class=
"img-circle"
alt=
"User Image"
>
</div>
<h4>
Support Team
<small><i
class=
"fa fa-clock-o"
></i>
5 mins
</small>
</h4>
<p>
Why not buy a new awesome theme?
</p>
</a>
</li>
<!-- end message -->
<li>
<a
href=
"#"
>
<div
class=
"pull-left"
>
<img
src=
"dist/img/user3-128x128.jpg"
class=
"img-circle"
alt=
"User Image"
>
</div>
<h4>
AdminLTE Design Team
<small><i
class=
"fa fa-clock-o"
></i>
2 hours
</small>
</h4>
<p>
Why not buy a new awesome theme?
</p>
</a>
</li>
</ul>
</li>
<li
class=
"footer"
><a
href=
"#"
>
See All Messages
</a></li>
</ul>
{% block messages %}
<a
href=
"#"
class=
"dropdown-toggle"
data-toggle=
"dropdown"
>
<i
class=
"fa fa-envelope-o"
></i>
<span
class=
"label label-success"
>
4
</span>
</a>
<ul
class=
"dropdown-menu"
>
<li
class=
"header"
>
You have 4 messages
</li>
<li>
<!-- inner menu: contains the actual data -->
<ul
class=
"menu"
>
<li>
<!-- start message -->
<a
href=
"#"
>
<div
class=
"pull-left"
>
<img
src=
"dist/img/user2-160x160.jpg"
class=
"img-circle"
alt=
"User Image"
>
</div>
<h4>
Support Team
<small><i
class=
"fa fa-clock-o"
></i>
5 mins
</small>
</h4>
<p>
Why not buy a new awesome theme?
</p>
</a>
</li>
<!-- end message -->
<li>
<a
href=
"#"
>
<div
class=
"pull-left"
>
<img
src=
"dist/img/user3-128x128.jpg"
class=
"img-circle"
alt=
"User Image"
>
</div>
<h4>
AdminLTE Design Team
<small><i
class=
"fa fa-clock-o"
></i>
2 hours
</small>
</h4>
<p>
Why not buy a new awesome theme?
</p>
</a>
</li>
</ul>
</li>
<li
class=
"footer"
><a
href=
"#"
>
See All Messages
</a></li>
</ul>
{% endblock %}
{% block notifications %}
<a
href=
"#"
class=
"dropdown-toggle"
data-toggle=
"dropdown"
>
<i
class=
"fa fa-bell-o"
></i>
<span
class=
"label label-warning"
>
10
</span>
</a>
<ul
class=
"dropdown-menu"
>
<li
class=
"header"
>
You have 10 notifications
</li>
<li>
<!-- inner menu: contains the actual data -->
<ul
class=
"menu"
>
<li>
<a
href=
"#"
>
<i
class=
"fa fa-users text-aqua"
></i>
5 new members joined today
</a>
</li>
<a
href=
"#"
class=
"dropdown-toggle"
data-toggle=
"dropdown"
>
<i
class=
"fa fa-bell-o"
></i>
<span
class=
"label label-warning"
>
10
</span>
</a>
<ul
class=
"dropdown-menu"
>
<li
class=
"header"
>
You have 10 notifications
</li>
<li>
<!-- inner menu: contains the actual data -->
<ul
class=
"menu"
>
<li>
<a
href=
"#"
>
<i
class=
"fa fa-users text-aqua"
></i>
5 new members joined today
</a>
</li>
</li>
</ul>
</li>
<li
class=
"footer"
><a
href=
"#"
>
View all
</a></li>
</ul>
</li>
</ul>
</li>
<li
class=
"footer"
><a
href=
"#"
>
View all
</a></li>
</ul>
{% endblock %}
{% block tasks %}
<a
href=
"#"
class=
"dropdown-toggle"
data-toggle=
"dropdown"
>
<i
class=
"fa fa-flag-o"
></i>
<span
class=
"label label-danger"
>
9
</span>
</a>
<ul
c
{%
load
static
%}
lass=
"dropdown-menu"
>
<li
class=
"header"
>
You have 9 tasks
</li>
<li>
<!-- inner menu: contains the actual data -->
<ul
class=
"menu"
>
<li>
<!-- Task item -->
<a
href=
"#"
>
<h3>
Design some buttons
<small
class=
"pull-right"
>
20%
</small>
</h3>
<div
class=
"progress xs"
>
<div
class=
"progress-bar progress-bar-aqua"
style=
"width: 20%"
role=
"progressbar"
aria-valuenow=
"20"
aria-valuemin=
"0"
aria-valuemax=
"100"
>
<span
class=
"sr-only"
>
20% Complete
</span>
</div>
</div>
</a>
</li>
<!-- end task item -->
</ul>
</li>
<li
class=
"footer"
>
<a
href=
"#"
>
View all tasks
</a>
</li>
</ul>
<a
href=
"#"
class=
"dropdown-toggle"
data-toggle=
"dropdown"
>
<i
class=
"fa fa-flag-o"
></i>
<span
class=
"label label-danger"
>
9
</span>
</a>
<ul
c
{%
load
static
%}
lass=
"dropdown-menu"
>
<li
class=
"header"
>
You have 9 tasks
</li>
<li>
<!-- inner menu: contains the actual data -->
<ul
class=
"menu"
>
<li>
<!-- Task item -->
<a
href=
"#"
>
<h3>
Design some buttons
<small
class=
"pull-right"
>
20%
</small>
</h3>
<div
class=
"progress xs"
>
<div
class=
"progress-bar progress-bar-aqua"
style=
"width: 20%"
role=
"progressbar"
aria-valuenow=
"20"
aria-valuemin=
"0"
aria-valuemax=
"100"
>
<span
class=
"sr-only"
>
20% Complete
</span>
</div>
</div>
</a>
</li>
<!-- end task item -->
</ul>
</li>
<li
class=
"footer"
>
<a
href=
"#"
>
View all tasks
</a>
</li>
</ul>
{% endblock %}
{% block sidebar %}
<div
class=
"form-group "
>
<div
class=
"form-group "
>
<!-- search form -->
<form
role=
"form"
action=
"#"
method=
"get"
class=
"sidebar-form"
>
<div
class=
"input-group"
>
<div
class=
"input-group"
>
<input
type=
"text"
id=
"ajax-input"
name=
"value"
class=
"form-control"
placeholder=
"Search region..."
>
<span
class=
"input-group-btn"
>
<button
type=
"button"
name=
"search"
id=
"search-btn"
class=
"btn btn-flat"
onclick=
"erase_input()"
>
<i
class=
"fa fa-eraser"
></i>
</button>
<button
type=
"button"
name=
"search"
id=
"search-btn"
class=
"btn btn-flat"
onclick=
"erase_input()"
>
<i
class=
"fa fa-eraser"
></i>
</button>
</span>
</div>
<div
class=
"row"
id=
"option-list"
>
<div
class=
"col-12"
>
<ul
id=
"polygon-list"
class=
"no-bullet"
></ul>
</div>
</div>
</div>
<div
class=
"row"
id=
"option-list"
>
<div
class=
"col-12"
>
<ul
id=
"polygon-list"
class=
"no-bullet"
></ul>
</div>
</div>
</form>
<!-- /search form -->
<!-- sidebar menu: : style can be found in sidebar.less -->
<!-- <form role="form" target="catalogFrame" action="{% url 'productList' %}" method="post"> -->
<form
id=
'product-form'
role=
"form"
method=
"post"
>
{% csrf_token %}
<ul
class=
"sidebar-menu"
data-widget=
"tree"
>
{% csrf_token %}
<ul
class=
"sidebar-menu"
data-widget=
"tree"
>
<li
class=
"treeview"
>
<a
href=
"#"
>
<i
class=
"fa fa-sync-alt"
></i>
<span>
Process
</span>
<span
class=
"pull-right-container"
>
<span
class=
"label label-primary pull-right"
></span>
</span>
</a>
<ul
class=
"treeview-menu sidebar-form"
>
<li
class=
"col-xs-12"
>
{{searchForm.platform}}
</li>
</ul>
<a
href=
"#"
>
<i
class=
"fa fa-sync-alt"
></i>
<span>
Process
</span>
<span
class=
"pull-right-container"
>
<span
class=
"label label-primary pull-right"
></span>
</span>
</a>
<ul
class=
"treeview-menu sidebar-form"
>
<li
class=
"col-xs-12"
>
{{searchForm.platform}}
</li>
</ul>
</li>
<li
class=
"treeview"
>
<a
href=
"#"
>
<i
class=
"fa fa-calendar-alt"
></i>
<span>
Date range
</span>
<span
class=
"pull-right-container"
>
<span
class=
"label label-primary pull-right"
></span>
</span>
</a>
<ul
class=
"treeview-menu sidebar-form"
>
<li>
{{searchForm.start}}
</li>
<li>
{{searchForm.end}}
</li>
</ul>
<a
href=
"#"
>
<i
class=
"fa fa-calendar-alt"
></i>
<span>
Date range
</span>
<span
class=
"pull-right-container"
>
<span
class=
"label label-primary pull-right"
></span>
</span>
</a>
<ul
class=
"treeview-menu sidebar-form"
>
<li>
{{searchForm.start}}
</li>
<li>
{{searchForm.end}}
</li>
</ul>
</li>
<li
class=
"treeview "
>
<a
href=
"#"
>
<i
class=
"fa fa-map"
></i>
<span>
Polygon
</span>
<span
class=
"pull-right-container"
>
<span
class=
"label label-primary pull-right"
></span>
</span>
</a>
<ul
class=
"treeview-menu sidebar-form"
>
<li>
{{searchForm.polygon}}
</li>
</ul>
<a
href=
"#"
>
<i
class=
"fa fa-map"
></i>
<span>
Polygon
</span>
<span
class=
"pull-right-container"
>
<span
class=
"label label-primary pull-right"
></span>
</span>
</a>
<ul
class=
"treeview-menu sidebar-form"
>
<li>
{{searchForm.polygon}}
</li>
</ul>
</li>
<li
class=
"treeview "
>
<a
href=
"#"
>
<i
class=
"fa fa-cloud"
></i>
<span>
Cloud percentage
</span>
<span
class=
"pull-right-container"
>
<span
class=
"label label-primary pull-right"
></span>
</span>
</a>
<ul
class=
"treeview-menu sidebar-form"
>
<li>
<input
class=
"form-control"
type=
"number"
name=
"cloudPercentage"
>
</li>
</ul>
<a
href=
"#"
>
<i
class=
"fa fa-cloud"
></i>
<span>
Cloud percentage
</span>
<span
class=
"pull-right-container"
>
<span
class=
"label label-primary pull-right"
></span>
</span>
</a>
<ul
class=
"treeview-menu sidebar-form"
>
<li>
<input
class=
"form-control"
type=
"number"
name=
"cloudPercentage"
>
</li>
</ul>
</li>
<li>
<a
href=
"#"
>
<span>
<button
type=
"submit"
name=
"search"
id=
"search-btn"
class=
"btn btn-primary"
><i
class=
"fa fa-search"
></i>
Search
</button>
<!-- <button name="search" id="search-btn" class="btn btn-primary">Search</button> -->
</span>
</a>
<a
href=
"#"
>
<span>
<button
type=
"submit"
name=
"search"
id=
"search-btn"
class=
"btn btn-primary"
><i
class=
"fa fa-search"
></i>
Search
</button>
<!-- <button name="search" id="search-btn" class="btn btn-primary">Search</button> -->
</span>
</a>
</li>
<li>
<!-- <iframe id="catalogFrame" name="catalogFrame">my frame</iframe> -->
<!-- <iframe id="catalogFrame" name="catalogFrame">my frame</iframe> -->
</li>
</ul>
</ul>
</form>
</div>
<!-- form-group-->
</div>
<!-- form-group-->
{% endblock %}
{% block user %}
<a
href=
"#"
class=
"dropdown-toggle"
data-toggle=
"dropdown"
>
<i
class=
"fa fa-user"
></i>
<!-- <img src="dist/img/user2-160x160.jpg" class="user-image" alt="User Image">-->
<!-- <span class="hidden-xs">Alexander Pierce</span>-->
</a>
<ul
class=
"dropdown-menu"
>
<!-- User image -->
<li
class=
"user-header"
>
<!-- <img src="dist/img/user2-160x160.jpg" class="img-circle" alt="User Image">-->
<p>
{{ user.get_full_name }}
<small>
{{ user.get_username }}
</small>
</p>
</li>
<!-- Menu Body -->
<!-- <li class="user-body">-->
<!-- </li>-->
<!-- Menu Footer-->
<li
class=
"user-footer"
>
<div
class=
"pull-left"
>
<a
href=
"#"
class=
"btn btn-default btn-flat"
>
Profile
</a>
</div>
<div
class=
"pull-right"
>
<a
href=
"{% url 'logout'%}?next={{request.path}}"
class=
"btn btn-default btn-flat"
>
Sign out
</a>
</div>
</li>
</ul>
<a
href=
"#"
class=
"dropdown-toggle"
data-toggle=
"dropdown"
>
<i
class=
"fa fa-user"
></i>
<!--<img src="dist/img/user2-160x160.jpg" class="user-image" alt="User Image">-->
<!--<span class="hidden-xs">Alexander Pierce</span>-->
</a>
<ul
class=
"dropdown-menu"
>
<!-- User image -->
<li
class=
"user-header"
>
<!--<img src="dist/img/user2-160x160.jpg" class="img-circle" alt="User Image">-->
<p>
{{ user.get_full_name }}
<small>
{{ user.get_username }}
</small>
</p>
</li>
<!-- Menu Body -->
<!--<li class="user-body">-->
<!--</li>-->
<!-- Menu Footer-->
<li
class=
"user-footer"
>
<div
class=
"pull-left"
>
<a
href=
"#"
class=
"btn btn-default btn-flat"
>
Profile
</a>
</div>
<div
class=
"pull-right"
>
<a
href=
"{% url 'logout'%}?next={{request.path}}"
class=
"btn btn-default btn-flat"
>
Sign out
</a>
</div>
</li>
</ul>
{% endblock %}
{% block content %}
<div
id=
"map"
class=
"map"
tabindex=
"0"
>
</div>
<div
id=
"map"
class=
"map"
tabindex=
"0"
>
</div>
<footer
class=
"my-footer"
>
<strong>
<a
href=
"http://www.centrogeo.org.mx/"
>
© 2018 Centro de Investigación en Ciencias de Información Geoespacial
</a>
</strong>
...
...
@@ -256,13 +242,14 @@
{% endblock %}
{% block scripts %}
<script>
//var osmap = new OpenStreetMapsClass("map", -99.145556,19.419444, 10);
var
osmap
=
new
sidtMap
(
"map"
,
-
89.63873079999999
,
21.0404457
,
7
);
osmap
.
geolocation
();
osmap
.
addInteraction
();
var
req_url
=
"{% url 'search-submit' %}"
;
// url for requesting polygon data
var
prod_req_url
=
"{% url 'productList' %}"
// url for requesting product data
var
img_req_url
=
"{% url 'img-rqst' %}"
// url for requestim preview image
</script>
<script>
//var osmap = new OpenStreetMapsClass("map", -99.145556,19.419444, 10);
var
osmap
=
new
sidtMap
(
"map"
,
-
89.63873079999999
,
21.0404457
,
7
);
osmap
.
geolocation
();
osmap
.
addInteraction
();
var
req_url
=
"{% url 'search-submit' %}"
;
// url for requesting polygon data
var
prod_req_url
=
"{% url 'productList' %}"
// url for requesting product data
var
img_req_url
=
"{% url 'img-rqst' %}"
// url for requesting preview image
</script>
{% endblock %}
catalog/views.py
View file @
b0133c01
# -*- coding: utf-8 -*-
from
__future__
import
unicode_literals
from
django.shortcuts
import
render
from
catalog.forms
import
ASFSearchForm
from
catalog.models
import
Polygon
from
django.http
import
HttpResponse
,
JsonResponse
,
HttpResponseRedirect
from
django.urls
import
reverse
from
django.views.generic.base
import
View
from
django.template
import
loader
from
django.template
import
loader
,
RequestContext
from
urllib
import
urlencode
import
requests
,
json
,
unicodedata
,
sys
import
base64
...
...
@@ -17,6 +16,7 @@ from geosentinel import APISentinel
sentinel
=
APISentinel
.
APISentinel
(
'emmhp'
,
'geoemm29'
)
# Create your views here.
#-------------------------------------------------------------------------------
def
login
(
request
):
...
...
@@ -24,9 +24,9 @@ def login(request):
View function for home page of site.
"""
# Render the HTML template index.html with the data in the context variable
return
render
(
request
,
'login.html'
,{})
#-------------------------------------------------------------------------------
def
map
(
request
):
"""
...
...
@@ -40,10 +40,8 @@ def map(request):
#-------------------------------------------------------------------------------
def
requestToImage
(
request
):
img_link
=
request
.
GET
[
'value'
]
# img_link = img_link[:img_link.find("/") + 2] + "emmhp:geoemm29@" + img_link[img_link.find("/") + 2:]
r
=
requests
.
get
(
img_link
,
auth
=
(
"emmhp"
,
"geoemm29"
),
stream
=
True
)
img_str
=
base64
.
b64encode
(
r
.
content
)
r
=
requests
.
get
(
img_link
,
auth
=
(
"emmhp"
,
"geoemm29"
),
stream
=
True
)
img_str
=
base64
.
b64encode
(
r
.
content
)
return
JsonResponse
({
'img'
:
img_str
})
...
...
@@ -64,7 +62,7 @@ def productList(request):
## ----- aqui llamada a api sentinel
## ----- antes consultar en DB si no se tiene ya el producto
date
=
(
""
.
join
(
init_date
.
split
(
'-'
)),
""
.
join
(
end_date
.
split
(
'-'
)))
date
=
(
""
.
join
(
init_date
.
split
(
'-'
)),
""
.
join
(
end_date
.
split
(
'-'
)))
params
=
{
"platformname"
:
"Sentinel-2"
}
# if cloud_percentage.strip():
...
...
@@ -73,8 +71,6 @@ def productList(request):
products
=
sentinel
.
getProducts
(
area
,
date
,
params
)
## simulation of 6-digit random id, this will be obtain from sentinel(?)
# random_id = ''.join(["%s" % random.randint(0, 9) for i in range(0, 6)])
## path from image preview storage location
img_preview
=
'/static/images/sat_preview/sat_test.jpg'
...
...
@@ -85,33 +81,20 @@ def productList(request):
img_link
=
img_link
[:
img_link
.
find
(
"/"
)
+
2
]
+
"emmhp:geoemm29@"
+
img_link
[
img_link
.
find
(
"/"
)
+
2
:]
catalog
.
append
({
'process'
:
process
,
'start_date'
:
init_date
,
'end_date'
:
end_date
,
'cloud_percentage'
:
cloud_percentage
,
'product'
:
products
[
p
],
'id'
:
products
[
p
][
'uuid'
],
'img'
:
img_preview
'process'
:
process
,
'start_date'
:
init_date
,
'end_date'
:
end_date
,
'cloud_percentage'
:
cloud_percentage
,
'product'
:
products
[
p
],
'id'
:
products
[
p
][
'uuid'
],
'img'
:
img_preview
})
return
JsonResponse
({
'catalog'
:
catalog
});
# r2 = dict(request.POST)
# r2.pop('csrfmiddlewaretoken', None)
# print("R2: ", r2.keys());
# url = 'https://api.daac.asf.alaska.edu/services/search/param?'+urlencode(r2, 'utf-8')+"&output=JSON"
# response = requests.get(url)
# json = response.json()
# return render(request, 'productList.html', {}) #"catalog":json[0]})
# return HttpResponse(json.dumps(item_data, ensure_ascii=True), content_type="application/json")
# return render(request, 'productList.html', {'item_data': item_data})
return
JsonResponse
({
'catalog'
:
catalog
});
#-------------------------------------------------------------------------------
class
SearchSubmitView
(
View
):
template
=
'map.html'
# template = 'search_submit.html'
def
strip_accents
(
self
,
s
):
return
''
.
join
((
c
for
c
in
unicodedata
.
normalize
(
'NFD'
,
s
)
if
unicodedata
.
category
(
c
)
!=
'Mn'
))
...
...
@@ -123,86 +106,29 @@ class SearchSubmitView(View):
searchValue
=
self
.
strip_accents
(
searchValue
)
.
lower
()
## A simple query for Polygon objects whose name is 'searchValue'
# polygonList = Polygon.objects.filter(name=searchValue)
polygonList
=
Polygon
.
objects
.
filter
(
name__startswith
=
searchValue
)
# data = []
list
=
[]
data_list
=
[]
if
len
(
polygonList
)
>
0
:
for
polygon
in
polygonList
:
polygonInfo
=
json
.
loads
(
polygon
.
json_info
)
# data.append({
# 'city' : polygon.name,
# 'state' : self.state_parser[polygonInfo['properties']['CVE_ENT']],
# 'geojson': polygon.json_info
# })
list
.
append
({
'id'
:
str
(
polygon
.
id
),
'city'
:
polygonInfo
[
'properties'
][
'NOMGEO'
],
'state'
:
polygonInfo
[
'properties'
][
'ENT_NAME'
],
'geojson'
:
polygonInfo
,
'wkt_polygon'
:
polygon
.
wkt_polygon
,
'description'
:
polygon
.
description
,
'source'
:
polygon
.
source
data_list
.
append
({
'id'
:
str
(
polygon
.
id
),
'city'
:
polygonInfo
[
'properties'
][
'NOMGEO'
],
'state'
:
polygonInfo
[
'properties'
][
'ENT_NAME'
],
'geojson'
:
polygonInfo
,
'wkt_polygon'
:
polygon
.
wkt_polygon
,
'description'
:
polygon
.
description
,
'source'
:
polygon
.
source
})
# context = {
# 'searchValue': searchValue,
# 'data': json.dumps(data, ensure_ascii=True)
# }
data
=
{
'polygonList'
:
list
'polygonList'
:
data_
list
}
# rendered_template = template.render(context, request)
# print("DATA:", data)
# return HttpResponse(rendered_template, content_type='application/json')
# return HttpResponse(json.dumps(data, ensure_ascii=True), content_type='application/json')
return
JsonResponse
(
data
)
#-------------------------------------------------------------------------------
# class SearchSubmitView(View):
# template = 'map.html'
# # template = 'search_submit.html'
# state_parser = {'31': "Yucatán"}
#
# def post(self, request):
# template = loader.get_template(self.template)
# searchValue = request.POST.get('value', '')
#
# ## A simple query for Polygon objects whose name is 'searchValue'
# polygonList = Polygon.objects.filter(name=searchValue)
#
# data = []
# if len(polygonList) > 0:
# for polygon in polygonList:
# polygonInfo = json.loads(polygon.json_info)
#
# # data.append({
# # 'city' : polygon.name,
# # 'state' : self.state_parser[polygonInfo['properties']['CVE_ENT']],
# # 'geojson': polygon.json_info
# # })
# data.append({
# 'city': polygonInfo['properties']['NOMGEO'],
# 'state': self.state_parser[polygonInfo['properties']['CVE_ENT']],
# 'geojson': polygonInfo
# })
#
# context = {
# 'searchValue': searchValue,
# 'data': data
# }
#
# # rendered_template = template.render(context, request)
# print("DATA:", data)
# # return render(request, self.template, context)
# return HttpResponseRedirect(reverse(map), json.dumps(data, ensure_ascii=True), content_type='application/json')
#-------------------------------------------------------------------------------
def
regionSearched
(
request
):
"""
...
...
@@ -210,7 +136,7 @@ def regionSearched(request):
"""
city_name
=
request
.
POST
[
'value'
]
cityList
=
Polygon
.
objects
.
filter
(
name
=
city_name
)
cityList
=
Polygon
.
objects
.
filter
(
name
=
city_name
)
if
len
(
cityList
)
>
0
:
print
cityList
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment