[Mapbender-commits] r9345 - trunk/mapbender/http/plugins

svn_mapbender at osgeo.org svn_mapbender at osgeo.org
Tue Jan 12 07:48:07 PST 2016


Author: armin11
Date: 2016-01-12 07:48:06 -0800 (Tue, 12 Jan 2016)
New Revision: 9345

Modified:
   trunk/mapbender/http/plugins/mb_downloadFeedClient.php
Log:
New version of INSPIRE Atom Feed Client that uses bootstrap

Modified: trunk/mapbender/http/plugins/mb_downloadFeedClient.php
===================================================================
--- trunk/mapbender/http/plugins/mb_downloadFeedClient.php	2016-01-12 15:47:37 UTC (rev 9344)
+++ trunk/mapbender/http/plugins/mb_downloadFeedClient.php	2016-01-12 15:48:06 UTC (rev 9345)
@@ -22,177 +22,201 @@
 <title><?php echo _mb("INSPIRE ATOM Feed Client");?></title> 
 <meta name="description" content="INSPIRE ATOM Feed Client" xml:lang="en" />
 <meta name="keywords" content="INSPIRE SDI GDI Download" xml:lang="en" />	
-<meta http-equiv="cache-control" content="no-cache">
-<meta http-equiv="pragma" content="no-cache">
-<meta http-equiv="expires" content="0">
+<meta http-equiv="cache-control" content="no-cache" />
+<meta http-equiv="pragma" content="no-cache" />
+<meta http-equiv="expires" content="0" />
 <meta http-equiv="content-language" content="en" />
 <meta http-equiv="content-style-type" content="text/css" />
-<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
-	<link rel="stylesheet" href="../extensions/OpenLayers-2.13.1/theme/default/style.css" type="text/css">
-	<link type="text/css" href="../extensions/jquery-ui-1.8.16.custom/css/ui-lightness/jquery-ui-1.8.16.custom.css" rel="Stylesheet" />
-	
-	<style type="text/css">
-	body,td, form, input, select{
-		font-size: 12px;
-		line-height: 16px;
-		font-family: "Verdana","Arial",sans-serif;
-		color: black;
-	}
-	.olControlPanPanel{margin-top:55px;}
-        select, textarea {
-            font: 0.9em Verdana, Arial, sans-serif;	
-        }
-	textarea {
-		position: absolute;
-		right: 0;
-		width: 300px;
-		height: auto;
-		resize: none;
-	}
-	#client {
-		<!--width: 850px;-->
-		height: 870px;
-	}
-	#input_feed_url {
-	}
-	#dataset_select {
-	}
-	#dataset_info {
-		position: relative;
-	}
-	#representation_select {
-	}
-	#representation_info {
-		position: relative;
-	}
-	#dataset_info {
-		width: 1000px;
-		height: 300px;
-	}
-        #mapframe_dataset_list {
-	    position: absolut;
-	    top: 0;
-	    left: 0;
-            width: 350px;
-            height: 250px;
-            border: 1px solid #ccc;
-        }
-	#dataset_information{
-	    position: absolute;
-	    left: 400;
-	    top: 0;
-	    width: 500px;
-            height: 270px;
-	    margin-left: 370px;
-	}
-	#mapframe {
-		
-	}
-        #mapframe_file_list {
-            width: 325px;
-            height: 225px;
-            border: 1px solid #ccc;
-        }
-	#section_list {
-		position: relative;
-		top: 0;
-		left: 0;
-		width: 325px;
-            	height: 225px;	
-	}
-        #input {
-            width: 512px;
-        }
-        #text {
-            font-size: 0.85em;
-            margin: 1em 0 1em 0;
-            width: 100%;
-            height: 10em;
-        }
-        p {
-            margin: 0;
-            padding: 0.75em 0 0.75em 0;
-        }
-    </style>
-    	<script src="../extensions/OpenLayers-2.13.1/OpenLayers.js"></script>
-	<!--<script src="http://openlayers.org/api/OpenLayers.js"></script>-->
-	<script src="../extensions/jquery-ui-1.8.16.custom/js/jquery-1.6.2.min.js"></script>
-	<script src="../extensions/jquery-ui-1.8.16.custom/js/jquery-ui-1.8.16.custom.min.js"></script>
-	<script src="../javascripts/mb_downloadFeedClient.php"></script>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+<link rel="stylesheet" href="../extensions/OpenLayers-2.13.1/theme/default/style.css" type="text/css" />
+<link type="text/css" href="../extensions/jquery-ui-1.8.16.custom/css/ui-lightness/jquery-ui-1.8.16.custom.css" rel="Stylesheet" />
+<link rel="stylesheet" href="../extensions/bootstrap-3.3.6-dist/css/bootstrap.min.css" type="text/css" />
+<link rel="stylesheet" href="../extensions/bootstrap-select-1.9.3/dist/css/bootstrap-select.css" type="text/css" />
+<style type="text/css">
+body,td, form, input, select{
+  font-size: 12px;
+  line-height: 16px;
+  font-family: "Verdana","Arial",sans-serif;
+  color: black;
+}
+.olControlPanPanel{margin-top:55px;}
+select, textarea {
+  font: 0.9em Verdana, Arial, sans-serif;	
+}
+
+#client {
+  <!--width: 850px;-->
+  <!--height: 870px;-->
+}
+
+.inspire_loading {
+    -webkit-animation:spin 4s linear infinite;
+    -moz-animation:spin 4s linear infinite;
+    animation:spin 4s linear infinite;
+
+}
+
+ at -moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
+ at -webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
+ at keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }
+
+#mapframe_dataset_list {
+  position: absolut;
+  top: 0;
+  left: 0;
+  width: 350px;
+  height: 250px;
+  border: 1px solid #ccc;
+}
+#mapframe {
+}
+
+#mapframe_file_list {
+  width: 325px;
+  height: 225px;
+  border: 1px solid #ccc;
+}
+#section_list {
+  position: relative;
+  top: 0;
+  left: 0;
+  width: 325px;
+  height: 225px;	
+}
+#input {
+  width: 512px;
+}
+#text {
+  font-size: 0.85em;
+  margin: 1em 0 1em 0;
+  width: 100%;
+  height: 10em;
+}
+
+</style>
+<!--<script src="../extensions/OpenLayers-2.13.1/OpenLayers.js"></script>-->
+<script src="../extensions/OpenLayers-2.13.1/OpenLayers.js"></script>
+<script src="../extensions/jquery-1.12.0.min.js"></script>
+<script src="../extensions/bootstrap-3.3.6-dist/js/bootstrap.min.js"></script>
+<script src="../extensions/bootstrap-select-1.9.3/dist/js/bootstrap-select.min.js"></script>
+<script src="../extensions/bootstrap-select-1.9.3/dist/js/i18n/defaults-de_DE.js"></script>
+<script src="../javascripts/mb_downloadFeedClient1.php"></script>
 </head>
 <body onload="init()">
