Fixed Overflow, Hidden Examples, and Changed HTTP Request Format

_config.yml

@@ -18,3 +18,6 @@ prolog: "prolog_scripts/"
 
 # Build settings
 markdown: kramdown
+
+# Online folder location of Prolog scripts
+onlinefolder: "https://raw.githubusercontent.com/COMS30106/prolog_scripts/7167c1fc5c259425d375c1ad1cfebef64d13cba1/"

_includes/head.html

@@ -5,6 +5,7 @@
   <meta name="description" content="{% if page.excerpt %}{{ page.excerpt | strip_html | strip_newlines | truncate: 160 }}{% else %}{{ site.description }}{% endif %}">
 
   <!-- SWISH -->
+  <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.1.0/css/all.css" integrity="sha384-lKuwvrZot6UHsBSfcMvOkWwlCMgc0TaWr+30HWe3a4ltaBwTZhyTEggF5tJv8tbt" crossorigin="anonymous">
   <link href="{{ site.baseurl }}/web/css/lpn.css" rel="stylesheet">
   <link href="{{ site.baseurl }}/web/css/jquery-ui.min.css" rel="stylesheet">
   <script src="{{ site.baseurl }}/web/js/jquery.min.js"></script>

_includes/new_swish_box.html

@@ -0,0 +1,5 @@
+<div class="extract newswish" id="{{ include.id }}">
+  <pre class="source newswish" id="{{ include.id }}" onlinefolder="{{ site.onlinefolder }}" swishurl="{{ site.swish }}">
+  	<div class="innerswishbox" id="{{ include.id }}"></div>
+  </pre>
+</div>

_includes/swish_box.html

@@ -1,5 +1,5 @@
 <div class="extract swish" id="{{ include.id }}">
-  <pre class="source swish" id="{{ include.id }}">
+  <pre class="source swish" id="{{ include.id }}" onlinefolder="{{ site.onlinefolder }}" swishurl="{{ site.swish }}">
 {% include_relative {{ include.id | prepend:site.prolog | append:".pl" }} %}
   </pre>
 </div>

index_overflowfix_examplesfix_iframefix_previewfix.html

