Make the document images responsive

Author: slacmshankar

docs/archiveviewer.html

@@ -49,12 +49,12 @@ <h3>Retrieving data using the ArchiveViewer</h3>
 To retrieve data, start the Archive Viewer and connect to the EPICS Archiver Appliance using a URL that looks like so <code>pbraw://archiver.slac.stanford.edu/retrieval</code>. 
 This URL is generated by replacing the string <i>http</i> with the string <i>pbraw</i> in the <code>data_retrieval_url</code> element of your <code>appliances.xml</code>.
 <figure>
-<img src="images/av_connect.png" alt="Connecting using pbraw"/>
+<img class="img-responsive" src="images/av_connect.png" alt="Connecting using pbraw"/>
 </figure>
 
 Once you have established a connection to the server, you should be able to use the Archive Viewer as before to retrieve and display data.
 <figure>
-<img src="images/av_plot.png" alt="Plotting"/>
+<img class="img-responsive" src="images/av_plot.png" alt="Plotting"/>
 </figure>
 
 The Archive Viewer is also used to retrieve data from the Channel Archiver; this has a concept of indexes that form part of the data retrieval request.

docs/csstudio.html

@@ -58,14 +58,14 @@ <h5>Configuring CS-Studio</h5>
 </ul>
 Example:
 <figure>
-<img src="images/csstudio_config.png" alt="Connecting using pbraw"/>
+<img class="img-responsive" src="images/csstudio_config.png" alt="Connecting using pbraw"/>
 </figure>
 
 Once the URL has been added to the preferences, the archiver appliance can be used in the databrowser like any other data source.
 Users can search the archive for PV’s, retrieve data and plot it, etc.
 
 <figure>
-<img src="images/csstudio_plot.jpg" alt="Plotting"/>
+<img class="img-responsive" src="images/csstudio_plot.jpg" alt="Plotting"/>
 </figure>
 
 </section>

docs/customization.html

@@ -79,7 +79,7 @@ <h3>Site specific builds</h3>
 <li>There is also a site specific properties file called <code>archappl.properties</code> that is discovered in a similar fashion. The properties in this file are used to control some of the other customizations of the archiver appliance.</li>
 </ol>
 <figure>
-<img src="images/archappl_siteid.png"/>
+<img class="img-responsive" src="images/archappl_siteid.png"/>
 <figcaption>Using the ARCHAPPL_SITEID to customize the contents of the generated WAR files.</figcaption>
 </figure>
 </li>

docs/details.html

@@ -134,7 +134,7 @@ <h3>Architecture</h3>
 <li>A NAS/SAN for the long term store - in this storage stage, we'd store data at a granularity of a year.</li>
 </ol> 
 <figure>
-<img src="images/applarch.png"/>
+<img class="img-responsive" src="images/applarch.png"/>
 <figcaption>Architecture of a single appliance</figcaption>
 </figure>
 <div>
@@ -146,11 +146,11 @@ <h3>Architecture</h3>
 The long term store is shown outside the appliance as an example of a commonly deployed configuration.
 There is no necessity for the appliances to share any storage; so both of these configurations are possible.
 <figure>
-<img src="images/clusterinto1lts.png" alt="Multiple appliances into one long term store"/>
+<img class="img-responsive" src="images/clusterinto1lts.png" alt="Multiple appliances into one long term store"/>
 <figcaption>Multiple appliances sending data into one long term store</figcaption> 
 </figure>
 <figure>
-<img src="images/clusterintodifflts.png" alt="Multiple appliances into different long term stores"/>
+<img class="img-responsive" src="images/clusterintodifflts.png" alt="Multiple appliances into different long term stores"/>
 <figcaption>Multiple appliances sending data into different long term stores</figcaption> 
 </figure>
 </div>
@@ -192,7 +192,7 @@ <h3>Clustering</h3>
 </p>
 
 <figure>
-<img src="images/proxyrequest.png"/>
+<img class="img-responsive" src="images/proxyrequest.png"/>
 <figcaption>Appliance 1 proxies data retrieval request for PV being archived by appliance 2.</figcaption>
 </figure> 
 In addition, users do not need to allocate PVs to appliances when requesting for new PVs be archived.