+<!-- Navbar -->
+<nav class="navbar navbar-default">
+  <div class="container-fluid">
+    <!-- Titel und Schalter werden für eine bessere mobile Ansicht zusammengefasst -->
+    <div class="navbar-header">
+      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
+        <span class="sr-only">Navigation ein-/ausblenden</span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+      </button>
+      <a class="navbar-brand" href="#"><?php echo _mb("INSPIRE ATOM Feed Client");?></a>
+      <img alt="Titel" src="../img/inspire_tr_36.png">
+    </div>
 
-<fieldset id="client">
-	<legend><?php echo _mb("INSPIRE Download Service ATOM Feed Client");?><img src="../img/inspire_tr_36.png" /><!--<img class="help-dialog" title="<?php echo _mb("Help");?>" help="{text:'<?php echo _mb("Client to download INSPIRE data on an easy way.");?>'}" src="../img/questionmark.png" alt="" />--></legend>
-	<div id="input_feed_url">
-	<p>    
-		<form id="service_feed_form">
-		<label for="download_feed_url"><?php echo _mb("ATOM Service Feed url");?>:</label>
-		<input name="download_feed_url" id="download_feed_url" class="required" <?php if (isset($url)) {echo " value=\"".htmlspecialchars($url)."\"";} else { echo " value=\"\"";}?>/><img src="../img/gnome/process-stop.png" width="20px" onclick="$('#download_feed_url').val('');"/><input type="button" title="Get Feed" id="download_feed_button" value="<?php echo _mb("Get feed content");?>"/>
-		</form>
-	</p>
-	</div>
-	<div id="dataset_list">
-		<div id="dataset_select"></div>
-	</div>
-	<br>
-	<div id="dataset_info">
-	<!--<fieldset>
-		<legend><?php echo _mb("Select dataset");?><img class="help-dialog" title="<?php echo _mb("Help");?>" help="{text:'<?php echo _mb("Select single dataset either in list or on map");?>'}" src="../img/questionmark.png" alt="" /></legend>-->
-		<div id="mapframe_dataset_list"></div>
-		<div id="dataset_information">
-			<!--<fieldset>
-				<legend><?php echo _mb("Dataset Feed entries");?><img class="help-dialog" title="<?php echo _mb("Help");?>" help="{text:'<?php echo _mb("The fieldset shows the content of the INSPIRE Download Service service-feed document. It contains one or more links to different datasets.");?>'}" src="../img/questionmark.png" alt="" /></legend>-->
-				<p>
-					<label for="dataset_title"><?php echo _mb("Dataset title");?>:</label>
-					<textarea rows="1" readonly="readonly" name="dataset_title" id="dataset_title"></textarea>
-				</p>
-				<p>
-					<label for="dataset_abstract"><?php echo _mb("Dataset abstract");?>:</label>
-					<textarea rows="2" type="text" readonly="readonly" name="dataset_abstract" id="dataset_abstract"></textarea>
-				</p>	
-				<p>
-					<!--<label for="resource_identifier"><?php echo _mb("Resource identifier");?>:</label>-->
-					<div id="dataset_identifier"><?php echo _mb("Resource identifier");?>:<br></div>
-				</p>
-				<p>
-					<label for="dataset_rights"><?php echo _mb("Rights");?>:</label>
-					<textarea rows="10" readonly="readonly" name="dataset_rights" id="dataset_rights"></textarea>
-				</p>
-				<p>
-					<!--<label for="resource_identifier"><?php echo _mb("Resource identifier");?>:</label>-->
+    <!-- Alle Navigationslinks, Formulare und anderer Inhalt werden hier zusammengefasst und können dann ein- und ausgeblendet werden -->
+    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
+      <ul class="nav navbar-nav">   
+      </ul>
+      <ul class="nav navbar-nav navbar-right">
+        <li><a href="#"><?php if (!is_int(Mapbender::session()->get("mb_user_id"))) { echo _mb("Your logged in as ").Mapbender::session()->get("mb_user_name");} else { echo _mb("Your not logged in - please authenticate!");}?></a></li>
+      </ul>
+    </div><!-- /.navbar-collapse -->
+  </div><!-- /.container-fluid -->
+</nav>
+<!-- Modal Meldungen -->
+<!--<div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="title" id="parse_service_feed_modal">
+  <div class="modal-dialog modal-sm">
+    <div class="modal-content">
+      Load and parse ServiceFeed ...
+    </div>
+  </div>
+</div>
+<div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="title" id="parse_dataset_feed_modal">
+  <div class="modal-dialog modal-sm">
+    <div class="modal-content">
+      Load and parse DatasetFeed ...
+    </div>
+  </div>
+</div>-->
+<div id="loading_image_service" style="display: none;"><p><img class="inspire_loading" src="../img/inspire_tr_36.png" style="margin-left: auto; margin-right: auto;"/>Loading Service Feed ...</p></div>
+<!-- <button class="btn btn-primary" type="button" id="stop_parsing"><?php echo _mb("reset");?></button> -->
+<div id="loading_image_dataset" style="display: none;"><p><img class="inspire_loading" src="../img/inspire_tr_36.png" style="margin-left: auto; margin-right: auto;"/>Loading Dataset Feed ...</p></div>
 
