20273.diff

diff --git a/css/names.css b/css/names.css
new file mode 100644
index 0000000..f32cec8
--- /dev/null
+++ b/css/names.css
@@ -0,0 +1,311 @@
+@media screen and (min-width: 771px) {
+    body > #container {
+        width: 715px;
+    }
+}
+
+/**
+ * Names cloud
+ */
+#recentnames {
+    text-align: center;
+    padding: 26px;
+    margin-bottom: 17px;
+    width: 800px;
+    margin: 17px auto;
+}
+@media screen and (max-width: 990px) {
+    #recentnames {
+        padding: 15px 10px;
+        width: 760px;
+    }
+}
+@media screen and (max-width: 770px) {
+    #recentnames {
+        padding: 5px 0;
+        width: 450px;
+    }
+}
+
+#recentnames > ul {
+    margin: 30px 0 0;
+    padding: 0;
+    text-align: center;
+    font-size: 1.5em;
+}
+@media screen and (max-width: 990px) {
+    #recentnames > ul {
+        font-size: 1.2em;
+    }
+}
+@media screen and (max-width: 770px) {
+    #recentnames > ul {
+        font-size: .8em;
+    }
+}
+
+#recentnames > ul > li {
+    font-family: proxima-nova;
+    list-style-type: none;
+    display: inline-block;
+    margin: 5px;
+    border: 1px solid #c2dfef;
+    color: #c2dfef;
+    font-weight: bold;
+    border-radius: 3px;
+    text-align: center;
+    cursor: pointer;
+    font-weight: normal;
+    overflow: hidden;
+    position: relative;
+}
+@media screen and (max-width: 770px) {
+    #recentnames > ul > li {
+        margin: 2px;
+    }
+}
+
+#recentnames > ul > li:after {
+    content: '\00a0';
+    width: 2em;
+    height: 1.5em;
+    position: absolute;
+    right: 0;
+    top: 0;
+    height: 100%;
+    background: -moz-linear-gradient(left,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
+    background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0)), color-stop(100%,rgba(255,255,255,1)));
+    background: -webkit-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
+    background: -o-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
+    background: -ms-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
+    background: linear-gradient(to right,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
+    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=1 );    
+}
+
+/*
+ * Names cloud: font sizes, vertical padding and limiting widths
+ */
+#recentnames > ul > li:nth-child(1),
+#recentnames > ul > li:nth-child(2),
+#recentnames > ul > li:nth-child(3),
+#recentnames > ul > li:nth-child(4),
+#recentnames > ul > li:nth-child(22),
+#recentnames > ul > li:nth-child(23) {
+    font-size: .9em;
+    padding: .3em 0;
+    min-width: 12%;
+    max-width: 13%;
+}
+
+#recentnames > ul > li:nth-child(5),
+#recentnames > ul > li:nth-child(9),
+#recentnames > ul > li:nth-child(18),
+#recentnames > ul > li:nth-child(21) {
+    font-size: .9em;
+    padding: .1em 0;
+    min-width: 11%;
+    max-width: 12%;
+}
+
+#recentnames > ul > li:nth-child(10),
+#recentnames > ul > li:nth-child(14) {
+    font-size: 1em;
+    padding: .4em 0;
+    min-width: 16%;
+    max-width: 17%;
+}
+
+#recentnames > ul > li:nth-child(6),
+#recentnames > ul > li:nth-child(7),
+#recentnames > ul > li:nth-child(8),
+#recentnames > ul > li:nth-child(19),
+#recentnames > ul > li:nth-child(20) {
+    font-size: 1.1em;
+    padding: .2em 0;
+    min-width: 14%;
+    max-width: 15%;
+}
+
+#recentnames > ul > li:nth-child(11),
+#recentnames > ul > li:nth-child(12),
+#recentnames > ul > li:nth-child(13) {
+    font-size: 1.6em;
+    padding: .3em 0;
+    min-width: 18%;
+    max-width: 21%;
+}
+
+#recentnames > ul > li:nth-child(15),
+#recentnames > ul > li:nth-child(16),
+#recentnames > ul > li:nth-child(17) {
+    font-size: 1.6em;
+    padding: .3em 0;
+    min-width: 28%;
+    max-width: 34%;
+}
+
+/*
+ * Names cloud: corner margins / center alignnment
+ */
+#recentnames > ul > li:nth-child(1) {
+    margin-left: 20%;
+}
+
+#recentnames > ul > li:nth-child(4) {
+    margin-right: 20%;
+}
+
+#recentnames > ul > li:nth-child(5) {
+    margin-left: 9%;
+}
+
+#recentnames > ul > li:nth-child(9) {
+    margin-right: 9%;
+}
+
+#recentnames > ul > li:nth-child(18) {
+    margin-left: 20%;
+}
+
+#recentnames > ul > li:nth-child(21) {
+    margin-right: 20%;
+}
+
+#recentnames > ul > li:nth-child(22) {
+    margin-left: 35%;
+}
+
+#recentnames > ul > li:nth-child(23) {
+    margin-right: 35%;
+}
+
+/*
+ * Names cloud: colors;
+ */
+#recentnames > ul > li:nth-child(12) {
+    color: #3395c8;
+    border-color: #3395c8;
+}
+
+#recentnames > ul > li:nth-child(7),
+#recentnames > ul > li:nth-child(11),
+#recentnames > ul > li:nth-child(13),
+#recentnames > ul > li:nth-child(16) {
+    color: #70b5d8;
+    border-color: #70b5d8;
+}
+
+#recentnames > ul > li:nth-child(6),
+#recentnames > ul > li:nth-child(8),
+#recentnames > ul > li:nth-child(19),
+#recentnames > ul > li:nth-child(20) {
+    color: #99cae3;
+    border-color: #99cae3;
+}
+
+/*
+ * Names cloud: vertical align
+ */
+#recentnames > ul > li:nth-child(1),
+#recentnames > ul > li:nth-child(2),
+#recentnames > ul > li:nth-child(3),
+#recentnames > ul > li:nth-child(4),
+#recentnames > ul > li:nth-child(5),
+#recentnames > ul > li:nth-child(6),
+#recentnames > ul > li:nth-child(7),
+#recentnames > ul > li:nth-child(8),
+#recentnames > ul > li:nth-child(9),
+#recentnames > ul > li:nth-child(10),
+#recentnames > ul > li:nth-child(11),
+#recentnames > ul > li:nth-child(12),
+#recentnames > ul > li:nth-child(13),
+#recentnames > ul > li:nth-child(14) {
+    vertical-align: bottom;
+}
+
+#recentnames > ul > li:nth-child(15),
+#recentnames > ul > li:nth-child(16),
+#recentnames > ul > li:nth-child(17),
+#recentnames > ul > li:nth-child(18),
+#recentnames > ul > li:nth-child(19),
+#recentnames > ul > li:nth-child(20),
+#recentnames > ul > li:nth-child(21),
+#recentnames > ul > li:nth-child(22),
+#recentnames > ul > li:nth-child(23) {
+    vertical-align: top;
+}
+ 
+#main {
+    position: relative;
+    display: block;
+    margin-bottom: 10%;
+    padding-top: 418px;
+    background: transparent url(../img/names.png) top center no-repeat;
+    background-size: contain;
+}
+@media screen and (max-width: 990px) {
+    #main {
+        padding-top: 10px;
+        background-size: 40%;
+        background-position: 100% 80%;
+    }
+}
+
+#main p {
+    text-align: center;
+}
+
+#main p,
+#main a {
+    font-family: proxima-nova, sans-serif;
+}
+
+#main p {
+    margin-top: 3%;
+    margin-bottom: 3%;
+    color: #555555;
+    font-size: 18px;
+    padding: 0 134px;
+}
+@media screen and (max-width: 990px) {
+    #main p {
+        text-align: left;
+    }
+
+    #main p + p {
+        width: 47%;
+    }
+}
+@media screen and (max-width: 770px) {
+    #main p {
+        padding: 0 30px;
+    }
+}
+@media screen and (max-width: 530px) {
+    #main p {
+        padding: 0;
+        font-size: 16px;
+    }
+    #main p + p {
+        width: 63%;
+    }
+}
+#main a {
+    color: #0f9abb;
+    border: 1px solid #0f9abb;
+    border-radius: 5px;
+    text-decoration: none;
+    font-size: 1.4em;
+    font-weight: bold;
+    padding: .3em 1em;
+}
+@media screen and (max-width: 770px) {
+    #main a {
+        font-size: 1em;
+    }
+}
+
+#main a:hover {
+    color: #ffffff;
+    background-color: #0f9abb;
+}
diff --git a/img/names.png b/img/names.png
new file mode 100644
index 0000000..617c194
Binary files /dev/null and b/img/names.png differ
diff --git a/js/names.js b/js/names.js
new file mode 100644
index 0000000..6513dbd
--- /dev/null
+++ b/js/names.js
@@ -0,0 +1,117 @@
+var names = {
+    SHOWN_PLACES_COUNT: 23,
+    RESORT_INTERVAL: 10, // seconds
+    UPDATE_INTERVAL: 300, // seconds
+
+    options: {
+        unsupported_warning: false
+    },
+
+    profanity: [],
+    places: [],
+    lastUpdate: 0,
+    updating: false,
+    shownPlacesFrom: 0,
+    sortedPlaces: [],
+    lastResort: 0,
+
+    init: function () {
+        names.loadProfanity(function () {
+            names.render();
+        });
+    },
+
+    render: function () {
+        if (!names.updating && (!names.lastUpdate || names.UPDATE_INTERVAL < (new Date().getTime() / 1000) - names.lastUpdate)) {
+            names.update();
+        }
+        var resorted = false;
+        if (names.places.length && (!names.lastResort || names.RESORT_INTERVAL < (new Date().getTime() / 1000) - names.lastResort)) {
+            names.resort();
+            resorted = true;
+        }
+        if ((names.places.length && !names.sortedPlaces.length) || resorted) {
+            if (!$('#recentnames').length) {
+                $('<section>').attr('id', 'recentnames').insertBefore('#container');
+                $('<ul>').appendTo('#recentnames');
+            }
+            names.sortedPlaces = names.sortPlaces(names.shownPlacesFrom, names.SHOWN_PLACES_COUNT);
+            $('#recentnames > ul > li').remove();
+            for (var i = 0; i < names.sortedPlaces.length; i++) {
+                $('<li>').html(names.sortedPlaces[i]).appendTo('#recentnames > ul');
+            }
+        }
+        setTimeout(names.render, 1000);
+    },
+
+    resort: function () {
+        names.shownPlacesFrom++;
+        if (names.shownPlacesFrom > names.places.length) {
+            names.shownPlacesFrom = 0;
+        }
+        names.lastResort = new Date().getTime() / 1000;
+    },
+
+    sortPlaces: function (from, count) {
+        var i = 0;
+        var sorted = [];
+        var middlePlace = parseInt(count / 2);
+        var sortIndex = middlePlace;
+        var namesOffset = from + count;
+        var namesIndex = namesOffset - (namesOffset >= names.places.length ? names.places.length : 0);
+        sorted[sortIndex] = names.places[namesIndex];
+        for (var i = 0; i < count -1; i++) {
+            namesOffset = from + count - i -1;
+            namesIndex = namesOffset - (namesOffset >= names.places.length ? names.places.length : 0);
+            sortIndex = middlePlace + parseInt(((i+1) / 2) + ((i+1) % 2)) * ((namesIndex + 2) % 2 ? 1 : -1);
+            sorted[sortIndex] = names.places[namesIndex];
+        }
+        return sorted;
+    },
+
+    needsUpdate: function (places) {
+        return places.filter(function (i) {
+            return names.places.indexOf(i) < 0;
+        });
+    },
+
+    needsUpdate: function (places) {
+        return places.filter(function (i) {
+            return names.places.indexOf(i) < 0;
+        });
+    },
+
+    update: function (fAfter) {
+        if (names.updating) {
+            return false;
+        }
+        names.updating = true;
+        var url = 'https://metaverse.highfidelity.io/api/v1/new_place_names';
+        $.getJSON(url, function (json) {
+            var updated_places = json.data.new_place_names;
+            if (diff = names.needsUpdate(updated_places)) {
+                names.places = names.places.concat(diff);
+            }
+            names.lastUpdate = new Date().getTime() / 1000;
+            names.updating = false;
+        });
+    },
+
+    hasProfanity: function (word) {
+        var regex = new RegExp(names.profanity.join('|'));
+        return word.search(regex) > -1;
+    },
+
+    loadProfanity: function (fAfter) {
+        $.get('./profanity.txt', function(data) {
+            names.profanity = data.split("\n");
+            if (fAfter) {
+                fAfter();
+            }
+        });
+    },
+
+    isCompatible: function () {
+        return true;
+    }
+};
diff --git a/names.php b/names.php
new file mode 100644
index 0000000..e17cae3
--- /dev/null
+++ b/names.php
@@ -0,0 +1,11 @@
+<?php
+require_once('config.php');
+
+View::$title = 'High Fidelity Place Names';
+View::write('page', 'names');
+
+View::addStyle('css/names.css');
+
+View::addScript('js/names.js');
+
+View::renderCommonLayout('names');
diff --git a/profanity.txt b/profanity.txt
new file mode 100644
index 0000000..1e91e6a
--- /dev/null
+++ b/profanity.txt
@@ -0,0 +1,361 @@
+2g1c
+2 girls 1 cup
+acrotomophilia
+alabama hot pocket
+alaskan pipeline
+anal
+anilingus
+anus
+arsehole
+ass
+asshole
+assmunch
+auto erotic
+autoerotic
+babeland
+baby batter
+baby juice
+ball gag
+ball gravy
+ball kicking
+ball licking
+ball sack
+ball sucking
+bangbros
+bareback
+barely legal
+barenaked
+bastardo
+bastinado
+bbw
+bdsm
+beaver cleaver
+beaver lips
+bestiality
+bi curious
+big black
+big breasts
+big knockers
+big tits
+bimbos
+birdlock
+bitch
+black cock
+blonde action
+blonde on blonde action
+blowjob
+blow job
+blow your load
+blue waffle
+blumpkin
+bollocks
+bondage
+boner
+boob
+boobs
+booty call
+brown showers
+brunette action
+bukkake
+bulldyke
+bullet vibe
+bung hole
+bunghole
+busty
+butt
+buttcheeks
+butthole
+camel toe
+camgirl
+camslut
+camwhore
+carpet muncher
+carpetmuncher
+chocolate rosebuds
+circlejerk
+cleveland steamer
+clit
+clitoris
+clover clamps
+clusterfuck
+cock
+cocks
+coprolagnia
+coprophilia
+cornhole
+creampie
+cum
+cumming
+cunnilingus
+cunt
+darkie
+date rape
+daterape
+deep throat
+deepthroat
+dendrophilia
+dick
+dildo
+dirty pillows
+dirty sanchez
+doggie style
+doggiestyle
+doggy style
+doggystyle
+dog style
+dolcett
+domination
+dominatrix
+dommes
+donkey punch
+double dong
+double penetration
+dp action
+dry hump
+dvda
+eat my ass
+ecchi
+ejaculation
+erotic
+erotism
+escort
+ethical slut
+eunuch
+faggot
+fecal
+felch
+fellatio
+feltch
+female squirting
+femdom
+figging
+fingerbang
+fingering
+fisting
+foot fetish
+footjob
+frotting
+fuck
+fuck buttons
+fudge packer
+fudgepacker
+futanari
+gang bang
+gay sex
+genitals
+giant cock
+girl on
+girl on top
+girls gone wild
+goatcx
+goatse
+gokkun
+golden shower
+goodpoop
+goo girl
+goregasm
+grope
+group sex
+g-spot
+guro
+hand job
+handjob
+hard core
+hardcore
+hentai
+homoerotic
+honkey
+hooker
+hot carl
+hot chick
+how to kill
+how to murder
+huge fat
+humping
+incest
+intercourse
+jack off
+jail bait
+jailbait
+jelly donut
+jerk off
+jigaboo
+jiggaboo
+jiggerboo
+jizz
+juggs
+kike
+kinbaku
+kinkster
+kinky
+knobbing
+leather restraint
+leather straight jacket
+lemon party
+lolita
+lovemaking
+make me come
+male squirting
+masturbate
+menage a trois
+milf
+missionary position
+motherfucker
+mound of venus
+mr hands
+muff diver
+muffdiving
+nambla
+nawashi
+negro
+neonazi
+nigga
+nigger
+nig nog
+nimphomania
+nipple
+nipples
+nsfw images
+nude
+nudity
+nympho
+nymphomania
+octopussy
+omorashi
+one cup two girls
+one guy one jar
+orgasm
+orgy
+paedophile
+panties
+panty
+pedobear
+pedophile
+pegging
+penis
+phone sex
+piece of shit
+pissing
+piss pig
+pisspig
+playboy
+pleasure chest
+pole smoker
+ponyplay
+poof
+poon
+poontang
+punany
+poop chute
+poopchute
+porn
+porno
+pornography
+prince albert piercing
+pthc
+pubes
+pussy
+queaf
+raghead
+raging boner
+rape
+raping
+rapist
+rectum
+reverse cowgirl
+rimjob
+rimming
+rosy palm
+rosy palm and her 5 sisters
+rusty trombone
+sadism
+santorum
+scat
+schlong
+scissoring
+semen
+sex
+sexo
+sexy
+shaved beaver
+shaved pussy
+shemale
+shibari
+shit
+shota
+shrimping
+skeet
+slanteye
+slut
+s&m
+smut
+snatch
+snowballing
+sodomize
+sodomy
+spic
+splooge
+splooge moose
+spooge
+spread legs
+spunk
+strap on
+strapon
+strappado
+strip club
+style doggy
+suck
+sucks
+suicide girls
+sultry women
+swastika
+swinger
+tainted love
+taste my
+tea bagging
+threesome
+throating
+tied up
+tight white
+tit
+tits
+titties
+titty
+tongue in a
+topless
+tosser
+towelhead
+tranny
+tribadism
+tub girl
+tubgirl
+tushy
+twat
+twink
+twinkie
+two girls one cup
+undressing
+upskirt
+urethra play
+urophilia
+vagina
+venus mound
+vibrator
+violet blue
+violet wand
+vorarephilia
+voyeur
+vulva
+wank
+wetback
+wet dream
+white power
+women rapping
+wrapping men
+wrinkled starfish
+xx
+xxx
+yaoi
+yellow showers
+yiffy
+zoophilia
\ No newline at end of file
diff --git a/views/layout/navbar.php b/views/layout/navbar.php
index 8ffe693..f38ada4 100644
--- a/views/layout/navbar.php
+++ b/views/layout/navbar.php
@@ -53,7 +53,7 @@
         </nav>
     </div>
 </header>
-<?php if ($page != 'home') { ?>
+<?php if ($page != 'home' && $page != 'names') { ?>
     <div id="container">
 <?php } ?>
 
diff --git a/views/names.php b/views/names.php
new file mode 100644
index 0000000..c319c62
--- /dev/null
+++ b/views/names.php
@@ -0,0 +1,15 @@
+<div id="container">
+  <div role='main' id='main'>
+    <p>
+      Where domain names get you the web pages, Place Names
+      get you to a fixed location in 3D space.
+    </p>
+    <p>
+      Entering the Place Name 'Japan' might bring you to a
+      Welcome Area somewhere in Tokyo. The exact location for
+      the Place Name is determined by its owner.
+    </p>
+    <p>
+      <a href='#'>Buy a Place Name</a>
+    </p>
+  </div>
\ No newline at end of file