Skip to content

Instantly share code, notes, and snippets.

/nav.xsl

Created December 7, 2014 17:04
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save anonymous/3432742335a8fd3c600f to your computer and use it in GitHub Desktop.
Save anonymous/3432742335a8fd3c600f to your computer and use it in GitHub Desktop.
Download ZIP
Raw
nav.xsl
<?xml version="1.0" encoding="UTF-8"?>
<!--
Document : nav.xsl
Created on : 07 December 2014, 16:14
Author : Adam
Description:
Purpose of transformation follows.
-->
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
<xsl:output method="html"/>
<xsl:template match="/">
<html>
<head>
<title>Reviews</title>
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="https://code.jquery.com/color/jquery.color-2.1.2.min.js" type="text/javascript"></script>
<script>
var first_content_added = false;
$(function() {
$(".learn-more").on("click", function() {
$.getJSON("shazam.json", function(data) {
appendContentToFirstP(data.reviews[0].about.moreinfo);
});
});
});
function appendContentToFirstP(content) {
if (first_content_added) {
return;
}
var after_first_p = $('<p class="more-info" />');
after_first_p.text(content);
$(".first").append(after_first_p);
first_content_added = true;
}
//////////////////////////////////////////////////////////////////////////////////
var first_content_added2 = false;
$(function() {
$(".learn-more2").on("click", function() {
$.getJSON("viber.json", function(data) {
appendContentToFirstP2(data.reviews[0].about.moreinfo);
});
});
});
function appendContentToFirstP2(content) {
if (first_content_added2) {
return;
}
var after_first_p2 = $('<p class="more-info2" />');
after_first_p2.text(content);
$(".second").append(after_first_p2);
first_content_added2 = true;
}
////////////////////////////////////////////////////////////////////////////////
var first_content_added3 = false;
$(function() {
$(".learn-more3").on("click", function() {
$.getJSON("netflix.json", function(data) {
appendContentToFirstP3(data.reviews[0].about.moreinfo);
});
});
});
function appendContentToFirstP3(content) {
if (first_content_added3) {
return;
}
var after_first_p3 = $('<p class="more-info3" />');
after_first_p3.text(content);
$(".third").append(after_first_p3);
first_content_added3 = true;
}
///////////////////////////////////////////////////////////////////////////////
var first_content_added4 = false;
$(function() {
$(".learn-more4").on("click", function() {
$.getJSON("snapchat.json", function(data) {
appendContentToFirstP4(data.reviews[0].about.moreinfo);
});
});
});
function appendContentToFirstP4(content) {
if (first_content_added4) {
return;
}
var after_first_p4 = $('<p class="more-info4" />');
after_first_p4.text(content);
$(".fourth").append(after_first_p4);
first_content_added4 = true;
}
</script>
<style>
@import url(http://fonts.googleapis.com/css?family=Raleway:400,500,600,700,300);
@import url(css/bootstrap.min.css);
@import url(css/main.css);
@import url(css/font-awesome.min.css);
body{
background-color: #E8E8E8;
}
</style>
</head>
<body>
<!-- Static navbar -->
<nav class="navbar navbar-default" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Appy Reviews</a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="active">
<a href="index.html">Home</a>
</li>
<li>
<a href="#">Reviews</a>
</li>
<li>
<a href="contact">Contact</a>
</li>
</ul>
</div><!--/.nav-collapse -->
</div><!--/.container-fluid -->
</nav>
<xsl:apply-templates />
</body>
</html>
</xsl:template>
</xsl:stylesheet>
Raw
review.xsl
<?xml version="1.0"?>
<xsl:transform xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
<xsl:include href="top.xsl"/>
<!--
Document : Review.xsl
Created on : 13 November 2014, 16:14
Author : Adam
Description:
Purpose of transformation follows.
-->
<!-- TODO customize transformation rules
syntax recommendation http://www.w3.org/TR/xslt
-->
<xsl:template match="">
<div class="jumbotron">
<div class="container">
<h1>
<xsl:apply-templates select="//review[@id='1']//name"/>
</h1>
<p>About: <xsl:apply-templates select="//review[@id='1']//information"/></p>
<p class = "first"></p>
<p>Price: <xsl:apply-templates select="//review[@id='1']//price"/></p>
<p>Opinion: <xsl:apply-templates select="//review[@id='1']//opinion"/></p>
<p>Rating: <xsl:apply-templates select="//review[@id='1']//rating"/></p>
<p>
<a class="learn-more" role="button" >
Learn more about the app.
</a>
</p>
</div>
</div>
<div class="jumbotron">
<div class="container">
<h1>
<xsl:apply-templates select="//review[@id='2']//name"/>
</h1>
<p>About: <xsl:apply-templates select="//review[@id='2']//information"/></p>
<p class = "second"></p>
<p>Price: <xsl:apply-templates select="//review[@id='2']//price"/></p>
<p>Opinion: <xsl:apply-templates select="//review[@id='2']//opinion"/></p>
<p>Rating: <xsl:apply-templates select="//review[@id='2']//rating"/></p>
<p>
<a class="learn-more2" role="button">
Learn more about the app.</a>
</p>
</div>
</div>
<div class="jumbotron">
<div class="container">
<h1>
<xsl:apply-templates select="//review[@id='3']//name"/>
</h1>
<p>About: <xsl:apply-templates select="//review[@id='3']//information"/></p>
<p class = "third"></p>
<p>Price: <xsl:apply-templates select="//review[@id='3']//price"/></p>
<p>Opinion: <xsl:apply-templates select="//review[@id='3']//opinion"/></p>
<p>Rating: <xsl:apply-templates select="//review[@id='3']//rating"/></p>
<p>
<a class="learn-more3" role="button">
Learn more about the app.</a>
</p>
</div>
</div>
<div class="jumbotron">
<div class="container">
<h1>
<xsl:apply-templates select="//review[@id='4']//name"/>
</h1>
<p>About: <xsl:apply-templates select="//review[@id='4']//information"/></p>
<p class = "fourth"></p>
<p>Price: <xsl:apply-templates select="//review[@id='4']//price"/></p>
<p>Opinion: <xsl:apply-templates select="//review[@id='4']//opinion"/></p>
<p>Rating: <xsl:apply-templates select="//review[@id='4']//rating"/></p>
<p>
<a class="learn-more4" role="button">
Learn more about the app.</a>
</p>
</div>
</div>
</xsl:template>
</xsl:transform>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment