From 144f9a2ccd43db8beccf9a3bd792d2ddf9af5bff Mon Sep 17 00:00:00 2001
From: andy <bunce.andy@gmail.com>
Date: Thu, 14 May 2015 23:00:59 +0100
Subject: [PATCH] update browser libraries

---
 src/graphxq/expath-pkg.xml     |   7 +++
 src/graphxq/repo.xml           |  13 ++++
 src/graphxq/views/api.xml      |   4 +-
 src/graphxq/views/dotform.xq   |  10 ++--
 src/graphxq/views/dotmlform.xq |  10 ++--
 src/graphxq/views/layout.xq    | 105 +++++++++++++++++++--------------
 src/static/graphxq/app.css     |   4 +-
 7 files changed, 95 insertions(+), 58 deletions(-)
 create mode 100644 src/graphxq/expath-pkg.xml
 create mode 100644 src/graphxq/repo.xml

diff --git a/src/graphxq/expath-pkg.xml b/src/graphxq/expath-pkg.xml
new file mode 100644
index 0000000..d4a32d0
--- /dev/null
+++ b/src/graphxq/expath-pkg.xml
@@ -0,0 +1,7 @@
+<package abbrev="graphxq" name="https://github.com/apb2006/graphxq"
+	version="0.1" spec="1.0" xmlns="http://expath.org/ns/pkg">
+	<title>Graphxq</title>
+	<dependency name="twitter-bootstrap" version="3.3.1" />
+	<dependency name="jquery" version="2.0.2" />
+	<dependency name="ace" version="1.1.8" />
+</package>
\ No newline at end of file
diff --git a/src/graphxq/repo.xml b/src/graphxq/repo.xml
new file mode 100644
index 0000000..cf43ae5
--- /dev/null
+++ b/src/graphxq/repo.xml
@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<meta xmlns="http://basex.org/xquery/repo">
+    <description>Restxq interface for Graphviz for BaseX 8.0.</description>
+    <author>Andy Bunce</author>
+    <website>https://github.com/apb2006/graphxq</website>
+    <status>alpha</status>
+    <license>Apache 2</license>
+    <copyright>true</copyright>
+    <type>application</type>
+    <target>graphxq</target>
+    <prepare></prepare>
+    <finish/>
+</meta>
diff --git a/src/graphxq/views/api.xml b/src/graphxq/views/api.xml
index 640824c..5ed2edb 100644
--- a/src/graphxq/views/api.xml
+++ b/src/graphxq/views/api.xml
@@ -9,7 +9,7 @@
     <p>Return SVG generated from dot syntax passed in the <code>data</code> parameter.</p>
     <h3>Syntax</h3>
     <p>
-        <code>restxq/graphxq/api/dot</code> <span class="label">application/x-www-form-urlencoded</span>
+        <code>/graphxq/api/dot</code> <span class="label">application/x-www-form-urlencoded</span>
     </p>
     <table class="table table-bordered">
         <thead>
@@ -40,7 +40,7 @@
     <p>Return SVG generated from dotML syntax passed in the <code>data</code> parameter.</p>
     <h3>Syntax</h3>
     <p>
-        <code>restxq/graphxq/api/dotml</code> <span class="label">application/x-www-form-urlencoded</span>
+        <code>/graphxq/api/dotml</code> <span class="label">application/x-www-form-urlencoded</span>
     </p>
     <table class="table table-bordered">
         <thead>
diff --git a/src/graphxq/views/dotform.xq b/src/graphxq/views/dotform.xq
index e0a4d0f..09ee76b 100644
--- a/src/graphxq/views/dotform.xq
+++ b/src/graphxq/views/dotform.xq
@@ -3,13 +3,13 @@ declare variable $toolbar external :="{tooolbar}";
 declare variable $dot external :="{dot}";
 declare variable $svgwidget external :="{svg}";
 
-<div class="row-fluid">		
+<div class="row">		
 
-	<div class="row-fluid" style="height:24px">
+	<div class="row" style="height:24px">
 		{$toolbar}
 	</div>
