Roadcase.files.wordpress.com



Skip Allums Directed Study Journal W/NM GDS Responsive Web Applications, Fall 2011 Sept 11Dave Kanterdkaausf@ contains protocols for web storagelocal - persistssession - minute i leave page or close browser, its gonecache manifest - can lists data, scripts, libs locally... or what you don't want stored??(limit 5 MB)data connection - if you don't want to display features with no data connectioncss3 gradients!content > padding > border > margin > positioncss transitionslinear, ease in & outcss hierarchy works in reverse (more important stuff towards the bottom)erick meyer's css resetyahoo css resetheader - ?link to reset firsthomework:read a list apart's article on RW requires flexible grid & images , media queriesGRID SYSTEMSinitializr - easiest, pick your ownamazium - changes top navtwitter bootstrap - combines nav into menu buttonFLEXIBLE IMAGESem - unit based on the size of the base font (ie. base font is 10px, then em is 10px)Sept 18Safari dev center has HTML5 javascript responsive and webkit stuffsample code cardflip exercisewebdeveloperjuice css3 effectstake card flipchange back to look different (w/ image?)rotate on a different axis (x or z?)get it to work in firefoxSept 25BOX MODELPadding pushes inMargin pushes awayJAVASCRIPTSafari has advanced > show developer tools (console, emulator)literal values:myvar = 10;myvar = "string"++ can be used for plus one, adding one (not any other math)% when mod is zero, e.g. styling tablesrow%2 = zero (even row)row%2 = 1 (odd row)COMPARING VARSno spaces, can't start with a numberx = 10;y = 87;z = x;if statements can only return true or falseif ( x < y ) {do something?}if ( x >= z ) {do something}else - happens if nothing else is trueelse if - adds another comparisonequal sign - single = means assignment, double == means compares equivalenceLOOPSwhile loopx = 1;//count ten Hellos?while(x <=10) {document.write(x + "Hello1");x++;}you can write it more compactly as a for loop:for (x = 1; x <=10; x++) {document.write(x + "Hello!");}for loops are good for when you know when something is gonna happenwhile loops are good if you don't know when it will happenFUNCTIONSJS has be targeted and told to run, using a function block / event handler that will assign it to an element on the pagefunction should do one thing (login, divs, playing sounds)functions can have values passed into them (strings)functions can only return one thingx = gocode(20,30);|| = or, instead of using else ifCSSclass begins with a .id is a number, #id - there can only be one element on that page with that idclass - can be used multiple timesAMAZIUMgood for columnsOct 2OPERAopera developer toolsgood target to cover a lot of responsive baseshas a built in mobile emulator validatorCSSIDs - only one element, title, sidebar etcclass = .classname for multiple elements shared elsewhere picker500 named css colors!AJAXsee W3, demos for simple call AMAZIUM, Twitter Bootstrap ?for responsive?formsUse Ajax to auto completejQuery Theme Roller for form, widgets CSSCODIQAquery mobile drag & dropNAV STUFF@each UL could be a class, specify background image after media queryli.promote {? ? background-image: url(img url);}<ul>?<li> class="promote"><a href="#">Promote</a></li>Oct 16CSS linksvisited hover & active background style color ssizewebmonkey tutorialsGetting started with JSON with XML<xml version 1.0><animals>? ?<dogs>? ? ? <beagles>woof</beagle>? ? ? <wolfhound> awhooo</wolfhound>? </dogs></animals></xml>create databasecreate users w/ db wizardphp myadmincolumn - keytype INT - numberindex primary - first in the tableauto incrementvariables begin with a $ signecho is how you output things?phpinfo dump your entire build detailsto see which version you have running, is all is workingfirst you would authenticate as a valid userINSERT INTO to create entries to databaseECHO to outputOct 23Research:deployd -? week: present status of projectrepresentation of progresscreate database design doc- artist? ? - tours? ? ? ? ?- shows? ? ? ? ? ? ? - date? ? ? ? ? ? ? - venue name? ? ? ? ? ? ? - venue address? ? ? ? ? ? ? - venue url? ? ? ? ? ? ? - venue phone? ? ? ? ? ? ? - load in/soundcheck/start time? ? ? ? ? ? ? - line-up? ? ? ? ? ? ? - notes?? ? - venues? ? ? ? ?- venue name? ? ? ? ?- venue address? ? ? ? ? - venue url? ? ? ? ? - venue phoneNov 6Model View Controller lectureiTunes U Stanford lecturesModel - databasecontroller - php ajaxView - html cssNov 13Reviewing the final preso guidelines!*Send Dave an update on progress for Week 10 12Class next week starts at 4pmstep 1, create userstep 2, phpMyAdmin generates php for youcan enforce character limitscan output classes in the echos ................
................

In order to avoid copyright disputes, this page is only a partial summary.

Google Online Preview   Download