@@ -0,0 +1,172 @@
+---
+layout: slides
+title: Interactive lab examples
+subtitle: Simply Logical
+---
+
+<section>
+  <section>
+    <h2>Fibonacci sequence</h2>
+    Demonstrates the use of accumulators, and the difference between interpreted and uninterpreted arithmetic expressions.
+  </section>
+  <section>
+    This implementation of the Fibonacci sequence is very inefficient -- the 30th number takes about 90 seconds!
+    {% include new_swish_box.html id="fib" %}
+  </section>
+  <section>
+    Variant of <code>fib/2</code> that returns an uninterpreted arithmetic expression showing the computation tree.
+    {% include new_swish_box.html id="fibt" %}
+  </section>
+  <section>
+  We can get an efficient version by solving a more general problem!
+    {% include new_swish_box.html id="fibn" %}
+  </section>
+</section>
+
+<section>
+  <section>
+    <h2>Second-order predicates</h2>
+    generate all solutions to a query.
+    {% include new_swish_box.html id="biglist" %}
+  </section>
+  <section>
+    Sorting, quick and dirty
+    {% include new_swish_box.html id="setof_sort" %}
+  </section>
+  <section>
+    Existential variables
+    {% include new_swish_box.html id="secondorder" %}
+  </section>
+  <section data-markdown>
+  <script type="text/template">
+     See also 
+     - [`library(aggregate)`](http://www.swi-prolog.org/pldoc/man?section=aggregate)
+     - [`library(apply)`](http://www.swi-prolog.org/pldoc/man?section=apply)
+     - e.g. `maplist/3` example on [`fibn/2`](/#/1/3)
+  </script>
+  </section>
+</section>
+
+<section>
+  <section data-markdown>
+    <script type="text/template">
+      ## Generate and test
+      This is a programming technique exploiting Prolog's non-determinism:
+      - a *generator* generates candidate solutions;
+      - a *tester* checks whether a candidate has the required properties.
+
+      It will be beneficial to make the generator as efficient as possible
+    </script>
+  </section>
+  <section>
+    An AI classic: N non-attacking queens
+    {% include new_swish_box.html id="nqueens" %}
+  </section>
+  <section>
+    Finding prime factors:
+    {% include new_swish_box.html id="factors" %}
+  </section>
+  <section>
+    How not to use generate and test:
+    {% include new_swish_box.html id="psort" %}
+  </section>
+</section>
+
+<section>
+  <section>
+    <h2>Meta-interpreters</h2>
+    {% include new_swish_box.html id="prove" %}
+  </section>
+  <section>
+    Keep conjunctive resolvent together
+    {% include new_swish_box.html id="prove_r" %}
+  </section>
+  <section>
+    Show (propositional) proof tree
+    {% include new_swish_box.html id="prove_p" %}
+  </section>
+</section>
+
+<section>
+  <section>
+    <h2>Depth-first search and variants</h2>
+    {% include new_swish_box.html id="search_df" %}
+  </section>
+  <section>
+    Depth-first search without agenda = transitive closure
+    {% include new_swish_box.html id="search_bt" %}
+  </section>
+  <section>
+    Backtracking DF search with depth bound
+    {% include new_swish_box.html id="search_d" %}
+  </section>
+  <section>
+    Iterative deepening
+    {% include new_swish_box.html id="search_id" %}
+  </section>
+  <section>
+    Don't use search if an analytic solution exists!
+    {% include new_swish_box.html id="hanoi" %}
+  </section>
+</section>
+
+<section>
+  <section>
+    <h2>Breadth-first search</h2>
+    {% include new_swish_box.html id="search_bf" %}
+  </section>
+  <section>
+    Breadth-first meta-interpreter
+    {% include new_swish_box.html id="prove_bf" %}
+  </section>
+  <section>
+    Meta-interpreter for full clausal logic
+    {% include new_swish_box.html id="refute_bf" %}
+  </section>
+  <section>
+    Forward chaining
+    {% include new_swish_box.html id="model" %}
+  </section>
+  <section>
+    Depth-bounded forward chaining for infinite domains
+    {% include new_swish_box.html id="model_d" %}
+  </section>
+</section>
+
+<section>
+  <section>
+    <h2>Informed search</h2>
+  </section>
+  <section>
+    Sliding tiles (best-first but not A* and with aggressive pruning)
+    {% include new_swish_box.html id="tiles" %}
+  </section>
+  <section>
+    Path finding (depth-first, breadth-first, A*, backtracking)
+    {% include new_swish_box.html id="path" %}
+  </section>
+</section>
+
+<section>
+  <section>
+    <h2>Definite Clause Grammars</h2>
+  </section>
+  <section>
+    Roman numerals
+    {% include new_swish_box.html id="roman" %}
+  </section>
+</section>
+
+<section>
+  <section>
+    <h2>Inductive reasoning</h2>
+  </section>
+  <section>
+    Bottom-up induction
+    {% include new_swish_box.html id="section92" %}
+  </section>
+  <section>
+    Top-down induction
+    {% include new_swish_box.html id="section93" %}
+  </section>
+</section>

web/css/lpn.css

@@ -67,7 +67,7 @@ div.load {
   right: 5px;
   width: 32px;
   height: 32px;
-  background-image: url("../../img/Actions-system-run-icon.png");
+  background-image: url("../../img/run.png");
   background-repeat: none;
   background-size: 100%;
 }
@@ -158,3 +158,64 @@ div.content {
 	top:-7px;
 	right:-7px;
 }
+
+.runswish {
+  z-index: 1000;
+  width: 32px;
+  height: 32px;
+  float: right;
+  /*background-image: url("../../img/run.png");*/
+  font-size: 28px;
+  position: relative;
+  right: 18px;
+  top: 5px;
+}
+
+.extractswish {
+  width: 100%;
+  padding: 20px;
+}
+
+div.extract.newswish {
+  width: 100%;
+  padding: 0px;
+  border-radius: 10px;
+  background-color: #eee;
+}
+
+pre.source.newswish {
+  background-color: #f5f5f5;
+  font-family: monospace;
+  font-size: 20px;
+  border-radius: 10px;
+  overflow: auto;
+}
+
+.innerswishbox {
+  margin-left: 20px !important;
+}
+
+::-webkit-scrollbar {
+  width: 7px;
+  height: 7px;
+}
+
+::-webkit-scrollbar-track {
+  background-color: rgba(85, 85, 85, 0.2);
+  border-radius: 7px;
+  margin: 5px;
+}
+
+::-webkit-scrollbar-thumb {
+  background-color: #555;
+  border-radius: 5px;
+  transition: all 2s;
+}
+
+::-webkit-scrollbar-thumb:hover {
+  background-color: #222;
+}
+
+::-webkit-scrollbar-corner {
+  display: none;
+}

web/css/lpn_overflowfix_examplesfix_iframefix_previewfix.css

@@ -0,0 +1,94 @@
+div.ui-resizable-s {
+}
+
+
+		 /*******************************
+		 *	    DISCLAIMER		*
+		 *******************************/
+
+div.swish-disclaimer {
+  font-size: 80%;
+  font-family:Helvetica,sans-serif;
+  color: #444;
+  padding: 0px 5%;
+}
+
+div.github {
+  padding-top: 5px;
+  text-align: center;
+  margin: auto;
+}
+
+div.github > span {
+}
+
+div.github iframe {
+  vertical-align: top;
+  border: 0px;
+}
+
+div.content {
+  background-image: url("testing-version.png");
+  background-size: 50%;
+}
+
+
+/************************
+ *      NEW SYSTEM      *
+ ************************/
+
+.runswish {
+  z-index: 1000;
+  width: 32px;
+  height: 32px;
+  float: right;
+  /*background-image: url("../../img/run.png");*/
+  font-size: 28px;
+  position: relative;
+  right: 18px;
+  top: 5px;
+}
+
+div.extract.newswish {
+  width: 100%;
+  padding: 0px;
+  border-radius: 10px;
+  background-color: #eee;
+}
+
+pre.source.newswish {
+  background-color: #f5f5f5;
+  font-family: monospace;
+  font-size: 20px;
+  border-radius: 10px;
+  overflow: auto;
+}
+
+.innerswishbox {
+  margin-left: 20px !important;
+}
+
+::-webkit-scrollbar {
+  width: 7px;
+  height: 7px;
+}
+
+::-webkit-scrollbar-track {
+  background-color: rgba(85, 85, 85, 0.2);
+  border-radius: 7px;
+  margin: 5px;
+}
+
+::-webkit-scrollbar-thumb {
+  background-color: #555;
+  border-radius: 5px;
+  transition: all 2s;
+}
+
+::-webkit-scrollbar-thumb:hover {
+  background-color: #222;
+}
+
+::-webkit-scrollbar-corner {
+  display: none;
+}

web/js/lpn.js

@@ -23,7 +23,7 @@
     return this.each(function() {
 		var elem = $(this);
 		var data = {};			/* private data */
-
+ 	
 		data.swishURL = options.swish || SWISH;
 
 		function appendRunButtonTo(obj) {