Add first-run information page to the Atmel Studio 6.1 extension.
[pub/lufa.git] / LUFA / StudioIntegration / VSIX / GettingStarted.htm
diff --git a/LUFA/StudioIntegration/VSIX/GettingStarted.htm b/LUFA/StudioIntegration/VSIX/GettingStarted.htm
new file mode 100644 (file)
index 0000000..af0c37c
--- /dev/null
@@ -0,0 +1,132 @@
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">\r
+<html>\r
+       <head>\r
+               <title>LUFA</title>\r
+\r
+               <style media="screen" type="text/css">\r
+                       /* Reset */\r
+                       html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p,\r
+                       blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font,\r
+                       img, ins, kbd, q, s, samp, small, strike, strong, sub, tt, var, b, u, i,\r
+                       center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption,\r
+                       tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0;\r
+                       font-size: 100%; vertical-align: baseline; background: transparent; } body {\r
+                       line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; }\r
+                       blockquote:before, blockquote:after, q:before, q:after { content: ''; content:\r
+                       none; } :focus { outline: 0; } ins { text-decoration: none; } del { text-decoration: line-through; }\r
+                       table { border-collapse: collapse; border-spacing: 0; }\r
+\r
+                       body\r
+                       {\r
+                               background-color: #353530;\r
+                       }\r
+\r
+                       #container\r
+                       {\r
+                               width: 800px;\r
+                               margin-top: 20px;\r
+                               margin-left: auto;\r
+                               margin-right: auto;\r
+                               border: 1px solid #DDC;\r
+                       }\r
+\r
+                       #header\r
+                       {\r
+                               background-color: #3D3229;\r
+                               text-align: center;\r
+                               font: bold 2.5em "Times New Roman", serif;\r
+                               color: #CCB;\r
+                               padding: 20px;\r
+                       }\r
+\r
+                       #header span\r
+                       {\r
+                               color: #998\r
+                       }\r
+\r
+                       #content\r
+                       {\r
+                               background-color: #EAE0D6;\r
+                               padding: 20px;\r
+                       }\r
+\r
+                       #content p\r
+                       {\r
+                               line-height: 1.4em;\r
+                               padding: 0.2em 0 1.2em;\r
+                               font: normal 1em Georgia, sans-serif;\r
+                       }\r
+\r
+                       #content h1\r
+                       {\r
+                               font: bold 1.3em Georgia, sans-serif;\r
+                               color: #3D3229;\r
+                               margin-top: 2em;\r
+                               margin-bottom: 0.2em;\r
+                       }\r
+\r
+                       #content a\r
+                       {\r
+                               color: #3D3229;\r
+                       }\r
+\r
+                       #content img\r
+                       {\r
+                               display: block;\r
+                               margin-left: auto;\r
+                               margin-right: auto;\r
+                       }\r
+\r
+               </style>\r
+       </head>\r
+       <body>\r
+               <div id="container">\r
+                       <div id="header">\r
+                               <h1>Thanks for installing <span>LUFA</span>!</h1>\r
+                       </div>\r
+\r
+                       <div id="content">\r
+                               <p>The LUFA extension is now installed into Atmel Studio, and\r
+                                  is ready for use. To get started, read the information below.</p>\r
+\r
+                               <h1>Create an Example Project</h1>\r
+                               <p>LUFA comes with a variety of example projects, showing off several of the library features. Also included is a number of\r
+                                  bootloaders, full LUFA powered projects, and several user-contributed projects. To see these, open the <em>New Example Project</em>\r
+                                  wizard from the <tt>File->New</tt> menu. Expand out the <em>FourWalledCubicle</em> node, then the <em>Dean Camera - LUFA</em> node to see a list\r
+                                  of LUFA projects.</p>\r
+\r
+                                  <img width="700px" src="NewExampleWizard.png"/>\r
+\r
+                               <h1>Configure LUFA</h1>\r
+                               <p>The LUFA Atmel Studio extension is fully integrated into the Atmel Studio IDE, including the LUFA sub-modules. Open the\r
+                                       <em>ASF Wizard</em> from the <tt>ASF->ASF Wizard</tt> menu, choose your project from your current solution, then choose\r
+                                       the LUFA library as the extension to configure from the <em>Available Modules</em> portion of the wizard. Here you can\r
+                                       add and remove LUFA modules to and from your project as you need them.</p>\r
+\r
+                                  <img width="700px" src="ASFWizard.png"/>\r
+\r
+                               <h1>Find the Module APIs</h1>\r
+                               <p>You can view your project's included LUFA modules any time you need to from the <em>ASF Explorer</em> window, accessible from\r
+                                       the <tt>ASF->ASF Explorer</tt> menu.</p> Here you can find a link to the module's corresponding API documentation in the LUFA\r
+                                       manual, as well as a direct link to the module's API header.\r
+\r
+                                  <img src="ASFExplorer.png"/>\r
+\r
+                               <h1>Get Help</h1>\r
+                               <p>First and foremost, remember to consult the <a href="http://www.lufa-lib.org/documentation">LUFA documentation</a>\r
+                                  if you want to learn how to use LUFA in your project.\r
+                               </p>\r
+                               <p>\r
+                                       If you are still stuck and need help, please sign up and post on the <a href="http://www.lufa-lib.org/support">LUFA Mailing List</a>\r
+                                       - or just search the archives to see if your question has already been answered.\r
+                               </p>\r
+\r
+                               <h1>Read About the Latest Developments</h1>\r
+                               <p>Keep up to date with the latest LUFA news; read the <a href="http://www.fourwalledcubicle.com/blog">author's blog</a>,\r
+                                  or see the <a href="http://www.fourwalledcubicle.com/">author's website</a>.\r
+                               </p>\r
+                       </div>\r
+               </div>\r
+               <br/>\r
+       </body>\r
+</html>\r