@@ -205,7 +205,7 @@ <h3>Scripting</h3>
 The web interface communicates with the server principally using JSON/HTTP. 
 The same web service calls are also available for use from external scripting tools like Python. 
 <figure>
-<img src="images/pythonscript.png"/>
+<img class="img-responsive" src="images/pythonscript.png"/>
 <figcaption>A sample python script that prints out all the PVs in the cluster of appliances.</figcaption>
 </figure> 
 Click <a href="api/mgmt_scriptables.html" target="_blank">here</a> for a list of business logic accesible thru scripting.
@@ -214,22 +214,22 @@ <h3>Scripting</h3>
 <section>
 <h3>Screenshots</h3>
 <figure>
-<img src="images/homepage.png"/>
+<img class="img-responsive" src="images/homepage.png"/>
 <figcaption>A screenshot of the home page.</figcaption>
 </figure> 
 
 <figure>
-<img src="images/reportspage.png"/>
+<img class="img-responsive" src="images/reportspage.png"/>
 <figcaption>We offer a wide variety of reports.</figcaption>
 </figure> 
 
 <figure>
-<img src="images/metricspage.png"/>
+<img class="img-responsive" src="images/metricspage.png"/>
 <figcaption>Metrics maintained by the appliances.</figcaption>
 </figure> 
 
 <figure>
-<img src="images/appliancespage.png"/>
+<img class="img-responsive" src="images/appliancespage.png"/>
 <figcaption>The appliances page offers a quick view of some JVM parameters.</figcaption>
 </figure> 
 

docs/developersguide.html

@@ -46,7 +46,7 @@ <h3>Prerequisites</h3>
 An installation of Tomcat is required to build successfully; this is located using the environment variable <code>TOMCAT_HOME</code>.
 Use something like
 <figure>
-<img src="images/tomcathome.png"/>
+<img class="img-responsive" src="images/tomcathome.png"/>
 </figure> 
 By default, Tomcat sets up a HTTP listener on port 8080.
 You can change this in the Tomcat server.xml to avoid collision with other folks running Tomcat.
@@ -76,14 +76,14 @@ <h3>Building</h3>
 If you have a Eclipse workspace called <code>workspace</code> and the EPICS archiver appliance code checked out into a folder called <code>epicsarchiverap</code>, 
 then the build script is run by calling ant from within <code>workspace/epicsarchiverap</code>.
 <figure>
-<img src="images/build_ant.png"/>
+<img class="img-responsive" src="images/build_ant.png"/>
 <figcaption>Using ant to initiate a build.</figcaption>
 </figure> 
 
 
 The default target builds the install package and the various wars and places them into the parent folder.
 <figure>
-<img src="images/built_wars.png"/>
+<img class="img-responsive" src="images/built_wars.png"/>
 </figure> 
 </section>
 

docs/installguide.html

@@ -120,7 +120,7 @@ <h3>Create an <code>appliances.xml</code></h3>
 The details of the file are outlined in the <a href="api/org/epics/archiverappliance/config/ConfigService.html#ARCHAPPL_APPLIANCES">ConfigService</a> javadoc.
 A sample  <code>appliances.xml</code> with two appliances looks like 
 <figure>
-<img src="images/appliancesxml.png"/>
+<img class="img-responsive" src="images/appliancesxml.png"/>
 <figcaption>The <code>appliances.xml</code> lists all the appliances in the cluster.</figcaption>
 </figure> 
 
@@ -168,7 +168,7 @@ <h3>Create an <code>appliances.xml</code></h3>
 In this case, we are pointing all clients to a single load-balancer on <code>archiver.slac.stanford.edu</code> on port 80.
 One can use the <a href="http://httpd.apache.org/docs/2.4/mod/mod_proxy_balancer.html">mod_proxy_balancer</a> of Apache to load-balance among any of the appliances in the cluster.
 <figure>
