launch commit
parent
a0e90022db
commit
616dd5d9b1
@ -1,3 +1,2 @@
|
||||
.ipynb_checkpoints
|
||||
_kindofbin
|
||||
.ipynb_checkpoints
|
||||
build
|
||||
|
||||
@ -1,70 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="stylesheet" type="text/css" href="style.css">
|
||||
<title></title>
|
||||
</head>
|
||||
<a href="../"> ↪ go back </a>
|
||||
<body>
|
||||
|
||||
<div class="images">
|
||||
|
||||
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++<br>
|
||||
+|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|+<br>
|
||||
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++<br>
|
||||
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++<br>
|
||||
+|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|+++|++|++|+++|++|++|++|++|++|++|++|++<br>
|
||||
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++=+++++=++=+++=++=++=+++++=++++++++++++++++++++<br>
|
||||
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++<br>
|
||||
+|++|++|++|++|++|++|+++++++++++++++++++++++++++++++|=+++++++++++++++++++++++=+++++++++++++++++++=++=++=+++++=+++++++++++++++++=++++++=++++++++++|++|++<br>
|
||||
+++++++++++++++++++++++|+++++++++++++++++++++++++++++++++++++++=++=====+=+=+=+===+==+==+++++=+==++=++=+=+==+=+=+==+=+=+=+=+=+=+++=++=+++++++++++++++++<br>
|
||||
+++++++++++++++++++++++=+++++++++++=++=++++++++++|=|+++++++=+++=+==++|+++++==+=++=+=+==========+==========+===+==+====+===+=+=+=+++=+++++++++++++++|=|<br>
|
||||
+|++|++|++|++|++|++|++|=+++=+=++===+=++++=+==+========++++++==;===++++|+====|+++++==+=++==;;=+++=++==++===================================++++++++++++<br>
|
||||
+++++++++++++++++++++|=|=+=++=========+====;;;=;;=|==||==+=+=+||||+|||+=====;;==;;==;===;==+===+||+|||++|=||==;;::::::;::;=;;;;=;=;===========+=++++++<br>
|
||||
+++++++++++++++++|+|=+|=++||+==|====++==;;=::=|+=====-=i==+|=+====++===+=====+=++==;:::+=;=;;;====|>====;====++=;::.::::::.:;:;=+=;::;;;;====+=+++=+++<br>
|
||||
+|++|++|++|++|+|++++++=+==||=|+++++=|===:+--::_:=i:.._=;==::==+=|=+=|==|==+=+|++====;:=======:==:=:;;:=====+=+=:;;:=:::::::-:-::::;;:;;:;;;;;:;;======<br>
|
||||
++++++++++++++==+===+=|+||=:::::=||+++||;.....::=__==i=+====++=+=ii+=||=|==;===+==i|=|==::+==:|+=::::;=+=|=:::::::..-:::.:::.::::=::::;::;======;;;;==<br>
|
||||
+++++++++++++++|=+|||||=====|||+++-- -+-==||=|iIi>+=+=:;=;==||= +|||= >====||=;|+|vii=i>;=|=:-::-:::;;==+==:::.:-:=:;.:====++===;:::-:-::::;=;:==+++==<br>
|
||||
+|++|++++++++++++|=|+|+|+=+-=~-.. _==%>:||+||||=||||% i>||+|=i=||i|isi>=||i+:|iI|||ivi|+_=-::;:.====:=::=|:=::=::;:.;:=:;::::-::::-::;::.:.:::;=====++<br>
|
||||
+++++++|++|++|+|++++=;:::.:_::__==||+===|=||%i>+|={ivvus=i|i{(=|i>+|svv=i=====|+|+=ivv|;+-.:+=+==|:;:.==.:=;==::;;=;===:::::.::.::-.;-:::::;====:=====<br>
|
||||
+++++++++++++++=====:;;===iiic iv>|==vis%l}||=:||||nnno1vs %|i |}iii||+i>|i:+=i++|| %i=;.::||===+|=:.|=;.: :::===:~::+=:=.:.:.::==;:.:.::=+;::=:;====+<br>
|
||||
+|++|+++++++++====;;:=++||""~==i|||{|+|==|; |> lvopv21ovnnvsvvioii%ilIi=iIi=|i|i+=i> :.::==|:;==>= =:|=+=;::.:;=:=:;=::--::=======:=: :=:=:=====;;;===<br>
|
||||
+++++++|+++++=+===;::::-.-.-:-+=:;=%=ua%ivvnvi%vnnvnInvoon%slili1vsvvvsvvii%i|||%i==|:==:=|>==>=i:~-|=|=;::=:`-.--:..:::_;+:`:====:::..::-:=:;=;:=;===<br>
|
||||
++++++++=+++=====;:;::-::::.::-==|=vn%XnXvnonnnoXnuo1nSo21vvvnllIivv%vvlliii|i=|=_%==||==|-:=+:+:..:-....-:.:._:..:_.../:. ._:;;==-.:::_:::..:::====;=<br>
|
||||
+++|=|=+++=+====;:;=li=;=-===:: 1XmXozv%nXo3XSvoXXn2Xnvnvnzvv ziv2vnlzi{vic= aaw%i>i+=|==;~::.............:;:. -:.-::.:...:::.-----_;==+=:=:::;===;;==<br>
|
||||
+++++=+++=+====;;=++|=+;=;;;==;ivo#Z#mnXZ1XvSvononnvon*%IIvvod1Iooqq.<span class="water">####WATER######mwa%</span> ==::: -.:..-..-...-:...:.....::.:......--.:;=.:.:-;-:::=++||<br>
|
||||
+++++++======+=====:=:::-::=|||=|{3#UZ#ZXvdXnXvvz{v{vaoXdXXnooqm#mm<span class="water">##WA#T###########E##R##mm%</span>..:.:.-..:...:.-:......:: ...........:::=:=+:;_i._::::=||<br>
|
||||
++++++=+=+=+======;;::-...:.::..:.:+!YYmo|InXe{*1vvd##Xwwqm##m<span class="water">#####WAT#ER.WATER#W#A#T##E#R###mma%</span>`.........:......:..:...............; :=;;--:;`;:=+=;<br>
|
||||
++++++=++=+===;;=:;::::::..::. ..:....--:::|:+1%lXmWW<span class="water">#####WAT#WATER.WATER.WATER.WATER#W#A#TER.WATEmma%</span>:_:;:.__...:+.:.............:>+=.=-.:.:)+>:==;;;<br>
|
||||
+++++++++====;;=;;;;:::...:...- -`.: >:v=u111=|!={Q<span class="water">#####WATER.WATER.WAT#E##R##W#A#T#E#R.WATER#W#A#T###wa</span>,;.=--:=:+;:;..`.;........_= ..:;+i_=,:; =====<br>
|
||||
++|++|++|=|==;;;:::::::...-.:.......=|i>wsai}l=.=;+!?<span class="water">###WATER#WATER.WA#T#E#R#W#A#T#E#R#WAT#ER.WAT#E#R##W#A##qa</span>,=..:=`.;+:/.-----.,..:(.a c_;)=;===i===<br>
|
||||
++++++++++|=+==;;:::-...:.:. ......=|izi1}>=v2|;==i||=;:+"!?<span class="water">##WATER.#W#A#TE#R#W#ATER.#WAT#E#RWA#TE#R#W#A#TE</span>(_=.:=:........... . .||)']sv =:==i lvi|i|l<br>
|
||||
+|=|=|+++|+===|=+=::..::.....-.....-=|(v= |{>:====-=n}===: ..-+!?<span class="water">##WATE#R#W#A#TE#R#W#ATER#WAT#ER.#W#A#T#E#R</span>`+ . .. .. . ... - := ..:|](==..:= >:=i|=||<br>
|
||||
+++++++++++==|==||;==;::..-......--.:|==)(=|s=;|::=+iv%i+:=.:.=:+ )l?Y<span class="water">##WATER.WATER.WATER.WATER.WAT!""</span>++~ ;.:.,. .:+ .lll.;.=)o%=>.i =X1||=;==+++++|+<br>
|
||||
+++++++++===|======= >:;.......=::|>:+||i>i|*1q%:==::vv==;=+;:-:: =;_ i||<span class="water">*WATER.WATER.WATER.</span>!^-...=:;;-/- .+".,:-..--------....-==|=v;:;as}..>+|:=|=+<br>
|
||||
+++++++=+||++|=|====+=::_>.,....v>=|.:|vvliII|+^:,=|.>au|=%=|;;;==:==u#mZ...aa<span class="water">.WATER.W""</span>^-: =;.-.:>==........-=::. :..:.. .-...: ::>a:-a=;:+=|l::==>==<br>
|
||||
++|=|=+++===|++=+==|==--+:._..;=e;|=:==|i-a:.=;:=a>=vau#ws+_::==;::nZ....m.ZY../Z".......... -:...=2=:+~:.......... .`-`-......:=..|=;=a}:-::=|==|i=++<br>
|
||||
++++++++++|==+|+===|::;::.:"|=oia(.a::.i^=e:|)====v{1Xm!{(=n.:.:||.,,,.........;`.......;:: =;:=>+v-+::,_. :_..------......:;=a;+.-||=_a;-.===|=ii=|==<br>
|
||||
+|=++++++++=+++=====:::::.::|_%I!+++=+>}:I(:v%`::|;.%==;vswc_:=%v==i..............:...`:_:;/+=:>=+ . -a`. ..-.......--.-..:+a(=%:=,--++::.;=;+====+++|<br>
|
||||
+++++|++|+++=+===|;|:i>;;;:-:=|.=>a._=,..:c.{;:av+I-:{iauZ!:=.....ai.......#..1:`..;.:::+==a{v:~:.l:..=;:_:-.: _--......+..,a|%`>---::|::+=======|===+<br>
|
||||
+++|=+++++|=||=|===;;=|+=:;.---=|2I~={r.:=-:=|=s,.-:==+_ac+!|"=..}n.......;.?'- ..;..=..`..._.;;l. .:_.,,:.:`.:-_./../_.::>=I||=- :::;:i:;==+======+++<br>
|
||||
+|++++++|++++==++|==;:i=;;=;;.::=~ .=>:,..:>%:>....---.:>^,"~:;._svIq,.?A"i=|- . .:~-: .::+;. ~..> :`. -- ....=- -: .=|.. =>=:;::.:+;;;:;=;=+=|=+++++=<br>
|
||||
++++++|+++++++|=+========;==+:i..a>`-+Ii=.-`..........:=.a,i;vi|+deuYVwmmeof+`..../..:/..:>_a :`.._.-._.=;:= . :...-=i=.:;::=i======:::=|====+=+|=++++<br>
|
||||
+++++++++++++++++=>=======:=;==..-`....:,...:au,:;-`..as'=++:_;a+Y1+aaX)3f)'_-.//...);:.~=,=~..=:|~;.=..:=_%. =+`..:=;.|=li;:_=>=:=:;;=;;;===+++=++++|<br>
|
||||
+|++|+++|=|=|=++++|=+i===:;:==;:....:.::--.;:-^./==::.:v.a>)E a/_d>aa=!ajp_:,>..=--.a==:.o=/.;-_=;>:==:_,:)aai:;.:::;=:;=:|::>=iiIi===;=+==+=+++++++++<br>
|
||||
+++++++|=+++++|=+=========+=+=+~-...- ..::;:-=--=v%.-;%`:: - ;a)+?("r-_33}^;=u;://i)".-., ..__%;%==>:====::>=_i==:::===::|::a>||=>=>===+=+=+++++++|+++<br>
|
||||
++++++++++++++=++++|==|=|=|=+;-.:;...,. >`:..:.=}".::.::==,=ai;.._%..IYY$2-vp~`.:_,.:`...::.===:1:==>=|~=|ai>*i====::;:;a;==>=|======+=+=+++++++++++++<br>
|
||||
+|++|++++|++|++|+++=++=|====+=:||=;..=-.:-....=:`-:|::..=:+.-:an>YYX+`aade{d( .=-2;...:`.: =|..:=;:i=|-_=v}i%=++::::.i%|+=|==|===|+|++++++++++++|=|=+|<br>
|
||||
+++++++|+++++++++++|+===|===|;=2i>^:--._:_,.:==..:"`.;-.~.::-+{*':=; .:3#::uc .==e`:-`..._.vui-a>=+:a=||I}|:=:=;l:::=:====+=a===||==++++++++++++++++++<br>
|
||||
+++++++++++++++++++||++===|Il^.ai_.%:_}C=)+=a>a...:.--.:=:`.:.._/-aS(:%mmqc3Wc(_c`._, ..- :-::u*::+=::==+====;==a=|;=++===|==+++|==+|=+++++|++|+++++++<br>
|
||||
+|++|++++++|++|+||=|++=|=+=|=_%(ai+|=>=v(.:a%=;=. =ia;- ... :=;-`+=`=_i3r}"=32-.s;_;..:==.=|=)+=i=s::::;:====+;;;;;|==|==++||++++++|=+|=++++++++++|+++<br>
|
||||
+++++++|++|=++++|+|+|=|=;==;i%a}~:=*!+|-.|=v=n-:.;n?Xi-a>%|=:;. :.+.-*m(`|::a>av>C......-=*. :_p==|>=;====>======++==||==+===++|=++++++++|=+++++++++++<br> <br>
|
||||
<div class="title" > Guatavita Lagoon, CUN, COL <div>
|
||||
</div>
|
||||
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 1.1 MiB |
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Binary file not shown.
Binary file not shown.
|
Before Width: | Height: | Size: 577 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 6.8 KiB |
@ -1,47 +0,0 @@
|
||||
<style type=""text/css"">
|
||||
code{white-space: pre-wrap;}
|
||||
span.smallcaps{font-variant: small-caps;}
|
||||
span.underline{text-decoration: underline;}
|
||||
div.column{display: inline-block; vertical-align: top; width: 50%;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
<style>
|
||||
@page{
|
||||
size: A3;
|
||||
margin: 15mm;
|
||||
background-image: url("A0Grid_30opac-01.png");
|
||||
background-size: cover;
|
||||
font-family: monospace;
|
||||
border:1px dotted #00939b;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
body{
|
||||
margin: 15mm;
|
||||
background-image: url("A0Grid_30opac-01.png");
|
||||
background-size: cover;
|
||||
font-family: Roboto Mono;
|
||||
font-size: 10pt;
|
||||
line-height: 1.4;
|
||||
color: black;
|
||||
padding: 10px }
|
||||
}
|
||||
|
||||
h1{
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-size: 100pt;
|
||||
line-height: 1.25;
|
||||
color: #00939b;
|
||||
}
|
||||
strong{
|
||||
color: blue;
|
||||
}
|
||||
em{
|
||||
color: green;
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
@ -1,207 +0,0 @@
|
||||
{
|
||||
"cells": [
|
||||
{
|
||||
"cell_type": "markdown",
|
||||
"metadata": {},
|
||||
"source": [
|
||||
"# NLTK pos-tagged HTML → PDF"
|
||||
]
|
||||
},
|
||||
{
|
||||
"cell_type": "code",
|
||||
"execution_count": 4,
|
||||
"metadata": {},
|
||||
"outputs": [],
|
||||
"source": [
|
||||
"import nltk\n",
|
||||
"from weasyprint import HTML, CSS"
|
||||
]
|
||||
},
|
||||
{
|
||||
"cell_type": "code",
|
||||
"execution_count": 5,
|
||||
"metadata": {},
|
||||
"outputs": [],
|
||||
"source": [
|
||||
"# open the input file\n",
|
||||
"txt = open('manifesto1.txt').read()\n",
|
||||
"words = nltk.word_tokenize(txt)\n",
|
||||
"tagged_words = nltk.pos_tag(words)"
|
||||
]
|
||||
},
|
||||
{
|
||||
"cell_type": "code",
|
||||
"execution_count": 22,
|
||||
"metadata": {},
|
||||
"outputs": [
|
||||
{
|
||||
"name": "stdout",
|
||||
"output_type": "stream",
|
||||
"text": [
|
||||
"A0Grid_30opac-01.png manifesto.pdf\n",
|
||||
"language.css\t nltk-frequency-distribution-Copy1.ipynb\n",
|
||||
"manifesto1.txt\t nltk-pos-tagger-Copy1.ipynb\n",
|
||||
"manifesto.css\t nltk-pos-tagging-and-weasyprint.ipynb\n",
|
||||
"manifesto.html\t nltk-similar-words-Copy1.ipynb\n",
|
||||
"manifestonltk.ipynb pattern-search-Copy1.ipynb\n"
|
||||
]
|
||||
}
|
||||
],
|
||||
"source": [
|
||||
"!ls"
|
||||
]
|
||||
},
|
||||
{
|
||||
"cell_type": "code",
|
||||
"execution_count": 6,
|
||||
"metadata": {},
|
||||
"outputs": [],
|
||||
"source": [
|
||||
"# collect all the pieces of HTML\n",
|
||||
"content = ''\n",
|
||||
"content += '<h1>A Liquid Manifesto</h1>'\n",
|
||||
"\n",
|
||||
"for word, tag in tagged_words:\n",
|
||||
" content += f'<span class=\"{ tag }\">{ word }</span> '"
|
||||
]
|
||||
},
|
||||
{
|
||||
"cell_type": "code",
|
||||
"execution_count": 7,
|
||||
"metadata": {},
|
||||
"outputs": [],
|
||||
"source": [
|
||||
"# write the HTML file\n",
|
||||
"with open(\"manifesto.html\", \"w\") as f:\n",
|
||||
" f.write(f\"\"\"<!DOCTYPE html>\n",
|
||||
"<html>\n",
|
||||
"<head>\n",
|
||||
" <meta charset=\"utf-8\">\n",
|
||||
" <link rel=\"stylesheet\" type=\"text/css\" href=\"manifesto.css\">\n",
|
||||
" <title></title>\n",
|
||||
"</head>\n",
|
||||
"<body>\n",
|
||||
"{ content }\n",
|
||||
"</body>\n",
|
||||
"\"\"\")"
|
||||
]
|
||||
},
|
||||
{
|
||||
"cell_type": "code",
|
||||
"execution_count": 8,
|
||||
"metadata": {},
|
||||
"outputs": [],
|
||||
"source": [
|
||||
"# write a CSS file\n",
|
||||
"with open(\"language.css\", \"w\") as f:\n",
|
||||
" f.write(\"\"\"\n",
|
||||
"\n",
|
||||
"@page{\n",
|
||||
" size:A4;\n",
|
||||
" background-color:lightgrey;\n",
|
||||
" margin:10mm;\n",
|
||||
"}\n",
|
||||
".JJ{\n",
|
||||
" color:red;\n",
|
||||
"}\n",
|
||||
".VB,\n",
|
||||
".VBG{\n",
|
||||
" color:magenta;\n",
|
||||
"}\n",
|
||||
".NN,\n",
|
||||
".NNP{\n",
|
||||
" color:green;\n",
|
||||
"}\n",
|
||||
".EX{\n",
|
||||
" color: blue;\n",
|
||||
"}\n",
|
||||
" \"\"\")"
|
||||
]
|
||||
},
|
||||
{
|
||||
"cell_type": "code",
|
||||
"execution_count": 9,
|
||||
"metadata": {},
|
||||
"outputs": [],
|
||||
"source": [
|
||||
"# If you use @font-face in your stylesheet, you would need Weasyprint's FontConfiguration()\n",
|
||||
"from weasyprint.fonts import FontConfiguration\n",
|
||||
"\n",
|
||||
"font_config = FontConfiguration()"
|
||||
]
|
||||
},
|
||||
{
|
||||
"cell_type": "code",
|
||||
"execution_count": null,
|
||||
"metadata": {},
|
||||
"outputs": [],
|
||||
"source": [
|
||||
"# collect all the files and write the PDF\n",
|
||||
"html = HTML(\"manifesto.html\")\n",
|
||||
"css = CSS(\"manifesto.css\")\n",
|
||||
"html.write_pdf('manifesto.pdf', stylesheets=[css], font_config=font_config)"
|
||||
]
|
||||
},
|
||||
{
|
||||
"cell_type": "code",
|
||||
"execution_count": 1,
|
||||
"metadata": {},
|
||||
"outputs": [
|
||||
{
|
||||
"data": {
|
||||
"text/html": [
|
||||
"\n",
|
||||
" <iframe\n",
|
||||
" width=\"900\"\n",
|
||||
" height=\"600\"\n",
|
||||
" src=\".pdf\"\n",
|
||||
" frameborder=\"0\"\n",
|
||||
" allowfullscreen\n",
|
||||
" ></iframe>\n",
|
||||
" "
|
||||
],
|
||||
"text/plain": [
|
||||
"<IPython.lib.display.IFrame at 0xb3d3b310>"
|
||||
]
|
||||
},
|
||||
"execution_count": 1,
|
||||
"metadata": {},
|
||||
"output_type": "execute_result"
|
||||
}
|
||||
],
|
||||
"source": [
|
||||
"# Preview your PDF in the notebook!\n",
|
||||
"from IPython.display import IFrame, display\n",
|
||||
"IFrame(\".pdf\", width=900, height=600)"
|
||||
]
|
||||
},
|
||||
{
|
||||
"cell_type": "code",
|
||||
"execution_count": null,
|
||||
"metadata": {},
|
||||
"outputs": [],
|
||||
"source": []
|
||||
}
|
||||
],
|
||||
"metadata": {
|
||||
"kernelspec": {
|
||||
"display_name": "Python 3",
|
||||
"language": "python",
|
||||
"name": "python3"
|
||||
},
|
||||
"language_info": {
|
||||
"codemirror_mode": {
|
||||
"name": "ipython",
|
||||
"version": 3
|
||||
},
|
||||
"file_extension": ".py",
|
||||
"mimetype": "text/x-python",
|
||||
"name": "python",
|
||||
"nbconvert_exporter": "python",
|
||||
"pygments_lexer": "ipython3",
|
||||
"version": "3.7.3"
|
||||
}
|
||||
},
|
||||
"nbformat": 4,
|
||||
"nbformat_minor": 4
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -1,8 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<link rel="stylesheet" type="text/css" href="manifesto.css">
|
||||
<title>TEXT AS IMAGE</title>
|
||||
|
||||
<link rel="icon" href="liquid.png" type="image/png"/>
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 6.8 KiB |
@ -1,3 +0,0 @@
|
||||
<p style="color:blue">Sadness :(<p>
|
||||
|
||||
<a href='../'>go back</a>
|
||||
File diff suppressed because one or more lines are too long
@ -1,157 +0,0 @@
|
||||
body{
|
||||
margin: 2vw;
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
text-align: center;
|
||||
color: black;
|
||||
font-size: 1.5vw;
|
||||
text-align: justify;
|
||||
text-justify: inter-word;
|
||||
display: absolute;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
#conts{
|
||||
margin: 10vw;
|
||||
box-shadow: 0 2vw 6vw 2vw green, 0 3vw 4vw 0 green;
|
||||
padding: 2vw;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/*
|
||||
|
||||
|
||||
header:hover{
|
||||
-webkit-animation:spin 1s linear infinite;
|
||||
-moz-animation:spin 1s linear infinite;
|
||||
animation:spin 1s linear infinite;
|
||||
color: white;
|
||||
|
||||
}
|
||||
|
||||
h1{
|
||||
font-size: 55px;
|
||||
color: #0066cc;
|
||||
color: #909090;
|
||||
|
||||
}
|
||||
|
||||
h2{
|
||||
font-size: 45px;
|
||||
color: #0033cc;
|
||||
color: #BEBEBE;
|
||||
}
|
||||
|
||||
h3{
|
||||
font-size: 35px;
|
||||
color: #0066cc;
|
||||
color: #DCDCDC;
|
||||
}
|
||||
|
||||
h3:hover{
|
||||
-webkit-animation:spin 1s linear infinite;
|
||||
-moz-animation:spin 1s linear infinite;
|
||||
animation:spin 1s linear infinite;
|
||||
color: white;
|
||||
|
||||
}
|
||||
|
||||
div{
|
||||
/*border: 5px dashed white;*//*
|
||||
padding: 2vw 1vw ;
|
||||
margin: 5vw 10vw;
|
||||
}
|
||||
|
||||
a{
|
||||
text-decoration: underline;
|
||||
color: #909090
|
||||
}
|
||||
|
||||
a:visited{
|
||||
text-decoration: none;
|
||||
color: white;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: red;
|
||||
|
||||
}
|
||||
|
||||
#square{
|
||||
width: 15vw;
|
||||
height: 30vw;
|
||||
background-color: rgba(100,100,100,50);
|
||||
border: none;
|
||||
}
|
||||
|
||||
p{
|
||||
text-align: justify;
|
||||
text-justify: inter-word;
|
||||
font-size:20px;
|
||||
margin: 0 15vw;
|
||||
}
|
||||
|
||||
b{
|
||||
text-align: justify;
|
||||
text-justify: inter-word;
|
||||
color: red
|
||||
}
|
||||
|
||||
ol{
|
||||
text-align: left;
|
||||
font-size:20px;
|
||||
margin: 0 15vw;
|
||||
}
|
||||
|
||||
.home{
|
||||
margin: 1vw;
|
||||
font-size:3vw;
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
.home:hover{
|
||||
-webkit-animation:spin 1s linear infinite;
|
||||
-moz-animation:spin 1s linear infinite;
|
||||
animation:spin 1s linear infinite;
|
||||
}
|
||||
|
||||
@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
|
||||
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
|
||||
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }
|
||||
|
||||
|
||||
*/
|
||||
|
||||
|
||||
|
||||
h1{
|
||||
font-style: bold;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: black
|
||||
}
|
||||
|
||||
h2{
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: black
|
||||
}
|
||||
|
||||
button{
|
||||
width: 7vw;
|
||||
height: 5vw;
|
||||
}
|
||||
|
||||
a:visited{
|
||||
text-decoration:none;
|
||||
}
|
||||
|
||||
a{
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
#butts{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
}
|
||||
@ -1,217 +0,0 @@
|
||||
strong{
|
||||
color: blue;
|
||||
}
|
||||
|
||||
em{
|
||||
color: green;
|
||||
}
|
||||
|
||||
body{
|
||||
margin: 2vw;
|
||||
font-size: 1.5vw;
|
||||
text-align: justify;
|
||||
text-justify: inter-word;
|
||||
line-height: 1.5;
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
color: rgba(0,0,0,0);
|
||||
display: absolute;
|
||||
}
|
||||
|
||||
#conts{
|
||||
margin: 10vw;
|
||||
box-shadow: 0 2vw 6vw 2vw green, 0 3vw 4vw 0 green;
|
||||
}
|
||||
|
||||
span.CC{
|
||||
background-color:#333300
|
||||
}
|
||||
|
||||
span.CD{
|
||||
background-color:#999900
|
||||
}
|
||||
|
||||
span.DT{
|
||||
|
||||
background-color: #ff00ff
|
||||
}
|
||||
|
||||
span.EX{
|
||||
background-color: #006080
|
||||
}
|
||||
|
||||
span.FW{
|
||||
background-color:#f6f6ee
|
||||
}
|
||||
|
||||
span.IN{
|
||||
background-color:#ffccff
|
||||
}
|
||||
|
||||
span.JJ{
|
||||
|
||||
background-color: #f2f2f2;
|
||||
}
|
||||
|
||||
span.JJR{
|
||||
|
||||
background-color: #b3b3b3
|
||||
}
|
||||
|
||||
span.JJS{
|
||||
background-color:#737373
|
||||
}
|
||||
|
||||
span.LS{
|
||||
background-color:#666633
|
||||
}
|
||||
|
||||
span.MD{
|
||||
background-color:#00cc00
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
span.NN{
|
||||
background-color:#33ff33
|
||||
}
|
||||
|
||||
span.NNS{
|
||||
background-color:#80ff80
|
||||
}
|
||||
|
||||
span.NNP{
|
||||
background-color:#ccffcc
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
span.PDT{
|
||||
background-color:#ffd1b3
|
||||
}
|
||||
|
||||
span.POS{
|
||||
background-color:#ffb380
|
||||
}
|
||||
|
||||
span.PRP{
|
||||
background-color:#ff8533
|
||||
}
|
||||
|
||||
span.PRP${
|
||||
background-color:#e65c00
|
||||
}
|
||||
|
||||
span.RB{
|
||||
background-color:#ff8080
|
||||
}
|
||||
|
||||
span.RBR{
|
||||
background-color:#ff4d4d
|
||||
}
|
||||
|
||||
span.RBS{
|
||||
background-color:#e60000
|
||||
}
|
||||
|
||||
span.RP{
|
||||
background-color:#992600
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
span.SYM{
|
||||
background-color:#99ff33
|
||||
}
|
||||
|
||||
span.TO{
|
||||
|
||||
background-color: black
|
||||
}
|
||||
|
||||
span.UH{
|
||||
background-color:#ffff00
|
||||
}
|
||||
|
||||
span.VB{
|
||||
background-color: #000099
|
||||
}
|
||||
|
||||
span.VBD{
|
||||
|
||||
background-color: #0000e6
|
||||
}
|
||||
|
||||
span.VBG{
|
||||
background-color:#1a1aff
|
||||
}
|
||||
|
||||
span.VBN{
|
||||
background-color: #4d4dff
|
||||
}
|
||||
|
||||
span.VBP{
|
||||
background-color: #b3b3ff
|
||||
}
|
||||
|
||||
span.VBZ{
|
||||
background-color: #ccccff
|
||||
}
|
||||
|
||||
span.WDT{
|
||||
background-color:#ccffff
|
||||
}
|
||||
|
||||
span.WP{
|
||||
background-color:#66ffff
|
||||
}
|
||||
span.WP${
|
||||
background-color:#00e6e6
|
||||
}
|
||||
|
||||
span.WRB{t
|
||||
background-color: #008080
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
h1{
|
||||
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: black
|
||||
}
|
||||
|
||||
h2{
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: black
|
||||
}
|
||||
|
||||
button{
|
||||
width: 7vw;
|
||||
height: 5vw;
|
||||
}
|
||||
|
||||
a:visited{
|
||||
text-decoration:none;
|
||||
}
|
||||
|
||||
a{
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
#butts{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-direction: row;
|
||||
}
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 15 KiB |
@ -1,236 +0,0 @@
|
||||
@font-face {
|
||||
font-family: "CothamSans";
|
||||
src: url("../assets/fonts/CothamSans.otf");
|
||||
}
|
||||
|
||||
:root{
|
||||
font-family:"CothamSans";
|
||||
--reg:4vw;
|
||||
--tit:6vw;
|
||||
--green:#00ff00;
|
||||
--pink:#ff00d9;
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
|
||||
|
||||
html {
|
||||
margin: 0;
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
width: 300%;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
|
||||
|
||||
img{
|
||||
width: 15%;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
#container{
|
||||
|
||||
}
|
||||
|
||||
|
||||
#img1{
|
||||
animation: infinite cycle1 3s ;
|
||||
margin-left: 50%;
|
||||
}
|
||||
|
||||
#img2{
|
||||
animation: infinite cycle2 3s ;
|
||||
margin-left: 30%;
|
||||
margin-top: 30%
|
||||
}
|
||||
|
||||
#img3{
|
||||
animation: infinite cycle3 3s ;
|
||||
margin-top: 30%;
|
||||
margin-left: 70%
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
p, a{
|
||||
font-size: var(--reg);
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.texts{
|
||||
margin: 1.5%;
|
||||
}
|
||||
|
||||
.texts .left,.center,.right{
|
||||
float: left;
|
||||
width: 33%;
|
||||
}
|
||||
|
||||
.left{
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.center{
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.right{
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
#practical{
|
||||
font-size: var(--tit);
|
||||
color: var(--pink);
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.left{
|
||||
margin-top: -4%;
|
||||
}
|
||||
|
||||
.left p{
|
||||
padding: 20% 5%;
|
||||
}
|
||||
|
||||
.center p{
|
||||
padding: 20% 5%;
|
||||
}
|
||||
|
||||
.right p{
|
||||
padding: 20% 0 ;
|
||||
}
|
||||
|
||||
.center{
|
||||
margin-top: 28%;
|
||||
}
|
||||
|
||||
.right{
|
||||
margin-top: 50% ;
|
||||
}
|
||||
|
||||
|
||||
.left div{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
/* border: red solid 3px; */
|
||||
/* margin-top: 50%; */
|
||||
/* position: absolute÷; */
|
||||
/* margin-top:-50% */
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
#descriptio{
|
||||
width: 10%;
|
||||
/* margin-left: 60%; */
|
||||
z-index: 20;
|
||||
border: var(--pink) solid 3px;
|
||||
background-color: rgba(255, 0, 242, 0.5);
|
||||
}
|
||||
|
||||
#descriptio p{
|
||||
padding: 0 1vw;
|
||||
font-size: 40px;
|
||||
color: white
|
||||
}
|
||||
|
||||
#descriptio > a{
|
||||
padding: 0 1vw;
|
||||
font-size: 40px;
|
||||
color: var(--pink)
|
||||
}
|
||||
|
||||
|
||||
a{
|
||||
color:var(--green);
|
||||
text-decoration: underline;
|
||||
text-decoration-color: var(--pink);
|
||||
-webkit-text-decoration-color:var(--pink);
|
||||
text-shadow: 10px 10px 4px rgba(51, 255, 0, 0.1)
|
||||
}
|
||||
|
||||
p{
|
||||
text-shadow: 10px 10px 5px rgba(0,0,0, 0.1)
|
||||
}
|
||||
|
||||
span2{
|
||||
color:var(--green);
|
||||
text-shadow: 10px 10px 4px rgba(51, 255, 0, 0.1)
|
||||
}
|
||||
|
||||
.testa{
|
||||
position: fixed;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
/* font-size: 3px; */
|
||||
width: 10%;
|
||||
/* margin-left: 5%; */
|
||||
margin: 10px 0
|
||||
}
|
||||
|
||||
|
||||
|
||||
button{
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
display: inline-block;
|
||||
margin: .3vw 1vw;
|
||||
padding: .5vw;
|
||||
min-width: 8vw;
|
||||
min-height: 2.5vw;
|
||||
background-color: rgb(255);
|
||||
border-radius: 40px;
|
||||
box-shadow: 5px 8px 30px var(--pink);
|
||||
}
|
||||
|
||||
.testa button:nth-child(2){margin-bottom: 30vh;}
|
||||
|
||||
button a{
|
||||
font-family: "CothamSans";
|
||||
text-decoration: none;
|
||||
font-size: .8vw;
|
||||
color: var(--pink)
|
||||
|
||||
|
||||
}
|
||||
|
||||
@keyframes cycle1 {
|
||||
0% { transform: rotate(88deg); }
|
||||
50% {transform: rotate(121deg);}
|
||||
100% {transform: rotate(88deg); }
|
||||
}
|
||||
|
||||
@keyframes cycle2 {
|
||||
0% { transform: rotate(1deg)}
|
||||
50% {transform: rotate(33deg)}
|
||||
100 {transform: rotate(1deg);}
|
||||
}
|
||||
|
||||
@keyframes cycle3 {
|
||||
0% { transform: rotate(185deg)}
|
||||
50% {transform: rotate(151deg)}
|
||||
100% {transform: rotate(185deg);}
|
||||
}
|
||||
@ -1,169 +0,0 @@
|
||||
:root{
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
--background-color: white;
|
||||
--regular: 1.5vw
|
||||
}
|
||||
|
||||
body{
|
||||
margin: 0 ;
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
background-color: var(--background-color);
|
||||
background-image: url('grid.png');
|
||||
background-size: 8vw;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
header{
|
||||
z-index: 80;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
transform: rotate(-13deg);
|
||||
font-size: 7vw;
|
||||
color: rgb(227, 224, 240);
|
||||
margin: 0 10%;
|
||||
animation: cycle 1s linear ;
|
||||
color: rgba(0,0,0,0);
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
|
||||
|
||||
button{
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
display: inline-block;
|
||||
padding: 0.5vw 1.3em;
|
||||
color: blue;
|
||||
font-size: var(--regular);
|
||||
text-decoration: none;
|
||||
margin-bottom: 1.5vw;
|
||||
background-color: rgba(104, 96, 226, 0.164);
|
||||
border-radius: 40px;
|
||||
box-shadow: 3px 8px 20px rgba(78, 78, 219, 0.76);
|
||||
}
|
||||
|
||||
nav{
|
||||
z-index: 100;
|
||||
padding: 1vw;
|
||||
margin: 0;
|
||||
position: fixed;
|
||||
display: flex;
|
||||
-webkit-box-align: start;
|
||||
align-items: flex-start;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-box-direction: normal;
|
||||
flex-direction: column;
|
||||
color: blue;
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
#print{
|
||||
color: red;
|
||||
background-color: rgba(226, 96, 96, 0.164);
|
||||
border-radius: 50px 4px;
|
||||
box-shadow: 3px 8px 20px rgba(214, 29, 53, 0.76);
|
||||
position: absolute;
|
||||
bottom:1vw;
|
||||
left:1vw;
|
||||
}
|
||||
|
||||
.container {
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.contents{
|
||||
color: red;
|
||||
overflow: scroll;
|
||||
overflow-x: hidden;
|
||||
z-index: 110;
|
||||
background-color: white;
|
||||
box-shadow: 1px 3px 90px 20px rgba(4, 14, 70, 0.76) ;
|
||||
border: blue 0.5vw;
|
||||
width: 70vw;
|
||||
height: 70vh;
|
||||
margin-left: 10vw;
|
||||
padding: 2vw;
|
||||
|
||||
}
|
||||
|
||||
.contents p{
|
||||
text-align: justify;
|
||||
text-justify: auto;
|
||||
}
|
||||
|
||||
.contents h1, h2{
|
||||
color: blue;
|
||||
}
|
||||
|
||||
|
||||
.legenda{
|
||||
columns: 2;
|
||||
padding: 0.3vw;
|
||||
z-index: 170;
|
||||
border: black dashed 0.3vw;
|
||||
width: 15%;
|
||||
height: 15%;
|
||||
|
||||
position:absolute;
|
||||
bottom:1vw;
|
||||
right:1vw;
|
||||
}
|
||||
|
||||
|
||||
ul{
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
justify-content: space-around;
|
||||
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
|
||||
}
|
||||
|
||||
li{
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
display: flex;
|
||||
font-size: 1vw;
|
||||
/* align-content: stretch; */
|
||||
|
||||
}
|
||||
|
||||
p{
|
||||
text-align: justify;
|
||||
text-justify: auto;
|
||||
color: #0000cd;
|
||||
}
|
||||
|
||||
#column{
|
||||
columns: 2;
|
||||
column-gap: 35%;
|
||||
}
|
||||
|
||||
#title{
|
||||
height: 20vh;
|
||||
}
|
||||
|
||||
|
||||
|
||||
@keyframes cycle {
|
||||
0% { text-shadow: rgb(43, 98, 201) 10px 10px 20px;}
|
||||
20% {color: darkblue;}
|
||||
40% {text-shadow:darkblue 10px 10px 20px;}
|
||||
60% {text-shadow: rgb(43, 98, 201) 10px 10px 200px;}
|
||||
80% { color: rgba(227, 224, 240,0);}
|
||||
90% {display: none; visibility: hidden;}
|
||||
}
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
@ -1,16 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>ascii magic</title>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
|
||||
<link type="text/css" rel="stylesheet" href="body.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
<script type="module" src="ascii.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -1,105 +0,0 @@
|
||||
import * as THREE from '/sandbot/words-for-the-future/RESURGENCE/GLTFLoader/js/three/build/three.module.js';
|
||||
|
||||
import { AsciiEffect } from '/sandbot/words-for-the-future/RESURGENCE/jsm/effects/AsciiEffect.js';
|
||||
import { TrackballControls } from '/sandbot/words-for-the-future/RESURGENCE/jsm/controls/TrackballControls.js';
|
||||
|
||||
let camera, controls, scene, renderer, effect;
|
||||
|
||||
let sphere, torus, plane;
|
||||
|
||||
const start = Date.now();
|
||||
|
||||
init();
|
||||
animate();
|
||||
|
||||
|
||||
|
||||
function init() {
|
||||
|
||||
camera = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 1, 1000 );
|
||||
camera.position.y = 150;
|
||||
camera.position.z = 500;
|
||||
|
||||
scene = new THREE.Scene();
|
||||
scene.background = new THREE.Color( 0, 0, 0 );
|
||||
|
||||
const pointLight1 = new THREE.PointLight( 0xff00ff );
|
||||
pointLight1.position.set( 500, 500, 500 );
|
||||
scene.add( pointLight1 );
|
||||
|
||||
const pointLight2 = new THREE.PointLight( 0xffffff, 0.25 );
|
||||
pointLight2.position.set( - 500, - 500, - 500 );
|
||||
scene.add( pointLight2 );
|
||||
|
||||
sphere = new THREE.Mesh( new THREE.SphereBufferGeometry( 200, 20, 10 ), new THREE.MeshPhongMaterial( { flatShading: true } ) );
|
||||
scene.add( sphere );
|
||||
|
||||
|
||||
torus = new THREE.Mesh (new THREE.TorusBufferGeometry( 8, 800, 10 ), new THREE.MeshPhongMaterial( { flatShading: true } ) );
|
||||
torus.position.x = 150;
|
||||
scene.add( torus );
|
||||
// Plane
|
||||
|
||||
plane = new THREE.Mesh( new THREE.PlaneBufferGeometry( 1000, 1000 ), new THREE.MeshBasicMaterial( { color: 0xe0e0e0 } ) );
|
||||
plane.position.y = - 150;
|
||||
plane.rotation.x = - Math.PI / 2;
|
||||
scene.add( plane );
|
||||
|
||||
renderer = new THREE.WebGLRenderer();
|
||||
renderer.setSize( window.innerWidth, window.innerHeight );
|
||||
|
||||
effect = new AsciiEffect( renderer, '.:xmagicmagicmagic', { invert: true } );
|
||||
effect.setSize( window.innerWidth, window.innerHeight );
|
||||
effect.domElement.style.color = 'darkgray';
|
||||
effect.domElement.style.backgroundColor = 'black';
|
||||
|
||||
// Special case: append effect.domElement, instead of renderer.domElement.
|
||||
// AsciiEffect creates a custom domElement (a div container) where the ASCII elements are placed.
|
||||
|
||||
document.body.appendChild( effect.domElement );
|
||||
|
||||
controls = new TrackballControls( camera, effect.domElement );
|
||||
|
||||
//
|
||||
|
||||
window.addEventListener( 'resize', onWindowResize, false );
|
||||
|
||||
}
|
||||
|
||||
function onWindowResize() {
|
||||
|
||||
camera.aspect = window.innerWidth / window.innerHeight;
|
||||
camera.updateProjectionMatrix();
|
||||
|
||||
renderer.setSize( window.innerWidth, window.innerHeight );
|
||||
effect.setSize( window.innerWidth, window.innerHeight );
|
||||
|
||||
}
|
||||
|
||||
//
|
||||
|
||||
function animate() {
|
||||
|
||||
requestAnimationFrame( animate );
|
||||
|
||||
render();
|
||||
|
||||
}
|
||||
|
||||
function render() {
|
||||
|
||||
const timer = Date.now() - start;
|
||||
|
||||
sphere.position.y = Math.abs( Math.sin( timer * 0.002 ) ) * 150;
|
||||
sphere.rotation.x = timer * 0.0003;
|
||||
sphere.rotation.z = timer * 0.0002;
|
||||
|
||||
torus.position.y = Math.abs( Math.sin( timer * 0.002 ) ) * 120;
|
||||
torus.rotation.x = timer * 0.0004;
|
||||
torus.rotation.z = timer * 0.0001;
|
||||
|
||||
controls.update();
|
||||
|
||||
effect.render( scene, camera );
|
||||
|
||||
}
|
||||
@ -1,32 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>TEST</title>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
|
||||
<link type="text/css" rel="stylesheet" href="body.css">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<script defer src="game.js"></script>
|
||||
<script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
|
||||
<script type="text/javascript" src="rooms.js"></script>
|
||||
<script type="text/javascript" src="script.js"></script>
|
||||
|
||||
<div class="cover"></div>
|
||||
|
||||
<div class="container"><p>+ on the foot of the volcano +</p><br>
|
||||
<div id="text">Text</div>
|
||||
<div id="option-buttons" class="btn-grid">
|
||||
<button class="btn" id="btn">Option 1</button>
|
||||
<button class="btn">Option 2</button>
|
||||
<button class="btn">Option 3</button>
|
||||
<button class="btn">Option 4</button>
|
||||
</div><br><br>
|
||||
|
||||
<p>go <a href="../">home</a> </p>
|
||||
|
||||
<script type="module" src="main.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -1,133 +0,0 @@
|
||||
{
|
||||
"cells": [
|
||||
{
|
||||
"cell_type": "code",
|
||||
"execution_count": null,
|
||||
"metadata": {},
|
||||
"outputs": [],
|
||||
"source": [
|
||||
"import time\n",
|
||||
"import sys\n",
|
||||
"\n",
|
||||
"a = 0.2\n",
|
||||
"b = 2\n",
|
||||
"\n",
|
||||
"def inventoryWipe():\n",
|
||||
" file = open(\"inventory.txt\", \"w\")\n",
|
||||
" file.close()\n",
|
||||
"inventoryWipe()\n",
|
||||
"\n",
|
||||
"print(\" _________\")\n",
|
||||
"print(\" / ======= .\")\n",
|
||||
"print(\" / __________. \")\n",
|
||||
"print(\" | ___________ |\")\n",
|
||||
"print(\" | | words | |\")\n",
|
||||
"print(\" | | for | |\")\n",
|
||||
"print(\" | |_the_____| |________________________\")\n",
|
||||
"print(\" \\=____________/ future )\")\n",
|
||||
"print(\" / =========== \\ /\")\n",
|
||||
"print(\"/ ::::::::::::: \\ =D-'\")\n",
|
||||
"print(\"(________________)\")\n",
|
||||
"s = '\"Hello Traveler\"'\n",
|
||||
"for character in s:\n",
|
||||
" sys.stdout.write(character)\n",
|
||||
" sys.stdout.flush()\n",
|
||||
" time.sleep(a)\n",
|
||||
"time.sleep(b)\n",
|
||||
"print()\n",
|
||||
"print('Enter your name:')\n",
|
||||
"name = input()\n",
|
||||
"count = 0\n",
|
||||
"\n",
|
||||
"def select_element():\n",
|
||||
" global count\n",
|
||||
" print('Hello, ' + name + \". Welcome to ***Earthrise***. Are you ready to set sail to the land of the future? If yes, pick one of these elements to start: water, fire, wind\")\n",
|
||||
" time.sleep(b)\n",
|
||||
"\n",
|
||||
" while True:\n",
|
||||
"\n",
|
||||
" print('Type your choice below, ' + name + '!')\n",
|
||||
" element = input()\n",
|
||||
" if element.lower().strip() == \"water\":\n",
|
||||
" print('Great work, ' + name + ', Captain Atata picked you up with his ferry! Where should we go from here? (north/west)')\n",
|
||||
" count = count + 1\n",
|
||||
" print(count)\n",
|
||||
" elif element.lower().strip() == \"fire\":\n",
|
||||
" print('Great work, ' + name + ', You find yourself at the foot of an active volcano. Where do we go from here? (north/west)')\n",
|
||||
" count = count + 1\n",
|
||||
" elif element.lower().strip() == \"wind\":\n",
|
||||
" print('You lift off the earth into the skies now, ' + name + ', you are floating. Where do we go from here? (north/west)')\n",
|
||||
" count = count + 1\n",
|
||||
" else:\n",
|
||||
" print(\"this spell has no power here.\")\n",
|
||||
"\n",
|
||||
"\n",
|
||||
" direction = input()\n",
|
||||
" if direction.lower().strip() == \"west\" and count == 1:\n",
|
||||
" print(\"You are walking along a \" + element + \" stream until you see a big book.\")\n",
|
||||
"\n",
|
||||
" elif direction.lower().strip() == \"north\":\n",
|
||||
" print(\"You find yourself in a dense forest. By your feet you see a magic elixier and a whistle. You only have space for one, which one do you pick? (elixier/whistle)\")\n",
|
||||
" count = count + 1\n",
|
||||
" else:\n",
|
||||
" print(\"this spell has no power here.\")\n",
|
||||
"\n",
|
||||
" object = input()\n",
|
||||
" if object.lower().strip() == \"elixier\" and count == 2:\n",
|
||||
" print(\"You don't understand what to use it for yet, so you keep on walking.\")\n",
|
||||
"\n",
|
||||
" elif direction.lower().strip() == \"whistle\":\n",
|
||||
" print(\"You try to make sounds with it, until you finally suceed. You hear the whistle sound being echoed from far. (follow)\")\n",
|
||||
"\n",
|
||||
" else:\n",
|
||||
" print(\"this spell has no power here.\")\n",
|
||||
"select_element()\n",
|
||||
"\n",
|
||||
"\n",
|
||||
"\n"
|
||||
]
|
||||
},
|
||||
{
|
||||
"cell_type": "code",
|
||||
"execution_count": null,
|
||||
"metadata": {},
|
||||
"outputs": [],
|
||||
"source": []
|
||||
},
|
||||
{
|
||||
"cell_type": "code",
|
||||
"execution_count": null,
|
||||
"metadata": {},
|
||||
"outputs": [],
|
||||
"source": []
|
||||
},
|
||||
{
|
||||
"cell_type": "code",
|
||||
"execution_count": null,
|
||||
"metadata": {},
|
||||
"outputs": [],
|
||||
"source": []
|
||||
}
|
||||
],
|
||||
"metadata": {
|
||||
"kernelspec": {
|
||||
"display_name": "Python 3",
|
||||
"language": "python",
|
||||
"name": "python3"
|
||||
},
|
||||
"language_info": {
|
||||
"codemirror_mode": {
|
||||
"name": "ipython",
|
||||
"version": 3
|
||||
},
|
||||
"file_extension": ".py",
|
||||
"mimetype": "text/x-python",
|
||||
"name": "python",
|
||||
"nbconvert_exporter": "python",
|
||||
"pygments_lexer": "ipython3",
|
||||
"version": "3.7.3"
|
||||
}
|
||||
},
|
||||
"nbformat": 4,
|
||||
"nbformat_minor": 4
|
||||
}
|
||||
@ -1,754 +0,0 @@
|
||||
import {
|
||||
EventDispatcher,
|
||||
MOUSE,
|
||||
Quaternion,
|
||||
Vector2,
|
||||
Vector3
|
||||
} from "../../../build/three.module.js";
|
||||
|
||||
var TrackballControls = function ( object, domElement ) {
|
||||
|
||||
if ( domElement === undefined ) console.warn( 'THREE.TrackballControls: The second parameter "domElement" is now mandatory.' );
|
||||
if ( domElement === document ) console.error( 'THREE.TrackballControls: "document" should not be used as the target "domElement". Please use "renderer.domElement" instead.' );
|
||||
|
||||
var scope = this;
|
||||
var STATE = { NONE: - 1, ROTATE: 0, ZOOM: 1, PAN: 2, TOUCH_ROTATE: 3, TOUCH_ZOOM_PAN: 4 };
|
||||
|
||||
this.object = object;
|
||||
this.domElement = domElement;
|
||||
|
||||
// API
|
||||
|
||||
this.enabled = true;
|
||||
|
||||
this.screen = { left: 0, top: 0, width: 0, height: 0 };
|
||||
|
||||
this.rotateSpeed = 1.0;
|
||||
this.zoomSpeed = 1.2;
|
||||
this.panSpeed = 0.3;
|
||||
|
||||
this.noRotate = false;
|
||||
this.noZoom = false;
|
||||
this.noPan = false;
|
||||
|
||||
this.staticMoving = false;
|
||||
this.dynamicDampingFactor = 0.2;
|
||||
|
||||
this.minDistance = 0;
|
||||
this.maxDistance = Infinity;
|
||||
|
||||
this.keys = [ 65 /*A*/, 83 /*S*/, 68 /*D*/ ];
|
||||
|
||||
this.mouseButtons = { LEFT: MOUSE.ROTATE, MIDDLE: MOUSE.ZOOM, RIGHT: MOUSE.PAN };
|
||||
|
||||
// internals
|
||||
|
||||
this.target = new Vector3();
|
||||
|
||||
var EPS = 0.000001;
|
||||
|
||||
var lastPosition = new Vector3();
|
||||
var lastZoom = 1;
|
||||
|
||||
var _state = STATE.NONE,
|
||||
_keyState = STATE.NONE,
|
||||
|
||||
_eye = new Vector3(),
|
||||
|
||||
_movePrev = new Vector2(),
|
||||
_moveCurr = new Vector2(),
|
||||
|
||||
_lastAxis = new Vector3(),
|
||||
_lastAngle = 0,
|
||||
|
||||
_zoomStart = new Vector2(),
|
||||
_zoomEnd = new Vector2(),
|
||||
|
||||
_touchZoomDistanceStart = 0,
|
||||
_touchZoomDistanceEnd = 0,
|
||||
|
||||
_panStart = new Vector2(),
|
||||
_panEnd = new Vector2();
|
||||
|
||||
// for reset
|
||||
|
||||
this.target0 = this.target.clone();
|
||||
this.position0 = this.object.position.clone();
|
||||
this.up0 = this.object.up.clone();
|
||||
this.zoom0 = this.object.zoom;
|
||||
|
||||
// events
|
||||
|
||||
var changeEvent = { type: 'change' };
|
||||
var startEvent = { type: 'start' };
|
||||
var endEvent = { type: 'end' };
|
||||
|
||||
|
||||
// methods
|
||||
|
||||
this.handleResize = function () {
|
||||
|
||||
var box = scope.domElement.getBoundingClientRect();
|
||||
// adjustments come from similar code in the jquery offset() function
|
||||
var d = scope.domElement.ownerDocument.documentElement;
|
||||
scope.screen.left = box.left + window.pageXOffset - d.clientLeft;
|
||||
scope.screen.top = box.top + window.pageYOffset - d.clientTop;
|
||||
scope.screen.width = box.width;
|
||||
scope.screen.height = box.height;
|
||||
|
||||
};
|
||||
|
||||
var getMouseOnScreen = ( function () {
|
||||
|
||||
var vector = new Vector2();
|
||||
|
||||
return function getMouseOnScreen( pageX, pageY ) {
|
||||
|
||||
vector.set(
|
||||
( pageX - scope.screen.left ) / scope.screen.width,
|
||||
( pageY - scope.screen.top ) / scope.screen.height
|
||||
);
|
||||
|
||||
return vector;
|
||||
|
||||
};
|
||||
|
||||
}() );
|
||||
|
||||
var getMouseOnCircle = ( function () {
|
||||
|
||||
var vector = new Vector2();
|
||||
|
||||
return function getMouseOnCircle( pageX, pageY ) {
|
||||
|
||||
vector.set(
|
||||
( ( pageX - scope.screen.width * 0.5 - scope.screen.left ) / ( scope.screen.width * 0.5 ) ),
|
||||
( ( scope.screen.height + 2 * ( scope.screen.top - pageY ) ) / scope.screen.width ) // screen.width intentional
|
||||
);
|
||||
|
||||
return vector;
|
||||
|
||||
};
|
||||
|
||||
}() );
|
||||
|
||||
this.rotateCamera = ( function () {
|
||||
|
||||
var axis = new Vector3(),
|
||||
quaternion = new Quaternion(),
|
||||
eyeDirection = new Vector3(),
|
||||
objectUpDirection = new Vector3(),
|
||||
objectSidewaysDirection = new Vector3(),
|
||||
moveDirection = new Vector3(),
|
||||
angle;
|
||||
|
||||
return function rotateCamera() {
|
||||
|
||||
moveDirection.set( _moveCurr.x - _movePrev.x, _moveCurr.y - _movePrev.y, 0 );
|
||||
angle = moveDirection.length();
|
||||
|
||||
if ( angle ) {
|
||||
|
||||
_eye.copy( scope.object.position ).sub( scope.target );
|
||||
|
||||
eyeDirection.copy( _eye ).normalize();
|
||||
objectUpDirection.copy( scope.object.up ).normalize();
|
||||
objectSidewaysDirection.crossVectors( objectUpDirection, eyeDirection ).normalize();
|
||||
|
||||
objectUpDirection.setLength( _moveCurr.y - _movePrev.y );
|
||||
objectSidewaysDirection.setLength( _moveCurr.x - _movePrev.x );
|
||||
|
||||
moveDirection.copy( objectUpDirection.add( objectSidewaysDirection ) );
|
||||
|
||||
axis.crossVectors( moveDirection, _eye ).normalize();
|
||||
|
||||
angle *= scope.rotateSpeed;
|
||||
quaternion.setFromAxisAngle( axis, angle );
|
||||
|
||||
_eye.applyQuaternion( quaternion );
|
||||
scope.object.up.applyQuaternion( quaternion );
|
||||
|
||||
_lastAxis.copy( axis );
|
||||
_lastAngle = angle;
|
||||
|
||||
} else if ( ! scope.staticMoving && _lastAngle ) {
|
||||
|
||||
_lastAngle *= Math.sqrt( 1.0 - scope.dynamicDampingFactor );
|
||||
_eye.copy( scope.object.position ).sub( scope.target );
|
||||
quaternion.setFromAxisAngle( _lastAxis, _lastAngle );
|
||||
_eye.applyQuaternion( quaternion );
|
||||
scope.object.up.applyQuaternion( quaternion );
|
||||
|
||||
}
|
||||
|
||||
_movePrev.copy( _moveCurr );
|
||||
|
||||
};
|
||||
|
||||
}() );
|
||||
|
||||
|
||||
this.zoomCamera = function () {
|
||||
|
||||
var factor;
|
||||
|
||||
if ( _state === STATE.TOUCH_ZOOM_PAN ) {
|
||||
|
||||
factor = _touchZoomDistanceStart / _touchZoomDistanceEnd;
|
||||
_touchZoomDistanceStart = _touchZoomDistanceEnd;
|
||||
|
||||
if ( scope.object.isPerspectiveCamera ) {
|
||||
|
||||
_eye.multiplyScalar( factor );
|
||||
|
||||
} else if ( scope.object.isOrthographicCamera ) {
|
||||
|
||||
scope.object.zoom *= factor;
|
||||
scope.object.updateProjectionMatrix();
|
||||
|
||||
} else {
|
||||
|
||||
console.warn( 'THREE.TrackballControls: Unsupported camera type' );
|
||||
|
||||
}
|
||||
|
||||
} else {
|
||||
|
||||
factor = 1.0 + ( _zoomEnd.y - _zoomStart.y ) * scope.zoomSpeed;
|
||||
|
||||
if ( factor !== 1.0 && factor > 0.0 ) {
|
||||
|
||||
if ( scope.object.isPerspectiveCamera ) {
|
||||
|
||||
_eye.multiplyScalar( factor );
|
||||
|
||||
} else if ( scope.object.isOrthographicCamera ) {
|
||||
|
||||
scope.object.zoom /= factor;
|
||||
scope.object.updateProjectionMatrix();
|
||||
|
||||
} else {
|
||||
|
||||
console.warn( 'THREE.TrackballControls: Unsupported camera type' );
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
if ( scope.staticMoving ) {
|
||||
|
||||
_zoomStart.copy( _zoomEnd );
|
||||
|
||||
} else {
|
||||
|
||||
_zoomStart.y += ( _zoomEnd.y - _zoomStart.y ) * this.dynamicDampingFactor;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
this.panCamera = ( function () {
|
||||
|
||||
var mouseChange = new Vector2(),
|
||||
objectUp = new Vector3(),
|
||||
pan = new Vector3();
|
||||
|
||||
return function panCamera() {
|
||||
|
||||
mouseChange.copy( _panEnd ).sub( _panStart );
|
||||
|
||||
if ( mouseChange.lengthSq() ) {
|
||||
|
||||
if ( scope.object.isOrthographicCamera ) {
|
||||
|
||||
var scale_x = ( scope.object.right - scope.object.left ) / scope.object.zoom / scope.domElement.clientWidth;
|
||||
var scale_y = ( scope.object.top - scope.object.bottom ) / scope.object.zoom / scope.domElement.clientWidth;
|
||||
|
||||
mouseChange.x *= scale_x;
|
||||
mouseChange.y *= scale_y;
|
||||
|
||||
}
|
||||
|
||||
mouseChange.multiplyScalar( _eye.length() * scope.panSpeed );
|
||||
|
||||
pan.copy( _eye ).cross( scope.object.up ).setLength( mouseChange.x );
|
||||
pan.add( objectUp.copy( scope.object.up ).setLength( mouseChange.y ) );
|
||||
|
||||
scope.object.position.add( pan );
|
||||
scope.target.add( pan );
|
||||
|
||||
if ( scope.staticMoving ) {
|
||||
|
||||
_panStart.copy( _panEnd );
|
||||
|
||||
} else {
|
||||
|
||||
_panStart.add( mouseChange.subVectors( _panEnd, _panStart ).multiplyScalar( scope.dynamicDampingFactor ) );
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
}() );
|
||||
|
||||
this.checkDistances = function () {
|
||||
|
||||
if ( ! scope.noZoom || ! scope.noPan ) {
|
||||
|
||||
if ( _eye.lengthSq() > scope.maxDistance * scope.maxDistance ) {
|
||||
|
||||
scope.object.position.addVectors( scope.target, _eye.setLength( scope.maxDistance ) );
|
||||
_zoomStart.copy( _zoomEnd );
|
||||
|
||||
}
|
||||
|
||||
if ( _eye.lengthSq() < scope.minDistance * scope.minDistance ) {
|
||||
|
||||
scope.object.position.addVectors( scope.target, _eye.setLength( scope.minDistance ) );
|
||||
_zoomStart.copy( _zoomEnd );
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
this.update = function () {
|
||||
|
||||
_eye.subVectors( scope.object.position, scope.target );
|
||||
|
||||
if ( ! scope.noRotate ) {
|
||||
|
||||
scope.rotateCamera();
|
||||
|
||||
}
|
||||
|
||||
if ( ! scope.noZoom ) {
|
||||
|
||||
scope.zoomCamera();
|
||||
|
||||
}
|
||||
|
||||
if ( ! scope.noPan ) {
|
||||
|
||||
scope.panCamera();
|
||||
|
||||
}
|
||||
|
||||
scope.object.position.addVectors( scope.target, _eye );
|
||||
|
||||
if ( scope.object.isPerspectiveCamera ) {
|
||||
|
||||
scope.checkDistances();
|
||||
|
||||
scope.object.lookAt( scope.target );
|
||||
|
||||
if ( lastPosition.distanceToSquared( scope.object.position ) > EPS ) {
|
||||
|
||||
scope.dispatchEvent( changeEvent );
|
||||
|
||||
lastPosition.copy( scope.object.position );
|
||||
|
||||
}
|
||||
|
||||
} else if ( scope.object.isOrthographicCamera ) {
|
||||
|
||||
scope.object.lookAt( scope.target );
|
||||
|
||||
if ( lastPosition.distanceToSquared( scope.object.position ) > EPS || lastZoom !== scope.object.zoom ) {
|
||||
|
||||
scope.dispatchEvent( changeEvent );
|
||||
|
||||
lastPosition.copy( scope.object.position );
|
||||
lastZoom = scope.object.zoom;
|
||||
|
||||
}
|
||||
|
||||
} else {
|
||||
|
||||
console.warn( 'THREE.TrackballControls: Unsupported camera type' );
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
this.reset = function () {
|
||||
|
||||
_state = STATE.NONE;
|
||||
_keyState = STATE.NONE;
|
||||
|
||||
scope.target.copy( scope.target0 );
|
||||
scope.object.position.copy( scope.position0 );
|
||||
scope.object.up.copy( scope.up0 );
|
||||
scope.object.zoom = scope.zoom0;
|
||||
|
||||
scope.object.updateProjectionMatrix();
|
||||
|
||||
_eye.subVectors( scope.object.position, scope.target );
|
||||
|
||||
scope.object.lookAt( scope.target );
|
||||
|
||||
scope.dispatchEvent( changeEvent );
|
||||
|
||||
lastPosition.copy( scope.object.position );
|
||||
lastZoom = scope.object.zoom;
|
||||
|
||||
};
|
||||
|
||||
// listeners
|
||||
|
||||
function onPointerDown( event ) {
|
||||
|
||||
if ( scope.enabled === false ) return;
|
||||
|
||||
switch ( event.pointerType ) {
|
||||
|
||||
case 'mouse':
|
||||
case 'pen':
|
||||
onMouseDown( event );
|
||||
break;
|
||||
|
||||
// TODO touch
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function onPointerMove( event ) {
|
||||
|
||||
if ( scope.enabled === false ) return;
|
||||
|
||||
switch ( event.pointerType ) {
|
||||
|
||||
case 'mouse':
|
||||
case 'pen':
|
||||
onMouseMove( event );
|
||||
break;
|
||||
|
||||
// TODO touch
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function onPointerUp( event ) {
|
||||
|
||||
if ( scope.enabled === false ) return;
|
||||
|
||||
switch ( event.pointerType ) {
|
||||
|
||||
case 'mouse':
|
||||
case 'pen':
|
||||
onMouseUp( event );
|
||||
break;
|
||||
|
||||
// TODO touch
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function keydown( event ) {
|
||||
|
||||
if ( scope.enabled === false ) return;
|
||||
|
||||
window.removeEventListener( 'keydown', keydown );
|
||||
|
||||
if ( _keyState !== STATE.NONE ) {
|
||||
|
||||
return;
|
||||
|
||||
} else if ( event.keyCode === scope.keys[ STATE.ROTATE ] && ! scope.noRotate ) {
|
||||
|
||||
_keyState = STATE.ROTATE;
|
||||
|
||||
} else if ( event.keyCode === scope.keys[ STATE.ZOOM ] && ! scope.noZoom ) {
|
||||
|
||||
_keyState = STATE.ZOOM;
|
||||
|
||||
} else if ( event.keyCode === scope.keys[ STATE.PAN ] && ! scope.noPan ) {
|
||||
|
||||
_keyState = STATE.PAN;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function keyup() {
|
||||
|
||||
if ( scope.enabled === false ) return;
|
||||
|
||||
_keyState = STATE.NONE;
|
||||
|
||||
window.addEventListener( 'keydown', keydown, false );
|
||||
|
||||
}
|
||||
|
||||
function onMouseDown( event ) {
|
||||
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
|
||||
if ( _state === STATE.NONE ) {
|
||||
|
||||
switch ( event.button ) {
|
||||
|
||||
case scope.mouseButtons.LEFT:
|
||||
_state = STATE.ROTATE;
|
||||
break;
|
||||
|
||||
case scope.mouseButtons.MIDDLE:
|
||||
_state = STATE.ZOOM;
|
||||
break;
|
||||
|
||||
case scope.mouseButtons.RIGHT:
|
||||
_state = STATE.PAN;
|
||||
break;
|
||||
|
||||
default:
|
||||
_state = STATE.NONE;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
var state = ( _keyState !== STATE.NONE ) ? _keyState : _state;
|
||||
|
||||
if ( state === STATE.ROTATE && ! scope.noRotate ) {
|
||||
|
||||
_moveCurr.copy( getMouseOnCircle( event.pageX, event.pageY ) );
|
||||
_movePrev.copy( _moveCurr );
|
||||
|
||||
} else if ( state === STATE.ZOOM && ! scope.noZoom ) {
|
||||
|
||||
_zoomStart.copy( getMouseOnScreen( event.pageX, event.pageY ) );
|
||||
_zoomEnd.copy( _zoomStart );
|
||||
|
||||
} else if ( state === STATE.PAN && ! scope.noPan ) {
|
||||
|
||||
_panStart.copy( getMouseOnScreen( event.pageX, event.pageY ) );
|
||||
_panEnd.copy( _panStart );
|
||||
|
||||
}
|
||||
|
||||
scope.domElement.ownerDocument.addEventListener( 'pointermove', onPointerMove, false );
|
||||
scope.domElement.ownerDocument.addEventListener( 'pointerup', onPointerUp, false );
|
||||
|
||||
scope.dispatchEvent( startEvent );
|
||||
|
||||
}
|
||||
|
||||
function onMouseMove( event ) {
|
||||
|
||||
if ( scope.enabled === false ) return;
|
||||
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
|
||||
var state = ( _keyState !== STATE.NONE ) ? _keyState : _state;
|
||||
|
||||
if ( state === STATE.ROTATE && ! scope.noRotate ) {
|
||||
|
||||
_movePrev.copy( _moveCurr );
|
||||
_moveCurr.copy( getMouseOnCircle( event.pageX, event.pageY ) );
|
||||
|
||||
} else if ( state === STATE.ZOOM && ! scope.noZoom ) {
|
||||
|
||||
_zoomEnd.copy( getMouseOnScreen( event.pageX, event.pageY ) );
|
||||
|
||||
} else if ( state === STATE.PAN && ! scope.noPan ) {
|
||||
|
||||
_panEnd.copy( getMouseOnScreen( event.pageX, event.pageY ) );
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function onMouseUp( event ) {
|
||||
|
||||
if ( scope.enabled === false ) return;
|
||||
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
|
||||
_state = STATE.NONE;
|
||||
|
||||
scope.domElement.ownerDocument.removeEventListener( 'pointermove', onPointerMove );
|
||||
scope.domElement.ownerDocument.removeEventListener( 'pointerup', onPointerUp );
|
||||
|
||||
scope.dispatchEvent( endEvent );
|
||||
|
||||
}
|
||||
|
||||
function mousewheel( event ) {
|
||||
|
||||
if ( scope.enabled === false ) return;
|
||||
|
||||
if ( scope.noZoom === true ) return;
|
||||
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
|
||||
switch ( event.deltaMode ) {
|
||||
|
||||
case 2:
|
||||
// Zoom in pages
|
||||
_zoomStart.y -= event.deltaY * 0.025;
|
||||
break;
|
||||
|
||||
case 1:
|
||||
// Zoom in lines
|
||||
_zoomStart.y -= event.deltaY * 0.01;
|
||||
break;
|
||||
|
||||
default:
|
||||
// undefined, 0, assume pixels
|
||||
_zoomStart.y -= event.deltaY * 0.00025;
|
||||
break;
|
||||
|
||||
}
|
||||
|
||||
scope.dispatchEvent( startEvent );
|
||||
scope.dispatchEvent( endEvent );
|
||||
|
||||
}
|
||||
|
||||
function touchstart( event ) {
|
||||
|
||||
if ( scope.enabled === false ) return;
|
||||
|
||||
event.preventDefault();
|
||||
|
||||
switch ( event.touches.length ) {
|
||||
|
||||
case 1:
|
||||
_state = STATE.TOUCH_ROTATE;
|
||||
_moveCurr.copy( getMouseOnCircle( event.touches[ 0 ].pageX, event.touches[ 0 ].pageY ) );
|
||||
_movePrev.copy( _moveCurr );
|
||||
break;
|
||||
|
||||
default: // 2 or more
|
||||
_state = STATE.TOUCH_ZOOM_PAN;
|
||||
var dx = event.touches[ 0 ].pageX - event.touches[ 1 ].pageX;
|
||||
var dy = event.touches[ 0 ].pageY - event.touches[ 1 ].pageY;
|
||||
_touchZoomDistanceEnd = _touchZoomDistanceStart = Math.sqrt( dx * dx + dy * dy );
|
||||
|
||||
var x = ( event.touches[ 0 ].pageX + event.touches[ 1 ].pageX ) / 2;
|
||||
var y = ( event.touches[ 0 ].pageY + event.touches[ 1 ].pageY ) / 2;
|
||||
_panStart.copy( getMouseOnScreen( x, y ) );
|
||||
_panEnd.copy( _panStart );
|
||||
break;
|
||||
|
||||
}
|
||||
|
||||
scope.dispatchEvent( startEvent );
|
||||
|
||||
}
|
||||
|
||||
function touchmove( event ) {
|
||||
|
||||
if ( scope.enabled === false ) return;
|
||||
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
|
||||
switch ( event.touches.length ) {
|
||||
|
||||
case 1:
|
||||
_movePrev.copy( _moveCurr );
|
||||
_moveCurr.copy( getMouseOnCircle( event.touches[ 0 ].pageX, event.touches[ 0 ].pageY ) );
|
||||
break;
|
||||
|
||||
default: // 2 or more
|
||||
var dx = event.touches[ 0 ].pageX - event.touches[ 1 ].pageX;
|
||||
var dy = event.touches[ 0 ].pageY - event.touches[ 1 ].pageY;
|
||||
_touchZoomDistanceEnd = Math.sqrt( dx * dx + dy * dy );
|
||||
|
||||
var x = ( event.touches[ 0 ].pageX + event.touches[ 1 ].pageX ) / 2;
|
||||
var y = ( event.touches[ 0 ].pageY + event.touches[ 1 ].pageY ) / 2;
|
||||
_panEnd.copy( getMouseOnScreen( x, y ) );
|
||||
break;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function touchend( event ) {
|
||||
|
||||
if ( scope.enabled === false ) return;
|
||||
|
||||
switch ( event.touches.length ) {
|
||||
|
||||
case 0:
|
||||
_state = STATE.NONE;
|
||||
break;
|
||||
|
||||
case 1:
|
||||
_state = STATE.TOUCH_ROTATE;
|
||||
_moveCurr.copy( getMouseOnCircle( event.touches[ 0 ].pageX, event.touches[ 0 ].pageY ) );
|
||||
_movePrev.copy( _moveCurr );
|
||||
break;
|
||||
|
||||
}
|
||||
|
||||
scope.dispatchEvent( endEvent );
|
||||
|
||||
}
|
||||
|
||||
function contextmenu( event ) {
|
||||
|
||||
if ( scope.enabled === false ) return;
|
||||
|
||||
event.preventDefault();
|
||||
|
||||
}
|
||||
|
||||
this.dispose = function () {
|
||||
|
||||
scope.domElement.removeEventListener( 'contextmenu', contextmenu, false );
|
||||
|
||||
scope.domElement.removeEventListener( 'pointerdown', onPointerDown, false );
|
||||
scope.domElement.removeEventListener( 'wheel', mousewheel, false );
|
||||
|
||||
scope.domElement.removeEventListener( 'touchstart', touchstart, false );
|
||||
scope.domElement.removeEventListener( 'touchend', touchend, false );
|
||||
scope.domElement.removeEventListener( 'touchmove', touchmove, false );
|
||||
|
||||
scope.domElement.ownerDocument.removeEventListener( 'pointermove', onPointerMove, false );
|
||||
scope.domElement.ownerDocument.removeEventListener( 'pointerup', onPointerUp, false );
|
||||
|
||||
window.removeEventListener( 'keydown', keydown, false );
|
||||
window.removeEventListener( 'keyup', keyup, false );
|
||||
|
||||
};
|
||||
|
||||
this.domElement.addEventListener( 'contextmenu', contextmenu, false );
|
||||
|
||||
this.domElement.addEventListener( 'pointerdown', onPointerDown, false );
|
||||
this.domElement.addEventListener( 'wheel', mousewheel, false );
|
||||
|
||||
this.domElement.addEventListener( 'touchstart', touchstart, false );
|
||||
this.domElement.addEventListener( 'touchend', touchend, false );
|
||||
this.domElement.addEventListener( 'touchmove', touchmove, false );
|
||||
|
||||
this.domElement.ownerDocument.addEventListener( 'pointermove', onPointerMove, false );
|
||||
this.domElement.ownerDocument.addEventListener( 'pointerup', onPointerUp, false );
|
||||
|
||||
window.addEventListener( 'keydown', keydown, false );
|
||||
window.addEventListener( 'keyup', keyup, false );
|
||||
|
||||
this.handleResize();
|
||||
|
||||
// force an update at start
|
||||
this.update();
|
||||
|
||||
};
|
||||
|
||||
TrackballControls.prototype = Object.create( EventDispatcher.prototype );
|
||||
TrackballControls.prototype.constructor = TrackballControls;
|
||||
|
||||
export { TrackballControls };
|
||||
@ -1,291 +0,0 @@
|
||||
|
||||
/**
|
||||
* Ascii generation is based on http://www.nihilogic.dk/labs/jsascii/
|
||||
* Maybe more about this later with a blog post at http://lab4games.net/zz85/blog
|
||||
*
|
||||
* 16 April 2012 - @blurspline
|
||||
*/
|
||||
|
||||
var AsciiEffect = function ( renderer, charSet, options ) {
|
||||
|
||||
// its fun to create one your own!
|
||||
|
||||
charSet = ( charSet === undefined ) ? ' .:-=+*#%@' : charSet;
|
||||
|
||||
// ' .,:;=|iI+hHOE#`$';
|
||||
// darker bolder character set from https://github.com/saw/Canvas-ASCII-Art/
|
||||
// ' .\'`^",:;Il!i~+_-?][}{1)(|/tfjrxnuvczXYUJCLQ0OZmwqpdbkhao*#MW&8%B@$'.split('');
|
||||
|
||||
if ( ! options ) options = {};
|
||||
|
||||
// Some ASCII settings
|
||||
|
||||
var bResolution = ! options[ 'resolution' ] ? 0.15 : options[ 'resolution' ]; // Higher for more details
|
||||
var iScale = ! options[ 'scale' ] ? 1 : options[ 'scale' ];
|
||||
var bColor = ! options[ 'color' ] ? false : options[ 'color' ]; // nice but slows down rendering!
|
||||
var bAlpha = ! options[ 'alpha' ] ? false : options[ 'alpha' ]; // Transparency
|
||||
var bBlock = ! options[ 'block' ] ? false : options[ 'block' ]; // blocked characters. like good O dos
|
||||
var bInvert = ! options[ 'invert' ] ? false : options[ 'invert' ]; // black is white, white is black
|
||||
|
||||
var strResolution = 'low';
|
||||
|
||||
var width, height;
|
||||
|
||||
var domElement = document.createElement( 'div' );
|
||||
domElement.style.cursor = 'default';
|
||||
|
||||
var oAscii = document.createElement( "table" );
|
||||
domElement.appendChild( oAscii );
|
||||
|
||||
var iWidth, iHeight;
|
||||
var oImg;
|
||||
|
||||
this.setSize = function ( w, h ) {
|
||||
|
||||
width = w;
|
||||
height = h;
|
||||
|
||||
renderer.setSize( w, h );
|
||||
|
||||
initAsciiSize();
|
||||
|
||||
};
|
||||
|
||||
|
||||
this.render = function ( scene, camera ) {
|
||||
|
||||
renderer.render( scene, camera );
|
||||
asciifyImage( renderer, oAscii );
|
||||
|
||||
};
|
||||
|
||||
this.domElement = domElement;
|
||||
|
||||
|
||||
// Throw in ascii library from http://www.nihilogic.dk/labs/jsascii/jsascii.js
|
||||
|
||||
/*
|
||||
* jsAscii 0.1
|
||||
* Copyright (c) 2008 Jacob Seidelin, jseidelin@nihilogic.dk, http://blog.nihilogic.dk/
|
||||
* MIT License [http://www.nihilogic.dk/licenses/mit-license.txt]
|
||||
*/
|
||||
|
||||
function initAsciiSize() {
|
||||
|
||||
iWidth = Math.round( width * fResolution );
|
||||
iHeight = Math.round( height * fResolution );
|
||||
|
||||
oCanvas.width = iWidth;
|
||||
oCanvas.height = iHeight;
|
||||
// oCanvas.style.display = "none";
|
||||
// oCanvas.style.width = iWidth;
|
||||
// oCanvas.style.height = iHeight;
|
||||
|
||||
oImg = renderer.domElement;
|
||||
|
||||
if ( oImg.style.backgroundColor ) {
|
||||
|
||||
oAscii.rows[ 0 ].cells[ 0 ].style.backgroundColor = oImg.style.backgroundColor;
|
||||
oAscii.rows[ 0 ].cells[ 0 ].style.color = oImg.style.color;
|
||||
|
||||
}
|
||||
|
||||
oAscii.cellSpacing = 0;
|
||||
oAscii.cellPadding = 0;
|
||||
|
||||
var oStyle = oAscii.style;
|
||||
oStyle.display = "inline";
|
||||
oStyle.width = Math.round( iWidth / fResolution * iScale ) + "px";
|
||||
oStyle.height = Math.round( iHeight / fResolution * iScale ) + "px";
|
||||
oStyle.whiteSpace = "pre";
|
||||
oStyle.margin = "0px";
|
||||
oStyle.padding = "0px";
|
||||
oStyle.letterSpacing = fLetterSpacing + "px";
|
||||
oStyle.fontFamily = strFont;
|
||||
oStyle.fontSize = fFontSize + "px";
|
||||
oStyle.lineHeight = fLineHeight + "px";
|
||||
oStyle.textAlign = "left";
|
||||
oStyle.textDecoration = "none";
|
||||
|
||||
}
|
||||
|
||||
|
||||
var aDefaultCharList = ( " .,:;i1tfLCG08@" ).split( "" );
|
||||
var aDefaultColorCharList = ( " CGO08@" ).split( "" );
|
||||
var strFont = "courier new, monospace";
|
||||
|
||||
var oCanvasImg = renderer.domElement;
|
||||
|
||||
var oCanvas = document.createElement( "canvas" );
|
||||
if ( ! oCanvas.getContext ) {
|
||||
|
||||
return;
|
||||
|
||||
}
|
||||
|
||||
var oCtx = oCanvas.getContext( "2d" );
|
||||
if ( ! oCtx.getImageData ) {
|
||||
|
||||
return;
|
||||
|
||||
}
|
||||
|
||||
var aCharList = ( bColor ? aDefaultColorCharList : aDefaultCharList );
|
||||
|
||||
if ( charSet ) aCharList = charSet;
|
||||
|
||||
var fResolution = 0.5;
|
||||
|
||||
switch ( strResolution ) {
|
||||
|
||||
case "low" : fResolution = 0.25; break;
|
||||
case "medium" : fResolution = 0.5; break;
|
||||
case "high" : fResolution = 1; break;
|
||||
|
||||
}
|
||||
|
||||
if ( bResolution ) fResolution = bResolution;
|
||||
|
||||
// Setup dom
|
||||
|
||||
var fFontSize = ( 2 / fResolution ) * iScale;
|
||||
var fLineHeight = ( 2 / fResolution ) * iScale;
|
||||
|
||||
// adjust letter-spacing for all combinations of scale and resolution to get it to fit the image width.
|
||||
|
||||
var fLetterSpacing = 0;
|
||||
|
||||
if ( strResolution == "low" ) {
|
||||
|
||||
switch ( iScale ) {
|
||||
|
||||
case 1 : fLetterSpacing = - 1; break;
|
||||
case 2 :
|
||||
case 3 : fLetterSpacing = - 2.1; break;
|
||||
case 4 : fLetterSpacing = - 3.1; break;
|
||||
case 5 : fLetterSpacing = - 4.15; break;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
if ( strResolution == "medium" ) {
|
||||
|
||||
switch ( iScale ) {
|
||||
|
||||
case 1 : fLetterSpacing = 0; break;
|
||||
case 2 : fLetterSpacing = - 1; break;
|
||||
case 3 : fLetterSpacing = - 1.04; break;
|
||||
case 4 :
|
||||
case 5 : fLetterSpacing = - 2.1; break;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
if ( strResolution == "high" ) {
|
||||
|
||||
switch ( iScale ) {
|
||||
|
||||
case 1 :
|
||||
case 2 : fLetterSpacing = 0; break;
|
||||
case 3 :
|
||||
case 4 :
|
||||
case 5 : fLetterSpacing = - 1; break;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
// can't get a span or div to flow like an img element, but a table works?
|
||||
|
||||
|
||||
// convert img element to ascii
|
||||
|
||||
function asciifyImage( canvasRenderer, oAscii ) {
|
||||
|
||||
oCtx.clearRect( 0, 0, iWidth, iHeight );
|
||||
oCtx.drawImage( oCanvasImg, 0, 0, iWidth, iHeight );
|
||||
var oImgData = oCtx.getImageData( 0, 0, iWidth, iHeight ).data;
|
||||
|
||||
// Coloring loop starts now
|
||||
var strChars = "";
|
||||
|
||||
// console.time('rendering');
|
||||
|
||||
for ( var y = 0; y < iHeight; y += 2 ) {
|
||||
|
||||
for ( var x = 0; x < iWidth; x ++ ) {
|
||||
|
||||
var iOffset = ( y * iWidth + x ) * 4;
|
||||
|
||||
var iRed = oImgData[ iOffset ];
|
||||
var iGreen = oImgData[ iOffset + 1 ];
|
||||
var iBlue = oImgData[ iOffset + 2 ];
|
||||
var iAlpha = oImgData[ iOffset + 3 ];
|
||||
var iCharIdx;
|
||||
|
||||
var fBrightness;
|
||||
|
||||
fBrightness = ( 0.3 * iRed + 0.59 * iGreen + 0.11 * iBlue ) / 255;
|
||||
// fBrightness = (0.3*iRed + 0.5*iGreen + 0.3*iBlue) / 255;
|
||||
|
||||
if ( iAlpha == 0 ) {
|
||||
|
||||
// should calculate alpha instead, but quick hack :)
|
||||
//fBrightness *= (iAlpha / 255);
|
||||
fBrightness = 1;
|
||||
|
||||
}
|
||||
|
||||
iCharIdx = Math.floor( ( 1 - fBrightness ) * ( aCharList.length - 1 ) );
|
||||
|
||||
if ( bInvert ) {
|
||||
|
||||
iCharIdx = aCharList.length - iCharIdx - 1;
|
||||
|
||||
}
|
||||
|
||||
// good for debugging
|
||||
//fBrightness = Math.floor(fBrightness * 10);
|
||||
//strThisChar = fBrightness;
|
||||
|
||||
var strThisChar = aCharList[ iCharIdx ];
|
||||
|
||||
if ( strThisChar === undefined || strThisChar == " " )
|
||||
strThisChar = " ";
|
||||
|
||||
if ( bColor ) {
|
||||
|
||||
strChars += "<span style='"
|
||||
+ "color:rgb(" + iRed + "," + iGreen + "," + iBlue + ");"
|
||||
+ ( bBlock ? "background-color:rgb(" + iRed + "," + iGreen + "," + iBlue + ");" : "" )
|
||||
+ ( bAlpha ? "opacity:" + ( iAlpha / 255 ) + ";" : "" )
|
||||
+ "'>" + strThisChar + "</span>";
|
||||
|
||||
} else {
|
||||
|
||||
strChars += strThisChar;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
strChars += "<br/>";
|
||||
|
||||
}
|
||||
|
||||
oAscii.innerHTML = "<tr><td>" + strChars + "</td></tr>";
|
||||
|
||||
// console.timeEnd('rendering');
|
||||
|
||||
// return oAscii;
|
||||
|
||||
}
|
||||
|
||||
// end modified asciifyImage block
|
||||
|
||||
};
|
||||
|
||||
export { AsciiEffect };
|
||||
@ -1,167 +0,0 @@
|
||||
var Stats = function () {
|
||||
|
||||
var mode = 0;
|
||||
|
||||
var container = document.createElement( 'div' );
|
||||
container.style.cssText = 'position:fixed;top:0;left:0;cursor:pointer;opacity:0.9;z-index:10000';
|
||||
container.addEventListener( 'click', function ( event ) {
|
||||
|
||||
event.preventDefault();
|
||||
showPanel( ++ mode % container.children.length );
|
||||
|
||||
}, false );
|
||||
|
||||
//
|
||||
|
||||
function addPanel( panel ) {
|
||||
|
||||
container.appendChild( panel.dom );
|
||||
return panel;
|
||||
|
||||
}
|
||||
|
||||
function showPanel( id ) {
|
||||
|
||||
for ( var i = 0; i < container.children.length; i ++ ) {
|
||||
|
||||
container.children[ i ].style.display = i === id ? 'block' : 'none';
|
||||
|
||||
}
|
||||
|
||||
mode = id;
|
||||
|
||||
}
|
||||
|
||||
//
|
||||
|
||||
var beginTime = ( performance || Date ).now(), prevTime = beginTime, frames = 0;
|
||||
|
||||
var fpsPanel = addPanel( new Stats.Panel( 'FPS', '#0ff', '#002' ) );
|
||||
var msPanel = addPanel( new Stats.Panel( 'MS', '#0f0', '#020' ) );
|
||||
|
||||
if ( self.performance && self.performance.memory ) {
|
||||
|
||||
var memPanel = addPanel( new Stats.Panel( 'MB', '#f08', '#201' ) );
|
||||
|
||||
}
|
||||
|
||||
showPanel( 0 );
|
||||
|
||||
return {
|
||||
|
||||
REVISION: 16,
|
||||
|
||||
dom: container,
|
||||
|
||||
addPanel: addPanel,
|
||||
showPanel: showPanel,
|
||||
|
||||
begin: function () {
|
||||
|
||||
beginTime = ( performance || Date ).now();
|
||||
|
||||
},
|
||||
|
||||
end: function () {
|
||||
|
||||
frames ++;
|
||||
|
||||
var time = ( performance || Date ).now();
|
||||
|
||||
msPanel.update( time - beginTime, 200 );
|
||||
|
||||
if ( time >= prevTime + 1000 ) {
|
||||
|
||||
fpsPanel.update( ( frames * 1000 ) / ( time - prevTime ), 100 );
|
||||
|
||||
prevTime = time;
|
||||
frames = 0;
|
||||
|
||||
if ( memPanel ) {
|
||||
|
||||
var memory = performance.memory;
|
||||
memPanel.update( memory.usedJSHeapSize / 1048576, memory.jsHeapSizeLimit / 1048576 );
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
return time;
|
||||
|
||||
},
|
||||
|
||||
update: function () {
|
||||
|
||||
beginTime = this.end();
|
||||
|
||||
},
|
||||
|
||||
// Backwards Compatibility
|
||||
|
||||
domElement: container,
|
||||
setMode: showPanel
|
||||
|
||||
};
|
||||
|
||||
};
|
||||
|
||||
Stats.Panel = function ( name, fg, bg ) {
|
||||
|
||||
var min = Infinity, max = 0, round = Math.round;
|
||||
var PR = round( window.devicePixelRatio || 1 );
|
||||
|
||||
var WIDTH = 80 * PR, HEIGHT = 48 * PR,
|
||||
TEXT_X = 3 * PR, TEXT_Y = 2 * PR,
|
||||
GRAPH_X = 3 * PR, GRAPH_Y = 15 * PR,
|
||||
GRAPH_WIDTH = 74 * PR, GRAPH_HEIGHT = 30 * PR;
|
||||
|
||||
var canvas = document.createElement( 'canvas' );
|
||||
canvas.width = WIDTH;
|
||||
canvas.height = HEIGHT;
|
||||
canvas.style.cssText = 'width:80px;height:48px';
|
||||
|
||||
var context = canvas.getContext( '2d' );
|
||||
context.font = 'bold ' + ( 9 * PR ) + 'px Helvetica,Arial,sans-serif';
|
||||
context.textBaseline = 'top';
|
||||
|
||||
context.fillStyle = bg;
|
||||
context.fillRect( 0, 0, WIDTH, HEIGHT );
|
||||
|
||||
context.fillStyle = fg;
|
||||
context.fillText( name, TEXT_X, TEXT_Y );
|
||||
context.fillRect( GRAPH_X, GRAPH_Y, GRAPH_WIDTH, GRAPH_HEIGHT );
|
||||
|
||||
context.fillStyle = bg;
|
||||
context.globalAlpha = 0.9;
|
||||
context.fillRect( GRAPH_X, GRAPH_Y, GRAPH_WIDTH, GRAPH_HEIGHT );
|
||||
|
||||
return {
|
||||
|
||||
dom: canvas,
|
||||
|
||||
update: function ( value, maxValue ) {
|
||||
|
||||
min = Math.min( min, value );
|
||||
max = Math.max( max, value );
|
||||
|
||||
context.fillStyle = bg;
|
||||
context.globalAlpha = 1;
|
||||
context.fillRect( 0, 0, WIDTH, GRAPH_Y );
|
||||
context.fillStyle = fg;
|
||||
context.fillText( round( value ) + ' ' + name + ' (' + round( min ) + '-' + round( max ) + ')', TEXT_X, TEXT_Y );
|
||||
|
||||
context.drawImage( canvas, GRAPH_X + PR, GRAPH_Y, GRAPH_WIDTH - PR, GRAPH_HEIGHT, GRAPH_X, GRAPH_Y, GRAPH_WIDTH - PR, GRAPH_HEIGHT );
|
||||
|
||||
context.fillRect( GRAPH_X + GRAPH_WIDTH - PR, GRAPH_Y, PR, GRAPH_HEIGHT );
|
||||
|
||||
context.fillStyle = bg;
|
||||
context.globalAlpha = 0.9;
|
||||
context.fillRect( GRAPH_X + GRAPH_WIDTH - PR, GRAPH_Y, PR, round( ( 1 - ( value / maxValue ) ) * GRAPH_HEIGHT ) );
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
};
|
||||
|
||||
export default Stats;
|
||||
@ -1,243 +0,0 @@
|
||||
import * as THREE from '/sandbot/words-for-the-future/RESURGENCE/GLTFLoader/js/three/build/three.module.js';
|
||||
import {FBXLoader} from 'https://cdn.jsdelivr.net/npm/three@0.118.1/examples/jsm/loaders/FBXLoader.js';
|
||||
import { GLTFLoader } from "/sandbot/words-for-the-future/RESURGENCE/GLTFLoader/GLTFLoader.js";
|
||||
import Stats from "/sandbot/words-for-the-future/RESURGENCE/jsm/libs/stats.module.js";
|
||||
|
||||
|
||||
var container;
|
||||
var camera, scene, raycaster, renderer;
|
||||
var boolMouseOn = false,boolMouseClick = false;
|
||||
var mouse = new THREE.Vector2(), INTERSECTED;
|
||||
var radius = 100, theta = 0;
|
||||
|
||||
//creating custom IDs for Gltfs
|
||||
const GltfId = "gltf1";
|
||||
//caught critter counter:
|
||||
let count = 0 ;
|
||||
let boolcrittercaught = false;
|
||||
|
||||
init();
|
||||
animate();
|
||||
|
||||
function init() {
|
||||
|
||||
container = document.createElement( 'div' );
|
||||
document.body.appendChild( container );
|
||||
|
||||
camera = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 1, 10000 );
|
||||
|
||||
scene = new THREE.Scene();
|
||||
|
||||
|
||||
var light = new THREE.DirectionalLight( 0xffffff, 1 );
|
||||
light.position.set( 1, 1, 1 ).normalize();
|
||||
|
||||
|
||||
|
||||
|
||||
scene.background = new THREE.Color(0x000000, 1);
|
||||
var geometry = new THREE.BoxBufferGeometry( 20, 20, 20 );
|
||||
|
||||
for ( var i = 0; i < 1; i ++ ) {
|
||||
|
||||
var object = new THREE.Mesh( geometry, new THREE.MeshLambertMaterial( { color: 0xffffff } ) );
|
||||
|
||||
object.position.z = 0;
|
||||
object.position.x = -25;
|
||||
object.position.y = -40;
|
||||
object.rotation.y = -20;
|
||||
//object.rotation.x = 0;
|
||||
object.name = "cube";
|
||||
//scene.add( object );
|
||||
|
||||
}
|
||||
|
||||
//clickable critter placehoders:
|
||||
|
||||
var object1 = new THREE.Mesh( geometry, new THREE.MeshLambertMaterial( { color: 0xffffff } ) );
|
||||
|
||||
object1.position.z = 0;
|
||||
object1.position.x = 5;
|
||||
object1.position.y = -40;
|
||||
object1.rotation.y = -20;
|
||||
|
||||
//object.rotation.x = 90;
|
||||
//scene.add(object1);
|
||||
|
||||
|
||||
|
||||
|
||||
//GLTF loader with carmens critter (iphone)
|
||||
|
||||
var loader = new GLTFLoader(); new THREE.CubeTextureLoader();
|
||||
|
||||
|
||||
|
||||
loader.load( '/sandbot/words-for-the-future/RESURGENCE/models/ben-rock.glb', function ( gltf ) {
|
||||
gltf.scene.position.x = -1;
|
||||
gltf.scene.position.z = -78;
|
||||
gltf.scene.position.y = 0;
|
||||
gltf.scene.rotation.x = 0;
|
||||
|
||||
|
||||
//gltf.scene.scale = Vector3(3,3,3);
|
||||
//gtlf.material.opacity = 0.5;
|
||||
//gltf.scene.material.transparent = true;
|
||||
|
||||
scene.add( gltf.scene );
|
||||
gltf.scene.visible = false;
|
||||
|
||||
|
||||
|
||||
//louisa's code: onclick (window is placeholder for what should be clicked) makes it appear:
|
||||
document.getElementById("buttonright").addEventListener("mousedown", function(){
|
||||
gltf.scene.visible = !gltf.scene.visible;
|
||||
scene.add( light );
|
||||
console.log( "map is visible now" );
|
||||
});
|
||||
|
||||
}, undefined, function ( error ) {
|
||||
|
||||
console.error( error );
|
||||
|
||||
} );
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
raycaster = new THREE.Raycaster();
|
||||
|
||||
renderer = new THREE.WebGLRenderer();
|
||||
renderer.setPixelRatio( window.devicePixelRatio );
|
||||
renderer.setSize( window.innerWidth, window.innerHeight );
|
||||
container.appendChild( renderer.domElement );
|
||||
|
||||
|
||||
|
||||
window.addEventListener( 'mousedown', onDocumentMouseDown, false );
|
||||
//document.addEventListener( 'mousedown', onDocumentMouseDown, false );
|
||||
window.addEventListener( 'mousemove', onMouseMove, false );
|
||||
window.addEventListener( 'resize', onWindowResize, false );
|
||||
|
||||
|
||||
// var onDocumentMouseDown = function ( event ) {
|
||||
// mouse.x = ( event.clientX / window.innerWidth ) * 2 - 1;
|
||||
// mouse.y = - ( event.clientY / window.innerHeight ) * 2 + 1;
|
||||
// var intersects = raycaster.intersectObjects( object );
|
||||
// var intersection = intersects[0], object = intersection.object;
|
||||
// object.visible = false ;
|
||||
// };
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
function onWindowResize() {
|
||||
|
||||
camera.aspect = window.innerWidth / window.innerHeight;
|
||||
camera.updateProjectionMatrix();
|
||||
|
||||
renderer.setSize( window.innerWidth, window.innerHeight );
|
||||
|
||||
}
|
||||
|
||||
function onMouseMove( event ) {
|
||||
|
||||
// calculate mouse position in normalized device coordinates
|
||||
// (-1 to +1) for both components
|
||||
|
||||
mouse.x = ( event.clientX / window.innerWidth ) * 2 - 1;
|
||||
mouse.y = - ( event.clientY / window.innerHeight ) * 2 + 1;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
//
|
||||
//const stats = Stats()
|
||||
//document.body.appendChild(stats.dom)
|
||||
|
||||
|
||||
|
||||
|
||||
function animate() {
|
||||
|
||||
requestAnimationFrame( animate );
|
||||
render();
|
||||
|
||||
|
||||
}
|
||||
const ground = new THREE.Mesh(
|
||||
new THREE.PlaneBufferGeometry( 1000, 1000, 1, 1 ),
|
||||
new THREE.MeshLambertMaterial( { color: 0xffffff} )
|
||||
|
||||
|
||||
);
|
||||
|
||||
ground.position.z = 95;
|
||||
|
||||
ground.visible = true;
|
||||
//scene.add( ground );
|
||||
|
||||
|
||||
function render() {
|
||||
|
||||
|
||||
theta += 0.1;
|
||||
|
||||
camera.position.x = radius * Math.sin( THREE.MathUtils.degToRad( theta ) );
|
||||
camera.position.y = radius * Math.sin( THREE.MathUtils.degToRad( theta ) );
|
||||
camera.position.z = radius * Math.cos( THREE.MathUtils.degToRad( theta ) );
|
||||
camera.lookAt( scene.position );
|
||||
|
||||
camera.updateMatrixWorld();
|
||||
|
||||
// find intersections
|
||||
|
||||
raycaster.setFromCamera( mouse, camera );
|
||||
|
||||
var intersects = raycaster.intersectObjects( scene.children);
|
||||
|
||||
|
||||
|
||||
//console.log('mouse click is '+boolMouseClick);
|
||||
|
||||
//console.log('mousedown');
|
||||
//louisa's code, trying to make the pop up happen onclick of an object
|
||||
if(boolMouseOn == true && boolMouseClick == true ){
|
||||
console.log("its a hit!");
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
//turn off mouseclick after possible event
|
||||
|
||||
|
||||
|
||||
renderer.render( scene, camera );
|
||||
|
||||
}
|
||||
|
||||
function onDocumentMouseDown( event ) {
|
||||
|
||||
event.preventDefault();
|
||||
switch ( event.which ) {
|
||||
case 1: // left mouse click
|
||||
//console.log('click!');
|
||||
boolMouseClick = true;
|
||||
//mouse.x = ( event.clientX / window.innerWidth ) * 2 - 1;
|
||||
//mouse.y = - ( event.clientY / window.innerHeight ) * 2 + 1;
|
||||
//mouse.unproject( camera );
|
||||
//addPoint( mouse );
|
||||
break;
|
||||
|
||||
case 3: // right mouse click
|
||||
//removeLastPoint();
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
@ -1,305 +0,0 @@
|
||||
|
||||
*{
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
transition: 1s;
|
||||
}
|
||||
|
||||
|
||||
|
||||
body { margin: 1em; background: black; font-family: 'Uncial Antiqua', serif; color: black; overflow: hidden; overflow-x: hidden; padding-top: 10px;
|
||||
|
||||
|
||||
}
|
||||
|
||||
font-family: 'Rakkas', cursive;
|
||||
|
||||
font-family: 'Spectral', serif;
|
||||
|
||||
font-family: 'Texturina', serif;
|
||||
|
||||
font-family: 'Uncial Antiqua', cursive;
|
||||
|
||||
canvas {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
z-index: 1;
|
||||
position:fixed;
|
||||
top:0;
|
||||
bottom:0;
|
||||
left:0;
|
||||
right:0;
|
||||
|
||||
}
|
||||
|
||||
#quote{
|
||||
font-size: 10px;
|
||||
color: orange}
|
||||
|
||||
|
||||
|
||||
@font-face {font-family: Anka;
|
||||
src: url("fonts/AnkaCoder-b.ttf");}
|
||||
|
||||
@font-face {font-family: wftfs;
|
||||
src: url("wftfs-Regular.otf");}
|
||||
|
||||
|
||||
.cover {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
height:100%;
|
||||
background-color:#000000;
|
||||
padding: 10px;
|
||||
border-radius: 5px;
|
||||
box-shadow: 0 0 10px 2px;
|
||||
z-index: 10;
|
||||
color: black;
|
||||
position: fixed;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
z-index:9;
|
||||
transform: translate(-50%, -50%);
|
||||
opacity: 1;
|
||||
visibility:hidden;
|
||||
}
|
||||
|
||||
|
||||
#game-text{
|
||||
position: sticky;
|
||||
margin-top: 20px;
|
||||
z-index: 10;
|
||||
max-width: 30%;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);}
|
||||
|
||||
/*button {
|
||||
width: 1%;
|
||||
height: 30px;
|
||||
text-align:left;
|
||||
font-size: 1em;
|
||||
margin-top:15px;
|
||||
padding: 12px 20px;
|
||||
margin: 8px 0;
|
||||
box-sizing: border-box;
|
||||
border: red;
|
||||
font-family: Anka;
|
||||
color: yellowgreen;
|
||||
background-color:rgba(255, 0, 0, 0);;
|
||||
position: fixed;
|
||||
text-decoration: none;
|
||||
z-index: 10;
|
||||
|
||||
top: 50%;
|
||||
border-radius: 20px;
|
||||
|
||||
}
|
||||
|
||||
button:hover {
|
||||
width: 1%;
|
||||
height: 30px;
|
||||
text-align:left;
|
||||
font-size: 1em;
|
||||
margin-top:15px;
|
||||
padding: 12px 20px;
|
||||
margin: 8px 0;
|
||||
box-sizing: border-box;
|
||||
border: red;
|
||||
font-family: Anka;
|
||||
color: yellowgreen;
|
||||
background-color:rgba(255, 0, 0, 0);
|
||||
position: fixed;
|
||||
text-decoration: none;
|
||||
z-index: 10;
|
||||
top: 50%;
|
||||
|
||||
scale: 160%;
|
||||
|
||||
}*/
|
||||
|
||||
#yes{
|
||||
left: 35%;
|
||||
}
|
||||
|
||||
|
||||
#no{
|
||||
right:35%;
|
||||
}
|
||||
|
||||
#forward{
|
||||
top:35%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
|
||||
#back{
|
||||
top: 70%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.container {
|
||||
width: 60%;
|
||||
max-width: 70%;
|
||||
height: 80%;
|
||||
background-color: #b0abb4de;
|
||||
padding: 10px;
|
||||
border-radius: 5px;
|
||||
z-index: 10;
|
||||
color: blue;
|
||||
position:fixed;
|
||||
top: 20em;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
opacity: 1;
|
||||
padding: 1em;
|
||||
background-color: grey;
|
||||
box-shadow: 0 0 40px #214c12;
|
||||
overflow: scroll;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.container:hover{box-shadow: 0 0 60px #FF2200;}
|
||||
|
||||
.container:hover{box-shadow: 0 0 10px black, 0 0 20px black, 0 0 30px yellowgreen;}
|
||||
|
||||
.container2 {
|
||||
width: 50%;
|
||||
max-width: 80%;
|
||||
background-color: white;
|
||||
padding: 10px;
|
||||
border-radius: 5px;
|
||||
box-shadow: 0 0 10px 2px;
|
||||
z-index: 10;
|
||||
color: #214c12;
|
||||
position: fixed;
|
||||
top: 30%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.btn {
|
||||
background-color: grey;
|
||||
border: rgba(255, 0, 0, 0);
|
||||
border-radius: 5px;
|
||||
color:#214c12;
|
||||
outline: none;
|
||||
z-index: 11;
|
||||
font-family: Anka;
|
||||
position: fixed;
|
||||
top: 10px;
|
||||
left: 10px;
|
||||
max-width: 50%;
|
||||
text-decoration: none;
|
||||
box-shadow: 0 0 10px #214c12;
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
.btn2 {
|
||||
background-color: #bfeaea;
|
||||
border: rgba(255, 0, 0, 0);
|
||||
border-radius: 5px;
|
||||
color:#214c12;
|
||||
outline: none;
|
||||
z-index: 11;
|
||||
font-family: Anka;
|
||||
position: fixed;
|
||||
top: 10px;
|
||||
right: 10px;
|
||||
max-width: 50%;
|
||||
text-decoration: none;
|
||||
box-shadow: 0 0 10px #214c12;
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
.btn3 {
|
||||
background-color: #bfeaea;
|
||||
border: rgba(255, 0, 0, 0);
|
||||
border-radius: 5px;
|
||||
color:#214c12;
|
||||
outline: none;
|
||||
z-index: 11;
|
||||
font-family: Anka;
|
||||
position: fixed;
|
||||
top: 3em;
|
||||
left: 10px;
|
||||
max-width: 50%;
|
||||
text-decoration: none;
|
||||
box-shadow: 0 0 10px #214c12;
|
||||
padding: 2px;
|
||||
}
|
||||
#text{z-index: 10;
|
||||
color: #7f00ff}
|
||||
|
||||
|
||||
p{z-index: 110;
|
||||
max-width: 75ch;
|
||||
color:#3f00ff;
|
||||
font-family: 'Texturina', serif;
|
||||
}
|
||||
|
||||
a{ text-decoration: none;
|
||||
color: red;
|
||||
}
|
||||
|
||||
a:hover{ text-decoration: none;
|
||||
color: red;
|
||||
size: 4em;}
|
||||
|
||||
button:hover {
|
||||
border-color: black;
|
||||
background-color: darkgray;
|
||||
z-index: 10;
|
||||
box-shadow: 0 0 10px #214c12;
|
||||
}
|
||||
|
||||
button {background-color:yellow;}
|
||||
|
||||
@media only screen and (max-width: 768px) {
|
||||
/* For mobile phones: */
|
||||
[class*="container"] {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
#anchor{}
|
||||
|
||||
|
||||
|
||||
.header{position: absolute;
|
||||
height: 10px;
|
||||
z-index: 100;}
|
||||
|
||||
.new{z-index:15; position: absolute; overflow: scroll; color: blue;
|
||||
height: 97%;
|
||||
padding: 10px;
|
||||
z-index: 10;
|
||||
color: #242322;
|
||||
position:fixed;
|
||||
right: 0.01px;
|
||||
border-radius: 2px;
|
||||
top: 10px;
|
||||
opacity: 1;
|
||||
padding: 1em;
|
||||
box-shadow: 0 0 40px #214c12;
|
||||
background-color:#bbb9c17d;
|
||||
overflow: scroll;
|
||||
overflow-x: hidden;
|
||||
resize: both;}
|
||||
|
||||
.new:hover{box-shadow: 0 0 40px #242322;}
|
||||
|
||||
#rock{z-index: 5;
|
||||
position: fixed;
|
||||
top: 10px;
|
||||
right:0.1px;
|
||||
height:120%;}
|
||||
@ -1,2 +0,0 @@
|
||||
<meta charset='utf-8'><link type="text/css" rel="stylesheet" href="body.css"> here is your fate:
|
||||
RESURGENCE | Isabelle Stengers
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue