NotDotTeam/crowds
NotDotTeam/crowds
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge branch 'master' into master

Browse Source
This commit is contained in:
Italo Lelis 2018-04-30 10:29:23 -03:00 committed by GitHub
commit 23b642337c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 77 additions and 66 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
README.md
View File

@ -1,3 +1,5 @@
!["The Wisdom and/or Madness of Crowds"](http://ncase.me/crowds/social/thumb.png)
# PLAY IT HERE: [http://ncase.me/crowds/](http://ncase.me/crowds/) # PLAY IT HERE: [http://ncase.me/crowds/](http://ncase.me/crowds/)
*The Wisdom and/or Madness of Crowds* is dedicated to the public domain, *The Wisdom and/or Madness of Crowds* is dedicated to the public domain,

9
css/index.css
View File

@ -14,6 +14,7 @@ html, body{
cursor: none; cursor: none;
} }
body{ body{
background: #fff;
margin:0; margin:0;
font-family: "PatrickHand", Helvetica, Arial; font-family: "PatrickHand", Helvetica, Arial;
@ -223,12 +224,12 @@ a:hover{
background-size: auto 100%; background-size: auto 100%;
} }
#sandbox_shortcuts_label{ #sandbox_shortcuts_label{
font-size: 18px; font-size: 22px;
} }
#sandbox_shortcuts{ #sandbox_shortcuts{
font-size: 14px; font-size: 20px;
line-height: 1.5em; line-height: 1.2em;
color: #999; color: #999;
} }
/* MODAL */ /* MODAL */

16
index.html
View File

@ -65,7 +65,7 @@ Good luck, and thanks again!
<meta property="og:image" content="http://ncase.me/crowds/social/thumb.png"> <meta property="og:image" content="http://ncase.me/crowds/social/thumb.png">
<!-- Styles --> <!-- Styles -->
<link rel="stylesheet" type="text/css" href="css/index.css"> <link rel="stylesheet" type="text/css" href="css/index.css?v=3">
</head> </head>
<body> <body>
@ -229,9 +229,9 @@ Good luck, and thanks again!
<script src="js/slideshow/SandboxUI.js"></script> <script src="js/slideshow/SandboxUI.js"></script>
<script src="js/slideshow/Modal.js"></script> <script src="js/slideshow/Modal.js"></script>
<script src="js/slideshow/Preloader.js"></script> <script src="js/slideshow/Preloader.js"></script>
<script src="js/slideshow/Translations.js"></script> <script src="js/slideshow/Translations.js?v=2"></script>
<script src="js/sim/Peep.js"></script> <script src="js/sim/Peep.js?v=2"></script>
<script src="js/sim/Connection.js"></script> <script src="js/sim/Connection.js"></script>
<script src="js/sim/ConnectorCutter.js"></script> <script src="js/sim/ConnectorCutter.js"></script>
<script src="js/sim/Simulations.js"></script> <script src="js/sim/Simulations.js"></script>
@ -245,7 +245,7 @@ Good luck, and thanks again!
<script src="js/chapters/G_Small_World.js"></script> <script src="js/chapters/G_Small_World.js"></script>
<script src="js/chapters/H_Conclusion.js"></script> <script src="js/chapters/H_Conclusion.js"></script>
<script src="js/chapters/I_Credits.js"></script> <script src="js/chapters/I_Credits.js"></script>
<script src="js/chapters/J_Sandbox.js"></script> <script src="js/chapters/J_Sandbox.js?v=2"></script>
<script src="js/main.js"></script> <script src="js/main.js"></script>
@ -895,7 +895,7 @@ Also, <b></b> bolds a word/phrase, and <i></i> italicizes a word/phrase.
top: 410px; top: 410px;
left: 220px; left: 220px;
text-align: center; text-align: center;
color: #aaa; color: #999;
"> ">
(wanna make your own simulations? (wanna make your own simulations?
check out Sandbox Mode, by clicking the (★) button below!) check out Sandbox Mode, by clicking the (★) button below!)
@ -983,7 +983,9 @@ Also, <b></b> bolds a word/phrase, and <i></i> italicizes a word/phrase.
<div style="font-size: 3em; line-height: 1.0em;"> <div style="font-size: 3em; line-height: 1.0em;">
NICKY CASE</div> NICKY CASE</div>
<a target="_blank" href="http://ncase.me" style="text-decoration:none"> <a target="_blank" href="http://ncase.me" style="text-decoration:none">
play my other shtuff</a> play my other shtuff</a> ·
<a target="_blank" href="https://twitter.com/ncasenmare" style="text-decoration:none">
follow my tweeter</a>
<br><br> <br><br>
@ -1611,7 +1613,7 @@ Final thing! These references also need you to TRANSLATE:
</h3> </h3>
<div> <div>
The keyboard shortcuts (1, 2, space, delete) The keyboard shortcuts (1, 2, space, backspace)
work in <i>all</i> the puzzles, not just Sandbox Mode! work in <i>all</i> the puzzles, not just Sandbox Mode!
Seriously, you can go back to a different chapter, Seriously, you can go back to a different chapter,
and edit the simulation right there. and edit the simulation right there.