-				</p>
-			<!--</fieldset>-->
-		</div>
-	<!--</fieldset>-->
+<!-- Tabs-Navs -->
+<ul class="nav nav-tabs" role="tablist" id="mytabs">
+  <li role="presentation" class="active"><a href="#input_feed_url" role="tab" data-toggle="tab"><?php echo _mb("Url to feed");?></a></li>
+  <li role="presentation"><a href="#dataset_info" role="tab" data-toggle="tab"><?php echo _mb("Available datasets");?></a></li>
+  <li role="presentation"><a href="#representations" role="tab" data-toggle="tab"><?php echo _mb("Access to representations");?></a></li>
+</ul>
+<!-- Tab-Inhalte -->
+<div class="tab-content" style="height:100%">
+  <div role="tabpanel" class="tab-pane active" id="input_feed_url">
+    <p>    
+      <form id="service_feed_form">
+        <label for="download_feed_url"><?php echo _mb("ATOM Service Feed url");?>:</label>
+        <input name="download_feed_url" id="download_feed_url" class="required" <?php if (isset($url)) {echo " value=\"".htmlspecialchars($url)."\"";} else { echo " value=\"\"";}?>/><img src="../img/gnome/process-stop.png" width="20px" onclick="$('#download_feed_url').val('');"/>
+<button class="btn btn-primary" type="button" id="download_feed_button">
+  <?php echo _mb("Get feed content");?> 
+</button>
+	<!--<input type="button" title="Get Feed" id="download_feed_button" value="<?php echo _mb("Get feed content");?>"/>-->
+      </form>
+    </p>
+  </div>
+  <div role="tabpanel" class="tab-pane" id="dataset_info">
+    <div id="dataset_list">
+      <div id="dataset_select"></div>
     </div>