-	<div class="row-fluid">
-		<div class="span6  " id="leftPane">	
+	<div class="row">
+		<div class="col-md-6" id="leftPane">	
            <div id="dsrc" class="extend ace-container" >
             <div  id="acedata" class="ace " data-mode="dot" ></div>
             </div>
@@ -26,7 +26,7 @@ node[shape=circle,style=filled,fillcolor=lightblue]
 
 }}</textarea>	
 		</div>
-		<div class="span6" id="rightPane">
+		<div class="col-md-6" id="rightPane">
 			<div id="svgdiv" class="extend"
 				style="width:100%;height:30em;border: 1px solid #E3E3E3;min-height:10em;">{$svgwidget}</div>
              <div id="svgsrc" class="extend ace-container" style="display: none">
diff --git a/src/graphxq/views/dotmlform.xq b/src/graphxq/views/dotmlform.xq
index 9642bcc..038efbd 100644
--- a/src/graphxq/views/dotmlform.xq
+++ b/src/graphxq/views/dotmlform.xq
@@ -2,12 +2,12 @@ declare variable $toolbar external :="{tooolbar}";
 declare variable $dotml external :="{dotml}";
 declare variable $svgwidget external :="{svg}";
 
-<div class="row-fluid">		
-	<div class="row-fluid" style="height:24px">
+<div class="row">		
+	<div class="row" style="height:24px">
 		{$toolbar}
 	</div>
-	<div class="row-fluid">
-		<div class="span6" id="leftPane" style="position:relative;height:100%">
+	<div class="row">
+		<div class="col-md-6" id="leftPane" style="position:relative;height:100%">
          <div id="dsrc" class="extend ace-container" >
             <div  id="acedata" class="ace " data-mode="xml" ></div>
             </div>
@@ -21,7 +21,7 @@ declare variable $svgwidget external :="{svg}";
   &lt;node id="test"/&gt;
 &lt;/graph&gt;</textarea>   
 		</div>
-		<div class="span6" id="rightPane">
+		<div class="col-md-6" id="rightPane">
 			<div id="svgdiv" class="extend"
 				style="width:100%;height:30em;border: 1px solid #E3E3E3;min-height:10em;">{$svgwidget}</div>
 			<div id="svgsrc" class="extend ace-container" style="display: none">
diff --git a/src/graphxq/views/layout.xq b/src/graphxq/views/layout.xq
index 4ef7466..bf5c557 100644
--- a/src/graphxq/views/layout.xq
+++ b/src/graphxq/views/layout.xq
@@ -11,18 +11,15 @@ declare  variable $active-link external :=function($_){$_};
 		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
 		<meta name="description" content="graphviz tool" />
 		<meta name="author" content="andy bunce" />
-		<link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.2.2/css/bootstrap.css" rel="stylesheet"
-			type="text/css" />
-
-
-		<link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.2.2/css/bootstrap-responsive.min.css"
-			rel="stylesheet" type="text/css" />
+		<link
+            href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.1/css/bootstrap.min.css"
+            rel="stylesheet" type="text/css" />
 		
 		<!-- Le fav and touch icons -->
 		<link rel="shortcut icon" href="/static/graphxq/graphxq2.png" />
 
-		<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.8.1/jquery.min.js" type="text/javascript"></script>
-		<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.2.2/bootstrap.min.js" type="text/javascript"></script>
+		<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.0.2/jquery.min.js" type="text/javascript"></script>
+		<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.1/js/bootstrap.min.js" type="text/javascript"></script>
         <script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.1.8/ace.js" type="text/javascript" charset="utf-8"></script>
         <link href="/static/graphxq/app.css" rel="stylesheet" type="text/css" />
         <script src="/static/graphxq/app.js" type="text/javascript"></script>
@@ -40,27 +37,33 @@ declare  variable $active-link external :=function($_){$_};
         ]]></script>
 	</head>
 	<body class="{$bodyclass}">
