Let’s start by talking about the self portrait that I didn’t get working.
Self Portrait
Find it here: http://ppc7138.itp.io/selfportrait3.html
Find the chat here: http://ppc7138.itp.io/
Let’s start by talking about the self portrait that I didn’t get working. The idea was to have an array of images and onclick
have the image change to the next in the array, I was also thinking of adding some sound or music that went along with each of the images.
I tried a number of different ways of accomplishing this, however, it never quite worked. I think the closest I came to getting it work was with the code below.
<html> <head> <title>lihp idirac</title> <link rel="icon" type="image/x-icon" href="images/favIcon.ico.jpg"> <script type="text/javascript"> var portImages = new Array(); portImages[0] = "images/Day7of50.jpg"; portImages[1] = "images/Day12of50.jpg"; portImages[2] = "images/PPC_5205.PNG"; portImages[3] = "imagesPPC_5211.PNG"; var currentImage = 0; var lastImage = portImages.length -1; /* window.addEventListener("load", init); function init() { console.log("page is loaded"); } */ function nextImage(){ if (currentImage == lastImage) { currentImage = 0; document.getElementById('portrait').src = portImages[currentImage]; } else { currentImage++; document.getElementById('portrait').src = portImages[currentImage]; } } </script> </head> <body> <img scr="images/Day7of50.jpg" id="portrait" onclick="nextImage()"> </body> </html>
I also tried the code below.
<html> <head> <title>lihp idirac</title> <link rel="icon" type="image/x-icon" href="images/favIcon.ico.jpg"> <script type="text/javascript"> window.addEventListener("load", init); function init() { console.log("page is loaded"); var change = document.getElementById("one"); var counter = 0; var portraitImages = [ "images/Day7of50.jpg", "images/Day12of50.jpg", "images/PPC_5205.PNG", "imagesPPC_5211.PNG", ]; } function nextPic(){ counter += 1; if (counter > portraitImages.length -1) { counter = 0; } change.addEventListener('click', nextPic); counter -= 1; nextPic(); } </script> <style> #one { width: 200px; height: 200px; border: solid 1px #000; } </style> </head> <body> <div id="one"></div> </body> </html>
I’ll keep working through the issues but for now, here it sits.
Live Media
I think the last “live media” event I engaged in was a “Fan First Friday” produced by Hasbro regarding the GI Joe Classified toy line. Hasbro utilizes YouTube live as their streaming service for events of this nature. The chat feature can be a good thing, however, in this situation it mostly devolves to a lot of complaining. In fact I find it very annoying and turn it off on most occasions. I guess in theory the chat is supposed to make you feel more of a connection to the other viewers and even the members of the live stream. As an avid action figure collector staying up to date with new releases and drop dates is something that makes a difference in the hobby. Finding out information about upcoming releases even as short as an hour late can mean the difference between acquiring the figure and not. Hasbro has only been doing this type of event for the last few years, it used to be that multiple trips to the store were required to find out if figure were available and even then you weren’t guaranteed to find them. In all truth I think this type of event really isn’t missing much, maybe onscreen links, but that’s about it.