Your Environment

Most, if not all of our programming this semester will involve graphics (duh)
- We will nee to be able to view graphics
- This means putty is absolutely out.
We will use a browser to display our work
- My browser of choice is crome.
I assume you do not have a web space
- If you do, you may use it, but
  - We will not discuss web security in any way.
  - You should not post anything publicly until I have graded your work and provided feedback.
I assume you will be working on a windows machine.
- If this is not the case, just watch, I will probably mostly work ;under linux.
My Windows Tools
- I use the following (sort of, I lie)
  - Notepad ++
  - WinSCP
  - putty
  - Google chrome.
  - I also have git, gvim, and mingw, and some other things installed.
Let's do a mini project
- Say Hello World
  - Create a directory to store the project.
  - Create a hello.html file
```
<html>
<head>
</head>
<body>
    <h1>Hello World!</h1>
</body>
</html>
```
  - This is in html.
    - I expect we have all different levels of html knowledge.
    - We will cover what we need.
    - If you want to get good, take CSCI 123, 323.
    - More to come.
  - We would like to look at our project, so fire up chrome
    - Open a tab and browse to your home directory.
    - On linx type pwd and use that.
    - On windows I used file://C: and browsed from there.
- A link to a second page.
  - HTML consists of various tags used to markup a document.
  - Again, I will introduce these as they are needed.
  - Most tags have attributes.
    - There are many of these.
  - The link tag allows us to link pages.
    - a reference
    - Format
    - ```
    <a href="url"> link text </a>
```
- The link text can be
  - A full url "http://mirkwood.cs.edinboro.edu"
  - A relative path "file.html"
- For your projects, please use a relative link.
  - This will allow us to move files around and still have the website work.
- Let's add a link to hello.html to a goodby page.
- ```
<html>
<head>
</head>
<body>

<h1>Hello World!</h1>

<a href="goodby.html"> Good By

</body>
</html>
```
  - Now create goodby.html and link it back.
- Just a little javascript
  - reference
  - We can add javascript code to our html pages.
  - This code is very much like c++
    - We will spend a few days working through some javascript.
    - But let's just add some code for now.
  - The tag
    - For in line javascript
    - ```
    <script type="text/javascript">
    // code goes here
    </script>
```
- For external files
- ```
<script src="path to source"> </script>
```
  - Some simple script
    - Let's count to 10.
    - ```
    let i;
    
    for (i = 0; i < 10; i++) {
        console.log("i = ", i);
    }
```
- Fairly c++ like.
- Semicolons are optional, but I would add them.
- let and lack of type is strange, but we will discuss that.
- No cout, but console.log will do the same, sort of.
- In chrome, you will need to press ctrl-shift-J to display the console.
Some Examples
- Hello
- Good By
- shapes a javascript example.
- webgl demo.