highlite.js added

transfersh-web/index.html

@@ -62,7 +62,8 @@
                 <div id="from-terminal" class=" box col-md-6 col-xs-12">
                     <h3>Share from terminal</h3>
                     <div id="terminal">
-                        <p style='white-space:pre'></p>
+                        <pre>
+                        <code id="terminal-code" class="bash">ls this</code></pre>
                     </div>
                 </div>
                 <div id="from-web" class="col-md-6 col-xs-12">
@@ -148,45 +149,56 @@
                     <h3>Make an alias</h3>
 
                     <h4>Create an alias, and add it to .bashrc for faster use</h4>
-                    <code>$ transfer() { # write to output to tmpfile because of progress bar tmpfile=$( mktemp -t transfer ) curl --progress-bar --upload-file $1 https://transfer.sh/$(basename $1) >> $tmpfile; cat $tmpfile; rm -f $tmpfile; } alias transfer=transfer</code>
+                    <pre>
+                            <code id="terminal-code" class="bash">
+                            # transfer.sh alias 
+                            # write output to tmpfile because of progress bar 
+                            $ transfer()
+                             { 
+                             tmpfile=$( mktemp -t transfer ) 
+                             curl --progress-bar --upload-file $1 https://transfer.sh/$(basename $1) >> $tmpfile; cat $tmpfile; rm -f $tmpfile; }
+                             alias transfer=transfer
+                             </code>
+                        </pre>
+
                     <h4>Now you can just use
                         <strong>transfer</strong>command</h4>
                     <code>$transfer hello.txt</code>
-
-
                 </div>
+
             </div>
+        </div>
 
 
-            <a class="btn-cta" data-target="#coll" data-toggle="collapse">More examples</a>
+        <a class="btn-cta" data-target="#coll" data-toggle="collapse">More examples</a>
 
-            <div class="collapse " id="coll">
-                <div class="row">
-                    <div class="col-md-6">
-                        <h3>Transfer multiple files</h3>
-                        <h4>Upload multiple files at once
-                        </h4>
-                        <code>$ curl -i -F filedata=@/tmp/hello.txt -F filedata=@/tmp/hello2.txt https://transfer.sh/</code>
+        <div class="collapse " id="coll">
+            <div class="row">
+                <div class="col-md-6">
+                    <h3>Transfer multiple files</h3>
+                    <h4>Upload multiple files at once
+                    </h4>
+                    <code>$ curl -i -F filedata=@/tmp/hello.txt -F filedata=@/tmp/hello2.txt https://transfer.sh/</code>
 
-                        <h4>Combining downloads as zip or tar archive</h4>
-                        <code>$ curl https://transfer.sh/(15HKz/hello.txt,15HKz/hello.txt).tar.gz</code>
-                        <br>
+                    <h4>Combining downloads as zip or tar archive</h4>
+                    <code>$ curl https://transfer.sh/(15HKz/hello.txt,15HKz/hello.txt).tar.gz</code>
+                    <br>
 
-                        <code>$ curl https://transfer.sh/(15HKz/hello.txt,15HKz/hello.txt).zip</code>
+                    <code>$ curl https://transfer.sh/(15HKz/hello.txt,15HKz/hello.txt).zip</code>
 
 
-                    </div>
-                    <div class="col-md-6">
-                        <h3>Encrypt your files before the transfer</h3>
-                        <h4>You can encrypt files using gpg. The following command will encrypt the data before it leaves your server using the password you enter and upload it to transfer.sh.</h4>
-                        <h4></h4>
-                        <code>$ cat /tmp/hello.txt|gpg -ac -o-|curl -X PUT --upload-file "-" https://transfer.sh/test.txt</code>
-                        <h4>Encrypt and upload</h4>
-                        <code>$ curl https://transfer.sh/1lDau/test.txt|gpg -o- > /tmp/hello.txt</code>
-                    </div>
                 </div>
-
+                <div class="col-md-6">
+                    <h3>Encrypt your files before the transfer</h3>
+                    <h4>You can encrypt files using gpg. The following command will encrypt the data before it leaves your server using the password you enter and upload it to transfer.sh.</h4>
+                    <h4></h4>
+                    <code>$ cat /tmp/hello.txt|gpg -ac -o-|curl -X PUT --upload-file "-" https://transfer.sh/test.txt</code>
+                    <h4>Encrypt and upload</h4>
+                    <code>$ curl https://transfer.sh/1lDau/test.txt|gpg -o- > /tmp/hello.txt</code>
+                </div>
             </div>
+
+        </div>
         </div>
     </section>
 
@@ -313,13 +325,15 @@
 
     <!-- build:js scripts/main.js -->
     <script src="bower_components/jquery/dist/jquery.js"></script>
-    <script src="bower_components/typed.js/js/typed.js"></script>
+    <script src="bower_components/highlightjs/highlight.pack.js"></script>
     <script src="bower_components/uri.js/src/URI.min.js"></script>
     <script src="bower_components/bootstrap/js/transition.js"></script>
     <script src="bower_components/bootstrap/js/collapse.js"></script>
+
     <script src="scripts/typewriter-bundle.js"></script>
     <script src="scripts/main.js"></script>
     <!-- endbuild -->
+
 </body>
 
 </html>

transfersh-web/scripts/main.js

@@ -1,5 +1,6 @@
 $(document).ready(function() {
 
+    hljs.initHighlightingOnLoad();
     // Terminal typing animation
     /*    $("#from-terminal p").typed({
             strings: ["curl --upload-file ./hello.txt https://transfer.sh/hello.txt\n######################################################\nhttps://transfer.sh/66nb8/hello.txt \n "],
@@ -16,7 +17,7 @@ $(document).ready(function() {
     */
     var typewriter = require('typewriter');
 
-    var twSpan = document.getElementById('terminal');
+    var twSpan = document.getElementById('terminal-code');
 
     var tw = typewriter(twSpan).withAccuracy(100)
         .withMinimumSpeed(17)
@@ -161,3 +162,5 @@ $(document).ready(function() {
         });
     });
 })();
+
+

transfersh-web/styles/main.css

@@ -1,4 +1,5 @@
 @charset "UTF-8";
+@import "../bower_components/highlightjs/styles/zenburn.css";
 /*! normalize.css v2.1.3 | MIT License | git.io/normalize */
 article,
 aside,

transfersh-web/styles/main.less

@@ -2,6 +2,9 @@
 
 
 @import "../bower_components/animate.less/animate.less";
+@import "../bower_components/highlightjs/styles/zenburn.css";
+
+
 
 @import "config";
 @import "includes/global";