mirror of
https://github.com/dutchcoders/transfer.sh.git
synced 2020-11-18 19:53:40 -08:00
terminal progress bar
This commit is contained in:
Uvis Grinfelds
parent
f770f5484c
commit
45e29d5d7d
@ -7,139 +7,31 @@
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
version="1.1"
|
||||
width="750"
|
||||
height="30"
|
||||
id="svg4149"
|
||||
version="1.1"
|
||||
inkscape:version="0.48.3.1 r9886"
|
||||
sodipodi:docname="terminal-top.svg">
|
||||
id="svg4149">
|
||||
<defs
|
||||
id="defs4151">
|
||||
<clipPath
|
||||
clipPathUnits="userSpaceOnUse"
|
||||
id="clipPath60">
|
||||
<path
|
||||
inkscape:connector-curvature="0"
|
||||
d="m 186.202,744.209 9.419,0 0,-9.418 -9.419,0 0,9.418 z"
|
||||
id="path62" />
|
||||
</clipPath>
|
||||
<clipPath
|
||||
clipPathUnits="userSpaceOnUse"
|
||||
id="clipPath44">
|
||||
<path
|
||||
inkscape:connector-curvature="0"
|
||||
d="m 170.791,744.209 9.418,0 0,-9.418 -9.418,0 0,9.418 z"
|
||||
id="path46" />
|
||||
</clipPath>
|
||||
<clipPath
|
||||
clipPathUnits="userSpaceOnUse"
|
||||
id="clipPath28">
|
||||
<path
|
||||
inkscape:connector-curvature="0"
|
||||
d="m 155.379,744.209 9.419,0 0,-9.418 -9.419,0 0,9.418 z"
|
||||
id="path30" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
<sodipodi:namedview
|
||||
id="base"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1.0"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:zoom="0.7"
|
||||
inkscape:cx="189.78652"
|
||||
inkscape:cy="256.28694"
|
||||
inkscape:document-units="px"
|
||||
inkscape:current-layer="layer1"
|
||||
showgrid="false"
|
||||
fit-margin-top="0"
|
||||
fit-margin-left="0"
|
||||
fit-margin-right="0"
|
||||
fit-margin-bottom="0"
|
||||
borderlayer="true"
|
||||
inkscape:showpageshadow="false"
|
||||
showborder="true"
|
||||
showguides="false"
|
||||
inkscape:window-width="1680"
|
||||
inkscape:window-height="1023"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="0"
|
||||
inkscape:window-maximized="1">
|
||||
<sodipodi:guide
|
||||
position="0,0"
|
||||
orientation="0,482.82629"
|
||||
id="guide4830" />
|
||||
<sodipodi:guide
|
||||
position="482.82629,0"
|
||||
orientation="-25.270071,0"
|
||||
id="guide4832" />
|
||||
<sodipodi:guide
|
||||
position="482.82629,25.270071"
|
||||
orientation="0,-482.82629"
|
||||
id="guide4834" />
|
||||
<sodipodi:guide
|
||||
position="0,25.270071"
|
||||
orientation="25.270071,0"
|
||||
id="guide4836" />
|
||||
<inkscape:grid
|
||||
type="xygrid"
|
||||
id="grid4844"
|
||||
empspacing="5"
|
||||
visible="true"
|
||||
enabled="true"
|
||||
snapvisiblegridlinesonly="true" />
|
||||
<sodipodi:guide
|
||||
position="0,0"
|
||||
orientation="0,1000"
|
||||
id="guide4884" />
|
||||
<sodipodi:guide
|
||||
position="1000,0"
|
||||
orientation="-25,0"
|
||||
id="guide4886" />
|
||||
<sodipodi:guide
|
||||
position="1000,25"
|
||||
orientation="0,-1000"
|
||||
id="guide4888" />
|
||||
<sodipodi:guide
|
||||
position="0,25"
|
||||
orientation="25,0"
|
||||
id="guide4890" />
|
||||
<sodipodi:guide
|
||||
position="0,0"
|
||||
orientation="0,750"
|
||||
id="guide4892" />
|
||||
<sodipodi:guide
|
||||
position="750,0"
|
||||
orientation="-25,0"
|
||||
id="guide4894" />
|
||||
<sodipodi:guide
|
||||
position="750,25"
|
||||
orientation="0,-750"
|
||||
id="guide4896" />
|
||||
<sodipodi:guide
|
||||
position="0,25"
|
||||
orientation="25,0"
|
||||
id="guide4898" />
|
||||
<sodipodi:guide
|
||||
position="0,0"
|
||||
orientation="0,750"
|
||||
id="guide4999" />
|
||||
<sodipodi:guide
|
||||
position="750,0"
|
||||
orientation="-30,0"
|
||||
id="guide5001" />
|
||||
<sodipodi:guide
|
||||
position="750,30"
|
||||
orientation="0,-750"
|
||||
id="guide5003" />
|
||||
<sodipodi:guide
|
||||
position="0,30"
|
||||
orientation="30,0"
|
||||
id="guide5005" />
|
||||
</sodipodi:namedview>
|
||||
<metadata
|
||||
id="metadata4154">
|
||||
<rdf:RDF>
|
||||
@ -153,17 +45,12 @@
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<g
|
||||
inkscape:label="Layer 1"
|
||||
inkscape:groupmode="layer"
|
||||
id="layer1"
|
||||
transform="translate(-93.957497,-365.26607)">
|
||||
<rect
|
||||
style="fill:#85b5bb;fill-opacity:1;stroke:none"
|
||||
transform="translate(-93.957497,-365.26607)"
|
||||
id="layer1">
|
||||
<path
|
||||
d="m 85.371201,355.16455 789.901059,0 0,49.98291 -789.901059,0 z"
|
||||
id="rect4487"
|
||||
width="789.90106"
|
||||
height="49.982914"
|
||||
x="85.371201"
|
||||
y="355.16455" />
|
||||
style="fill:#85b5bb;fill-opacity:1;stroke:none" />
|
||||
<g
|
||||
transform="matrix(1.4512649,0,0,-1.4512649,-114.5591,1453.446)"
|
||||
id="g24"
|
||||
@ -184,9 +71,8 @@
|
||||
style="fill:#ff7050">
|
||||
<path
|
||||
d="m 0,0 c 0,-2.601 -2.108,-4.709 -4.709,-4.709 -2.601,0 -4.709,2.108 -4.709,4.709 0,2.601 2.108,4.709 4.709,4.709 C -2.108,4.709 0,2.601 0,0"
|
||||
style="fill:#ff7050;fill-opacity:1;fill-rule:nonzero;stroke:none"
|
||||
id="path38"
|
||||
inkscape:connector-curvature="0" />
|
||||
style="fill:#ff7050;fill-opacity:1;fill-rule:nonzero;stroke:none" />
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
@ -211,9 +97,8 @@
|
||||
style="fill:#ffed5d">
|
||||
<path
|
||||
d="m 0,0 c 0,-2.601 -2.108,-4.709 -4.709,-4.709 -2.601,0 -4.709,2.108 -4.709,4.709 0,2.601 2.108,4.709 4.709,4.709 C -2.108,4.709 0,2.601 0,0"
|
||||
style="fill:#ffed5d;fill-opacity:1;fill-rule:nonzero;stroke:none"
|
||||
id="path54"
|
||||
inkscape:connector-curvature="0" />
|
||||
style="fill:#ffed5d;fill-opacity:1;fill-rule:nonzero;stroke:none" />
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
@ -238,9 +123,8 @@
|
||||
style="fill:#93de7f">
|
||||
<path
|
||||
d="m 0,0 c 0,-2.601 -2.108,-4.709 -4.709,-4.709 -2.601,0 -4.709,2.108 -4.709,4.709 0,2.601 2.108,4.709 4.709,4.709 C -2.108,4.709 0,2.601 0,0"
|
||||
style="fill:#93de7f;fill-opacity:1;fill-rule:nonzero;stroke:none"
|
||||
id="path70"
|
||||
inkscape:connector-curvature="0" />
|
||||
style="fill:#93de7f;fill-opacity:1;fill-rule:nonzero;stroke:none" />
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
|
Before Width: | Height: | Size: 6.9 KiB After Width: | Height: | Size: 3.8 KiB |
@ -17,7 +17,7 @@
|
||||
|
||||
<link href='https://fonts.googleapis.com/css?family=Source+Sans+Pro:100,200,300' rel='stylesheet' type='text/css'>
|
||||
<link href='https://fonts.googleapis.com/css?family=Source+Code+Pro:400' rel='stylesheet' type='text/css'>
|
||||
<link href='http://fonts.googleapis.com/css?family=Droid+Sans+Mono' rel='stylesheet' type='text/css'>
|
||||
<link href='http://fonts.googleapis.com/css?family=Droid+Sans+Mono' rel='stylesheet' type='text/css'>
|
||||
<!-- build:js scripts/vendor/modernizr.js -->
|
||||
<script src="bower_components/modernizr/modernizr.js"></script>
|
||||
<!-- endbuild -->
|
||||
@ -45,7 +45,7 @@
|
||||
<div class="wrapper">
|
||||
<h1>transfer.sh</h1>
|
||||
<ul>
|
||||
<li><a href="#samples">Sample use cases</a>
|
||||
<li><a href="#samples">sample use cases</a>
|
||||
</li>
|
||||
<li><a href="#contact">contact us</a>
|
||||
</li>
|
||||
@ -65,40 +65,43 @@
|
||||
|
||||
</div>
|
||||
<div id="terminal" class="terminal">
|
||||
<code>
|
||||
<span class="code-title"># Upload using cURL</span>
|
||||
<br>$ curl --upload-file ./hello.txt https://transfer.sh/hello.txt https://transfer.sh/66nb8/hello.txt <br>
|
||||
<br>
|
||||
<span class="code-title"># Create an alias</span>
|
||||
<br>$ transfer hello.txt <br>#################################################### 100.0% https://transfer.sh/eibhM/hello.txt
|
||||
</code>
|
||||
<code>
|
||||
<span class="code-title"># Upload using cURL</span>
|
||||
<br>$ curl --upload-file ./hello.txt https://transfer.sh/hello.txt https://transfer.sh/66nb8/hello.txt
|
||||
<br>
|
||||
<br>
|
||||
<span class="code-title"># Create an alias</span>
|
||||
<br>$ transfer hello.txt
|
||||
<br>##################################################### 100.0% https://transfer.sh/eibhM/hello.txt
|
||||
</code>ch
|
||||
</div>
|
||||
<div id="web">
|
||||
<code>
|
||||
<br>
|
||||
<br>
|
||||
<span class="code-title"># Upload from web</span>
|
||||
<br>Drag your files here, or <a class="browse" href="#"> click to browse.</a>
|
||||
</code>
|
||||
<input type="file" multiple="multiple" style='display: none;' />
|
||||
<ul class='queue' style='; list-style-type: none; margin: 0;'>
|
||||
<ul class='queue'>
|
||||
<li>
|
||||
</li>
|
||||
</ul>
|
||||
<div class='all-files'>
|
||||
<br>
|
||||
<span class="code-title"># Download all your files</span><br/>
|
||||
<a class="download-zip btn-cta" href="#">zip</a> <a class="download-tar btn-cta" href="#">tar.gz</a>
|
||||
<div>
|
||||
<span class="code-title"># Download all your files</span>
|
||||
<br/>
|
||||
<br/>
|
||||
<a class="download-zip btn-cta" href="#">zip</a> <a class="download-tar btn-cta" href="#">tar.gz</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
|
||||
<a href="#features" class="btn-cta btn-home">learn more</i> </a>
|
||||
|
||||
<div>
|
||||
<a href="#features" class="btn-cta btn-home">learn more</i> </a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
@ -146,41 +149,41 @@
|
||||
<div class="row">
|
||||
<div class="col-md-6 ">
|
||||
<h3>Uploading</h3>
|
||||
<div id="" class="terminal">
|
||||
<code>
|
||||
<span class="code-title"># Upload is easy using cURL</span>
|
||||
<br>$ curl --upload-file ./hello.txt https://transfer.sh/hello.txt https://transfer.sh/66nb8/hello.txt <br>
|
||||
<br>
|
||||
<span class="code-title"># Download the file</span>
|
||||
<br>$ transfer hello.txt <br>#################################################### 100.0% https://transfer.sh/eibhM/hello.txt
|
||||
<span class="code-title"># Upload multiple files</span>
|
||||
<br>$ transfer hello.txt <br>
|
||||
https://transfer.sh/eibhM/hello.txt
|
||||
<br>
|
||||
<br>
|
||||
</code>
|
||||
<div id="" class="terminal">
|
||||
<code>
|
||||
<span class="code-title"># Upload is easy using cURL</span>
|
||||
<br>$ curl --upload-file ./hello.txt https://transfer.sh/hello.txt https://transfer.sh/66nb8/hello.txt
|
||||
<br>
|
||||
<br>
|
||||
<span class="code-title"># Download the file</span>
|
||||
<br>$ transfer hello.txt
|
||||
<br>#################################################### 100.0% https://transfer.sh/eibhM/hello.txt
|
||||
<span class="code-title"># Upload multiple files</span>
|
||||
<br>$ transfer hello.txt
|
||||
<br>https://transfer.sh/eibhM/hello.txt
|
||||
<br>
|
||||
<br>
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6 ">
|
||||
<h3>Create an alias and add to .bashrc</h3>
|
||||
<div id="" class="terminal">
|
||||
<code>
|
||||
<span class="code-title"># Upload is easy using cURL</span>
|
||||
<br>$ curl --upload-file ./hello.txt https://transfer.sh/hello.txt https://transfer.sh/66nb8/hello.txt <br>
|
||||
<br>
|
||||
<span class="code-title"># Download the file</span>
|
||||
<br>
|
||||
tmpfile = $( mktemp -t transfer )
|
||||
curl --progress-bar --upload-file $1 https://transfer.sh/$(basename $1) >> $tmpfile;
|
||||
cat $tmpfile;
|
||||
rm -f $tmpfile;
|
||||
}<br>
|
||||
<div id="" class="terminal">
|
||||
<code>
|
||||
<span class="code-title"># Upload is easy using cURL</span>
|
||||
<br>$ curl --upload-file ./hello.txt https://transfer.sh/hello.txt https://transfer.sh/66nb8/hello.txt
|
||||
<br>
|
||||
<br>
|
||||
<span class="code-title"># Download the file</span>
|
||||
<br>tmpfile = $( mktemp -t transfer ) curl --progress-bar --upload-file $1 https://transfer.sh/$(basename $1) >> $tmpfile; cat $tmpfile; rm -f $tmpfile; }
|
||||
<br>
|
||||
|
||||
<span class="code-title"># Now you can just use transfer command</span>
|
||||
<br>$ transfer hello.txt <br>
|
||||
<br>
|
||||
<span class="code-title"># Now you can just use transfer command</span>
|
||||
<br>$ transfer hello.txt
|
||||
<br>
|
||||
<br>
|
||||
|
||||
</code>
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -190,49 +193,49 @@
|
||||
<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>Uploading</h3>
|
||||
<div id="" class="terminal">
|
||||
<div class="row">
|
||||
<div class="col-md-6 ">
|
||||
<h3>Uploading</h3>
|
||||
<div id="" class="terminal">
|
||||
<code>
|
||||
<span class="code-title"># Upload is easy using cURL</span>
|
||||
<br>$ curl --upload-file ./hello.txt https://transfer.sh/hello.txt https://transfer.sh/66nb8/hello.txt <br>
|
||||
<br>$ curl --upload-file ./hello.txt https://transfer.sh/hello.txt https://transfer.sh/66nb8/hello.txt
|
||||
<br>
|
||||
<br>
|
||||
<span class="code-title"># Download the file</span>
|
||||
<br>$ transfer hello.txt <br>#################################################### 100.0% https://transfer.sh/eibhM/hello.txt
|
||||
<br>$ transfer hello.txt
|
||||
<br>#################################################### 100.0% https://transfer.sh/eibhM/hello.txt
|
||||
<span class="code-title"># Upload multiple files</span>
|
||||
<br>$ transfer hello.txt <br>
|
||||
https://transfer.sh/eibhM/hello.txt
|
||||
<br>$ transfer hello.txt
|
||||
<br>https://transfer.sh/eibhM/hello.txt
|
||||
<br>
|
||||
<br>
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="col-md-6 ">
|
||||
<h3>Create an alias and add to .bashrc</h3>
|
||||
<div id="" class="terminal">
|
||||
</div>
|
||||
<div class="col-md-6 ">
|
||||
<h3>Create an alias and add to .bashrc</h3>
|
||||
<div id="" class="terminal">
|
||||
<code>
|
||||
<span class="code-title"># Upload is easy using cURL</span>
|
||||
<br>$ curl --upload-file ./hello.txt https://transfer.sh/hello.txt https://transfer.sh/66nb8/hello.txt <br>
|
||||
<br>$ curl --upload-file ./hello.txt https://transfer.sh/hello.txt https://transfer.sh/66nb8/hello.txt
|
||||
<br>
|
||||
<br>
|
||||
<span class="code-title"># Download the file</span>
|
||||
<br>tmpfile = $( mktemp -t transfer ) curl --progress-bar --upload-file $1 https://transfer.sh/$(basename $1) >> $tmpfile; cat $tmpfile; rm -f $tmpfile; }
|
||||
<br>
|
||||
tmpfile = $( mktemp -t transfer )
|
||||
curl --progress-bar --upload-file $1 https://transfer.sh/$(basename $1) >> $tmpfile;
|
||||
cat $tmpfile;
|
||||
rm -f $tmpfile;
|
||||
}<br>
|
||||
|
||||
<span class="code-title"># Now you can just use transfer command</span>
|
||||
<br>$ transfer hello.txt <br>
|
||||
<br>$ transfer hello.txt
|
||||
<br>
|
||||
<br>
|
||||
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<h3>Transfer multiple files</h3>
|
||||
|
||||
@ -1,49 +1,49 @@
|
||||
$(document).ready(function() {
|
||||
|
||||
/* hljs.initHighlightingOnLoad();*/
|
||||
/* hljs.initHighlightingOnLoad();*/
|
||||
// Terminal typing animation
|
||||
/* $("#terminal-code").typed({
|
||||
strings: ["# Upload using this \n acurl --upload-file ./hello.txt https://transfer.sh/hello.txt\n######################################################\nhttps://transfer.sh/66nb8/hello.txt \n "],
|
||||
typeSpeed: 0, // typing speed
|
||||
backSpeed: 0, // backspacing speed
|
||||
startDelay: 0, // time before typing starts
|
||||
backDelay: 500, // pause before backspacing
|
||||
loop: false, // loop on or off (true or false)
|
||||
loopCount: false, // number of loops, false = infinite
|
||||
showCursor: true,
|
||||
attr: null, // attribute to type, null = text for everything except inputs, which default to placeholder
|
||||
callback: function(){ } // call function after typing is done
|
||||
});*/
|
||||
/*
|
||||
var typewriter = require('typewriter');
|
||||
/* $("#terminal-code").typed({
|
||||
strings: ["# Upload using this \n acurl --upload-file ./hello.txt https://transfer.sh/hello.txt\n######################################################\nhttps://transfer.sh/66nb8/hello.txt \n "],
|
||||
typeSpeed: 0, // typing speed
|
||||
backSpeed: 0, // backspacing speed
|
||||
startDelay: 0, // time before typing starts
|
||||
backDelay: 500, // pause before backspacing
|
||||
loop: false, // loop on or off (true or false)
|
||||
loopCount: false, // number of loops, false = infinite
|
||||
showCursor: true,
|
||||
attr: null, // attribute to type, null = text for everything except inputs, which default to placeholder
|
||||
callback: function(){ } // call function after typing is done
|
||||
});*/
|
||||
/*
|
||||
var typewriter = require('typewriter');
|
||||
|
||||
var twSpan = document.getElementById('terminal-code');
|
||||
var twSpan = document.getElementById('terminal-code');
|
||||
|
||||
var tw = typewriter(twSpan).withAccuracy(100)
|
||||
.withMinimumSpeed()
|
||||
.withMaximumSpeed(25)
|
||||
.build();
|
||||
var tw = typewriter(twSpan).withAccuracy(100)
|
||||
.withMinimumSpeed()
|
||||
.withMaximumSpeed(25)
|
||||
.build();
|
||||
|
||||
tw.put('$ ')
|
||||
.put('<span class="hljs-comment"># Upload using cURL </span>')
|
||||
.waitRange(500, 1000)
|
||||
.put('<br/>')
|
||||
.type('$ curl --upload-file ./hello.txt https://transfer.sh/hello.txt')
|
||||
.put('<br/>')
|
||||
.put('https://transfer.sh/66nb8/hello.txt ')
|
||||
.put('<br/>')
|
||||
tw.put('$ ')
|
||||
.put('<span class="hljs-comment"># Upload using cURL </span>')
|
||||
.waitRange(500, 1000)
|
||||
.put('<br/>')
|
||||
.type('$ curl --upload-file ./hello.txt https://transfer.sh/hello.txt')
|
||||
.put('<br/>')
|
||||
.put('https://transfer.sh/66nb8/hello.txt ')
|
||||
.put('<br/>')
|
||||
|
||||
.waitRange(500, 1000)
|
||||
.put('<br/>')
|
||||
.waitRange(500, 1000)
|
||||
.put('<span class="hljs-comment"># Upload using alias</span>')
|
||||
.put('<br/>')
|
||||
.type('transfer hello.txt')
|
||||
.put('<br/>')
|
||||
.type('####################################################')
|
||||
.put(' 100.0%')
|
||||
.put('<br/>')
|
||||
.put('https://transfer.sh/eibhM/hello.txt ')*/
|
||||
.waitRange(500, 1000)
|
||||
.put('<br/>')
|
||||
.waitRange(500, 1000)
|
||||
.put('<span class="hljs-comment"># Upload using alias</span>')
|
||||
.put('<br/>')
|
||||
.type('transfer hello.txt')
|
||||
.put('<br/>')
|
||||
.type('####################################################')
|
||||
.put(' 100.0%')
|
||||
.put('<br/>')
|
||||
.put('https://transfer.sh/eibhM/hello.txt ')*/
|
||||
|
||||
// Smooth scrolling
|
||||
$('a[href*=#]:not([href=#])').click(function() {
|
||||
@ -77,21 +77,21 @@ $(document).ready(function() {
|
||||
$('.browse').addClass('uploading');
|
||||
var li = $('<li style="clear:both;"/>');
|
||||
|
||||
li.append($('<div><div class="progress active upload-progress" style="margin-bottom: 0;"><div class="bar" style="width: 0%;">############################>span></span></div></div><p>Uploading... ' + file.name + '</p></div>'));
|
||||
li.append($('<div><div class="upload-progress"><span></span><div class="bar" style="width:0%;">####################################################</div></div><p>Uploading... ' + file.name + '</p></div>'));
|
||||
$(li).appendTo($('.queue'));
|
||||
|
||||
var xhr = new XMLHttpRequest();
|
||||
|
||||
xhr.upload.addEventListener("progress", function(e) {
|
||||
var pc = parseInt((e.loaded / e.total * 100));
|
||||
/* $('.upload-progress', $(li)).show();*/
|
||||
$('.upload-progress', $(li)).show();
|
||||
$('.upload-progress .bar', $(li)).css('width', pc + "%");
|
||||
$('.upload-progress .bar .span').append( pc + "%");
|
||||
$('.upload-progress span ').empty().append(pc + "%");
|
||||
}, false);
|
||||
|
||||
xhr.onreadystatechange = function(e) {
|
||||
if (xhr.readyState == 4) {
|
||||
$('.upload-progress', $(li)).hide();
|
||||
/* $('.upload-progress', $(li)).hide();*/
|
||||
$('#web').addClass('uploading');
|
||||
// progress.className = (xhr.status == 200 ? "success" : "failure");
|
||||
if (xhr.status == 200) {
|
||||
@ -121,7 +121,6 @@ $(document).ready(function() {
|
||||
};
|
||||
|
||||
$(document).bind("dragenter", function(event) {
|
||||
|
||||
event.preventDefault();
|
||||
}).bind("dragover", function(event) {
|
||||
event.preventDefault();
|
||||
@ -129,7 +128,6 @@ $(document).ready(function() {
|
||||
$('#web').addClass('dragged');
|
||||
}).bind("dragleave", function(event) {
|
||||
$('#web').removeClass('dragged');
|
||||
console.log('asdasd');
|
||||
|
||||
}).bind("drop dragdrop", function(event) {
|
||||
var files = event.originalEvent.target.files || event.originalEvent.dataTransfer.files;
|
||||
@ -158,5 +156,3 @@ $(document).ready(function() {
|
||||
});
|
||||
});
|
||||
})();
|
||||
|
||||
|
||||
|
||||
@ -22,21 +22,20 @@
|
||||
.code-title {
|
||||
color: @red;
|
||||
}
|
||||
padding: 35px 0 0 10px;
|
||||
padding: 30px 0 0 10px;
|
||||
@media (min-width: @screen-sm-min) {
|
||||
padding: 50px 0 0 20px;
|
||||
padding: 30px 0 0 20px;
|
||||
}
|
||||
code {
|
||||
font-family: @font-family-mono;
|
||||
|
||||
font-family: @font-family-mono;
|
||||
}
|
||||
font-family: @font-family-mono;
|
||||
font-family: @font-family-mono;
|
||||
font-size: 15px;
|
||||
text-align: left;
|
||||
color: #fff;
|
||||
|
||||
}
|
||||
|
||||
|
||||
#web {
|
||||
margin-top: -2px;
|
||||
.border-bottom-radius (5px);
|
||||
@ -51,10 +50,6 @@ font-family: @font-family-mono;
|
||||
font-size: 14px;
|
||||
border-color: #fff;
|
||||
}
|
||||
.click {
|
||||
margin-top: -50px;
|
||||
color: #fff;
|
||||
}
|
||||
.queue {
|
||||
margin: 0;
|
||||
list-style: none;
|
||||
@ -65,27 +60,8 @@ font-family: @font-family-mono;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.terminal {
|
||||
.border-top-radius (5px);
|
||||
// min-height: 150px;
|
||||
@media (min-width: @screen-sm-min) {
|
||||
//min-height: 350px;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
#web .uploading {
|
||||
}
|
||||
|
||||
.dragged {
|
||||
background: @light-gray;
|
||||
}
|
||||
|
||||
|
||||
.terminal {
|
||||
.border-top-radius (0px);
|
||||
.border-top-radius (0);
|
||||
background: @dark-blue;
|
||||
// background: url(../images/terminal.svg);
|
||||
background-repeat: no-repeat;
|
||||
@ -93,7 +69,6 @@ font-family: @font-family-mono;
|
||||
}
|
||||
|
||||
.terminal-top {
|
||||
|
||||
.border-top-radius (5px);
|
||||
background: url(../images/terminal-top.svg);
|
||||
background-repeat: no-repeat;
|
||||
@ -101,11 +76,18 @@ font-family: @font-family-mono;
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
.progress {
|
||||
max-width: 80%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
|
||||
.upload-progress {
|
||||
max-width: 80%;
|
||||
.bar {
|
||||
word-wrap: normal;
|
||||
overflow: hidden;
|
||||
}
|
||||
span {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
.all-files {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@ -5502,7 +5502,7 @@ a:hover {
|
||||
#web,
|
||||
.terminal {
|
||||
word-wrap: break-word;
|
||||
padding: 35px 0 0 10px;
|
||||
padding: 30px 0 0 10px;
|
||||
font-family: "Droid Sans Mono", monospace;
|
||||
font-size: 15px;
|
||||
text-align: left;
|
||||
@ -5515,7 +5515,7 @@ a:hover {
|
||||
@media (min-width: 768px) {
|
||||
#web,
|
||||
.terminal {
|
||||
padding: 50px 0 0 20px;
|
||||
padding: 30px 0 0 20px;
|
||||
}
|
||||
}
|
||||
#web code,
|
||||
@ -5539,10 +5539,6 @@ a:hover {
|
||||
font-size: 14px;
|
||||
border-color: #fff;
|
||||
}
|
||||
#web .click {
|
||||
margin-top: -50px;
|
||||
color: #fff;
|
||||
}
|
||||
#web .queue {
|
||||
margin: 0;
|
||||
list-style: none;
|
||||
@ -5552,15 +5548,8 @@ a:hover {
|
||||
color: #fff;
|
||||
}
|
||||
.terminal {
|
||||
border-top-right-radius: 5px;
|
||||
border-top-left-radius: 5px;
|
||||
}
|
||||
.dragged {
|
||||
background: #f6f8f8;
|
||||
}
|
||||
.terminal {
|
||||
border-top-right-radius: 0px;
|
||||
border-top-left-radius: 0px;
|
||||
border-top-right-radius: 0;
|
||||
border-top-left-radius: 0;
|
||||
background: #36535a;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
@ -5573,9 +5562,15 @@ a:hover {
|
||||
background-size: cover;
|
||||
height: 30px;
|
||||
}
|
||||
.progress {
|
||||
.upload-progress {
|
||||
max-width: 80%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.upload-progress .bar {
|
||||
word-wrap: normal;
|
||||
overflow: hidden;
|
||||
}
|
||||
.upload-progress span {
|
||||
float: right;
|
||||
}
|
||||
.all-files {
|
||||
display: none;
|
||||
|
||||
File diff suppressed because one or more lines are too long
Loading…
x
Reference in New Issue
Block a user