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
Expand all
Show 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
This diff is collapsed.
Click to expand it.
catalog/templates/base_top.html
View file @
b0133c01
...
...
@@ -18,15 +18,12 @@
<!-- 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=
"wrapper"
>
<!-- <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"
>
...
...
@@ -114,33 +111,7 @@
</div>
</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>
<ul
id=
"product-list-globe"
class=
"control-sidebar-menu"
></ul>
<!-- /.control-sidebar-menu -->
</form>
</div>
...
...
@@ -169,8 +140,98 @@
<!-- /.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 -->
</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>
</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>
</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>
<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>
...
...
@@ -180,7 +241,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 %}
...
...
catalog/templates/map.html
View file @
b0133c01
{% extends "base_top.html" %}
{% load staticfiles %}
{% block headMedia %}
{% 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"
>
...
...
@@ -12,6 +12,7 @@
<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>
...
...
@@ -47,7 +48,6 @@
<p>
Why not buy a new awesome theme?
</p>
</a>
</li>
</ul>
</li>
<li
class=
"footer"
><a
href=
"#"
>
See All Messages
</a></li>
...
...
@@ -55,7 +55,6 @@
{% 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>
...
...
@@ -76,12 +75,9 @@
</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>
...
...
@@ -98,15 +94,12 @@
<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"
>
<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>
...
...
@@ -114,10 +107,10 @@
<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"
>
...
...
@@ -205,32 +198,28 @@
</li>
</ul>
</form>
</div>
<!-- form-group-->
</div>
<!-- form-group-->
{% endblock %}
{% block user %}
<a
href=
"#"
class=
"dropdown-toggle"
data-toggle=
"dropdown"
>
<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>-->
<!--
<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">-->
<!--<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>-->
<!--<li class="user-body">-->
<!--</li>-->
<!-- Menu Footer-->
<li
class=
"user-footer"
>
<div
class=
"pull-left"
>
...
...
@@ -241,14 +230,11 @@
</div>
</li>
</ul>
{% endblock %}
{% block content %}
<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>
...
...
@@ -261,8 +247,9 @@
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
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,8 +40,6 @@ 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
)
...
...
@@ -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'
...
...
@@ -88,30 +84,17 @@ def productList(request):
'process'
:
process
,
'start_date'
:
init_date
,
'end_date'
:
end_date
,
'cloud_percentage'
:
cloud_percentage
,
'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
):
"""
...
...
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