PageRenderTime 52ms CodeModel.GetById 24ms RepoModel.GetById 1ms app.codeStats 0ms

/output/demos/index.php

https://github.com/greglu/portfolio
PHP | 232 lines | 232 code | 0 blank | 0 comment | 5 complexity | c71d1570f60eba93bd2a4fd056e64630 MD5 | raw file
    

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    2. 

  2. <html lang='en' xml:lang='en' xmlns='http://www.w3.org/1999/xhtml'>
    3. 

  3.   <head>
    4. 

  4.     <title>
    5. 

  5.       Greg Lu
    6. 

  6.        - Demos
    7. 

  7.     </title>
    8. 

  8.     <meta content='text/html; charset=iso-8859-1' http-equiv='Content-Type' />
    9. 

  9.     <link href='/css/EliteCircle.css' rel='stylesheet' type='text/css' />
    10. 

  10.     <link href='/css/jquery.lightbox-0.5.css' media='screen' rel='stylesheet' type='text/css' />
    11. 

  11.     <script src='/js/jquery-1.3.1.min.js' type='text/javascript'></script>
    12. 

  12.     <script src='/js/jquery.scrollTo-min.js' type='text/javascript'></script>
    13. 

  13.     <script src='/js/jquery.lightbox-0.5.min.js' type='text/javascript'></script>
    14. 

  14.     <script src='/js/jquery.expander.js' type='text/javascript'></script>
    15. 

  15.     <script type='text/javascript'>
    16. 

  16.       $(function() {
    17. 

  17.       $('a[rel=lightbox]').lightBox();
    18. 

  18.       });
    19. 

  19.     </script>
    20. 

  20.     <script type='text/javascript'>
    21. 

  21.       $(document).ready(function() {
    22. 

  22.       $('.expandable').expander({
    23. 

  23.       slicePoint: 0,
    24. 

  24.       expandPrefix: '',
    25. 

  25.       expandText: '[...]',
    26. 

  26.       collapseTimer: 0,
    27. 

  27.       userCollapseText: '[^]'
    28. 

  28.       });
    29. 

  29.       });
    30. 

  30.     </script>
    31. 

  31.   </head>
    32. 

  32.   <body>
    33. 

  33.     <div id='header'>
    34. 

  34.       <div id='header-content'>
    35. 

  35.         <h1 id='logo'>
    36. 

  36.           Greg
    37. 

  37.           <span class='orange'>Lu</span>
    38. 

  38.         </h1>
    39. 

  39.         <h2 id='slogan'>Web application developer</h2>
    40. 

  40.         <div id='header-links'>
    41. 

  41.           <p>
    42. 

  42.             <a href='http://www.greglu.com/'>Home</a>
    43. 

  43.             |
    44. 

  44.             <a href='#' onclick="$.scrollTo( '#contact', 1000 );">Contact</a>
    45. 

  45.           </p>
    46. 

  46.         </div>
    47. 

  47.         <ul>
    48. 

  48.           <li><a href="/index.php">about</a></li>
    49. 

  49.           <li><a id="current" href="/demos/index.php">demos</a></li>
    50. 

  50.           <li><a href="/skills/index.php">skills</a></li>
    51. 

  51.           <li><a href="/work/index.php">work</a></li>
    52. 

  52.           <li>
    53. 

  53.             <a href='http://www.greglu.com/blog'>Blog</a>
    54. 

  54.           </li>
    55. 

  55.           <li>
    56. 

  56.             <a href='/Gregory_Lu-CV.pdf'>CV</a>
    57. 

  57.           </li>
    58. 

  58.         </ul>
    59. 

  59.       </div>
    60. 

  60.     </div>
    61. 

  61.     <div id='content-wrap'>
    62. 

  62.       <div id='content'>
    63. 

  63.         <div id='main'>
    64. 

  64.           <h1>
    65. 

  65.             Demos
    66. 

  66.           </h1>
    67. 

  67.           <div class='block'>
    68. 

  68.             <h2>
    69. 

  69.               Metranome
    70. 

  70.             </h2>
    71. 

  71.             <p>
    72. 

  72.               <a href='http://www.metrano.me' target='_blank'>Metranome</a>
    73. 

  73.               is a personal project that I've been working on independently for half a year. It is a collaborative information network which aims to bring classmates together to share and view course resources such as computer files, textbooks, and websites. This information is then presented contextually within a student's courses, or through a site wide search.
    74. 

  74.             </p>
    75. 

  75.             <p>
    76. 

  76.               I wanted Metranome to support any number of educational institutions, and therefore incorporated a model similar to Wikipedia, where students had the ability to add or edit all the information (such as program and course listings specific to each university) in order to keep everything updated.
    77. 

  77.             </p>
    78. 

  78.             <p>
    79. 

  79.               My primary motivation for creating Metranome was to provide a venue where I could implement my web development abilities in a single, independent project. Since I was under no pressure of deadlines or requirement constraints, I was able to practice my project design and development skills in a creative outlet so that I could showcase some of my work.
    80. 

  80.             </p>
    81. 

  81.             <p>
    82. 

  82.               Through Metranome, I was able to put into practice BDD (achieving a 2:1 test to code ratio), many AJAX implementations, web services, RSS feeds, capistrano automated application deployment, GIT, Github, and Amazon Web Services (S3 and EC2). I also researched many other topics which I hope to (soon) put into practice such as scaling web applications (Rails specifically), cloud computing, memcached, more robust automated backup procedures, and web presence/promotion.
    83. 

  83.             </p>
    84. 

  84.             <p>
    85. 

  85.               Metranome is currently live and can be found at
    86. 

  86.               <a href='http://www.metrano.me' target='_blank'>www.metrano.me.</a>
    87. 

  87.               Below is a screencast I created to demonstrate the site's functionality.
    88. 

  88.             </p>
    89. 

  89.             <div class='center'>
    90. 

  90.               <object data='http://www.screentoaster.com/swf/STPlayer.swf' height='344' type='application/x-shockwave-flash' width='425'>
    91. 

  91.                 <param name='movie' value='http://www.screentoaster.com/swf/STPlayer.swf' />
    92. 

  92.                 <param name='allowFullScreen' value='true' />
    93. 

  93.                 <param name='flashvars' value='video=stVEpTQ0ZLTFheQVhVWVJb' />
    94. 

  94.               </object>
    95. 

  95.             </div>
    96. 

  96.           </div>
    97. 

  97.           <div class='block'>
    98. 

  98.             <h2>
    99. 

  99.               This Portfolio
    100. 

  100.             </h2>
    101. 

  101.             <p>
    102. 

  102.               Although this portfolio seems like a pretty standard website, it was in fact created with
    103. 

  103.               <a href='http://nanoc.stoneship.org/' target='_blank'>Nanoc,</a>
    104. 

  104.               &quot;a Ruby CMS that generates static HTML.&quot; I chose to use this tool because it allowed me to create this site with the
    105. 

  105.               <a href='http://haml.hamptoncatlin.com/' target='_blank'>HAML templating language</a>
    106. 

  106.               without the need for a full blown framework. The source code for this portfolio can be found on
    107. 

  107.               <a href='https://github.com/enell/portfolio/' target='_blank'>my Github page.</a>
    108. 

  108.             </p>
    109. 

  109.           </div>
    110. 

  110.         </div>
    111. 

  111.         <div id='sidebar'>
    112. 

  112.           <h1>
    113. 

  113.             <a href='http://www.greglu.com/blog' target='_blank'>Blog Feed</a>
    114. 

  114.           </h1>
    115. 

  115.           <?php
    116. 

  116.           require_once($_SERVER["DOCUMENT_ROOT"] . "/rsslib.php");
    117. 

  117.           $url = "http://greglu.com/blog/feed/";
    118. 

  118.           echo RSS_Display($url, 5);
    119. 

  119.           ?>
    120. 

  120.           <h1>
    121. 

  121.             <a href='http://github.com/greglu' target='_blank'>Github Feed</a>
    122. 

  122.           </h1>
    123. 

  123.           <?php
    124. 

  124.           require_once($_SERVER["DOCUMENT_ROOT"] . "/atomlib.php");
    125. 

  125.           $url = "http://github.com/greglu.atom";
    126. 

  126.           echo Atom_Display($url, 5);
    127. 

  127.           ?>
    128. 

  128.           <h1>
    129. 

  129.             Wise Words
    130. 

  130.           </h1>
    131. 

  131.           <p>
    132. 

  132.             "Always code as if the person who will maintain your code is a maniac serial killer that knows where you live."
    133. 

  133.           </p>
    134. 

  134.           <p class='align-right'>
    135. 

  135.             - Unknown
    136. 

  136.           </p>
    137. 

  137.         </div>
    138. 

  138.       </div>
    139. 

  139.     </div>
    140. 

  140.     <div id='footer'>
    141. 

  141.       <div id='footer-content'>
    142. 

  142.         <div class='col float-left space-sep' id='contact'>
    143. 

  143.           <h2>
    144. 

  144.             Contact Information
    145. 

  145.           </h2>
    146. 

  146.           <ul class='columns'>
    147. 

  147.             <li class='top'>
    148. 

  148.               <strong>Email</strong>
    149. 

  149.               - greg.lu [at] gmail [dot] com
    150. 

  150.             </li>
    151. 

  151.             <li>
    152. 

  152.               <strong>Telephone</strong>
    153. 

  153.               - (514) 815-3611
    154. 

  154.             </li>
    155. 

  155.             <li>
    156. 

  156.               <a href='http://www.twitter.com/greglu'>
    157. 

  157.                 <strong>Twitter - @greglu</strong>
    158. 

  158.               </a>
    159. 

  159.             </li>
    160. 

  160.             <li>
    161. 

  161.               <a href='/Gregory_Lu-CV.pdf'>
    162. 

  162.                 <strong>Curriculum Vitae</strong>
    163. 

  163.               </a>
    164. 

  164.             </li>
    165. 

  165.           </ul>
    166. 

  166.         </div>
    167. 

  167.         <div class='col float-left'>
    168. 

  168.           <h2>
    169. 

  169.             Links
    170. 

  170.           </h2>
    171. 

  171.           <ul class='columns'>
    172. 

  172.             <li class='top'>
    173. 

  173.               <a href='http://www.greglu.com/blog' target='_blank'>
    174. 

  174.                 <strong>My Blog</strong>
    175. 

  175.               </a>
    176. 

  176.             </li>
    177. 

  177.             <li>
    178. 

  178.               <a href='http://github.com/greglu' target='_blank'>
    179. 

  179.                 <strong>Github Profile</strong>
    180. 

  180.               </a>
    181. 

  181.             </li>
    182. 

  182.             <li>
    183. 

  183.               <a href='http://workingwithrails.com/person/7317-gregory-lu' target='_blank'>
    184. 

  184.                 <strong>WorkingWithRails Page</strong>
    185. 

  185.               </a>
    186. 

  186.             </li>
    187. 

  187.           </ul>
    188. 

  188.         </div>
    189. 

  189.         <div class='col2 float-right'>
    190. 

  190.           <div class='footer-info'>
    191. 

  191.             <div id='copyright'>
    192. 

  192.               &copy; Copyright 2009
    193. 

  193.               <strong>
    194. 

  194.                 Gregory Lu
    195. 

  195.               </strong>
    196. 

  196.             </div>
    197. 

  197.             <div id='design'>
    198. 

  198.               Design by:
    199. 

  199.               <a href='http://www.styleshout.com/'>styleshout</a>
    200. 

  200.             </div>
    201. 

  201.             <div id='valid'>
    202. 

  202.               Valid
    203. 

  203.               <a href='http://jigsaw.w3.org/css-validator/check/referer'>CSS</a>
    204. 

  204.               |
    205. 

  205.               <a href='http://validator.w3.org/check/referer'>XHTML</a>
    206. 

  206.             </div>
    207. 

  207.           </div>
    208. 

  208.           <div class='footer-info'>
    209. 

  209.             <ul>
    210. 

  210.               <li>
    211. 

  211.                 <a href='http://www.gregorylu.com'>Home</a>
    212. 

  212.               </li>
    213. 

  213.               <li>
    214. 

  214.                 <a href='#' onclick="$.scrollTo( '#header', 1000 );">Back to Top</a>
    215. 

  215.               </li>
    216. 

  216.             </ul>
    217. 

  217.           </div>
    218. 

  218.         </div>
    219. 

  219.       </div>
    220. 

  220.     </div>
    221. 

  221.     <script type='text/javascript'>
    222. 

  222.       var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
    223. 

  223.       document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
    224. 

  224.     </script>
    225. 

  225.     <script type='text/javascript'>
    226. 

  226.       try {
    227. 

  227.       var pageTracker = _gat._getTracker("UA-7587231-1");
    228. 

  228.       pageTracker._trackPageview();
    229. 

  229.       } catch(err) {}
    230. 

  230.     </script>
    231. 

  231.   </body>
    232. 

  232. </html>
    233. 

  233.