-<img src="images/ApacheasLB.png"/>
+<img class="img-responsive" src="images/ApacheasLB.png"/>
 <figcaption>Using Apache HTTP on <code>archiver</code> to load balance data retrieval between <code>appliance0</code> and <code>appliance1</code>.</figcaption>
 </figure> 
 <ul>
@@ -221,7 +221,7 @@ <h3>Installing Tomcat and setting up Apache Commons Daemon</h3>
 <li>By default, the connector port for the HTTP connector is set to 8080. 
 Change this to the port used by the <code>mgmt</code> webapp for this appliance, in this example, 17665.
 <figure>
-<img src="images/tomcathttpconnector.png"/>
+<img class="img-responsive" src="images/tomcathttpconnector.png"/>
 <figcaption>Change 8080 to the port used by the <code>mgmt</code> webapp for this appliance.</figcaption>
 </figure> 
 </li>
@@ -260,7 +260,7 @@ <h3>Installing Tomcat and setting up Apache Commons Daemon</h3>
 Once you have built this, copy the <code>jsvc</code> binary to the Tomcat <code>bin</code> folder for convenience.
 Note, it's not required that you use <code>Apache Commons Daemon</code> especially, if you are already using system monitoring and management tools like <a href="http://www.nagios.org/">Nagios</a> or <a href="http://www.hyperic.com/">Hyperic</a>.
 <figure>
-<img src="images/buildingjsvc.png"/>
+<img class="img-responsive" src="images/buildingjsvc.png"/>
 <figcaption>Building Apache Commons Daemon.</figcaption>
 </figure> 
 </li>
@@ -301,7 +301,7 @@ <h3>Installing MySQL</h3>
 In addition to the log4j.properties file, you should have a <code>mysql-connector-java-XXX.jar</code> as show here.
 
 <figure>
-<img src="images/tomcatlib1.png"/>
+<img class="img-responsive" src="images/tomcatlib1.png"/>
 <figcaption>Tomcat lib after copying over MySQL jar</figcaption>
 </figure> 
 </li>
@@ -340,7 +340,7 @@ <h3>Installing MySQL</h3>
 The only parameter that is fixed is the name of the pool and this needs to be <code>jdbc/archappl</code>.
 All other parameters are left to your discretion.
 <figure>
-<img src="images/connpool.png"/>
+<img class="img-responsive" src="images/connpool.png"/>
 </figure>
 <ul>
 <li>Note for Debian/Ubuntu users: The Tomcat packages shipped with Debian/Ubuntu do not include the Tomcat JDBC Connection Pool. Download it from the web and drop the <code>tomcat-jdbc.jar</code> file into <code>/usr/share/tomcat7/lib</code>.</li>
@@ -358,7 +358,7 @@ <h3>Setting up storage</h3>
 A useful way to do this is to create a folder called <code>/arch</code> and then create soft links in this folder to the actual physical location.
 For example,
 <figure>
-<img src="images/slasharch.png"/>
+<img class="img-responsive" src="images/slasharch.png"/>
 <figcaption><code>/arch</code> showing soft links to actual storage locations.</figcaption>
 </figure> 
 We then set environment variables in the startup script that point to the locations within <code>/arch</code>.
@@ -388,7 +388,7 @@ <h3>Create individual Tomcat containers for each of the web apps</h3>
 </ol>
 and then run the <code>deployMultipleTomcats.py</code> script passing in one argument that identifies the parent folder of the individual Tomcat containers.
 <figure>
-<img src="images/deployMultiple.png"/>
+<img class="img-responsive" src="images/deployMultiple.png"/>
 <figcaption>Using the <code>deployMultipleTomcats.py</code> script to create individual containers for each WAR file.</figcaption>
 </figure> 
 This is the last of the steps that are install specific; that is, you'll execute these only on installation of a new appliance.

docs/matlab.html

@@ -76,7 +76,7 @@ <h3>Retrieving data using Matlab</h3>
 
 Here's a screenshot of this sample code being executed in a Matlab environment.
 <figure>
-<img src="images/matlab1.png"/>
+<img class="img-responsive" src="images/matlab1.png"/>
 </figure> 
 </section>
 <div>

