Skip to content

Commit

Permalink
[FEATURE] Added prettified JSON preview of the initialisation object
Browse files Browse the repository at this point in the history
  • Loading branch information
michaelsharman committed Nov 26, 2013
1 parent 26ca0f2 commit 7ddba1a
Show file tree
Hide file tree
Showing 9 changed files with 127 additions and 20 deletions.
1 change: 1 addition & 0 deletions src/includes/header.php
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@
<link rel="stylesheet" href="./static/vendor/reveal/reveal.css">
<link rel="stylesheet" href="./static/css/main.css">
<script src="./static/vendor/jquery/jquery-1.10.2.min.js"></script>
<script src="./static/js/main.js"></script>
</head>
<body>

Expand Down
43 changes: 43 additions & 0 deletions src/views/modals/initialisation-preview.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,43 @@
<!--
********************************************************************
*
* Setup a modal window to preview the API initialisation JSON
*
********************************************************************
-->
<div class="modal fade" id="initialisation-preview">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title">API Initialisation Preview</h4>
</div>
<div class="modal-body">
<pre><code id="preview-body"></code></pre>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>

<?php
if (!isset($signedRequest)) {
die('Make sure you call your PHP var $signedRequest for initialisation preview to work');
}
$previewObject = json_decode($signedRequest, true);
if (is_array($previewObject)) {
if (array_key_exists('security', $previewObject)) {
$previewBody = '{"security": ' . json_encode($previewObject['security']) . ', "request": ' . json_encode($previewObject['request']) . '}';
} else {
$previewBody = json_encode($previewObject);
}
} else {
$previewBody = $previewObject;
}
?>

<script>
$('#preview-body').html(library.json.prettyPrint(<?php echo $previewBody; ?>));
</script>
11 changes: 8 additions & 3 deletions www/authorapi.php
Original file line number Diff line number Diff line change
Expand Up @@ -33,12 +33,15 @@
<h1>Author API</h1>
<p>Learnosity's Author API allows searching and integration of Learnosity powered content into your content management system.<p>
<div class="row">
<div class="col-md-8">
<div class="col-md-10">
<h4><a href="http://docs.learnosity.com/authorapi/" class="text-muted">
<span class="glyphicon glyphicon-book"></span> Documentation
</a></h4>
<h4><a href="#" class="text-muted" data-toggle="modal" data-target="#initialisation-preview">
<span class="glyphicon glyphicon-share-alt"></span> Preview API Initialisation Object
</a></h4>
</div>
<div class="col-md-4"><p class='text-right'><a class="btn btn-primary btn-lg" href="questioneditorapi.php">Next <span class="glyphicon glyphicon-chevron-right"></span></a></p></div>
<div class="col-md-2"><p class='text-right'><a class="btn btn-primary btn-lg" href="questioneditorapi.php">Next <span class="glyphicon glyphicon-chevron-right"></span></a></p></div>
</div>
</div>

Expand Down Expand Up @@ -190,4 +193,6 @@ function signItemsRequest() {
}
</script>

<?php include_once '../src/includes/footer.php';
<?php
include_once '../src/views/modals/initialisation-preview.php';
include_once '../src/includes/footer.php';
16 changes: 9 additions & 7 deletions www/itemsapi_assess.php
Original file line number Diff line number Diff line change
Expand Up @@ -83,36 +83,38 @@
$request
);

$signedActivity = $RequestHelper->generateRequest();
$signedRequest = $RequestHelper->generateRequest();

?>

<div class="jumbotron">
<h1>Items API – Assess</h1>
<p>With the flick of a switch make the items into an assessment. Truly write once - use anywhere.<p>
<div class="row">
<div class="col-md-3">
<div class="col-md-10">
<h4><a href="http://docs.learnosity.com/itemsapi/" class="text-muted">
<span class="glyphicon glyphicon-book"></span> Documentation
</a></h4>
</div>
<div class="col-md-5">
<h4><a href="#" class="text-muted" data-toggle="modal" data-target="#settings">
<span class="glyphicon glyphicon-list-alt"></span> Customise API Settings
<span class="glyphicon glyphicon-list-alt"></span> Customise API Settings
</a></h4>
<h4><a href="#" class="text-muted" data-toggle="modal" data-target="#initialisation-preview">
<span class="glyphicon glyphicon-share-alt"></span> Preview API Initialisation Object
</a></h4>
</div>
<div class="col-md-4"><p class='text-right'><a class="btn btn-primary btn-lg" href="itemsapi_inline.php">Next <span class="glyphicon glyphicon-chevron-right"></span></a></p></div>
<div class="col-md-2"><p class='text-right'><a class="btn btn-primary btn-lg" href="itemsapi_inline.php">Next <span class="glyphicon glyphicon-chevron-right"></span></a></p></div>
</div>
</div>

<!-- Container for the items api to load into -->
<span id="learnosity_assess"></span>
<script src="http://items.learnosity.com"></script>
<script>
var activity = <?php echo $signedActivity; ?>;
var activity = <?php echo $signedRequest; ?>;
LearnosityItems.init(activity);
</script>

<?php
include_once '../src/views/modals/settings-items.php';
include_once '../src/views/modals/initialisation-preview.php';
include_once '../src/includes/footer.php';
15 changes: 10 additions & 5 deletions www/itemsapi_inline.php
Original file line number Diff line number Diff line change
Expand Up @@ -33,27 +33,30 @@
$request
);

$signedActivity = $RequestHelper->generateRequest();
$signedRequest = $RequestHelper->generateRequest();

