Skip to content

Commit

Permalink
set wmsimport as directive
Browse files Browse the repository at this point in the history
  • Loading branch information
fgravin committed Jun 18, 2014
1 parent e58d9dd commit 4bee2c2
Show file tree
Hide file tree
Showing 5 changed files with 49 additions and 205 deletions.
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<div class="wrapper">
<div class="wrapper" data-ng-controller="gnViewerController">

<div id="map"></div>
<div id="map" class="map" gn-map="" gn-map-map="map"></div>

<div class="search-container">
<input type="search" class="form-control" placeholder="Recherche">
Expand Down Expand Up @@ -86,46 +86,7 @@ <h5>Ajouter une couche</h5>
<button type="button" class="btn btn-default">Fichier KML</button>
</div>

<div class="layerTree collapsed">
<form role="form">
<div class="form-group">
<div class="input-group">
<span class="input-group-addon">
<span class="fa fa-globe"></span>
</span>
<input type="text" class="form-control" placeholder="Service URL">
</div>
</div>
</form>

<ul class="list-group">
<li class="list-group-item">
<label><input type="checkbox"> ainta nret auie</label></li>
<li class="list-group-item">
<label><input type="checkbox"> ainta nret auie</label></li>
<li class="list-group-item">
<label><input type="checkbox"> ainta nret auie</label></li>
<li class="list-group-item">
<label><input type="checkbox"> ainta nret auie</label>
<ul class="list-group">
<li class="list-group-item">
<label><input type="checkbox"> ainta nret auie</label></li>
<li class="list-group-item">
<label><input type="checkbox"> ainta nret auie</label></li>
<li class="list-group-item">
<label><input type="checkbox"> ainta nret auie</label></li>
<li class="list-group-item">
<label><input type="checkbox"> ainta nret auie</label></li>
</ul>
</li>
<li class="list-group-item">
<label><input type="checkbox"> ainta nret auie</label></li>
<li class="list-group-item">
<label><input type="checkbox"> ainta nret auie</label></li>
</ul>

</div>

<div gn-wms-import="" gn-wms-import-map="map"></div>
</div>


Expand Down Expand Up @@ -193,18 +154,6 @@ <h5>Impression</h5>
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script>
var map = new ol.Map({
layers: [
new ol.layer.Tile({
source: new ol.source.OSM()
})
],
target: 'map',
view: new ol.View2D({
center: [1, 0],
zoom: 2
})
});
$('.tools:not(.control-tools) .btn').click(function() {
if ($(this).hasClass('active')) {
$(this).removeClass('active');
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -24,11 +24,23 @@
scope: {
map: '=gnWmsImportMap'
},
link: function (scope, element, attrs) {
scope.gnOwsCapabilities = gnOwsCapabilities;
scope.selection = [];
controller: function($scope){
this.addLayer = function(getCapLayer) {

scope.params = {};
if (getCapLayer) {
var layer = getCapLayer;
return gnMap.addWmsToMap($scope.map, {
LAYERS: layer.name
}, {
url: $scope.url,
label: layer.title,
extent: gnOwsCapabilities.getLayerExtentFromGetCap($scope.map, layer)
}
);
}
};
},
link: function (scope, element, attrs) {

//TODO: remove
scope.servicesList = [
Expand All @@ -37,54 +49,11 @@
'http://www.ifremer.fr/services/wms/oceanographie_physique'
];
scope.load = function (url) {
scope.searchFilter = '';
scope.selection = [];
gnOwsCapabilities.getCapabilities(url)
.then(function (layers) {
scope.layers = layers;
});
};

scope.select = function (layer) {
if (scope.selection.indexOf(layer) < 0) {
scope.selection.push(layer);
}
else {
scope.selection.splice(scope.selection.indexOf(layer), 1);
}
};

scope.addLayer = function(getCapLayer, isPreview) {

if (getCapLayer) {

try {
var layer = getCapLayer;

return gnMap.addWmsToMap(scope.map,
{
LAYERS: layer.name
},
{
url: scope.params.url,
label: layer.title,
extent: gnOwsCapabilities.getLayerExtentFromGetCap(scope.map, layer)
}
);

} catch (e) {
scope.userMessage = $translate('add_wms_layer_failed') +
e.message;
return null;
}
}
};

scope.loadLayers = function(layers) {
angular.forEach(layers, function(layer) {
scope.addLayer(layer);
});
};
}
};
}]);
Expand All @@ -95,18 +64,18 @@
*
* @description
* Directive to manage a collection of nested layers from
* the capabilities document.
* the capabilities document. This directive works with
* gnCapTreeElt directive.
*/
module.directive('gnCapTreeCol', [
function () {
return {
restrict: "E",
restrict: 'E',
replace: true,
scope: {
collection: '=',
selection: '='
collection: '='
},
template: "<ul><gn-cap-tree-elt ng-repeat='member in collection' member='member' selection='selection'></gn-cap-tree-elt></ul>"
template: "<ul class='list-group'><gn-cap-tree-elt ng-repeat='member in collection' member='member'></gn-cap-tree-elt></ul>"
}
}]);

Expand All @@ -124,24 +93,20 @@
function ($compile) {
return {
restrict: "E",
require: '^gnWmsImport',
replace: true,
scope: {
member: '='
},
template: "<li data-ng-click='select(member)'>{{member.title}}</li>",
template: "<li class='list-group-item'><label><input type='checkbox' data-ng-model='inmap' data-ng-change='select()'>{{member.title}}</label></li>",
link: function (scope, element, attrs, controller) {
if (angular.isArray(scope.member.nestedLayers)) {
element.append("<gn-cap-tree-col collection='member.nestedLayers' selection='selection'></gn-cap-tree-col>");
$compile(element.contents())(scope)
element.append("<gn-cap-tree-col class='list-group' collection='member.nestedLayers'></gn-cap-tree-col>");
$compile(element.contents())(scope);
}
scope.select = function() {
controller.addLayer(scope.member);
}
scope.select = function (layer) {
if (scope.selection.indexOf(layer) < 0) {
scope.selection.push(layer);
}
else {
scope.selection.splice(scope.selection.indexOf(layer), 1);
}
};
}
}
}]);
Expand Down
Original file line number Diff line number Diff line change
@@ -1,91 +1,21 @@
<div class="modal-dialog gn-import-wms">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title" id="myModalLabel">WMS Import</h4>
</div>
<div class="modal-body">
<form class="form-horizontal" role="form">

<!-- Service input and dropdown -->
<div class="form-group">
<div class="col-sm-10">
<div class="input-group dropdown">
<div class="layerTree collapsed">
<form role="form">
<div class="form-group">
<div class="input-group dropdown">
<span class="input-group-addon">
<i class="fa fa-globe"/>
</span>
<input class="form-control" type="text" data-toggle="dropdown" data-ng-model="params.url"
data-ng-change="load(params.url)" placeholder="{{'serviceUrl' | translate}}"/>
<ul class="dropdown-menu" role="menu">
<li data-ng-repeat="srv in servicesList">
<a href="" data-ng-click="params.url = srv;load(srv)">
{{srv}}
</a>
</li>
</ul>
</div>
</div>
</div>
</form>

<!--Filter-->
<div class="input-group gn-import-wms-filter">
<span class="input-group-addon">
<i class="fa fa-search"/>
</span>
<input class="form-control input-sm" type="text" data-toggle="dropdown" data-ng-model="searchFilter"
placeholder="{{'search' | translate}}"/>
</div>

<div class="gn-import-wms-container">

<!-- Layer TREE result -->
<gn-cap-tree-col collection='layers.nestedLayers' selection="selection"></gn-cap-tree-col>


<!--Table header-->
<table class="table-header table table-condensed">
<thead>
<tr>
<th></th>
<th ng-click="reverse = !reverse">
<span class="pull-left" translate>title</span>
<i class="pull-right fa fa-sort-alpha-asc" ng-hide="reverse"></i>
<i class="pull-right fa fa-sort-alpha-desc" ng-show="reverse"></i>
</th>
</tr>
</thead>
</table>

<div class="gn-import-wms-content">
<table class="table table-striped table-hover table-condensed">
<tbody>
<tr ng-repeat="layer in layers | orderBy:'title':reverse | filter : searchFilter"
ng-class="{active : selection.indexOf(layer) >= 0}">
<td>
<div class="icon-zoom-in" ng-click="zoomOnLayerExtent(layer)"></div>
</td>
<td ng-mouseover="addLayerHovered(layer)"
ng-mouseleave="removeLayerHovered()"
ng-click="select(layer)" >
{{layer.title}}
</td>
</tr>
</tbody>
</table>
</div>
</div>

<!--
<div class="layers-list list-group">
<a href="#" ng-repeat="l in layers" class="list-group-item"
ng-class="{active : selection.indexOf(l) >= 0}" ng-click="select(l)">{{l.title}}</a>
<input class="form-control" type="text" data-toggle="dropdown" data-ng-model="url"
data-ng-change="load(url)" placeholder="{{'serviceUrl' | translate}}"/>
<ul class="dropdown-menu" role="menu">
<li data-ng-repeat="srv in servicesList">
<a href="" data-ng-click="params.url = srv;load(srv)">
{{srv}}
</a>
</li>
</ul>
</div>
-->
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary" data-ng-click="loadLayers(selection)">Load layers</button>
</div>
</div>
</form>
<gn-cap-tree-col collection='layers.nestedLayers' selection="selection"></gn-cap-tree-col>
</div>
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,7 @@ <h4 class="list-group-item-heading">{{s | translate}}</h4>
<div class="progress-bar" style="width: 100%"/>
</div>

<div class="panel panel-default" data-ng-hide="!loadReport && !loadTplReport"
<div class="panel panel-default" id="reportStatus" data-ng-hide="!loadReport && !loadTplReport"
data-ng-class="loadReport['@status'] == 'true' || loadTplReport['@status'] == 'true' ?
'panel-success' : 'panel-danger'">
<div class="panel-heading" data-translate="">loadReport</div>
Expand Down
4 changes: 2 additions & 2 deletions web-ui/src/main/resources/catalog/tmp/app.css
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,8 @@
* -------------------------- */
@font-face {
font-family: 'FontAwesome';
src: url('../lib/style/font-awesome/fonts/fontawesome-webfont.eot?v=4.1.0');
src: url('../lib/style/font-awesome/fonts/fontawesome-webfont.eot?#iefix&v=4.1.0') format('embedded-opentype'), url('../lib/style/font-awesome/fonts/fontawesome-webfont.woff?v=4.1.0') format('woff'), url('../lib/style/font-awesome/fonts/fontawesome-webfont.ttf?v=4.1.0') format('truetype'), url('../lib/style/font-awesome/fonts/fontawesome-webfont.svg?v=4.1.0#fontawesomeregular') format('svg');
src: url('../lib/style/font-awesome-4.0.3/fonts/fontawesome-webfont.eot?v=4.1.0');
src: url('../lib/style/font-awesome-4.0.3/fonts/fontawesome-webfont.eot?#iefix&v=4.1.0') format('embedded-opentype'), url('../lib/style/font-awesome-4.0.3/fonts/fontawesome-webfont.woff?v=4.1.0') format('woff'), url('../lib/style/font-awesome/fonts/fontawesome-webfont.ttf?v=4.1.0') format('truetype'), url('../lib/style/font-awesome/fonts/fontawesome-webfont.svg?v=4.1.0#fontawesomeregular') format('svg');
font-weight: normal;
font-style: normal;
}
Expand Down

0 comments on commit 4bee2c2

Please sign in to comment.