Skip to content

Instantly share code, notes, and snippets.

View brettbartylla's full-sized avatar

brettbartylla

4 followers · 45 following
View GitHub Profile
@brettbartylla
brettbartylla / youtube_playlist_load.js
Last active March 31, 2019 18:29
Youtube Api - Dynamically Load Playlist
//import for react only
//import fetch from 'isomorphic-fetch'
var url = "https://www.googleapis.com/youtube/v3/playlistItems?part=snippet&maxResults=50&playlistId=PLIC7a_CaE8nWRJzDr2JuVrS21jo4H1n32&key=AIzaSyDo49g75WoT2d1y1WJeJjVa7OxivoGw1aQ";
var videoIdArray = [];
var videoUrlArray = [];
fetch(url)
@brettbartylla
brettbartylla / arraySort.js
Created September 14, 2017 21:10
Sorts array values alphabetically using callback function
var myArr = [{
num: 5,
str:'apple'
},{
num: 7,
str:'cabbage'
},{
num: 1,
str:'ban'
}];
@brettbartylla
brettbartylla / lightbox.js
Last active September 14, 2017 05:36
This creates a multidimensional array of IDs and src tags from thumbnail images on a page so that when they are clicked on a larger image surrounded in a lightbox appears. It also handles previous/next navigation through the images. Live example at: http://whitetailhabitatconsulting.com/gallery.html
function buildArray(){
//build array containing images IDs
var myArray = [];
myArray[0] = [];
myArray[0][0] = [];
var i = 0;
$('.img-responsive').each(function(){
myArray[0].push($(this).attr('id'));
myArray[0][0].push($(this).attr('src'));
});
@brettbartylla
brettbartylla / sortArray.js
Created September 9, 2017 22:47
Sorts a 2 dimensional array
var a = [[12, 'AAA'], [58, 'BBB'], [28, 'CCC'],[18, 'DDD']];
a.sort(sortFunction);
//display result
alert(a);
//sorts array by first array column, change values of 0 to 1 to sort by second column
function sortFunction(a, b) {
if (a[0] === b[0]) {
@brettbartylla
brettbartylla / mergeArrays.js
Created September 9, 2017 22:36
Takes two arrays (obj1, obj3) and merges their values into a new array. The result is the values of obj1 and obj2 but in the order of every other one of their values Ex. a1b2c3
function merge(obj1, obj2){
var obj3 = [];
for (var i= 0, len = obj1.length; i < len; i++) {
obj3.push(obj1[i]);
obj3.push(obj2[i]);
}
return obj3;
}
//calls merge function, removes commas using join, displays output
@brettbartylla
brettbartylla / mouseDraw.js
Created September 9, 2017 22:26
This javascript allows a mouse to draw on an HTML5 Canvas. A working example of this is on my website.
//draw on home image
var canvas = document.querySelector('#paint');
var ctx = canvas.getContext('2d');
var sketch = document.querySelector('.sketch');
var sketch_style = getComputedStyle(sketch);
canvas.width = parseInt(sketch_style.getPropertyValue('width'));
canvas.height = parseInt(sketch_style.getPropertyValue('height'));
var mouse = {x: 0, y: 0};
var last_mouse = {x: 0, y: 0};
@brettbartylla
brettbartylla / mouseDraw.js
Created September 9, 2017 22:25
//draw on home image
var canvas = document.querySelector('#paint');
var ctx = canvas.getContext('2d');
var sketch = document.querySelector('.sketch');
var sketch_style = getComputedStyle(sketch);
canvas.width = parseInt(sketch_style.getPropertyValue('width'));
canvas.height = parseInt(sketch_style.getPropertyValue('height'));
var mouse = {x: 0, y: 0};
var last_mouse = {x: 0, y: 0};
@brettbartylla
brettbartylla / typeMessage.js
Created September 9, 2017 22:22
Simulates a message bring typed. Sets a div with the id of "typewriter" as the message that equals the string value of the str variable. There is a working example of this at the top of my website!
var str = "<h2>Full Stack Development</h2>",
i = 0,
isTag,
text;
(function type() {
text = str.slice(0, ++i);
if (text === str) return;
document.getElementById('typewriter').innerHTML = text;
@brettbartylla
brettbartylla / form.html
Created September 6, 2017 02:08
Form that goes with the mailer.php and ajaxSubmit.js files
<form id="ajax-contact" class="form-horizonta" method="post" action="mailer.php">
<div class="field form-group">
<label for="name" class="control-label">Name:</label>
<input class="form-control" type="text" id="name" name="name">
</div>
<div class="field form-group">
<label for="email" class="control-label">Email:</label>
<input class="form-control" type="email" id="email" name="email">
</div>
<div class="field form-group">
@brettbartylla
brettbartylla / ajaxSubmit.js
Last active September 6, 2017 02:07
Form submission using Ajax
$(function() {
// Get the form.
var form = $('#ajax-contact');
// Get the messages div.
var formMessages = $('#form-messages');
// Set up an event listener for the contact form.
$(form).submit(function(e) {
// Stop the browser from submitting the form.