?>

<!-- Container for the items api to load into -->
<script src="http://items.learnosity.com/"></script>
<script>
var activity = <?php echo $signedActivity; ?>;
var activity = <?php echo $signedRequest; ?>;
LearnosityItems.init(activity);
</script>

<div class="jumbotron">
<h1>Items API – Inline</h1>
<p>Display items from the Learnosity Item Bank in no time with the Items API. The Items API builds on the Questions API's power and makes it quicker to integrate.<p>
<div class="row">
<div class="col-md-8">
<div class="col-md-10">
<h4><a href="http://docs.learnosity.com/itemsapi/" class="text-muted">
<span class="glyphicon glyphicon-book"></span> Documentation
</a></h4>
<h4><a href="#" class="text-muted" data-toggle="modal" data-target="#initialisation-preview">
<span class="glyphicon glyphicon-share-alt"></span> Preview API Initialisation Object
</a></h4>
</div>
<div class="col-md-4"><p class='text-right'><a class="btn btn-primary btn-lg" href="assessapi.php">Next <span class="glyphicon glyphicon-chevron-right"></span></a></p></div>
<div class="col-md-2"><p class='text-right'><a class="btn btn-primary btn-lg" href="assessapi.php">Next <span class="glyphicon glyphicon-chevron-right"></span></a></p></div>
</div>
</div>

Expand All @@ -63,4 +66,6 @@
<span class="learnosity-submit-button"></span>
</p>

<?php include_once '../src/includes/footer.php';
<?php
include_once '../src/views/modals/initialisation-preview.php';
include_once '../src/includes/footer.php';
4 changes: 2 additions & 2 deletions www/questioneditorapi.php
Original file line number Diff line number Diff line change
Expand Up @@ -10,12 +10,12 @@
<h1>Question Editor API</h1>
<p>Our editor. Your item bank platform.<p>
<div class="row">
<div class="col-md-8">
<div class="col-md-10">
<h4><a href="http://docs.learnosity.com/questioneditorapi/" class="text-muted">
<span class="glyphicon glyphicon-book"></span> Documentation
</a></h4>
</div>
<div class="col-md-4"><p class='text-right'><a class="btn btn-primary btn-lg" href="questionsapi.php">Next <span class="glyphicon glyphicon-chevron-right"></span></a></p></div>
<div class="col-md-2"><p class='text-right'><a class="btn btn-primary btn-lg" href="questionsapi.php">Next <span class="glyphicon glyphicon-chevron-right"></span></a></p></div>
</div>
</div>

Expand Down
11 changes: 8 additions & 3 deletions www/reportsapi.php
Original file line number Diff line number Diff line change
Expand Up @@ -124,12 +124,15 @@
<h1>Reports API</h1>
<p>A cross domain embeddable service that allows content providers to easily render rich reports.<p>
<div class="row">
<div class="col-md-8">
<div class="col-md-10">
<h4><a href="http://docs.learnosity.com/reportsapi/" class="text-muted">
<span class="glyphicon glyphicon-book"></span> Documentation
</a></h4>
<h4><a href="#" class="text-muted" data-toggle="modal" data-target="#initialisation-preview">
<span class="glyphicon glyphicon-share-alt"></span> Preview API Initialisation Object
</a></h4>
</div>
<div class="col-md-4"> <p class='text-right'><a class="btn btn-primary btn-lg" href="ssoapi.php">Next <span class="glyphicon glyphicon-chevron-right"></span></a></p></div>
<div class="col-md-2"> <p class='text-right'><a class="btn btn-primary btn-lg" href="ssoapi.php">Next <span class="glyphicon glyphicon-chevron-right"></span></a></p></div>
</div>
</div>

Expand Down Expand Up @@ -228,4 +231,6 @@
});
</script>

<?php include_once '../src/includes/footer.php';
<?php
include_once '../src/views/modals/initialisation-preview.php';
include_once '../src/includes/footer.php';
19 changes: 19 additions & 0 deletions www/static/css/main.css
Original file line number Diff line number Diff line change
Expand Up @@ -125,3 +125,22 @@ td {
width:90%;
}
}

#initialisation-preview pre {
background-color: ghostwhite;
border: 1px solid silver;
padding: 10px 20px;
margin: 20px;
}

#initialisation-preview .json-key {
color: brown;
}

#initialisation-preview .json-value {
color: navy;
}

#initialisation-preview .json-string {
color: olive;
}
27 changes: 27 additions & 0 deletions www/static/js/main.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@

if (!library) {
var library = {};
}

library.json = {
replacer: function(match, pIndent, pKey, pVal, pEnd) {
var key = '<span class=json-key>';
var val = '<span class=json-value>';
var str = '<span class=json-string>';
var r = pIndent || '';
if (pKey) {
r = r + key + pKey.replace(/[": ]/g, '') + '</span>: ';
}
if (pVal) {
r = r + (pVal[0] == '"' ? str : val) + pVal + '</span>';
}
return r + (pEnd || '');
},
prettyPrint: function(obj) {
var jsonLine = /^( *)("[\w]+": )?("[^"]*"|[\w.+-]*)?([,[{])?$/mg;
return JSON.stringify(obj, null, 3)
.replace(/&/g, '&amp;').replace(/\\"/g, '&quot;')
.replace(/</g, '&lt;').replace(/>/g, '&gt;')
.replace(jsonLine, library.json.replacer);
}
};

0 comments on commit 7ddba1a

Please sign in to comment.