add user custom WMS tile/overlay servers; add all option editable; to be tested

merge-requests/2/head
Julien Veyssier 2017-06-13 00:45:54 +02:00
parent cf9f6a2ed3
commit 426b74b557
8 changed files with 353 additions and 58 deletions

View File

@ -40,6 +40,62 @@
<notnull>true</notnull>
<length>300</length>
</field>
<field>
<name>format</name>
<type>text</type>
<notnull>true</notnull>
<default>image/jpeg</default>
<length>300</length>
</field>
<field>
<name>layers</name>
<type>text</type>
<notnull>true</notnull>
<default></default>
<length>300</length>
</field>
<field>
<name>version</name>
<type>text</type>
<notnull>true</notnull>
<default>1.1.1</default>
<length>30</length>
</field>
<field>
<name>opacity</name>
<type>text</type>
<notnull>true</notnull>
<default>0.4</default>
<length>10</length>
</field>
<field>
<name>transparent</name>
<type>text</type>
<notnull>true</notnull>
<default>true</default>
<length>10</length>
</field>
<field>
<name>minzoom</name>
<type>integer</type>
<notnull>true</notnull>
<default>1</default>
<length>4</length>
</field>
<field>
<name>maxzoom</name>
<type>integer</type>
<notnull>true</notnull>
<default>18</default>
<length>4</length>
</field>
<field>
<name>attribution</name>
<type>text</type>
<notnull>true</notnull>
<default>???</default>
<length>300</length>
</field>
</declaration>
</table>
<table>

View File

@ -79,7 +79,7 @@ If you look for more powerfull GPX editors, take a look at :
<licence>AGPL</licence>
<summary>Simple GPX file editor</summary>
<author>Julien Veyssier</author>
<version>0.0.6</version>
<version>0.0.7</version>
<namespace>GpxEdit</namespace>
<documentation>
<user>https://gitlab.com/eneiluj/gpxedit-oc/wikis/userdoc</user>

View File