-		<div class="navbar navbar-fixed-top navbar-inverse" data-dropdown="dropdown">
-			<div class="navbar-inner">
-				<div class="container">
-					<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
-						<span class="icon-bar"></span>
-						<span class="icon-bar"></span>
-						<span class="icon-bar"></span>
-					</a>
-					<a href="about" class="brand" title="Version 0.5.0">
-						<img src="/static/graphxq/graphxq2.png" />
-						graphXQ
-					</a>
-					
-					 <div class="nav-collapse collapse">
-            <ul class="nav">               
-                <li class="{$active-link('dot')}">
-                    <a href="dot" rel="tooltip" title="Define a graph in Dot notation" ><i class="icon-edit"></i> Dot</a>
+	<nav class="navbar navbar-default">
+  <div class="container-fluid">
+    <!-- Brand and toggle get grouped for better mobile display -->
+    <div class="navbar-header">
+      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
+        <span class="sr-only">Toggle navigation</span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+      </button>
+     
+    </div>
+
+    <!-- Collect the nav links, forms, and other content for toggling -->
+    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
+      <ul class="nav navbar-nav">
+        <li> <a href="/graphxq" class="brand" title="Version 0.5.0">
+                        <img src="/static/graphxq/graphxq2.png" />
+                        GraphXQ
+                    </a>
+        </li> 
+         <li class="{$active-link('dot')}">
+                    <a href="dot" rel="tooltip" title="Define a graph in Dot notation" ><i class="glyphicon glyphicon-edit"></i> Dot</a>
                 </li>
 
                 <li class="{$active-link('dotml')}">
-                    <a href="dotml"><i class="icon-align-center"
+                    <a href="dotml"><i class="glyphicon glyphicon-align-center"
                     title="Define a graph using DotML XML"
                     ></i> DotML</a>
                 </li>
@@ -68,26 +71,42 @@ declare  variable $active-link external :=function($_){$_};
                <li class="{$active-link('library')}">
                 <a href="library"
                 title="Examples"
-                ><i class="icon-book"></i> Library</a>
+                ><i class="glyphicon glyphicon-book"></i> Library</a>
               </li> 
 
-              <li class="{$active-link('api')}">
-                  <a href="api"  title="About the API"
-                  ><i class="icon-wrench"></i> API</a>
-              </li>
-      
-            <li class="{$active-link('ace')}">
-                  <a href="ace"  title="Xquery editor (just for fun)"
-                  ><i class="icon-wrench"></i> Ace</a>
-              </li>                  
-            </ul>         
             
-          </div>
-        
-        
-				</div>
-			</div>
-		</div>
+      </ul>
+      
+      <form class="navbar-form navbar-left" role="search">
+        <div class="form-group">
+          <input type="text" class="form-control" placeholder="Search"/>
+        </div>
+        <button type="submit" class="btn btn-default">Submit</button>
+      </form>
+      
+      <ul class="nav navbar-nav navbar-right">
+          <li class="{$active-link('ace')}">
+                  <a href="ace"  title="Xquery editor (just for fun)"
+                  ><i class="glyphicon glyphicon-wrench"></i> Ace</a>
+              </li>    
+        <li class="dropdown">
+          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">About <span class="caret"></span></a>
+          <ul class="dropdown-menu" role="menu">
+            <li><a href="#">Action</a></li>
+            <li><a href="#">Another action</a></li>
+             <li class="{$active-link('api')}">
+                  <a href="api"  title="About the API"
+                  ><i class="glyphicon glyphicon-wrench"></i> API</a>
+              </li> 
+            <li class="divider"></li>
+            <li><a href="#about">About</a></li>
+          </ul>
+        </li>
+      </ul>
+    </div><!-- /.navbar-collapse -->
+  </div><!-- /.container-fluid -->
+</nav>
+
        <!-- Modal http://jsfiddle.net/matt_hwy1/hRq82/1/ -->
 <div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
   <div class="modal-header">
diff --git a/src/static/graphxq/app.css b/src/static/graphxq/app.css
index c5e6ee1..9eccdc6 100644
--- a/src/static/graphxq/app.css
+++ b/src/static/graphxq/app.css
@@ -1,7 +1,5 @@
 /* app.css */
-body {
-    padding-top: 50px;
-}
+
 @media (max-width: 979px) {
     body {
       padding-top: 0;