docs/pb_pbraw.html

@@ -48,7 +48,7 @@ <h3>The <code>.pb</code> file format</h3>
 PB files contain serialized PB messages; one per sample; a sample per line. 
 The first line in a PB file is a header (<code>PayloadInfo</code> PB message) that contains some basic information like the PV name, its DBR type and so on.
 <figure>
-<img src="images/pbfile.png"/>
+<img class="img-responsive" src="images/pbfile.png"/>
 </figure> 
 As serialized PB messages are binary data; after serialization, newline characters are escaped to maintain a "sample per line" constraint.
 <ol>
@@ -98,7 +98,7 @@ <h3>The PB/HTTP protocol</h3>
 There is no strict formula on how many chunks there will per data retrieval request; the server chunks data based on data source/partition/other parameters.
 Both <a href="https://github.com/slacmshankar/epicsarchiverap_pbrawclient/">pbrawclient</a> and <a href="https://github.com/epicsdeb/carchivetools">carchivetools</a> handle the multiple chunks in a seamless fashion and present the data to the caller as a single event stream.   
 <figure>
-<img src="images/pbhttp.png"/>
+<img class="img-responsive" src="images/pbhttp.png"/>
 </figure> 
 </section>
 

docs/quickstart.html

@@ -7,12 +7,6 @@
 <link type="text/css" href="docs.css" rel="Stylesheet" />	
 <title>EPICS Archiver Appliance -- Quickstart</title>
 
-<style type="text/css">
-img.imageshowingstep {
-  max-width: 75%; 
-}
-</style>
-
 </head>
 <body>
 <!-- Header starts here -->
@@ -65,20 +59,20 @@ <h3>Quickstart Guide</h3>
 Here are the steps to get started quickly.
 <ol>
 <li>Make sure you have a recent version of Sun Java 1.8 from Oracle by running <code>java -version</code>. You should see something like so
-<img class="imageshowingstep" src="images/javaversion.png"/>
+<img class="img-responsive" class="imageshowingstep" src="images/javaversion.png"/>
 </li>
 <li>Download the installation package to a Linux machine into a brand new folder. This should give you a tar.gz file like <code>archappl_vx.x.x.tar.gz</code>.</li>
 <li>Download a recent version of Tomcat 7.x. into the same folder. You should now have two files in this folder like so
-<img class="imageshowingstep" src="images/targzs.png"/>
+<img class="img-responsive" class="imageshowingstep" src="images/targzs.png"/>
 </li>
 <li>Untar the <code>archappl_vx.x.x.tar.gz</code>. This should untar into 4 WAR files and a bash script like so
-<img class="imageshowingstep" src="images/expandedtargz.png"/>
+<img class="img-responsive" class="imageshowingstep" src="images/expandedtargz.png"/>
 </li>
 <li>Run the script like so
-<img class="imageshowingstep" src="images/runqascript.png"/>
+<img class="img-responsive" class="imageshowingstep" src="images/runqascript.png"/>
 </li>
 <li>This should start the Tomcat process in the foreground. Once all the webapps have been initialized (it takes about 2-5 minutes), you should see a log message in the console <samp>All components in this appliance have started up. We should be ready to start accepting UI requests</samp> like so
-<img class="imageshowingstep" src="images/readyforUIrequests.png"/>
+<img class="img-responsive" class="imageshowingstep" src="images/readyforUIrequests.png"/>
 </li>
 <li>Open a browser to <code>http://&lt;&lt;<i>machinename</i>&gt;&gt;:17665/mgmt/ui/index.html</code> and you should see the home screen for your archiver appliance.</li>
 <li>If your EPICS environment variables are set up correctly, you should be able to start archiving PV's right away. 

docs/site_specific_content_changes.html

@@ -97,7 +97,7 @@ <h3>Making simple site-specific content changes</h3>
 </pre>
 to generate
 <figure>
-<img src="images/simple_static_content.png"/>
+<img class="img-responsive" src="images/simple_static_content.png"/>
 </figure>
 </div>