| Time (CDT) | Topic |
|---|---|
| 8:30 | Tech Check and Hello |
| 9:00 | Your coding toolbox: the Browser and Sublime Text 2/3 |
| 9:30 | The basics of the web: it’s more than just tubes |
| 10:00 | HTML – What is markup, why do we have it, and the DOM |
Marc Grabanski 1Marc
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <title>Chat</title> | |
| <link rel="stylesheet" href="normalize.css"> | |
| </head> | |
| <body> | |
| <style> | |
| td { |
1Marc
/ gist:8249a25658c24c783043
Last active
August 29, 2015 14:04
This gist is no longer in use.
1Marc
/ debug_in_context.js
Last active
August 29, 2015 14:01
debug a function with an unexpected return value in context
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // rename a function in your application | |
| // could be MyApp.someFunction; | |
| var debugging = myFunc; | |
| // override that function | |
| myFunc = function() { | |
| // send the arguments over and call it in context | |
| var result = debugging.apply(this, arguments); | |
| // if we get an unexpected result, then let's open the debugger | |
| if (!result) { |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Keywords here are "SVG" and "CSS3" | |
| The regex should find only words found in the text or in individual keywords in a URL seperated by dashes. It should NOT match any keywords located in shortned URL hashes. | |
| Should match: | |
| "I love this thing about SVG. http://foo.com/article" | |
| "This is awesome http://super-awesome-svg.com" | |
| "I <3 this css3 button thing http://codepen.com/abcdefg" |
1Marc
/ picturefill_wrapper.php
Created
February 3, 2014 19:51
Simple Wrapper around Scott Jehl's Picturefill
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <?php | |
| function get_src($dir, $filename, $res, $filetype) { | |
| return $dir . $filename . ($res ? '@' . $res : '') . '.' . $filetype; | |
| } | |
| function picturefill($filename, $sizes, $filetype, $alt) { | |
| $imgdir = get_template_directory_uri() . '/img/'; | |
| $default = get_src($imgdir, $filename, null, $filetype); | |
| $images = array(); |
1Marc
/ path_compare_intersection.js
Last active
January 2, 2016 08:39
Raphael path intersection code
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| var targetElement = this.borderElement, | |
| compareElement = item.borderElement, | |
| bbox = targetElement.getBBox(), | |
| transfromString = 'S' + [0.95, 0.95, (bbox.width/2), (bbox.height/2)] + '...', | |
| newEl = targetElement.clone(), | |
| smallerTransform = newEl.transform(transfromString).transform(), | |
| path = newEl.attr('path').toString(), | |
| tpath = Raphael.transformPath(path, smallerTransform), | |
| itemPath = compareElement.attr('path').toString(), | |
| tItemPath = Raphael.transformPath(itemPath, compareElement.transform()), |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| var request = require('request'), | |
| async = require('async'), | |
| express = require('express'), | |
| app = express(), | |
| paypal_api = require('paypal-rest-sdk'); | |
| paypal_api.configure({ | |
| 'host': 'api.paypal.com', | |
| 'port': '', | |
| 'client_id': ' live application client id ', |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> | |
| <html> | |
| <head> | |
| <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> | |
| <!-- Facebook sharing information tags --> | |
| <meta property="og:title" content="*|MC:SUBJECT|*"> | |
| <title>*|MC:SUBJECT|*</title> | |
1Marc
/ index.html
Created
May 15, 2013 16:56
A CodePen by John Blazek. 3D Carousel Using TweenMax.js & jQuery - Wanted to explore some 3d carousel goodness, using DOM elements. Works best in Chrome/Safari, then FF, not 100% sure about IE 10. TO DO: Adding touch interaction with devices & animate into place and out.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <header> | |
| <h1>3D Carousel Using TweenMax.js & jQuery</h1> | |
| <h3>A pen by <a href="http://www.twitter.com/johnblazek" target="_blank">@johnblazek</a></h3> | |
| <div id="fps">Framerate: 0/60 FPS</div> | |
| </header> | |
| <div id="contentContainer" class="trans3d"> | |
| <section id="carouselContainer" class="trans3d"> | |
| <figure id="item1" class="carouselItem trans3d"><div class="carouselItemInner trans3d">1</div></figure> | |
| <figure id="item2" class="carouselItem trans3d"><div class="carouselItemInner trans3d">2</div></figure> |