+    <br>
+    <div id="mapframe_dataset_list"></div>
+    <br>
+    <div id="dataset_information">
+      <p>
+        <label for="dataset_title"><?php echo _mb("Dataset title");?>:</label>
+        <p readonly="readonly" name="dataset_title" id="dataset_title"></p>
+      </p>
+      <p>
+        <label for="dataset_abstract"><?php echo _mb("Dataset abstract");?>:</label>
+        <p readonly="readonly" name="dataset_abstract" id="dataset_abstract"></p>
+      </p>	
+      <p>
+        <!--<label for="resource_identifier"><?php echo _mb("Resource identifier");?>:</label>-->
+        <div id="dataset_identifier"><?php echo _mb("Resource identifier (linkage to metadata)");?>:<br></div>
+      </p>
+      <p>
+        <label for="dataset_rights"><?php echo _mb("Rights");?>:</label>
+        <p readonly="readonly" name="dataset_rights" id="dataset_rights"></p>
+      </p>
+      <p>
+        <!--<label for="resource_identifier"><?php echo _mb("Resource identifier");?>:</label>-->
+      </p>
+    </div>
+  </div>
+  <div role="tabpanel" class="tab-pane" id="representations">
     <div id="capabilities_hybrid"><?php echo _mb("Capabilities (WFS-hybrid)");?>:<br></div>
     <div id="representation_select">
-	<p>
-		<label for="representations"><?php echo _mb("Available representations");?>:</label>
-		<div id="dataset_representation_list"></div>
-	</p>
+      <p>
+        <label for="representations"><?php echo _mb("Available representations");?>:</label>
+        <div id="dataset_representation_list"></div>
+      </p>
     </div>
+    <br>
     <div id="representation_info">
-	<!--<fieldset>
-	<legend><?php echo _mb("Files");?><img class="help-dialog" title="<?php echo _mb("Help");?>" help="{text:'<?php echo _mb("Files which can be downloaded");?>'}" src="../img/questionmark.png" alt="" /></legend>-->
-	<!--<input id="multi_select" type="checkbox" disabled ><?php echo _mb("Select multiple tiles");?></input><br>-->
-	<!--<label for="mapframe_file_list"><?php echo _mb("Position of files (if available)");?>:</label>-->
-	<!--<input type="list" id="file_list"/>-->
-	<p><?php echo _mb("Select to download dataset");?>:</p>
-	<div id="mapframe_file_list"></div>
-	<br>
-	<!--<label for="section_list"><?php echo _mb("List of files");?>:</label>-->
-	
-	<div id="section_list"><br></div>
-	<!--<select id="section_file_list" multiple='multiple'>-->
-	<!--<input type="button" title="Download selected files" value="Download selection"/>-->
-	<!--</fieldset>	-->
-	<div id="dialog-modal" title="Download Link">
+      <p><?php echo _mb("Select to download dataset");?>:</p>
+      <div id="mapframe_file_list"></div>
+      <br>
+      <!--<label for="section_list"><?php echo _mb("List of files");?>:</label>-->
+      <div id="section_list"><br></div>
+      <!--<select id="section_file_list" multiple='multiple'>-->
+      <!--<input type="button" title="Download selected files" value="Download selection"/>-->
+      <!--</fieldset>	-->
+      <div id="dialog-modal" title="Download Link"></div>
+    </div>	
+  </div>
 </div>
-    </div>
-</fieldset>
-
 </body>
 </html>



More information about the Mapbender_commits mailing list