2
js/chapters/J_Sandbox.js
View File

@ -27,7 +27,7 @@ SLIDES.push(
// Simulation UI // Simulation UI
{ {
type:"box", type:"box",
x:35, y:385, x:35, y:400,
sim_ui:"red" sim_ui:"red"
}, },

2
js/sim/Peep.js
View File

@ -133,7 +133,7 @@ function Peep(config){
// Travel Clockwise // Travel Clockwise
var spin = getUnitVector(self); var spin = getUnitVector(self);
spin = rotateVector(spin, Math.TAU/4); spin = rotateVector(spin, Math.TAU/4);
spin = multiplyVector(spin, 0.02*0.8); spin = multiplyVector(spin, 0.02*0.25); // even less spin
self.velocity = addVectors(self.velocity, spin); self.velocity = addVectors(self.velocity, spin);
// Air Friction // Air Friction

109
pt.html
View File

@ -39,33 +39,33 @@ Good luck, and thanks again!
<head> <head>
<!-- Meta Info --> <!-- Meta Info -->
<title>A Sabedoria e/ou Loucura das Massas</title> <title>A Sabedoria e/ou Loucura das Multidões</title> <!-- <title>(TRANSLATE this part only)</title> -->
<meta name="description" content="um guia interativo para as conexões humanas"/> <meta name="description" content="um guia interativo das relações humanas"/> <!-- content="(TRANSLATE this part only)" -->
<meta content="text/html;charset=utf-8" http-equiv="Content-Type"> <meta content="text/html;charset=utf-8" http-equiv="Content-Type">
<meta content="utf-8" http-equiv="encoding"> <meta content="utf-8" http-equiv="encoding">
<meta charset="utf-8"> <meta charset="utf-8">
<link rel="icon" type="image/png" href="favicon.png"> <link rel="icon" type="image/png" href="favicon.png">
<!-- Sharing --> <!-- Sharing -->
<meta itemprop="name" content="A Sabedoria e/ou Loucura das Massas"> <meta itemprop="name" content="A Sabedoria e/ou Loucura das Multidões"> <!-- content="(TRANSLATE this part only)" -->
<meta itemprop="description" content="um guia interativo para as conexões humanas"> <meta itemprop="description" content="um guia interativo das relações humanas"> <!-- content="(TRANSLATE this part only)" -->
<meta itemprop="image" content="http://ncase.me/crowds/social/thumb.png"> <meta itemprop="image" content="http://ncase.me/crowds/social/thumb.png">
<meta name="twitter:title" content="A Sabedoria e/ou Loucura das Massas"> <meta name="twitter:title" content="A Sabedoria e/ou Loucura das Multidões"> <!-- content="(TRANSLATE this part only)" -->
<meta name="twitter:description" content="um guia interativo para as conexões humanas"> <meta name="twitter:description" content="um guia interativo das relações humanas"> <!-- content="(TRANSLATE this part only)" -->
<meta name="twitter:card" content="summary_large_image"> <meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@ncasenmare"> <meta name="twitter:site" content="@ncasenmare">
<meta name="twitter:creator" content="@ncasenmare"> <meta name="twitter:creator" content="@ncasenmare">
<meta name="twitter:image" content="http://ncase.me/crowds/social/thumb.png"> <meta name="twitter:image" content="http://ncase.me/crowds/social/thumb.png">
<meta property="og:title" content="A Sabedoria e/ou Loucura das Massas"> <meta property="og:title" content="A Sabedoria e/ou Loucura das Multidões"> <!-- content="(TRANSLATE this part only)" -->
<meta property="og:description" content="um guia interativo para as conexões humanas"> <meta property="og:description" content="um guia interativo das relações humanas"> <!-- content="(TRANSLATE this part only)" -->
<meta property="og:type" content="website"> <meta property="og:type" content="website">
<meta property="og:url" content="http://ncase.me/crowds/"> <meta property="og:url" content="http://ncase.me/crowds/">
<meta property="og:image" content="http://ncase.me/crowds/social/thumb.png"> <meta property="og:image" content="http://ncase.me/crowds/social/thumb.png">
<!-- Styles --> <!-- Styles -->
<link rel="stylesheet" type="text/css" href="css/index.css"> <link rel="stylesheet" type="text/css" href="css/index.css?v=3">
</head> </head>
<body> <body>
@ -87,7 +87,7 @@ Good luck, and thanks again!
<canvas id="scratch" width="711" height="400"></canvas> <canvas id="scratch" width="711" height="400"></canvas>
<!-- Skip --> <!-- Skip -->
<div id="skip">pular &gt;</div> <div id="skip">pular &gt;</div> <!-- TRANSLATE -->
<!-- Modal --> <!-- Modal -->
<div id="modal_container"> <div id="modal_container">
@ -106,24 +106,25 @@ Good luck, and thanks again!
<div id="navigation_container"> <div id="navigation_container">
<div id="sound" mute="no"> <div id="sound" mute="no">
<div id="sound_icon"></div> <div id="sound_icon"></div>
<span id="sound_on">ON</span> <span id="sound_on">LIGADO</span> <!-- TRANSLATE -->
<span id="sound_off">OFF</span> <span id="sound_off">DESLIGADO</span> <!-- TRANSLATE -->
</div> </div>
<div id="sharing"> <div id="sharing">
<a id="fb" target="_blank" href="TODO"></a> <a id="fb" target="_blank" href="TODO"></a>
<a id="tw" target="_blank" href="TODO"></a> <a id="tw" target="_blank" href="TODO"></a>
<a id="em" target="_blank" href="TODO"></a> <a id="em" target="_blank" href="TODO"></a>
<span id="share_title"> <span id="share_title">
A Sabedoria e/ou Loucura das Massas A Sabedoria e/ou Loucura das Multidões <!-- TRANSLATE -->
</span> </span>
<span id="share_desc"> <span id="share_desc">
<!-- TRANSLATOR: keep this on ONE LINE or the social sharing will break! --> <!-- TRANSLATOR: keep this on ONE LINE or the social sharing will break! -->
Por que grupos de pessoas são inteligentes, idiotas, gentis, cruéis? Um guia interativo às redes humanas: Por que grupos de pessoas agem de forma inteligente, burra, gentil, cruel? Um guia interativo das relações humanas: <!-- TRANSLATE -->
</span> </span>
</div> </div>
<div id="navigation"> <div id="navigation">
<!-- The chapters --> <!-- The chapters -->
<!-- TRANSLATE all the Chapter names! -->
<div chapter="Introduction"> <div chapter="Introduction">
<span>0</span> <span>0</span>
<span>0. Introdução</span> <span>0. Introdução</span>
@ -146,7 +147,7 @@ Good luck, and thanks again!
</div> </div>
<div chapter="SmallWorld"> <div chapter="SmallWorld">
<span>5</span> <span>5</span>
<span>5. Mundo Pequeno</span> <span>5. Pequeno Mundo</span>
</div> </div>
<div chapter="Conclusion"> <div chapter="Conclusion">
<span>6</span> <span>6</span>
@ -167,11 +168,11 @@ Good luck, and thanks again!
<!-- Bonus Notes & References --> <!-- Bonus Notes & References -->
<div modal="bonus"> <div modal="bonus">
<span>?</span> <span>?</span>
<span>Caixas Bônus!</span> <span>Caixas Bônus!</span> <!-- TRANSLATE -->
</div> </div>
<div modal="references"> <div modal="references">
<span style="margin-top: 7px; font-size: 35px;">*</span> <span style="margin-top: 7px; font-size: 35px;">*</span>
<span>Links &amp; Referências</span> <span>Links &amp; Referências</span> <!-- TRANSLATE -->
</div> </div>
<div modal="translations"> <div modal="translations">
<span style="margin-top:5px; position:relative;"><span style=" <span style="margin-top:5px; position:relative;"><span style="
@ -184,7 +185,7 @@ Good luck, and thanks again!
top: -1px; top: -1px;
left: 16px; left: 16px;
">あ</span></span> ">あ</span></span>
<span>Traduções</span> <span>Traduções</span> <!-- TRANSLATE -->
</div> </div>
<!-- The hover bubble --> <!-- The hover bubble -->
@ -202,7 +203,7 @@ Good luck, and thanks again!
<!-- Preloader --> <!-- Preloader -->
<div id="pre_preloader"> <div id="pre_preloader">
<div>carregando...</div> <div>carregando...</div> <!-- TRANSLATE -->
</div> </div>
</body> </body>
@ -228,9 +229,9 @@ Good luck, and thanks again!
<script src="js/slideshow/SandboxUI.js"></script> <script src="js/slideshow/SandboxUI.js"></script>
<script src="js/slideshow/Modal.js"></script> <script src="js/slideshow/Modal.js"></script>
<script src="js/slideshow/Preloader.js"></script> <script src="js/slideshow/Preloader.js"></script>
<script src="js/slideshow/Translations.js"></script> <script src="js/slideshow/Translations.js?v=2"></script>
<script src="js/sim/Peep.js"></script> <script src="js/sim/Peep.js?v=2"></script>
<script src="js/sim/Connection.js"></script> <script src="js/sim/Connection.js"></script>
<script src="js/sim/ConnectorCutter.js"></script> <script src="js/sim/ConnectorCutter.js"></script>
<script src="js/sim/Simulations.js"></script> <script src="js/sim/Simulations.js"></script>
@ -244,7 +245,7 @@ Good luck, and thanks again!
<script src="js/chapters/G_Small_World.js"></script> <script src="js/chapters/G_Small_World.js"></script>
<script src="js/chapters/H_Conclusion.js"></script> <script src="js/chapters/H_Conclusion.js"></script>
<script src="js/chapters/I_Credits.js"></script> <script src="js/chapters/I_Credits.js"></script>
<script src="js/chapters/J_Sandbox.js"></script> <script src="js/chapters/J_Sandbox.js?v=2"></script>
<script src="js/main.js"></script> <script src="js/main.js"></script>
@ -269,20 +270,22 @@ it should automatically highlight what the text is (usually in white).
<words id="preloader_title"> <words id="preloader_title">
<div style="font-size: 30px;"> <div style="font-size: 30px;">
<span>the</span> <span>a</span>
<br> <br>
<span style="font-size: 60px;letter-spacing: 4px;">WISDOM</span> <span style="font-size: 60px;letter-spacing: 4px;">SABEDORIA</span>
<span style="position:relative;top: -10px;">and/or</span> <span style="position:relative;top: -10px;">e/ou</span>
<span style="font-size: 60px;">MADNESS</span> <span style="font-size: 60px;">LOUCURA</span>
<br> <br>
<span style="position: relative;top: -11px;">of</span> <span style="position: relative;top: -11px;">das</span>
<br> <br>
<span style="font-size: 100px;line-height: 80px;position: relative;top: -15px; display:block;">CROWDS</span> <span style="font-size: 100px;line-height: 80px;position: relative;top: -15px; display:block;">MULTIDÕES</span>
</div> </div>
<div style="color:#999"> <div style="color:#999">
<!--playing time: 30 min • by nicky case, april 2018 --> <!-- TRANSLATE note: comment out the line below... -->
por nicky case • traduzido por Iuri Rezende Souza • <a href='/'>original em Inglês</a> <!-- playing time: 30 min • by nicky case, april 2018 -->
<!-- ...and UN-comment + TRANSLATE this line! -->
por nicky case • traduzido por Italo Lelis e Iuri Rezende • <a href='/'>original em Inglês</a>
</div> </div>
</words> </words>
@ -292,7 +295,7 @@ it should automatically highlight what the text is (usually in white).
</words> </words>
<words id="preloader_loading"> <words id="preloader_loading">
loading... carregando...
</words> </words>
<words id="preloader_play"> <words id="preloader_play">
@ -314,25 +317,25 @@ Also, <b></b> bolds a word/phrase, and <i></i> italicizes a word/phrase.
<br><br> <br><br>
Sir Isaac Newton tinha certeza de que era Isaac Newton tinha certeza de que era um
<br> <br>
super inteligente. Claro, depois de inventar o cálculo sabichão. Depois de inventar o cálculo e a teoria da
<br> <br>
e uma teoria da gravidade, ele deveria ser sábio o gravidade, ele deveria ser inteligente o suficiente para
<br>
suficiente para fazer investimentos financeiros, não? Resumindo, ele
<br> <br>
perdeu US$4.600.000 (em dólares atuais) na especulação fazer um investimento financeiro, certo? Bem, resumindo a história,
<br> <br>
nacional conhecida como Bolha da Companhia do Mar do Sul de 1720. ele perdeu $4,600,000 (na cotação atual do dólar) na bolha nacional
<br>
especulativa conhecida como a Quebra dos Mares do Sul de 1720.
<br><br> <br><br>
Como disse o Sr. Newton depois do episódio: <i>“Posso calcular o Como o próprio Sir Newton disse posteriormente: <i>“Eu consigo calcular
<br> <br>
movimento dos corpos celestes, mas não a demência das pessoas.”</i> o movimento dos corpos celestiais, mas não a loucura das pessoas.”</i>
<next>é, problema dele <div class="rarr"></div> </next> <next>é, que ruim pra ele <div class="rarr"></div> </next>
</words> </words>
@ -340,29 +343,29 @@ Also, <b></b> bolds a word/phrase, and <i></i> italicizes a word/phrase.
<div style="height:0.5em"></div> <div style="height:0.5em"></div>
Claro, não foi a única vez que Claro, não foi a única vez que
<br> <br>
mercados, instituições, ou democracias mercados, instituições, ou democracias
<br> <br>
inteiras saíram de controle &mdash; a <i>loucura</i> das massas. inteiras saíram de controle &mdash; a <i>loucura</i> das massas.
<br> <br>
Ainda assim, logo que se perde a esperança na humanidade, Ainda assim, logo que se perde a esperança na humanidade,
<br> <br>
veem-se cidadãos coordenando para se resgatar uns aos veem-se cidadãos coordenando para se resgatar uns aos
<br> <br>
outros em furacões, comunidades criando soluções para problemas, outros em furacões, comunidades criando soluções para problemas,
<br> <br>
pessoas lutando por um mundo melhor &mdash; a <i>sabedoria</i> das massas! pessoas lutando por um mundo melhor &mdash; a <i>sabedoria</i> das massas!
<div style="height:0.9em"></div> <div style="height:0.9em"></div>
<b>Mas <i>por que</i> algumas massas se rendem à loucura, ou à sabedoria?</b> Nenhuma teoria <b>Mas <i>por que</i> algumas massas se rendem à loucura, ou à sabedoria?</b> Nenhuma teoria
<br> <br>
consegue explicar tudo, mas acredito que um novo campo de estudo, consegue explicar tudo, mas acredito que um novo campo de estudo,
<br> <br>
<b>ciência das redes</b>, pode nos guiar! E sua ideia central é esta: para <b>ciência das redes</b>, pode nos guiar! E sua ideia central é esta: para
<br> <br>
entender massas, deveríamos olhar não às <i>pessoas entender massas, deveríamos olhar não às <i>pessoas
<br> <br>
individuais</i>, mas para... individuais</i>, mas para...
@ -892,7 +895,7 @@ Also, <b></b> bolds a word/phrase, and <i></i> italicizes a word/phrase.
top: 410px; top: 410px;
left: 220px; left: 220px;
text-align: center; text-align: center;
color: #aaa; color: #999;
"> ">
(wanna make your own simulations? (wanna make your own simulations?
check out Sandbox Mode, by clicking the (★) button below!) check out Sandbox Mode, by clicking the (★) button below!)
@ -980,7 +983,9 @@ Also, <b></b> bolds a word/phrase, and <i></i> italicizes a word/phrase.
<div style="font-size: 3em; line-height: 1.0em;"> <div style="font-size: 3em; line-height: 1.0em;">
NICKY CASE</div> NICKY CASE</div>
<a target="_blank" href="http://ncase.me" style="text-decoration:none"> <a target="_blank" href="http://ncase.me" style="text-decoration:none">
play my other shtuff</a> play my other shtuff</a> ·
<a target="_blank" href="https://twitter.com/ncasenmare" style="text-decoration:none">
follow my tweeter</a>
<br><br> <br><br>
@ -1608,7 +1613,7 @@ Final thing! These references also need you to TRANSLATE:
</h3> </h3>
<div> <div>
The keyboard shortcuts (1, 2, space, delete) The keyboard shortcuts (1, 2, space, backspace)
work in <i>all</i> the puzzles, not just Sandbox Mode! work in <i>all</i> the puzzles, not just Sandbox Mode!
Seriously, you can go back to a different chapter, Seriously, you can go back to a different chapter,
and edit the simulation right there. and edit the simulation right there.

3
translations.txt
View File

@ -27,4 +27,5 @@
// AVAILABLE TRANSLATIONS: // // AVAILABLE TRANSLATIONS: //
///////////////////////////// /////////////////////////////
en: English en: English
pt: Português