kopia lustrzana https://github.com/FacilMap/facilmap
Migrate toolbox to bootstrap
Candid Dauth
rodzic
a2c395e0a2
commit
3d0f9549af
|
|
@ -51,6 +51,12 @@ html,body {
|
|||
position: absolute;
|
||||
top: 10px;
|
||||
right: 10px;
|
||||
opacity: .5;
|
||||
transition: opacity .7s;
|
||||
}
|
||||
|
||||
.fp-toolbox:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
@media print {
|
||||
|
|
|
|||
|
|
@ -52,7 +52,7 @@
|
|||
scope.$evalAsync(); // $compile only replaces variables on next digest
|
||||
|
||||
function getMaxHeight() {
|
||||
var toolbox = $(".fp-toolbox", map.map.div);
|
||||
var toolbox = map.toolboxUi.div;
|
||||
return $(map.map.div).outerHeight() - parseInt(el.css("bottom")) - 25 - toolbox.position().top - toolbox.outerHeight(true);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -244,11 +244,11 @@
|
|||
};
|
||||
|
||||
map.getLayerInfo = function() {
|
||||
var ret = [ ];
|
||||
var ret = { base: [ ], overlay: [ ] };
|
||||
map.map.layers.forEach(function(it) {
|
||||
if(!it.displayInLayerSwitcher)
|
||||
return;
|
||||
ret.push({ isBaseLayer: it.isBaseLayer, visibility: it.getVisibility(), name: it.name, permalinkName: it.permalinkName });
|
||||
(it.isBaseLayer ? ret.base : ret.overlay).push({ visibility: it.getVisibility(), name: it.name, permalinkName: it.permalinkName });
|
||||
});
|
||||
return ret;
|
||||
};
|
||||
|
|
@ -384,8 +384,8 @@
|
|||
map.typesUi = fpMapTypes(map);
|
||||
map.padUi = fpMapPad(map);
|
||||
map.gpxUi = fpMapGpx(map);
|
||||
map.toolboxUi = fpMapToolbox(map);
|
||||
|
||||
fpMapToolbox(map);
|
||||
fpMapLegend(map);
|
||||
fpMapSearch(map);
|
||||
|
||||
|
|
|
|||
|
|
@ -1,23 +1,53 @@
|
|||
<ul class="fp-toolbox">
|
||||
<li ng-hide="readonly" ng-repeat="type in types" fp-variable-menu-item><a href="javascript:" ng-click="addObject(type)">Add {{type.name}}</a></li>
|
||||
<li><a href="javascript:">Views</a><ul>
|
||||
<li ng-repeat="(id, view) in views" fp-variable-menu-item><a href="javascript:" ng-click="displayView(view)">{{view.name}}</a></li>
|
||||
<li ng-hide="readonly"><a href="javascript:" ng-click="saveView()">Save current view</a></li>
|
||||
<li ng-hide="readonly"><a href="javascript:" ng-click="manageViews()">Manage views</a></li>
|
||||
</ul></li>
|
||||
<li><a href="javascript:">Layers</a><ul>
|
||||
<li ng-repeat="layer in layers" fp-variable-menu-item>
|
||||
<a href="javascript:" ng-click="setLayer(layer)">
|
||||
<input type="{{layer.isBaseLayer ? 'radio' : 'checkbox'}}" ng-checked="layer.visibility" />
|
||||
{{layer.name}}
|
||||
</a>
|
||||
</li>
|
||||
</ul></li>
|
||||
<li><a href="javascript:">Tools</a><ul>
|
||||
<!--<li ng-hide="readonly"><a href="javascript:" ng-click="openDialog('copy-pad-dialog')">Copy pad</a></li>-->
|
||||
<li><a href="javascript:" ng-click="exportGpx()">Export GPX</a></li>
|
||||
<li><a href="javascript:" ng-click="showTable()">View as table</a></li>
|
||||
<li ng-hide="readonly"><a href="javascript:" ng-click="editPadSettings()">Pad settings</a></li>
|
||||
<li ng-hide="readonly"><a href="javascript:" ng-click="editObjectTypes()">Object types</a></li>
|
||||
</ul></li>
|
||||
</ul>
|
||||
<nav class="navbar navbar-default fp-toolbox">
|
||||
<div class="container-fluid">
|
||||
<div class="navbar-header">
|
||||
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#fp-toolbox-content" aria-expanded="false">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="collapse navbar-collapse" id="fp-toolbox-content">
|
||||
<ul class="nav navbar-nav">
|
||||
<li role="presentation" uib-dropdown ng-if="!readonly">
|
||||
<a href="javascript:" id="toolbox-add-dropdown" uib-dropdown-toggle role="button">Add <span class="caret"></span></a>
|
||||
<ul uib-dropdown-menu aria-labelledby="toolbox-add-dropdown">
|
||||
<li ng-repeat="type in types"><a href="javascript:" ng-click="addObject(type)">{{type.name}}</a></li>
|
||||
<li role="separator" class="divider"></li>
|
||||
<li><a href="javascript:" ng-click="editObjectTypes()">Manage types</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li role="presentation" uib-dropdown>
|
||||
<a href="javascript:" id="toolbox-views-dropdown" uib-dropdown-toggle role="button">Saved views <span class="caret"></span></a>
|
||||
<ul uib-dropdown-menu aria-labelledby="toolbox-views-dropdown">
|
||||
<li ng-repeat="(id, view) in views"><a href="javascript:" ng-click="displayView(view)">{{view.name}}</a></li>
|
||||
<li role="separator" class="divider"></li>
|
||||
<li ng-if="!readonly"><a href="javascript:" ng-click="saveView()">Save current view</a></li>
|
||||
<li ng-if="!readonly"><a href="javascript:" ng-click="manageViews()">Manage views</a></li>
|
||||
</ul></li>
|
||||
<li role="presentation" uib-dropdown>
|
||||
<a href="javascript:" id="toolbox-layers-dropdown" uib-dropdown-toggle role="button">Map style <span class="caret"></span></a>
|
||||
<ul uib-dropdown-menu aria-labelledby="toolbox-layers-dropdown">
|
||||
<li ng-repeat="layer in layers.base" ng-class="{active: layer.visibility}">
|
||||
<a href="javascript:" ng-click="setLayer(layer)">{{layer.name}}</a>
|
||||
</li>
|
||||
<li role="separator" class="divider" ng-if="layers.base.length > 0 && layers.overlay.length > 0"></li>
|
||||
<li ng-repeat="layer in layers.overlay" ng-class="{active: layer.visibility}">
|
||||
<a href="javascript:" ng-click="setLayer(layer)">{{layer.name}}</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li role="presentation" uib-dropdown>
|
||||
<a href="javascript:" id="toolbox-tools-dropdown" uib-dropdown-toggle role="button">Tools <span class="caret"></span></a>
|
||||
<ul uib-dropdown-menu aria-labelledby="toolbox-layers-dropdown" class="dropdown-menu-right">
|
||||
<!--<li ng-if="!readonly"><a href="javascript:" ng-click="openDialog('copy-pad-dialog')">Copy pad</a></li>-->
|
||||
<li><a href="javascript:" ng-click="exportGpx()">Export GPX</a></li>
|
||||
<li><a href="javascript:" ng-click="showTable()">View as table</a></li>
|
||||
<li ng-if="!readonly"><a href="javascript:" ng-click="editPadSettings()">Settings</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
|
@ -1,19 +1,5 @@
|
|||
(function(fp, $, ng, undefined) {
|
||||
|
||||
fp.app.directive("fpVariableMenuItem", function() {
|
||||
return {
|
||||
restrict: 'A',
|
||||
link: function(scope, element, attrs) {
|
||||
setTimeout(function() {
|
||||
var toolbox = $(element).closest(".fp-toolbox");
|
||||
if(toolbox.hasClass("ui-menu"))
|
||||
toolbox.menu("destroy");
|
||||
toolbox.menu();
|
||||
}, 0);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
fp.app.factory("fpMapToolbox", function($compile, $templateCache, fpTable) {
|
||||
return function(map) {
|
||||
var scope = map.socket.$new();
|
||||
|
|
@ -46,8 +32,13 @@
|
|||
|
||||
scope.exportGpx = map.gpxUi.exportGpx.bind(map.gpxUi);
|
||||
|
||||
$compile($($templateCache.get("map/toolbox/toolbox.html")).appendTo(map.map.div))(scope);
|
||||
var ret = {
|
||||
div: $($templateCache.get("map/toolbox/toolbox.html"))
|
||||
};
|
||||
$compile(ret.div.insertBefore(map.map.div))(scope);
|
||||
scope.$evalAsync(); // $compile only replaces variables on next digest
|
||||
|
||||
return ret;
|
||||
}
|
||||
});
|
||||
|
||||
|
|
|
|||
|
|
@ -7,8 +7,8 @@ var underscore = require("underscore");
|
|||
var stream = require("stream");
|
||||
|
||||
var DEFAULT_TYPES = [
|
||||
{ name: "marker", type: "marker", fields: [ { name: "Description", type: "textarea" } ] },
|
||||
{ name: "line", type: "line", fields: [ { name: "Description", type: "textarea" } ] }
|
||||
{ name: "Marker", type: "marker", fields: [ { name: "Description", type: "textarea" } ] },
|
||||
{ name: "Line", type: "line", fields: [ { name: "Description", type: "textarea" } ] }
|
||||
];
|
||||
|
||||
function getPadData(padId, callback) {
|
||||
|
|
|
|||
Ładowanie…
Reference in New Issue