Category Archives: Project 8

8: meBot [code]

Posted on by 

//funtions used (in order):
//searchIt (searches for a term among recent tweets)
//randomTweetGenerator (includes r value and number output)
//followedMe (mentions people who follow, random intervals)
//mentionsMe (replies when someone @iamlittleprick)



console.log('meBot is working today');

var Twit = require('twit');
var config = require('./config');
var T = new Twit(config);


//begin searchIt funtion
setInterval(searchIt, 1000*60*60);
searchIt();

function searchIt(){
  var searches = {
    q: 'new media art',
    count: 1,
    lang: 'en'
  }
  // dev.twitter.com and get search/statuses

  T.get('search/tweets', searches, getSearches);

  function getSearches(err, data, response){
    var tweets = data.statuses;
    if (tweets != undefined) {
      for (var i = 0; i < tweets.length; i++){
      console.log("HERE'S WHAT THEY RECENTLY SAID ABOUT NEW MEDIA ART: " + tweets[i].text);
      }
    }
  }
}
//end searchIt function



//THIS ONE tweets randomly, with a random number
//begin randomTweetGenerator function
// randomTweetGenerator();
// var r2 = Math.floor(Math.random()*5;
// setInterval(randomTweetGenerator, 1000*60); //how often to tweet
//1000ms=1sec *60=1min *60=1hr
randomTweetGenerator();

var rr = Math.floor(Math.random()*(53));
setInterval(randomTweetGenerator, 1000*60*rr);

function randomTweetGenerator(){

  var begin = [
  "i've been thinking about getting",
  "i'd really like",
  "thinking about",
  "lusting over"
  ];

  var noun = [
    "cookies",
    "stickers",
    "friends",
    "dollars",
    "followers",
    "flowers",
    "teacups",
    "vacations",
    "kittens",
    "cats",
    "t-shirts",
    "stickers",
    "boardgames",
    "balls of yarn",
  ];

  var end = [
    "today.",
    "in the near future.",
    "right now.",
    "soon.",
    "with a friend.",
    "for you.",
    "for myself. #treatYoSelf"
  ]

 var codingHashtags = [
    "#coderProblems",
    "#codingThisBitch",
    "#programmerProblems",
    "#syntaxError",
    "#turnDownForWhat",
    "#goOutside",
  ];

  var nostalgicHashtags = [
    "#eveninmydreams",
    "#imnotevenjoking",
    "#nostalgic",
    "#thegoodoldays",
    "#thinkingTooMuch"
  ];

  var boredHashtags = [
    "#indecisive",
    "#bored",
    "#dontknowwhattodo",
    "#idontknow"
  ];


  begin1 = begin[Math.floor(Math.random()*begin.length)];
  noun1 = noun[Math.floor(Math.random()*noun.length)];
  end1 = end[Math.floor(Math.random()*end.length)];

  codingHashtags1 = codingHashtags[Math.floor(Math.random()*codingHashtags.length)];
  nostalgicHashtags1 = nostalgicHashtags[Math.floor(Math.random()*nostalgicHashtags.length)];
  boredHashtags1 = boredHashtags[Math.floor(Math.random()*boredHashtags.length)];

  var r = Math.floor(Math.random()*50) + 2;

  var myRandomTweet = [
    "i've thought about you " + r + " times since my last tweet. " + nostalgicHashtags1,
    "i've been coding a lot lately, and i'm currently averaging " + r + " EPH (expletives per hour). " + codingHashtags1,
    "i've wanted to go outside " + r + " times since my last tweet. alas, i sit under the fluorescents. " + codingHashtags1,
    begin1 + " " + r + " " + noun1 + " " + end1,
    begin1 + " " + noun1,
    "every once in a while i ask this question, and it's just to get to know you all a little better. here's the question: how did you stumble upon my account? #hideandseek",
    "what should i do tomorrow? " + boredHashtags1,
    "what should i do today? " + boredHashtags1,
    "what should i do this weekend? " + boredHashtags1,
    "hi :)"
    ];

  myRandomTweet1 = myRandomTweet[Math.floor(Math.random()*myRandomTweet.length)];


  console.log("....... randomTweetGenerator started");

    var replyTweet = {
      status: myRandomTweet1
    }

    T.post('statuses/update', replyTweet, replyTweeted);

    function replyTweeted(err, data, response){
      if (err){
      console.log("oh, nos... error on randomTweetGenerator tweet");
      }else{
      console.log("....... randomTweetGenerator posted " + myRandomTweet1);
      }
    }
} //end of randomTweetGenerator function





//THIS FUNCTION is anytime someone follows me
//begin followedMe function

var streamFollow = T.stream('user');

streamFollow.on('follow', followedMe);


