diff --git a/assets/ui/payoffs_ui.png b/assets/ui/payoffs_ui.png
new file mode 100644
index 0000000..2569ddd
Binary files /dev/null and b/assets/ui/payoffs_ui.png differ
diff --git a/assets/ui/sandbox_tabs.png b/assets/ui/sandbox_tabs.png
index 20544fa..e73c587 100644
Binary files a/assets/ui/sandbox_tabs.png and b/assets/ui/sandbox_tabs.png differ
diff --git a/css/slides.css b/css/slides.css
index 9709694..7c45e68 100644
--- a/css/slides.css
+++ b/css/slides.css
@@ -35,6 +35,9 @@ body{
height: 60px;
background: #222;
}
+s{
+ text-decoration: line-through;
+}
/*************************/
/******* SLIDESHOW *******/
@@ -85,6 +88,13 @@ body{
/********* Button ********/
+.no-select{
+ -webkit-user-select: none; /* Chrome all / Safari all */
+ -moz-user-select: none; /* Firefox all */
+ -ms-user-select: none; /* IE 10+ */
+ user-select: none;
+ cursor: default;
+}
.button{
z-index: 0;
-webkit-user-select: none; /* Chrome all / Safari all */
@@ -151,6 +161,8 @@ body{
}
.button[size=short] #text{
width:105px;
+ font-size: 18px;
+ top: 18px;
}
.button[size=short] #hitbox{
width:115px;
@@ -251,6 +263,14 @@ body{
width:30px; height:30px;
background: url(../assets/ui/slider_knob.png);
background-size: 100% 100%;
+ cursor: -webkit-grab;
+ cursor: -moz-grab;
+ cursor: grab;
+}
+.slider > .slider_knob:active{
+ cursor: -webkit-grabbing;
+ cursor: -moz-grabbing;
+ cursor: grabbing;
}
.sandbox_pop{
diff --git a/index.html b/index.html
index 5c8d43e..e2b8223 100644
--- a/index.html
+++ b/index.html
@@ -42,6 +42,7 @@
+
@@ -87,7 +88,7 @@ window.onload = function(){
// First slide!
//slideshow.nextSlide();
- slideshow.gotoSlide("evolution");
+ slideshow.gotoSlide("distrust");
});
diff --git a/js/core/IncDecNumber.js b/js/core/IncDecNumber.js
index 6185d31..84d4985 100644
--- a/js/core/IncDecNumber.js
+++ b/js/core/IncDecNumber.js
@@ -36,7 +36,7 @@ function IncDecNumber(config){
// Value & UI
self.value = value;
- num.innerHTML = self.value;
+ num.innerHTML = (self.value>0) ? "+"+self.value : self.value;
};
self.setValue(config.value);
diff --git a/js/core/PayoffsUI.js b/js/core/PayoffsUI.js
new file mode 100644
index 0000000..09810fe
--- /dev/null
+++ b/js/core/PayoffsUI.js
@@ -0,0 +1,78 @@
+function PayoffsUI(config){
+
+ var self = this;
+ self.id = config.id;
+ self.slideshow = config.slideshow;
+
+ // Create DOM
+ self.dom = document.createElement("div");
+ self.dom.className = "object";
+ var dom = self.dom;
+ _configText(config, dom);
+ if(config.scale){
+ dom.style.transform = "scale("+config.scale+","+config.scale+")";
+ }
+
+ // Add Image Background
+ var bg = new ImageBox({
+ src: "assets/ui/payoffs_ui.png",
+ x:0, y:0, width:300, height:300
+ });
+ dom.appendChild(bg.dom);
+
+ // Labels
+ dom.appendChild(_makeLabel("label_cooperate", {x:148, y:17, rotation:45, align:"center", color:"#cccccc"}));
+ dom.appendChild(_makeLabel("label_cooperate", {x:52, y:17, rotation:-45, align:"center", color:"#cccccc"}));
+ dom.appendChild(_makeLabel("label_cheat", {x:245, y:90, rotation:45, align:"center", color:"#cccccc"}));
+ dom.appendChild(_makeLabel("label_cheat", {x:6, y:90, rotation:-45, align:"center", color:"#cccccc"}));
+
+ // Inc(rement) De(crement) Numbers
+ // which are symmetrical, and update each other!
+ var numbers = [];
+ var _makeIncDec = function(letter,x,y){
+ (function(letter,x,y){
+
+ var number = new IncDecNumber({
+ x:x, y:y, max:5, min:-5,
+ value: PD.PAYOFFS[letter],
+ onchange: function(value){
+ publish("pd/editPayoffs/"+letter,[value]);
+ publish("payoffs/onchange");
+ }
+ });
+ listen(self, "pd/editPayoffs/"+letter,function(value){
+ number.setValue(value);
+ });
+ number.slideshow = self.slideshow;
+ dom.appendChild(number.dom);
+ numbers.push(number);
+
+ })(letter,x,y);
+ };
+
+ _makeIncDec("R", 191-64, 127-47);
+ _makeIncDec("R", 233-64, 127-47);
+
+ _makeIncDec("T", 121-64, 197-47);
+ _makeIncDec("S", 161-64, 197-47);
+
+ _makeIncDec("S", 263-64, 197-47);
+ _makeIncDec("T", 306-64, 197-47);
+
+ _makeIncDec("P", 192-64, 268-47);
+ _makeIncDec("P", 232-64, 268-47);
+
+ // Add & Remove
+ self.add = function(){ _add(self); };
+ self.remove = function(){
+ unlisten(self);
+ for(var i=0;i
-Before everything goes to heck: let's start with something nice.
-A world, mostly populated by nice Copycats,
-with only one each of a
-mean Always Cheat,
-naive Always Cooperate,
-unforgiving Grudger, and
-manipulative Detective.
+Before everything goes to heck, let's start with something nice!
+Here's a world filled entirely with Always Cooperates,
+except for one Always Cheat and one Copycat.
-Under our current rules, Copycat wins easily.
+As you already know, Copycat wins handily in the long run,
+under our current rules!
-(when you're done, press:)
+once you're done playing around, click:
+
+continue
-As you just saw, if you play enough rounds, Copycat still wins...
-but when people play with each other less and less... suddenly, // HOW MUCH?
-ALWAYS CHEAT dominates once again.
+As you saw, when people play below some number of rounds,
+ALWAYS CHEAT dominates.
-oh, it gets worse... →
+and oh, it gets worse... →
-There's another way to breed distrust.
-Here are the "payoffs" for a single round of the trust game:
+There's another way to breed distrust.
+Here are the "payoffs" for the trust game:
-Note: although the reward for mutual trust (+2) is less than the temptation to exploit (+3),
-with enough repeat interaction, trust can still win!
-But now, click the arrows above to change the reward from +2 to +1,
-then click "start".
-Even though +1 is still more than the punishment for mutual distrust (0)...
+
+Let's start with a mostly-Copycat world. Normally, they'd win.
+But now, change the "trust" reward from +2 to +1,
+then click start. →
+Even though +1 is still more than the punishment for mutual distrust (0)...
what happens?
-
-(simulating: 5 rounds per match)
+feel free to play around with different payoffs!
+once you're done, click:
+
+(simulating: 10 rounds per match)
+The same thing happens: Always Cheat dominates.
So even if the reward for getting a "win-win" is still more
than the punishment for a "lose-lose"...
if the reward for mutual trust is too low, distrust evolves.
-Use the buttons on the right to start the simulation,
-go through it step-by-step, or restart it. →
+Use the buttons on the right to start the sim,
+go through it step-by-step, or reset it. →
But that's under our current rules, which say that
-players play against each other 10 rounds per match.
-What if players had to play 20 rounds? 5 rounds? 3 rounds? 1 round?
-Use the slider below to change this rule, start the simulation,
-and see what happens – then repeat this for as many numbers as you'd like to experiment with:
+players play against each other for 10 rounds per match.
+Does Copycat still win at 7 rounds? 5 rounds? 3? 2? 1?
+
+Change the number of rounds with the slider below,
+start the sim, and see what happens.
+Feel free to experiment as much as you'd like!
In 1985, when Americans were asked how many close friends they had,
the most common answer was "three". In 2004, the most common answer was "zero".
-Furthermore, we're also (relatively) less likely to
-get married, volunteer, go to church, join organizations, or participate in local politics.
-We're losing our "social capital".
-And as you discovered for yourself just now,
+We now have fewer friends across class, racial, economic, and political lines,
+because we have fewer friends -- period.
+And as you just discovered for yourself,
the fewer "repeat interactions" there are, the more distrust will spread.
-(and no, mass media doesn't count:
-it has to be repeat two-way interactions between specific individuals.)
+(no, mass media doesn't count:
+it must be two-way interactions between specific individuals.)
-(after you try that, feel free to play around with different "payoff" combinations!
-once you're done experimenting, hit:)
I think, as a culture, we're losing the value of finding "win-wins".
We're more interested in "win-lose", because viciousness gets views, conflict gets clicks.
-We'd rather live and let die.
+It's live and let die.
Maybe I'm just overthinking things, maybe I'm just old and shaking my fist at a cloud...
but don't you feel it? That we've forgotten something?...
-Aaaaanyway, you can now play with both the number of rounds and the payoffs! -These two things interact with each other a lot. -For example, even though a low +1 reward creates distrust with 5 rounds per match, -trust can still win with 10 rounds per match! (Click START to simulate this) +Aaaaanyway, now you can change both rules! +(click start to see how, with weird payoffs, the sim +"swings" between Cheats & Cooperates...)
-Once you're done experimenting, -(and there'll be a much bigger "sandbox" to play around with at the end) -let's take a look at our final, most interesting barrier to trust... +Once you're done experimenting with this, +let's look at our final barrier to trust...
-Misteaks Mistakes. →
-reset payoffs +set default
-Play [N] rounds per one-on-one game +Play [N] rounds per match:
-Play [N] round per one-on-one game +Play [N] round per match:
-After each tournament, eliminate the bottom [N] players & reproduce the top [N] players +After each tournament, eliminate the bottom [N] players & reproduce the top [N] players:
-After each tournament, eliminate the bottom [N] player & reproduce the top [N] player +After each tournament, eliminate the bottom [N] player & reproduce the top [N] player:
-In each round of a one-on-one game, there's a [N]% chance a player makes a mistake +During each round, there's a [N]% chance a player makes a mistake:
@@ -886,6 +885,10 @@ cheat play
++start +
+stop