@ -140,6 +140,8 @@ class PageController extends Controller {
$tss = $this->getUserTileServers('tile');
$oss = $this->getUserTileServers('overlay');
$tssw = $this->getUserTileServers('tilewms');
$ossw = $this->getUserTileServers('overlaywms');
// extra symbols
$dataDirPath = $this->config->getSystemValue('datadirectory').'/gpxedit';
@ -157,8 +159,10 @@ class PageController extends Controller {
$params = [
'username'=>$this->userId,
'basetileservers'=>$baseTileServers,
'tileservers'=>$tss,
'overlayservers'=>$oss,
'usertileservers'=>$tss,
'useroverlayservers'=>$oss,
'usertileserverswms'=>$tssw,
'useroverlayserverswms'=>$ossw,
'extrasymbols'=>$extraSymbolList,
'gpxedit_version'=>$this->appVersion
];
@ -381,14 +385,17 @@ class PageController extends Controller {
private function getUserTileServers($type){
// custom tile servers management
$sqlts = 'SELECT servername, url FROM *PREFIX*gpxedit_tile_servers ';
$sqlts = 'SELECT servername, type, url, layers, version, format, opacity, transparent, minzoom, maxzoom, attribution FROM *PREFIX*gpxedit_tile_servers ';
$sqlts .= 'WHERE '.$this->dbdblquotes.'user'.$this->dbdblquotes.'='.$this->db_quote_escape_string($this->userId).' ';
$sqlts .= 'AND type='.$this->db_quote_escape_string($type).';';
$req = $this->dbconnection->prepare($sqlts);
$req->execute();
$tss = Array();
while ($row = $req->fetch()){
$tss[$row["servername"]] = $row["url"];
$tss[$row["servername"]] = Array();
foreach (Array('servername', 'type', 'url', 'layers', 'version', 'format', 'opacity', 'transparent', 'minzoom', 'maxzoom', 'attribution') as $field) {
$tss[$row['servername']][$field] = $row[$field];
}
}
$req->closeCursor();
return $tss;

View File

@ -138,8 +138,6 @@ $baseTileServers = [
'attribution' => '&copy, Tiles © <a href="http://www.openstreetmap.fr">OpenStreetMap France</a>',
'minzoom' => '1',
'maxzoom' => '20',
'transparent' => 'true',
'opacity' => '0.5'
),
];
?>

View File

@ -203,7 +203,9 @@ class UtilsController extends Controller {
* Add one tile server to the DB for current user
* @NoAdminRequired
*/
public function addTileServer($servername, $serverurl, $type) {
public function addTileServer($servername, $serverurl, $type,
$layers, $version, $tformat, $opacity, $transparent,
$minzoom, $maxzoom, $attribution) {
// first we check it does not already exist
$sqlts = 'SELECT servername FROM *PREFIX*gpxedit_tile_servers ';
$sqlts .= 'WHERE '.$this->dbdblquotes.'user'.$this->dbdblquotes.'=\''.$this->userId.'\' ';
@ -220,11 +222,19 @@ class UtilsController extends Controller {
// then if not, we insert it
if ($ts === null){
$sql = 'INSERT INTO *PREFIX*gpxedit_tile_servers';
$sql .= ' ('.$this->dbdblquotes.'user'.$this->dbdblquotes.', type, servername, url) ';
$sql .= ' ('.$this->dbdblquotes.'user'.$this->dbdblquotes.', type, servername, url, layers, version, format, opacity, transparent, minzoom, maxzoom, attribution) ';
$sql .= 'VALUES (\''.$this->userId.'\',';
$sql .= ''.$this->db_quote_escape_string($type).',';
$sql .= ''.$this->db_quote_escape_string($servername).',';
$sql .= ''.$this->db_quote_escape_string($serverurl).');';
$sql .= $this->db_quote_escape_string($type).',';
$sql .= $this->db_quote_escape_string($servername).',';
$sql .= $this->db_quote_escape_string($serverurl).',';
$sql .= $this->db_quote_escape_string($layers).',';
$sql .= $this->db_quote_escape_string($version).',';
$sql .= $this->db_quote_escape_string($tformat).',';
$sql .= $this->db_quote_escape_string($opacity).',';
$sql .= $this->db_quote_escape_string($transparent).',';
$sql .= $this->db_quote_escape_string($minzoom).',';
$sql .= $this->db_quote_escape_string($maxzoom).',';
$sql .= $this->db_quote_escape_string($attribution).');';
$req = $this->dbconnection->prepare($sql);
$req->execute();
$req->closeCursor();

View File

@ -317,10 +317,6 @@ h3 {
#clean_results ul{
list-style-type:disc;
}
#tileserveradd, #tileserveradd input,
#overlayserveradd, #overlayserveradd input{
width:100%;
}
#gpxtable thead i.bigfa{
width: 100%;
@ -876,3 +872,26 @@ div#ho button {
margin-top: 3px;
margin-bottom: 3px;
}
#overlayserveradd, #tileserveradd, #tileserverwmsadd, #overlayserverwmsadd {
display: grid;
grid-template-columns: 35% 65%;
}
#tileserveradd p,
#tileserverwmsadd p,
#overlayserverwmsadd p,
#overlayserveradd p{
margin-top: auto;
margin-bottom: auto;
}
#tileserveradd input[type=checkbox],
#tileserverwmsadd input[type=checkbox],
#overlayserverwmsadd input[type=checkbox],
#overlayserveradd input[type=checkbox]{
margin-right: auto;
}
#tileserveradd input[type=text],
#tileserverwmsadd input[type=text],
#overlayserverwmsadd input[type=text],
#overlayserveradd input[type=text]{
width:100%;
}

View File

@ -236,10 +236,25 @@
});
// add custom layers
$('#tileserverlist li').each(function() {
var sname = $(this).attr('name');
var sname = $(this).attr('servername');
var surl = $(this).attr('title');
var sminzoom = $(this).attr('minzoom') || '1';
var smaxzoom = $(this).attr('maxzoom') || '20';
var sattrib = $(this).attr('attribution') || '';
baseLayers[sname] = new L.TileLayer(surl,
{maxZoom: 18, attribution: 'custom tile server'});
{minZoom: sminzoom, maxZoom: smaxzoom, attribution: sattrib});
});
$('#tileserverwmslist li').each(function() {
var sname = $(this).attr('servername');
var surl = $(this).attr('title');
var sminzoom = $(this).attr('minzoom') || '1';
var smaxzoom = $(this).attr('maxzoom') || '20';
var slayers = $(this).attr('layers') || '';
var sversion = $(this).attr('version') || '1.1.1';
var sformat = $(this).attr('format') || 'image/png';
var sattrib = $(this).attr('attribution') || '';
baseLayers[sname] = new L.tilelayer.wms(surl,
{format: sformat, version: sversion, layers: slayers, minZoom: sminzoom, maxZoom: smaxzoom, attribution: sattrib});
});
gpxedit.baseLayers = baseLayers;
@ -252,7 +267,13 @@
var minz = parseInt($(this).attr('minzoom'));
var maxz = parseInt($(this).attr('maxzoom'));
var sattrib = $(this).attr('attribution');
var stransparent = ($(this).attr('transparent') === 'true');
var stransparent;
if ($(this).attr('transparent') !== '') {
stransparent = ($(this).attr('transparent') === 'true');
}
else {
stransparent = true;
}
var sopacity = $(this).attr('opacity');
if (sopacity !== '') {
sopacity = parseFloat(sopacity);
@ -267,7 +288,13 @@
var surl = $(this).attr('url');
var slayers = $(this).attr('layers') || '';
var sversion = $(this).attr('version') || '1.1.1';
var stransparent = ($(this).attr('transparent') === 'true');
var stransparent;
if ($(this).attr('transparent') !== '') {
stransparent = ($(this).attr('transparent') === 'true');
}
else {
stransparent = true;
}
var sformat = $(this).attr('format') || 'image/png';
var sopacity = $(this).attr('opacity');
if (sopacity !== '') {
@ -281,10 +308,52 @@
});
// add custom overlays
$('#overlayserverlist li').each(function() {
var sname = $(this).attr('name');
var sname = $(this).attr('servername');
var surl = $(this).attr('title');
var sminzoom = $(this).attr('minzoom') || '1';
var smaxzoom = $(this).attr('maxzoom') || '20';
var stransparent;
if ($(this).attr('transparent') !== '') {
stransparent = ($(this).attr('transparent') === 'true');
}
else {
stransparent = true;
}
var sopacity = $(this).attr('opacity');
if (sopacity !== '') {
sopacity = parseFloat(sopacity);
}
else {
sopacity = 0.4;
}
var sattrib = $(this).attr('attribution') || '';
baseOverlays[sname] = new L.TileLayer(surl,
{maxZoom: 18, attribution: 'custom overlay server'});
{minZoom: sminzoom, maxZoom: smaxzoom, transparent: stransparent, opcacity: sopacity, attribution: sattrib});
});
$('#overlayserverwmslist li').each(function() {
var sname = $(this).attr('servername');
var surl = $(this).attr('title');
var sminzoom = $(this).attr('minzoom') || '1';
var smaxzoom = $(this).attr('maxzoom') || '20';
var slayers = $(this).attr('layers') || '';
var sversion = $(this).attr('version') || '1.1.1';
var stransparent;
if ($(this).attr('transparent') !== '') {
stransparent = ($(this).attr('transparent') === 'true');
}
else {
stransparent = true;
}
var sformat = $(this).attr('format') || 'image/png';
var sopacity = $(this).attr('opacity');
if (sopacity !== '') {
sopacity = parseFloat(sopacity);
}
else {
sopacity = 0.4;
}
var sattrib = $(this).attr('attribution') || '';
baseOverlays[sname] = new L.tileLayer.wms(surl, {layers: slayers, version: sversion, transparent: stransparent, opacity: sopacity, format: sformat, attribution: sattrib, minZoom: sminzoom, maxZoom: smaxzoom});
});
gpxedit.overlayLayers = baseOverlays;
@ -1094,7 +1163,7 @@
}
function deleteTileServer(li, type) {
var sname = li.attr('name');
var sname = li.attr('servername');
var req = {
servername: sname,
type: type
@ -1137,12 +1206,19 @@
function addTileServer(type) {
var sname = $('#'+type+'servername').val();
var surl = $('#'+type+'serverurl').val();
var sminzoom = $('#'+type+'minzoom').val();
var smaxzoom = $('#'+type+'maxzoom').val();
var stransparent = $('#'+type+'transparent').val() || '';
var sopacity = $('#'+type+'opacity').val() || '';
var sformat = $('#'+type+'format').val() || '';
var sversion = $('#'+type+'version').val() || '';
var slayers = $('#'+type+'layers').val() || '';
if (sname === '' || surl === '') {
OC.dialogs.alert(t('gpxedit', 'Server name or server url should not be empty'),
t('gpxedit', 'Impossible to add tile server'));
return;
}
if ($('#'+type+'serverlist ul li[name="' + sname + '"]').length > 0) {
if ($('#'+type+'serverlist ul li[servername="' + sname + '"]').length > 0) {
OC.dialogs.alert(t('gpxedit', 'A server with this name already exists'),
t('gpxedit', 'Impossible to add tile server'));
return;
@ -1153,7 +1229,15 @@
var req = {
servername: sname,
serverurl: surl,
type: type
type: type,
layers: slayers,
version: sversion,
tformat: sformat,
opacity: sopacity,
transparent: stransparent,
minzoom: sminzoom,
maxzoom: smaxzoom,
attribution: ''
};
var url = OC.generateUrl('/apps/gpxedit/addTileServer');
$.ajax({
@ -1164,14 +1248,14 @@
}).done(function (response) {
if (response.done) {
$('#'+type+'serverlist ul').prepend(
'<li style="display:none;" name="' + escapeHTML(sname) +
'<li style="display:none;" servername="' + escapeHTML(sname) +
'" title="' + escapeHTML(surl) + '">' +
escapeHTML(sname) + ' <button>' +
'<i class="fa fa-trash" aria-hidden="true" style="color:red;"></i> ' +
t('gpxedit', 'Delete') +
'</button></li>'
);
$('#'+type+'serverlist ul li[name="' + sname + '"]').fadeIn('slow');
$('#'+type+'serverlist ul li[servername="' + sname + '"]').fadeIn('slow');
if (type === 'tile') {
// add tile server in leaflet control
@ -1568,6 +1652,19 @@
addTileServer('overlay');
});
$('body').on('click', '#tileserverwmslist button', function(e) {
deleteTileServer($(this).parent(), 'tilewms');
});
$('#addtileserverwms').click(function() {
addTileServer('tilewms');
});
$('body').on('click', '#overlayserverwmslist button', function(e) {
deleteTileServer($(this).parent(), 'overlaywms');
});
$('#addoverlayserverwms').click(function() {
addTileServer('overlaywms');
});
$('body').on('change', 'select[role=symbol]', function() {
$(this).removeClass($(this).attr('class'));
$(this).attr('style', '');

View File

@ -118,28 +118,35 @@ echo '</ul>'."\n";
<label for="approximateele"><?php p($l->t('Approximate new points elevations'));?></label>
<input type="checkbox" id="approximateele"></input>
</div>
<hr/>
<hr/><br/>
<h3 class="sectiontitle"><?php p($l->t('Custom tile servers')); ?></h3>
<div id="tileserveradd">
<?php p($l->t('Server name (for example \'my custom server\')')); ?> :
<input type="text" id="tileservername"><br/>
<?php p($l->t('Server url (\'http://tile.server.org/cycle/{z}/{x}/{y}.png\')')); ?> :
<input type="text" id="tileserverurl"><br/>
<p><?php p($l->t('Server name (for example \'my custom server\')')); ?> :</p>
<input type="text" id="tileservername"/>
<p><?php p($l->t('Server url (\'http://tile.server.org/cycle/{z}/{x}/{y}.png\')')); ?> :</p>
<input type="text" id="tileserverurl"/>
<p><?php p($l->t('Min zoom (1-20)')); ?> :</p>
<input type="text" id="tileminzoom" value="1"/>
<p><?php p($l->t('Max zoom (1-20)')); ?> :</p>
<input type="text" id="tilemaxzoom" value="18"/>
<button id="addtileserver"><i class="fa fa-plus-circle" aria-hidden="true" style="color:green;"></i> <?php p($l->t('Add')); ?></button>
</div>
<br/>
<div id="tileserverlist">
<h2><?php p($l->t('Your servers')); ?></h2>
<h3><?php p($l->t('Your tile servers')); ?></h3>
<ul class="disclist">
<?php
if (count($_['tileservers']) > 0){
foreach($_['tileservers'] as $name=>$url){
echo '<li name="';
p($name);
echo '" title="';
p($url);
echo '">';
p($name);
if (count($_['usertileservers']) > 0){
foreach($_['usertileservers'] as $ts){
echo '<li';
foreach (Array('servername', 'type', 'url', 'layers', 'version', 'format', 'opacity', 'transparent', 'minzoom', 'maxzoom', 'attribution') as $field) {
if (array_key_exists($field, $ts)) {
echo ' '.$field.'="';
p($ts[$field]);
echo '"';
}
}
echo '>';
p($ts['servername']);
echo '<button><i class="fa fa-trash" aria-hidden="true" style="color:red;"></i> ';
p($l->t('Delete'));
echo '</button></li>';
@ -148,28 +155,129 @@ if (count($_['tileservers']) > 0){
?>
</ul>
</div>
<hr/>
<h3 class="sectiontitle"><?php p($l->t('Custom overlay servers')); ?></h3>
<hr/><br/>
<h3 class="sectiontitle"><?php p($l->t('Custom overlay tile servers')); ?></h3>
<div id="overlayserveradd">
<?php p($l->t('Server name (for example \'my custom server\')')); ?> :
<input type="text" id="overlayservername"><br/>
<?php p($l->t('Server url (\'http://overlay.server.org/cycle/{z}/{x}/{y}.png\')')); ?> :
<input type="text" id="overlayserverurl"><br/>
<p><?php p($l->t('Server name (for example \'my custom server\')')); ?> :</p>
<input type="text" id="overlayservername">
<p><?php p($l->t('Server url (\'http://overlay.server.org/cycle/{z}/{x}/{y}.png\')')); ?> :</p>
<input type="text" id="overlayserverurl">
<p><?php p($l->t('Min zoom (1-20)')); ?> :</p>
<input type="text" id="overlayminzoom" value="1">
<p><?php p($l->t('Max zoom (1-20)')); ?> :</p>
<input type="text" id="overlaymaxzoom" value="18">
<label for="overlaytransparent"><?php p($l->t('Transparent')); ?> :</label>
<input type="checkbox" id="overlaytransparent" checked>
<p><?php p($l->t('Opacity (0.0-1.1)')); ?> :</p>
<input type="text" id="overlayopacity" value="0.4">
<button id="addoverlayserver"><i class="fa fa-plus-circle" aria-hidden="true" style="color:green;"></i> <?php p($l->t('Add')); ?></button>
</div>
<br/>
<div id="overlayserverlist">
<h2><?php p($l->t('Your servers')); ?></h2>
<h3><?php p($l->t('Your overlay tile servers')); ?></h3>
<ul class="disclist">
<?php
if (count($_['overlayservers']) > 0){
foreach($_['overlayservers'] as $name=>$url){
echo '<li name="';
p($name);
echo '" title="';
p($url);
echo '">';
p($name);
if (count($_['useroverlayservers']) > 0){
foreach($_['useroverlayservers'] as $ts){
echo '<li';
foreach (Array('servername', 'type', 'url', 'layers', 'version', 'format', 'opacity', 'transparent', 'minzoom', 'maxzoom', 'attribution') as $field) {
if (array_key_exists($field, $ts)) {
echo ' '.$field.'="';
p($ts[$field]);
echo '"';
}
}
echo '>';
p($ts['servername']);
echo '<button><i class="fa fa-trash" aria-hidden="true" style="color:red;"></i> ';
p($l->t('Delete'));
echo '</button></li>';
}
}
?>
</ul>
</div>
<hr/><br/>
<h3 class="sectiontitle"><?php p($l->t('Custom WMS tile servers')); ?></h3>
<div id="tileserverwmsadd">
<p><?php p($l->t('Server name (for example \'my custom server\')')); ?> :</p>
<input type="text" id="tilewmsservername">
<p><?php p($l->t('Server url (\'http://tile.server.org/cycle/{z}/{x}/{y}.png\')')); ?> :</p>
<input type="text" id="tilewmsserverurl">
<p><?php p($l->t('Min zoom (1-20)')); ?> :</p>
<input type="text" id="tilewmsminzoom" value="1">
<p><?php p($l->t('Max zoom (1-20)')); ?> :</p>
<input type="text" id="tilewmsmaxzoom" value="18">
<p><?php p($l->t('Format')); ?> :</p>
<input type="text" id="tilewmsformat" value="image/jpeg">
<p><?php p($l->t('WMS version')); ?> :</p>
<input type="text" id="tilewmsversion" value="1.1.1">
<p><?php p($l->t('Layers to display')); ?> :</p>
<input type="text" id="tilewmslayers" value="">
<button id="addtileserverwms"><i class="fa fa-plus-circle" aria-hidden="true" style="color:green;"></i> <?php p($l->t('Add')); ?></button>
</div>
<div id="tileserverwmslist">
<h3><?php p($l->t('Your WMS tile servers')); ?></h3>
<ul class="disclist">
<?php
if (count($_['usertileserverswms']) > 0){
foreach($_['usertileserverswms'] as $ts){
echo '<li';
foreach (Array('servername', 'type', 'url', 'layers', 'version', 'format', 'opacity', 'transparent', 'minzoom', 'maxzoom', 'attribution') as $field) {
if (array_key_exists($field, $ts)) {
echo ' '.$field.'="';
p($ts[$field]);
echo '"';
}
}
echo '>';
p($ts['servername']);
echo '<button><i class="fa fa-trash" aria-hidden="true" style="color:red;"></i> ';
p($l->t('Delete'));
echo '</button></li>';
}
}
?>
</ul>
</div>
<hr/><br/>
<h3 class="sectiontitle"><?php p($l->t('Custom WMS overlay servers')); ?></h3>
<div id="overlayserverwmsadd">
<p><?php p($l->t('Server name (for example \'my custom server\')')); ?> :</p>
<input type="text" id="overlaywmsservername">
<p><?php p($l->t('Server url (\'http://overlay.server.org/cycle/{z}/{x}/{y}.png\')')); ?> :</p>
<input type="text" id="overlaywmsserverurl">
<p><?php p($l->t('Min zoom (1-20)')); ?> :</p>
<input type="text" id="overlaywmsminzoom" value="1">
<p><?php p($l->t('Max zoom (1-20)')); ?> :</p>
<input type="text" id="overlaywmsmaxzoom" value="18">
<label for="overlaywmstransparent"><?php p($l->t('Transparent')); ?> :</label>
<input type="checkbox" id="overlaywmstransparent" checked>
<p><?php p($l->t('Opacity (0.0-1.1)')); ?> :</p>
<input type="text" id="overlaywmsopacity" value="0.4">
<p><?php p($l->t('Format')); ?> :</p>
<input type="text" id="overlaywmsformat" value="image/jpeg">
<p><?php p($l->t('WMS version')); ?> :</p>
<input type="text" id="overlaywmsversion" value="1.1.1">
<p><?php p($l->t('Layers to display')); ?> :</p>
<input type="text" id="overlaywmslayers" value="">
<button id="addoverlayserverwms"><i class="fa fa-plus-circle" aria-hidden="true" style="color:green;"></i> <?php p($l->t('Add')); ?></button>
</div>
<div id="overlayserverwmslist">
<h3><?php p($l->t('Your WMS overlay tile servers')); ?></h3>
<ul class="disclist">
<?php
if (count($_['useroverlayserverswms']) > 0){
foreach($_['useroverlayserverswms'] as $ts){
echo '<li';
foreach (Array('servername', 'type', 'url', 'layers', 'version', 'format', 'opacity', 'transparent', 'minzoom', 'maxzoom', 'attribution') as $field) {
if (array_key_exists($field, $ts)) {
echo ' '.$field.'="';
p($ts[$field]);
echo '"';
}
}
echo '>';
p($ts['servername']);
echo '<button><i class="fa fa-trash" aria-hidden="true" style="color:red;"></i> ';
p($l->t('Delete'));
echo '</button></li>';