function followedMe(eventMsg){
  var name = eventMsg.source.name;
  var screenName = eventMsg.source.screen_name;
  var followedReply = [
    "how are you?",
    "what are you up to?",
    "what's up?",
    "thanks for the follow!",
    "thanks for the follow!!",
    "thanks for the follow! :)",
    "where are you from?",
    "what brings you around these parts?",
    "how did you stumble upon my account?",
    "what do you like to do for fun?",
    ":)",
    ":) :) :)",
    "thanks for following me :)",
    "thanks for following :)",
    "thanks for the follow",
    "followed me! yay! :)"
  ];

  var followedReplyBegin = [
    "hi ",
    "hi! ",
    "hi, ",
    "",
    "",
    "",
    "",
    "",
    "",
    "hey, it's ",
    "well, hello there ",
    "look who we have here :) "

  ];

  var followedReply1 = followedReply[Math.floor(Math.random()*followedReply.length)];
  var followedReplyBegin1 = followedReplyBegin[Math.floor(Math.random()*followedReplyBegin.length)];

  console.log("....... followedMe // i've been followed by " + screenName);
  // tweetBack("hi @" + screenName + " " + reply1);

  function delayedTweetBack(s) {
    tweetBack(s);
  }

  var tweetString = followedReplyBegin1 + "@" + screenName + " " + followedReply1;

  var r = Math.floor(Math.random()*37);

  setTimeout(delayedTweetBack, (1000*60*r), tweetString);

  function tweetBack(txt){

    var replyTweet = {
    status: txt
    }

  T.post('statuses/update', replyTweet, replyTweeted);

    function replyTweeted(err, data, response){
      if (err){
        console.log("followedMe FAILED");
      }else{
        console.log("followedMe // " + tweetString);
      }
    }
  }
} //end of followed funtion




//THIS FUNTION IS: thanks for the mention
//begin mentionsMe

var streamMentions = T.stream('user');

streamMentions.on('tweet', mentionsMe);

function mentionsMe(eventMsg){
  // var fs = require('fs');
  // var json = JSON.stringify(eventMsg,null,2);
  // fs.writeFile("tweet.json", json);

  var replyto = eventMsg.in_reply_to_screen_name;
  var text = eventMsg.text;
  var from = eventMsg.user.screen_name;

  var reply = [
    "really?",
    "so....what are you up to?",
    "nice :)",
    "...um",
    "not today..",
    "i think so",
    "huh?",
    "i see..",
    "what do you think?",
    "yeah, same here",
    "only on wednesdays lol",
    ":)",
    "well, well, well...",
    "according to the prophecy",
    "yeah..",
    "of course",
    "i'm sorry",
    "oh, really??",
    "thanks",
    ":D",
    "i'm not so sure",
    "what are your thoughts?"
  ];

  var reply1 = reply[Math.floor(Math.random()*reply.length)];

  if (replyto === 'iamlittleprick'){
    console.log(from + " says: " + text);


    function delayedTweetBack(s) {
      tweetBack(s);
    }

    var tweetString = "@" + from + " " + reply1;

    var r = Math.floor(Math.random()*23);

    setTimeout(delayedTweetBack, (1000*60*r), tweetString);

    function tweetBack(txt){

      var replyTweet = {
      status: txt
      }

  T.post('statuses/update', replyTweet, replyTweeted);

    function replyTweeted(err, data, response){
      if (err){
        console.log("mentionsMe FAILED");
        }else{
        console.log("....... yay!! mentionsMe works");
      }
    }
  }
}
} //end of mentionsMe function

Project 8 (my code)

Posted on by

Im Awake Are You Awake

.site {
float:top;
}
iframe {
float:right;
margin-bottom:5px;
height:350px;
width:800px;
}
body {
position: sticky;
padding-left:30%;

padding-right:20%;
padding-bottom:2%;
background-color:black;
}

Second Set of Code:

Firebase location

body {
background-color: black;
}
#log{
color: black;
}
.dot {
background-color: red;
border-radius: 50%;
display: inline-block;
width: 70px;
height: 70px;
position: absolute;
}

var config = {
apiKey: “AIzaSyD0gBQqKpHEjzAU7Gw96OaxZ3PdmqOG5Bo”,
authDomain: “sing-for-you.firebaseapp.com”,
databaseURL: “https://sing-for-you.firebaseio.com”,
projectId: “sing-for-you”,
storageBucket: “sing-for-you.appspot.com”,
messagingSenderId: “545356361457”
};

firebase.initializeApp(config);
var j = jQuery.noConflict();

var db = firebase.database();

var dot = db.ref(“dot”);

var currentMousePos = { x: -1, y: -1 };

dot.on(‘value’,function(dataSnapshot) {
var rawData = dataSnapshot.val(); // “300,”100″
var xyData = rawData.split(‘,’);
var x = xyData[0];
var y = xyData[1];
x = x – 35;
y = y – 35;
j(‘#log’).text(x+”,”+y);
var newDot = j(“

“);
newDot.css(“left”, x+”px”);
newDot.css(“top”, y+”px”);
newDot.css(“background-color”,”red”);
j(“.dot”).remove();
//j(‘#draggable’).append(newDot);
j(‘#container’).append(newDot);
});
/*
dbCount.on(‘value’)
//
*/
j(document).ready(function() {

j(document).click(function(e) {
var position = e.pageX+”,”+e.pageY;
dot.transaction(function() {
return position;
})
})
})

776,456

‘undefined’=== typeof _trfq || (window._trfq = []);’undefined’=== typeof _trfd && (window._trfd=[]),_trfd.push({‘tccl.baseHost’:’secureserver.net’}),_trfd.push({‘ap’:’cpsh’},{‘server’:’a2plcpnl0097′}) // Monitoring performance to make your website faster. If you want to opt-out, please contact web hosting support.

8: meBot

Posted on by

For the final project, I created a twitter bot. Now, this isn’t just any twitter bot — it’s me! You can follow my meBot on twitter at @iamlittleprick

I have too much going on to spend a bunch of time on social media, and often it’s just downright exhausting. However, I realize that being active on social media is important in how we network these days.

meBot is programmed to tweet like I would tweet, reply like I’d reply, and more! Check out the news segment featuring meBot:

If you’re curious as to how meBot is performing as far as not being noticeably a bot, here’s meBot’s current stats against other (real) people:

 

If you’re interested in checking out my meBot code, and other tidbits, see my next post.

Project 8 Code

Posted on by 
 

<%%KEEPWHITESPACE%%>    ready('button.css-1a34p0v', function(e) {
<%%KEEPWHITESPACE%%>      j(e).html("ADD TO BASKET&lt;br/&gt;do you need really need this item?");
<%%KEEPWHITESPACE%%>    });

<%%KEEPWHITESPACE%%>    ready('button.css-18f6p7u', function(e) {
<%%KEEPWHITESPACE%%>      j(e).html("CHECKOUT &lt;br/&gt; should you be spending money on this?");
<%%KEEPWHITESPACE%%>    });

<%%KEEPWHITESPACE%%>    ready('button.css-xtpcv7', function(e) {
<%%KEEPWHITESPACE%%>      j(e).html("CHECKOUT &lt;br/&gt; should you be spending money on this?");
<%%KEEPWHITESPACE%%>    });

Final Project Code

Posted on by

https://developers.google.com/maps/documentation/javascript/firebase

https://developers.google.com/maps/documentation/javascript/mysql-to-maps

 &lt;!DOCTYPE html&gt;
&lt;html&gt;
<%%KEEPWHITESPACE%%>  &lt;head&gt;
<%%KEEPWHITESPACE%%>    &lt;meta name="viewport" content="initial-scale=1.0, user-scalable=no"&gt;
<%%KEEPWHITESPACE%%>    &lt;meta charset="utf-8"&gt;
<%%KEEPWHITESPACE%%>    &lt;title&gt;Map Puzzle&lt;/title&gt;
<%%KEEPWHITESPACE%%>    &lt;style&gt;

<%%KEEPWHITESPACE%%>      #map {
<%%KEEPWHITESPACE%%>        height: 100%;
<%%KEEPWHITESPACE%%>      }

<%%KEEPWHITESPACE%%>      html, body {
<%%KEEPWHITESPACE%%>        height: 100%;
<%%KEEPWHITESPACE%%>        margin: 0;
<%%KEEPWHITESPACE%%>        padding: 0;
<%%KEEPWHITESPACE%%>      }
<%%KEEPWHITESPACE%%>    &lt;/style&gt;
<%%KEEPWHITESPACE%%>  &lt;/head&gt;
<%%KEEPWHITESPACE%%>  &lt;body&gt;
<%%KEEPWHITESPACE%%>    &lt;div id="map"&gt;&lt;/div&gt;
<%%KEEPWHITESPACE%%>    &lt;script src="https://www.gstatic.com/firebasejs/4.13.0/firebase.js"&gt;&lt;/script&gt;
&lt;script&gt;
<%%KEEPWHITESPACE%%>  // Initialize Firebase
<%%KEEPWHITESPACE%%>  var config = {
<%%KEEPWHITESPACE%%>    apiKey: "AIzaSyCdUZeJTXzbqEXfVzskUFOoY-Mqh9TnyvU",
<%%KEEPWHITESPACE%%>    authDomain: "click-function-test.firebaseapp.com",
<%%KEEPWHITESPACE%%>    databaseURL: "https://click-function-test.firebaseio.com",
<%%KEEPWHITESPACE%%>    projectId: "click-function-test",
<%%KEEPWHITESPACE%%>    storageBucket: "click-function-test.appspot.com",
<%%KEEPWHITESPACE%%>    messagingSenderId: "257165968755"
<%%KEEPWHITESPACE%%>  };
<%%KEEPWHITESPACE%%>  firebase.initializeApp(config);
&lt;/script&gt;
<%%KEEPWHITESPACE%%>    &lt;script&gt;

function PuzzleDemo() {

<%%KEEPWHITESPACE%%>  this.polys_ = [];

<%%KEEPWHITESPACE%%>  this.difficulty_ = 'easy';

<%%KEEPWHITESPACE%%>  this.count_ = 0;

<%%KEEPWHITESPACE%%>  this.pieceDiv_ = null;

<%%KEEPWHITESPACE%%>  this.timeDiv_ = null;
}

PuzzleDemo.NUM_PIECES_ = 10;

PuzzleDemo.START_COLOR_ = '#3c79de';

PuzzleDemo.END_COLOR_ = '#037e29';

PuzzleDemo.prototype.init = function(map) {
<%%KEEPWHITESPACE%%>  this.map_ = map;
<%%KEEPWHITESPACE%%>  this.createMenu_(map);
<%%KEEPWHITESPACE%%>  this.setDifficultyStyle_();
<%%KEEPWHITESPACE%%> this.loadData_();
};

PuzzleDemo.prototype.createMenu_ = function(map) {
<%%KEEPWHITESPACE%%>  var menuDiv = document.createElement('div');
<%%KEEPWHITESPACE%%>  menuDiv.style.cssText =
<%%KEEPWHITESPACE%%>      'margin: 40px 10px; border-radius: 8px; height: 320px; width: 180px;' +
<%%KEEPWHITESPACE%%>      'background-color: white; font-size: 14px; font-family: Roboto;' +
<%%KEEPWHITESPACE%%>      'text-align: center; color: grey;line-height: 32px; overflow: hidden';
<%%KEEPWHITESPACE%%>  var titleDiv = document.createElement('div');
<%%KEEPWHITESPACE%%>  titleDiv.style.cssText =
<%%KEEPWHITESPACE%%>      'width: 100%; background-color: #4285f4; color: white; font-size: 20px;' +
<%%KEEPWHITESPACE%%>      'line-height: 40px;margin-bottom: 24px';
<%%KEEPWHITESPACE%%>  titleDiv.innerText = 'Game Options';
<%%KEEPWHITESPACE%%>  var pieceTitleDiv = document.createElement('div');
<%%KEEPWHITESPACE%%>  pieceTitleDiv.innerText = 'PIECE:';
<%%KEEPWHITESPACE%%>  pieceTitleDiv.style.fontWeight = '800';
<%%KEEPWHITESPACE%%>  var pieceDiv = this.pieceDiv_ = document.createElement('div');
<%%KEEPWHITESPACE%%>  pieceDiv.innerText = '0 / ' + PuzzleDemo.NUM_PIECES_;
<%%KEEPWHITESPACE%%>  var timeTitleDiv = document.createElement('div');
<%%KEEPWHITESPACE%%>  timeTitleDiv.innerText = 'TIME:';
<%%KEEPWHITESPACE%%>  timeTitleDiv.style.fontWeight = '800';
<%%KEEPWHITESPACE%%>  var timeDiv = this.timeDiv_ = document.createElement('div');
<%%KEEPWHITESPACE%%>  timeDiv.innerText = '0.0 seconds';
<%%KEEPWHITESPACE%%>  var difficultyTitleDiv = document.createElement('div');
<%%KEEPWHITESPACE%%>  difficultyTitleDiv.innerText = 'DIFFICULTY:';
<%%KEEPWHITESPACE%%>  difficultyTitleDiv.style.fontWeight = '800';
<%%KEEPWHITESPACE%%>  var difficultySelect = document.createElement('select');
<%%KEEPWHITESPACE%%>  ['Easy', 'Moderate', 'Hard', 'Extreme'].forEach(function(level) {
<%%KEEPWHITESPACE%%>    var option = document.createElement('option');
<%%KEEPWHITESPACE%%>    option.value = level.toLowerCase();
<%%KEEPWHITESPACE%%>    option.innerText = level;
<%%KEEPWHITESPACE%%>    difficultySelect.appendChild(option);
<%%KEEPWHITESPACE%%>  });
<%%KEEPWHITESPACE%%>  difficultySelect.style.cssText =
<%%KEEPWHITESPACE%%>      'border: 2px solid lightgrey; background-color: white; color: #4275f4;' +
<%%KEEPWHITESPACE%%>      'padding: 6px;';
<%%KEEPWHITESPACE%%>  difficultySelect.onchange = function() {
<%%KEEPWHITESPACE%%>    this.setDifficulty_(difficultySelect.value);
<%%KEEPWHITESPACE%%>    this.resetGame_();
<%%KEEPWHITESPACE%%>  }.bind(this);
<%%KEEPWHITESPACE%%>  var resetDiv = document.createElement('div');
<%%KEEPWHITESPACE%%>  resetDiv.innerText = 'Reset';
<%%KEEPWHITESPACE%%>  resetDiv.style.cssText =
<%%KEEPWHITESPACE%%>      'cursor: pointer; border-top: 1px solid lightgrey; margin-top: 18px;' +
<%%KEEPWHITESPACE%%>      'color: #4275f4; line-height: 40px; font-weight: 800';
<%%KEEPWHITESPACE%%>  resetDiv.onclick = this.resetGame_.bind(this);
<%%KEEPWHITESPACE%%>  menuDiv.appendChild(titleDiv);
<%%KEEPWHITESPACE%%>  menuDiv.appendChild(pieceTitleDiv);
<%%KEEPWHITESPACE%%>  menuDiv.appendChild(pieceDiv);
<%%KEEPWHITESPACE%%>  menuDiv.appendChild(timeTitleDiv);
<%%KEEPWHITESPACE%%>  menuDiv.appendChild(timeDiv);
<%%KEEPWHITESPACE%%>  menuDiv.appendChild(difficultyTitleDiv);
<%%KEEPWHITESPACE%%>  menuDiv.appendChild(difficultySelect);
<%%KEEPWHITESPACE%%>  menuDiv.appendChild(resetDiv);
<%%KEEPWHITESPACE%%>  map.controls[google.maps.ControlPosition.TOP_LEFT].push(menuDiv);
};

PuzzleDemo.prototype.render = function(map) {

<%%KEEPWHITESPACE%%>  if (!this.dataLoaded_) {
<%%KEEPWHITESPACE%%>    return;
<%%KEEPWHITESPACE%%>  }
<%%KEEPWHITESPACE%%>  this.start_();
};

PuzzleDemo.prototype.loadData_ = function() {
<%%KEEPWHITESPACE%%>  var xmlhttpRequest = new XMLHttpRequest;
<%%KEEPWHITESPACE%%>  xmlhttpRequest.onreadystatechange = function() {
<%%KEEPWHITESPACE%%>    if (xmlhttpRequest.status != 200 ||
<%%KEEPWHITESPACE%%>        xmlhttpRequest.readyState != XMLHttpRequest.DONE) return;
<%%KEEPWHITESPACE%%>    this.loadDataComplete_(JSON.parse(xmlhttpRequest.responseText));
<%%KEEPWHITESPACE%%>  }.bind(this);
<%%KEEPWHITESPACE%%>  xmlhttpRequest.open(
<%%KEEPWHITESPACE%%>      'GET', 'https://storage.googleapis.com/mapsdevsite/json/puzzle.json',
<%%KEEPWHITESPACE%%>      true);
<%%KEEPWHITESPACE%%>  xmlhttpRequest.send(null);
};

PuzzleDemo.prototype.loadDataComplete_ = function(data) {
<%%KEEPWHITESPACE%%>  this.dataLoaded_ = true;
<%%KEEPWHITESPACE%%>  this.countries_ = data;
<%%KEEPWHITESPACE%%>  this.start_();
};

PuzzleDemo.prototype.setDifficulty_ = function(difficulty) {
<%%KEEPWHITESPACE%%>  this.difficulty_ = difficulty;

<%%KEEPWHITESPACE%%>  if (this.map_) {
<%%KEEPWHITESPACE%%>    this.setDifficultyStyle_();
<%%KEEPWHITESPACE%%>  }
};

PuzzleDemo.prototype.setDifficultyStyle_ = function() {
<%%KEEPWHITESPACE%%>  var styles = {
<%%KEEPWHITESPACE%%>    'easy': [
<%%KEEPWHITESPACE%%>      {
<%%KEEPWHITESPACE%%>        stylers: [
<%%KEEPWHITESPACE%%>          { visibility: 'off' }
<%%KEEPWHITESPACE%%>        ]
<%%KEEPWHITESPACE%%>      },{
<%%KEEPWHITESPACE%%>        featureType: 'water',
<%%KEEPWHITESPACE%%>        stylers: [
<%%KEEPWHITESPACE%%>            { visibility: 'on' },
<%%KEEPWHITESPACE%%>            { color: '#d4d4d4' }
<%%KEEPWHITESPACE%%>        ]
<%%KEEPWHITESPACE%%>      },{
<%%KEEPWHITESPACE%%>        featureType: 'landscape',
<%%KEEPWHITESPACE%%>        stylers: [
<%%KEEPWHITESPACE%%>          { visibility: 'on' },
<%%KEEPWHITESPACE%%>          { color: '#e5e3df' }
<%%KEEPWHITESPACE%%>        ]
<%%KEEPWHITESPACE%%>      }, {
<%%KEEPWHITESPACE%%>        featureType: 'administrative.country',
<%%KEEPWHITESPACE%%>        elementType: 'labels',
<%%KEEPWHITESPACE%%>        stylers: [
<%%KEEPWHITESPACE%%>         { visibility: 'on' }
<%%KEEPWHITESPACE%%>        ]
<%%KEEPWHITESPACE%%>      }, {
<%%KEEPWHITESPACE%%>        featureType: 'administrative.country',
<%%KEEPWHITESPACE%%>        elementType: 'geometry',
<%%KEEPWHITESPACE%%>        stylers: [
<%%KEEPWHITESPACE%%>         { visibility: 'on' },
<%%KEEPWHITESPACE%%>         { weight: 1.3 }
<%%KEEPWHITESPACE%%>        ]
<%%KEEPWHITESPACE%%>      }
<%%KEEPWHITESPACE%%>    ],
<%%KEEPWHITESPACE%%>    'moderate': [
<%%KEEPWHITESPACE%%>      {
<%%KEEPWHITESPACE%%>        stylers: [
<%%KEEPWHITESPACE%%>          { visibility: 'off' }
<%%KEEPWHITESPACE%%>        ]
<%%KEEPWHITESPACE%%>      },{
<%%KEEPWHITESPACE%%>        featureType: 'water',
<%%KEEPWHITESPACE%%>        stylers: [
<%%KEEPWHITESPACE%%>            { visibility: 'on' },
<%%KEEPWHITESPACE%%>            { color: '#d4d4d4' }
<%%KEEPWHITESPACE%%>        ]
<%%KEEPWHITESPACE%%>      },{
<%%KEEPWHITESPACE%%>        featureType: 'landscape',
<%%KEEPWHITESPACE%%>        stylers: [
<%%KEEPWHITESPACE%%>          { visibility: 'on' },
<%%KEEPWHITESPACE%%>          { color: '#e5e3df' }
<%%KEEPWHITESPACE%%>        ]
<%%KEEPWHITESPACE%%>      }, {
<%%KEEPWHITESPACE%%>        featureType: 'administrative.country',
<%%KEEPWHITESPACE%%>        elementType: 'labels',
<%%KEEPWHITESPACE%%>        stylers: [
<%%KEEPWHITESPACE%%>         { visibility: 'on' }
<%%KEEPWHITESPACE%%>        ]
<%%KEEPWHITESPACE%%>      }
<%%KEEPWHITESPACE%%>    ],
<%%KEEPWHITESPACE%%>    'hard': [
<%%KEEPWHITESPACE%%>      {
<%%KEEPWHITESPACE%%>        stylers: [
<%%KEEPWHITESPACE%%>          { visibility: 'off' }
<%%KEEPWHITESPACE%%>        ]
<%%KEEPWHITESPACE%%>      },{
<%%KEEPWHITESPACE%%>        featureType: 'water',
<%%KEEPWHITESPACE%%>        stylers: [
<%%KEEPWHITESPACE%%>            { visibility: 'on' },
<%%KEEPWHITESPACE%%>            { color: '#d4d4d4' }
<%%KEEPWHITESPACE%%>        ]
<%%KEEPWHITESPACE%%>      },{
<%%KEEPWHITESPACE%%>        featureType: 'landscape',
<%%KEEPWHITESPACE%%>        stylers: [
<%%KEEPWHITESPACE%%>          { visibility: 'on' },
<%%KEEPWHITESPACE%%>          { color: '#e5e3df' }
<%%KEEPWHITESPACE%%>        ]
<%%KEEPWHITESPACE%%>      }
<%%KEEPWHITESPACE%%>    ],
<%%KEEPWHITESPACE%%>    'extreme': [
<%%KEEPWHITESPACE%%>      {
<%%KEEPWHITESPACE%%>        elementType: 'geometry',
<%%KEEPWHITESPACE%%>        stylers: [
<%%KEEPWHITESPACE%%>          { visibility: 'off' }
<%%KEEPWHITESPACE%%>        ]
<%%KEEPWHITESPACE%%>      }
<%%KEEPWHITESPACE%%>    ]
<%%KEEPWHITESPACE%%>  };

<%%KEEPWHITESPACE%%>  this.map_.set('styles', styles[this.difficulty_]);
};

PuzzleDemo.prototype.resetGame_ = function() {
<%%KEEPWHITESPACE%%>  this.removeCountries_();
<%%KEEPWHITESPACE%%>  this.count_ = 0;
<%%KEEPWHITESPACE%%>  this.setCount_();
<%%KEEPWHITESPACE%%>  this.startClock_();

<%%KEEPWHITESPACE%%>  this.addRandomCountries_();
};

PuzzleDemo.prototype.setCount_ = function() {
<%%KEEPWHITESPACE%%>  this.pieceDiv_.innerText = this.count_ + ' / ' + PuzzleDemo.NUM_PIECES_;

<%%KEEPWHITESPACE%%>  if (this.count_ == PuzzleDemo.NUM_PIECES_) {
<%%KEEPWHITESPACE%%>    this.stopClock_();
<%%KEEPWHITESPACE%%>  }
};

PuzzleDemo.prototype.stopClock_ = function() {
<%%KEEPWHITESPACE%%>  window.clearInterval(this.timer_);
};

PuzzleDemo.prototype.startClock_ = function() {
<%%KEEPWHITESPACE%%>  this.stopClock_();

<%%KEEPWHITESPACE%%>  var timeDiv = this.timeDiv_;
<%%KEEPWHITESPACE%%>  if (timeDiv) timeDiv.textContent = '0.0 seconds';
<%%KEEPWHITESPACE%%>  var t = new Date;

<%%KEEPWHITESPACE%%>  this.timer_ = window.setInterval(function() {
<%%KEEPWHITESPACE%%>    var diff = new Date - t;
<%%KEEPWHITESPACE%%>    if (timeDiv) timeDiv.textContent = (diff / 1000).toFixed(2) + ' seconds';
<%%KEEPWHITESPACE%%>  }, 100);
};

PuzzleDemo.prototype.addRandomCountries_ = function() {
<%%KEEPWHITESPACE%%>  // Shuffle countries
<%%KEEPWHITESPACE%%>  this.countries_.sort(function() {
<%%KEEPWHITESPACE%%>    return Math.round(Math.random()) - 0.5;
<%%KEEPWHITESPACE%%>  });

<%%KEEPWHITESPACE%%>  var countries = this.countries_.slice(0, PuzzleDemo.NUM_PIECES_);
<%%KEEPWHITESPACE%%>  for (var i = 0, country; country = countries[i]; i++) {
<%%KEEPWHITESPACE%%>    this.addCountry_(country);
<%%KEEPWHITESPACE%%>  }
};

PuzzleDemo.prototype.addCountry_ = function(country) {
<%%KEEPWHITESPACE%%>  var options = {
<%%KEEPWHITESPACE%%>    strokeColor: PuzzleDemo.START_COLOR_,
<%%KEEPWHITESPACE%%>    strokeOpacity: 0.8,
<%%KEEPWHITESPACE%%>    strokeWeight: 2,
<%%KEEPWHITESPACE%%>    fillColor: PuzzleDemo.START_COLOR_,
<%%KEEPWHITESPACE%%>    fillOpacity: 0.35,
<%%KEEPWHITESPACE%%>    geodesic: true,
<%%KEEPWHITESPACE%%>    map: this.map_,
<%%KEEPWHITESPACE%%>    draggable: true,
<%%KEEPWHITESPACE%%>    zIndex: 2,
<%%KEEPWHITESPACE%%>    paths: country.start.map(google.maps.geometry.encoding.decodePath),
<%%KEEPWHITESPACE%%>  };

<%%KEEPWHITESPACE%%>  var poly = new google.maps.Polygon(options);
<%%KEEPWHITESPACE%%>  google.maps.event.addListener(poly, 'dragend', function() {
<%%KEEPWHITESPACE%%>    this.checkPosition_(poly, country);
<%%KEEPWHITESPACE%%>  }.bind(this));

<%%KEEPWHITESPACE%%>  this.polys_.push(poly);
};

PuzzleDemo.prototype.boundsContainsPoly_ = function(bounds, poly) {
<%%KEEPWHITESPACE%%>  var b = new google.maps.LatLngBounds(
<%%KEEPWHITESPACE%%>      new google.maps.LatLng(bounds[0][0], bounds[0][1]),
<%%KEEPWHITESPACE%%>      new google.maps.LatLng(bounds[1][0], bounds[1][1]));
<%%KEEPWHITESPACE%%>  var paths = poly.getPaths().getArray();
<%%KEEPWHITESPACE%%>  for (var i = 0; i &lt; paths.length; i++) {
<%%KEEPWHITESPACE%%>    var p = paths[i].getArray();
<%%KEEPWHITESPACE%%>    for (var j = 0; j &lt; p.length; j++) {
<%%KEEPWHITESPACE%%>      if (!b.contains(p[j])) {
<%%KEEPWHITESPACE%%>        return false;
<%%KEEPWHITESPACE%%>      }
<%%KEEPWHITESPACE%%>    }
<%%KEEPWHITESPACE%%>  }
<%%KEEPWHITESPACE%%>  return true;
};

PuzzleDemo.prototype.replacePiece_ = function(poly, country) {
<%%KEEPWHITESPACE%%>  var options = {
<%%KEEPWHITESPACE%%>    strokeColor: PuzzleDemo.END_COLOR_,
<%%KEEPWHITESPACE%%>    fillColor: PuzzleDemo.END_COLOR_,
<%%KEEPWHITESPACE%%>    draggable: false,
<%%KEEPWHITESPACE%%>    zIndex: 1,
<%%KEEPWHITESPACE%%>    paths: country.end.map(google.maps.geometry.encoding.decodePath),
<%%KEEPWHITESPACE%%>  };

<%%KEEPWHITESPACE%%>  poly.setOptions(options);
<%%KEEPWHITESPACE%%>  this.count_++;
<%%KEEPWHITESPACE%%>  this.setCount_();
};

PuzzleDemo.prototype.checkPosition_ = function(poly, country) {
<%%KEEPWHITESPACE%%>  if (this.boundsContainsPoly_(country.bounds, poly)) {
<%%KEEPWHITESPACE%%>    this.replacePiece_(poly, country);
<%%KEEPWHITESPACE%%>  }
};

PuzzleDemo.prototype.start_ = function() {
<%%KEEPWHITESPACE%%>  this.setDifficultyStyle_();
<%%KEEPWHITESPACE%%>  this.resetGame_();
};

PuzzleDemo.prototype.removeCountries_ = function() {
<%%KEEPWHITESPACE%%>  for (var i = 0, poly; poly = this.polys_[i]; i++) {
<%%KEEPWHITESPACE%%>    poly.setMap(null);
<%%KEEPWHITESPACE%%>  };

<%%KEEPWHITESPACE%%>  this.polys_ = [];
};

function initMap() {
<%%KEEPWHITESPACE%%>  var map = new google.maps.Map(document.getElementById('map'), {
<%%KEEPWHITESPACE%%>    disableDefaultUI: true,
<%%KEEPWHITESPACE%%>    center: {lat: 10, lng: 60},
<%%KEEPWHITESPACE%%>    zoom: 2
<%%KEEPWHITESPACE%%>  });

<%%KEEPWHITESPACE%%>  (new PuzzleDemo).init(map);
}
<%%KEEPWHITESPACE%%>    &lt;/script&gt;
<%%KEEPWHITESPACE%%>    &lt;script src="https://maps.googleapis.com/maps/api/js?key= AIzaSyB6O25GLEFd5l6wYeEgmLzMWZS7bs-IyU8&amp;libraries=geometry&amp;callback=initMap"
<%%KEEPWHITESPACE%%>        async defer&gt;&lt;/script&gt;
<%%KEEPWHITESPACE%%>  &lt;/body&gt;
&lt;/html&gt;

Project 8 Ideas

Posted on by

For project 8, I narrowed down my ideas to either creating another extension or using firebase for anonymous use. For an extension, I thought it would be cool to make an extension that helps you “see life clearer” – for example, the extension would be used on a news site or twitter and multiple aspects of the site would be changed so that it would appear brighter/happier. Headlines with sad news would fade out, specific words or phrases would change to something “overly happy”, the fonts would be changed to something more fun and the colors and page layout would change to reflect a happier setting. I was also thinking I could create an extension aimed more for the elderly – fonts would be bigger, headlines would include old timey phrases/sayings, and the news would reflect past events.

If I were to use firebase I was thinking about creating an anonymous blog type of service where users can post anonymously their fears/worries or get advice. It wouldn’t be so much a chatroom as a place where people can just say their thoughts without context. Each new user would get a different color and size of text and maybe even different fonts. It would mimic a safe space for users.

Project 8 Proposal

Posted on by

TrueChat

I want to create an anonymous chat room using firebase. My purpose for using firebase has to do with the accessibility that firebase offers you when making applications on the web. When utilizing firebase, it is very easy to access webpages through your desktop, laptop, or mobile device. Originally I wanted to create some sort of iOS or Android application, but decided that it would result in me putting in too much time to code and not enough time to create a complete project that follows all the guidelines. My real drive for this project is to create a project with meaningful content that is always very easy to access to basically any person.

In basically every aspect of our lives in 2018 that involves media we always focus on our image and what people think of us. We create videos, images, and inquiries all day long in order to enhance situations and build a reputation for our identity. In my opinion, one thing that is lacked through this way of life is true conversation. That is why I want to make an anonymous chat room. When you open the page there will be a text box, a submit button, and a live feed of messages being sent. This will create a discussion that will have no previous biases or other factors that will effect the results. People often speak with a mask on when they know that there data can be shared, or looked at by anyone. The data that we give out in all the most popular media platforms builds up and creates a separate identity in it’s own. That’s why with TrueChat you can speak as you feel

Project 8 ideas

Posted on by

Currently I am interested in using Firebase in collaboration with realtime mapping software to create an interactive and collaborative mapping experience.  I would like users to be able to open up a map, click and make pins that could contain data such as state, country, county, latitude, longitude, temperature, and maybe even a picture of the area.  Currently, I have seen examples like this https://developers.google.com/maps/documentation/javascript/firebase that involve creating a collaborative heat map however I want to step it up and have it be so that users can see data on not only their points but various others.  I’d also implement a similar time constraint to the heat map though so that points don’t stay on forever lest over time the map would just be a bunch of points and be too difficult to try to find or click anything.

Project 8 Proposal

Posted on by

I’d like to create a site for networked sound production using tone.js, with the idea that a user could manipulate various inputs (numeric values and buttons would be easy, but I’d like to learn how to integrate sliders and other graphic controls?) which would run through firebase to produce output(sound) for all users. I’m a little cautious with this idea as I’d figured that tons of versions of this already existed but I haven’t been able to find anything yet, and definitely not in a more critical/art context?

That’s my other concern, that it doesn’t have enough of an obvious critical component and can easily be viewed as pretty straightforward entertainment. But as I’ve mentioned in other contexts, I’m tired of [making] work that is so inaccessible (intellectually, spatially, however) as to essentially reinforce status quo by preaching to the same small choir or by being unusable in everyday life. I’m not using this an excuse to go lightweight on theory though, only to explain that there might be a kind of seductive facade.

I see the theory in this being related to the homogenization of music in general through web-based platforms like spotify, where we have the illusion of ‘curating’ our own tastes but really we are selecting off of an increasingly limited top-down menu. On top of the corporate stuff, I’m finding (as someone no longer in niche music scenes) it increasingly rare/difficult to encounter sounds that sound different, on a purely formal level, from everything i hear all the time. Maybe this is a cliche old-guy-vinyl argument, maybe not?

Various points of reference for different reasons:

https://tonejs.github.io/ (three examples below)

http://nexusosc.com/gameofreich/

https://celanajaya.github.io/vGamelan/

https://tothepoweroftom.github.io/xysynth/

https://mynoise.net/NoiseMachines/isochronicBrainwaveGenerator.php

http://weatherwarlock.com/ (from quintron & miss pussycat)

Ideas for Project 8

Posted on by
  1. Trolling Mitch…or trolling another friend using a similar mechanism we just built to function in an absurd way. May be advertised and many people enlisted to troll me throughout the day with a noise website.
  2. I’m very very excited to create a live feed of my bedroom and an image on a webpage which is just a black page with the red dot made available for other ppl to move around. Ideally the user would have a small screen in the corner showing my bedroom inside a larger window in which they get to move the red dot. The black page with red dot will be projected in my bedroom continuously so ppl can log on and move the dot around my room while I am in there or while I am not in there. I’m really excited about this!!!