├── .gitignore
├── 404.html
├── Gemfile
├── Gemfile.lock
├── README.md
├── _config.yml
├── _includes
    └── head.html
├── _layouts
    ├── base.html
    └── home.html
├── assets
    ├── css
    │   └── main.css
    └── images
    │   ├── CodingTrain.png
    │   └── TeamTrees.svg
├── code
    ├── Okaghana
    │   ├── branch.js
    │   ├── index.html
    │   ├── libraries
    │   │   ├── toxichelper.js
    │   │   └── toxiclibs.js
    │   ├── sketch.js
    │   └── wind.js
    └── original
    │   ├── branch.js
    │   ├── index.html
    │   ├── libraries
    │       ├── toxichelper.js
    │       └── toxiclibs.js
    │   └── sketch.js
└── index.md


/.gitignore:
--------------------------------------------------------------------------------
1 | .DS_Store
2 | 
3 | _site/
4 | .sass-cache/
5 | .jekyll-cache/
6 | .jekyll-metadata
7 | 


--------------------------------------------------------------------------------
/404.html:
--------------------------------------------------------------------------------
 1 | ---
 2 | layout: base
 3 | ---
 4 | 
 5 | <style type="text/css" media="screen">
 6 |   .container {
 7 |     margin: 10px auto;
 8 |     max-width: 600px;
 9 |     text-align: center;
10 |   }
11 |   h1 {
12 |     margin: 30px 0;
13 |     font-size: 4em;
14 |     line-height: 1;
15 |     letter-spacing: -1px;
16 |   }
17 | </style>
18 | 
19 | <div class="container">
20 |   <h1>404</h1>
21 | 
22 |   <p><strong>Page not found :(</strong></p>
23 |   <p>The requested page could not be found.</p>
24 | </div>
25 | 


--------------------------------------------------------------------------------
/Gemfile:
--------------------------------------------------------------------------------
 1 | source "https://rubygems.org"
 2 | 
 3 | gem "jekyll", "~> 3.8.5"
 4 | 
 5 | # If you want to use GitHub Pages, remove the "gem "jekyll"" above and
 6 | # uncomment the line below. To upgrade, run `bundle update github-pages`.
 7 | gem "github-pages", group: :jekyll_plugins
 8 | 
 9 | # If you have any plugins, put them here!
10 | group :jekyll_plugins do
11 |   gem "jekyll-feed", "~> 0.6"
12 | end
13 | 
14 | # Windows does not include zoneinfo files, so bundle the tzinfo-data gem
15 | gem "tzinfo-data", platforms: [:mingw, :mswin, :x64_mingw, :jruby]
16 | 


--------------------------------------------------------------------------------
/Gemfile.lock:
--------------------------------------------------------------------------------
  1 | GEM
  2 |   remote: https://rubygems.org/
  3 |   specs:
  4 |     activesupport (4.2.11.1)
  5 |       i18n (~> 0.7)
  6 |       minitest (~> 5.1)
  7 |       thread_safe (~> 0.3, >= 0.3.4)
  8 |       tzinfo (~> 1.1)
  9 |     addressable (2.7.0)
 10 |       public_suffix (>= 2.0.2, < 5.0)
 11 |     coffee-script (2.4.1)
 12 |       coffee-script-source
 13 |       execjs
 14 |     coffee-script-source (1.11.1)
 15 |     colorator (1.1.0)
 16 |     commonmarker (0.17.13)
 17 |       ruby-enum (~> 0.5)
 18 |     concurrent-ruby (1.1.5)
 19 |     dnsruby (1.61.3)
 20 |       addressable (~> 2.5)
 21 |     em-websocket (0.5.1)
 22 |       eventmachine (>= 0.12.9)
 23 |       http_parser.rb (~> 0.6.0)
 24 |     ethon (0.12.0)
 25 |       ffi (>= 1.3.0)
 26 |     eventmachine (1.2.7)
 27 |     execjs (2.7.0)
 28 |     faraday (0.17.0)
 29 |       multipart-post (>= 1.2, < 3)
 30 |     ffi (1.11.1)
 31 |     forwardable-extended (2.6.0)
 32 |     gemoji (3.0.1)
 33 |     github-pages (202)
 34 |       activesupport (= 4.2.11.1)
 35 |       github-pages-health-check (= 1.16.1)
 36 |       jekyll (= 3.8.5)
 37 |       jekyll-avatar (= 0.6.0)
 38 |       jekyll-coffeescript (= 1.1.1)
 39 |       jekyll-commonmark-ghpages (= 0.1.6)
 40 |       jekyll-default-layout (= 0.1.4)
 41 |       jekyll-feed (= 0.11.0)
 42 |       jekyll-gist (= 1.5.0)
 43 |       jekyll-github-metadata (= 2.12.1)
 44 |       jekyll-mentions (= 1.4.1)
 45 |       jekyll-optional-front-matter (= 0.3.0)
 46 |       jekyll-paginate (= 1.1.0)
 47 |       jekyll-readme-index (= 0.2.0)
 48 |       jekyll-redirect-from (= 0.14.0)
 49 |       jekyll-relative-links (= 0.6.0)
 50 |       jekyll-remote-theme (= 0.4.0)
 51 |       jekyll-sass-converter (= 1.5.2)
 52 |       jekyll-seo-tag (= 2.5.0)
 53 |       jekyll-sitemap (= 1.2.0)
 54 |       jekyll-swiss (= 0.4.0)
 55 |       jekyll-theme-architect (= 0.1.1)
 56 |       jekyll-theme-cayman (= 0.1.1)
 57 |       jekyll-theme-dinky (= 0.1.1)
 58 |       jekyll-theme-hacker (= 0.1.1)
 59 |       jekyll-theme-leap-day (= 0.1.1)
 60 |       jekyll-theme-merlot (= 0.1.1)
 61 |       jekyll-theme-midnight (= 0.1.1)
 62 |       jekyll-theme-minimal (= 0.1.1)
 63 |       jekyll-theme-modernist (= 0.1.1)
 64 |       jekyll-theme-primer (= 0.5.3)
 65 |       jekyll-theme-slate (= 0.1.1)
 66 |       jekyll-theme-tactile (= 0.1.1)
 67 |       jekyll-theme-time-machine (= 0.1.1)
 68 |       jekyll-titles-from-headings (= 0.5.1)
 69 |       jemoji (= 0.10.2)
 70 |       kramdown (= 1.17.0)
 71 |       liquid (= 4.0.0)
 72 |       listen (= 3.1.5)
 73 |       mercenary (~> 0.3)
 74 |       minima (= 2.5.0)
 75 |       nokogiri (>= 1.10.4, < 2.0)
 76 |       rouge (= 3.11.0)
 77 |       terminal-table (~> 1.4)
 78 |     github-pages-health-check (1.16.1)
 79 |       addressable (~> 2.3)
 80 |       dnsruby (~> 1.60)
 81 |       octokit (~> 4.0)
 82 |       public_suffix (~> 3.0)
 83 |       typhoeus (~> 1.3)
 84 |     html-pipeline (2.12.0)
 85 |       activesupport (>= 2)
 86 |       nokogiri (>= 1.4)
 87 |     http_parser.rb (0.6.0)
 88 |     i18n (0.9.5)
 89 |       concurrent-ruby (~> 1.0)
 90 |     jekyll (3.8.5)
 91 |       addressable (~> 2.4)
 92 |       colorator (~> 1.0)
 93 |       em-websocket (~> 0.5)
 94 |       i18n (~> 0.7)
 95 |       jekyll-sass-converter (~> 1.0)
 96 |       jekyll-watch (~> 2.0)
 97 |       kramdown (~> 1.14)
 98 |       liquid (~> 4.0)
 99 |       mercenary (~> 0.3.3)
100 |       pathutil (~> 0.9)
101 |       rouge (>= 1.7, < 4)
102 |       safe_yaml (~> 1.0)
103 |     jekyll-avatar (0.6.0)
104 |       jekyll (~> 3.0)
105 |     jekyll-coffeescript (1.1.1)
106 |       coffee-script (~> 2.2)
107 |       coffee-script-source (~> 1.11.1)
108 |     jekyll-commonmark (1.3.1)
109 |       commonmarker (~> 0.14)
110 |       jekyll (>= 3.7, < 5.0)
111 |     jekyll-commonmark-ghpages (0.1.6)
112 |       commonmarker (~> 0.17.6)
113 |       jekyll-commonmark (~> 1.2)
114 |       rouge (>= 2.0, < 4.0)
115 |     jekyll-default-layout (0.1.4)
116 |       jekyll (~> 3.0)
117 |     jekyll-feed (0.11.0)
118 |       jekyll (~> 3.3)
119 |     jekyll-gist (1.5.0)
120 |       octokit (~> 4.2)
121 |     jekyll-github-metadata (2.12.1)
122 |       jekyll (~> 3.4)
123 |       octokit (~> 4.0, != 4.4.0)
124 |     jekyll-mentions (1.4.1)
125 |       html-pipeline (~> 2.3)
126 |       jekyll (~> 3.0)
127 |     jekyll-optional-front-matter (0.3.0)
128 |       jekyll (~> 3.0)
129 |     jekyll-paginate (1.1.0)
130 |     jekyll-readme-index (0.2.0)
131 |       jekyll (~> 3.0)
132 |     jekyll-redirect-from (0.14.0)
133 |       jekyll (~> 3.3)
134 |     jekyll-relative-links (0.6.0)
135 |       jekyll (~> 3.3)
136 |     jekyll-remote-theme (0.4.0)
137 |       addressable (~> 2.0)
138 |       jekyll (~> 3.5)
139 |       rubyzip (>= 1.2.1, < 3.0)
140 |     jekyll-sass-converter (1.5.2)
141 |       sass (~> 3.4)
142 |     jekyll-seo-tag (2.5.0)
143 |       jekyll (~> 3.3)
144 |     jekyll-sitemap (1.2.0)
145 |       jekyll (~> 3.3)
146 |     jekyll-swiss (0.4.0)
147 |     jekyll-theme-architect (0.1.1)
148 |       jekyll (~> 3.5)
149 |       jekyll-seo-tag (~> 2.0)
150 |     jekyll-theme-cayman (0.1.1)
151 |       jekyll (~> 3.5)
152 |       jekyll-seo-tag (~> 2.0)
153 |     jekyll-theme-dinky (0.1.1)
154 |       jekyll (~> 3.5)
155 |       jekyll-seo-tag (~> 2.0)
156 |     jekyll-theme-hacker (0.1.1)
157 |       jekyll (~> 3.5)
158 |       jekyll-seo-tag (~> 2.0)
159 |     jekyll-theme-leap-day (0.1.1)
160 |       jekyll (~> 3.5)
161 |       jekyll-seo-tag (~> 2.0)
162 |     jekyll-theme-merlot (0.1.1)
163 |       jekyll (~> 3.5)
164 |       jekyll-seo-tag (~> 2.0)
165 |     jekyll-theme-midnight (0.1.1)
166 |       jekyll (~> 3.5)
167 |       jekyll-seo-tag (~> 2.0)
168 |     jekyll-theme-minimal (0.1.1)
169 |       jekyll (~> 3.5)
170 |       jekyll-seo-tag (~> 2.0)
171 |     jekyll-theme-modernist (0.1.1)
172 |       jekyll (~> 3.5)
173 |       jekyll-seo-tag (~> 2.0)
174 |     jekyll-theme-primer (0.5.3)
175 |       jekyll (~> 3.5)
176 |       jekyll-github-metadata (~> 2.9)
177 |       jekyll-seo-tag (~> 2.0)
178 |     jekyll-theme-slate (0.1.1)
179 |       jekyll (~> 3.5)
180 |       jekyll-seo-tag (~> 2.0)
181 |     jekyll-theme-tactile (0.1.1)
182 |       jekyll (~> 3.5)
183 |       jekyll-seo-tag (~> 2.0)
184 |     jekyll-theme-time-machine (0.1.1)
185 |       jekyll (~> 3.5)
186 |       jekyll-seo-tag (~> 2.0)
187 |     jekyll-titles-from-headings (0.5.1)
188 |       jekyll (~> 3.3)
189 |     jekyll-watch (2.2.1)
190 |       listen (~> 3.0)
191 |     jemoji (0.10.2)
192 |       gemoji (~> 3.0)
193 |       html-pipeline (~> 2.2)
194 |       jekyll (~> 3.0)
195 |     kramdown (1.17.0)
196 |     liquid (4.0.0)
197 |     listen (3.1.5)
198 |       rb-fsevent (~> 0.9, >= 0.9.4)
199 |       rb-inotify (~> 0.9, >= 0.9.7)
200 |       ruby_dep (~> 1.2)
201 |     mercenary (0.3.6)
202 |     mini_portile2 (2.4.0)
203 |     minima (2.5.0)
204 |       jekyll (~> 3.5)
205 |       jekyll-feed (~> 0.9)
206 |       jekyll-seo-tag (~> 2.1)
207 |     minitest (5.12.2)
208 |     multipart-post (2.1.1)
209 |     nokogiri (1.10.4)
210 |       mini_portile2 (~> 2.4.0)
211 |     octokit (4.14.0)
212 |       sawyer (~> 0.8.0, >= 0.5.3)
213 |     pathutil (0.16.2)
214 |       forwardable-extended (~> 2.6)
215 |     public_suffix (3.1.1)
216 |     rb-fsevent (0.10.3)
217 |     rb-inotify (0.10.0)
218 |       ffi (~> 1.0)
219 |     rouge (3.11.0)
220 |     ruby-enum (0.7.2)
221 |       i18n
222 |     ruby_dep (1.5.0)
223 |     rubyzip (2.0.0)
224 |     safe_yaml (1.0.5)
225 |     sass (3.7.4)
226 |       sass-listen (~> 4.0.0)
227 |     sass-listen (4.0.0)
228 |       rb-fsevent (~> 0.9, >= 0.9.4)
229 |       rb-inotify (~> 0.9, >= 0.9.7)
230 |     sawyer (0.8.2)
231 |       addressable (>= 2.3.5)
232 |       faraday (> 0.8, < 2.0)
233 |     terminal-table (1.8.0)
234 |       unicode-display_width (~> 1.1, >= 1.1.1)
235 |     thread_safe (0.3.6)
236 |     typhoeus (1.3.1)
237 |       ethon (>= 0.9.0)
238 |     tzinfo (1.2.5)
239 |       thread_safe (~> 0.1)
240 |     unicode-display_width (1.6.0)
241 | 
242 | PLATFORMS
243 |   ruby
244 | 
245 | DEPENDENCIES
246 |   github-pages
247 |   jekyll (~> 3.8.5)
248 |   jekyll-feed (~> 0.6)
249 |   tzinfo-data
250 | 
251 | BUNDLED WITH
252 |    1.16.1
253 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # TeamTrees
 2 | 
 3 | [Site](https://codingtrain.github.io/teamtrees/) with code from #TeamTrees Live Stream.
 4 | 
 5 | [Live Stream Link](https://www.youtube.com/watch?v=HhceJ5xxl-4)
 6 | 
 7 | ## Contributing
 8 | 
 9 | To contribute your remixed version of the tree.
10 | 
11 | 1. Add a folder in the Code directory with your sketch. Must have an index.html containing your sketch. You can also duplicate the `original` and modify it.
12 | 
13 | 2. Then add to index.md under sketches with the following format.
14 | 
15 | ```
16 | sketches:
17 |   # existing entries
18 |   - name: "Whatever you want to name it."
19 |     description: "A brief description this is optional."
20 |     creator: "Your name."
21 |     url: "directoryName" # This has to be the exact directory name that you created under /code.
22 | ```
23 | 
24 | 3. Create a pull request with the your changes.
25 | 


--------------------------------------------------------------------------------
/_config.yml:
--------------------------------------------------------------------------------
 1 | title: "TeamTrees"
 2 | 
 3 | markdown: kramdown
 4 | plugins:
 5 |   - jekyll-feed
 6 | 
 7 | # Exclude from processing.
 8 | # The following items will not be processed, by default. Create a custom list
 9 | # to override the default setting.
10 | exclude:
11 |   - Gemfile
12 |   - Gemfile.lock
13 |   - node_modules
14 |   - vendor/bundle/
15 |   - vendor/cache/
16 |   - vendor/gems/
17 |   - vendor/ruby/
18 | 


--------------------------------------------------------------------------------
/_includes/head.html:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html lang="en">
 3 | <head>
 4 | 
 5 |   <meta charset="UTF-8">
 6 |   <meta name="viewport" content="width=device-width, initial-scale=1.0">
 7 |   <meta http-equiv="X-UA-Compatible" content="ie=edge">
 8 |   
 9 |   <title>{{page.title}} | {{site.title}} | The Coding Train</title>
10 | 
11 |   {% comment %} cdn links {% endcomment %}
12 |   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/skeleton/2.0.4/skeleton.css" integrity="sha256-ECB9bbROLGm8wOoEbHcHRxlHgzGqYpDtNTgDTyDz0wg=" crossorigin="anonymous" />
13 | 
14 |   {% comment %} local styles {% endcomment %}
15 |   <link rel="stylesheet" href="{{ '/assets/css/main.css' | relative_url }}" />
16 | 
17 | </head>


--------------------------------------------------------------------------------
/_layouts/base.html:
--------------------------------------------------------------------------------
 1 | ---
 2 | layout: compress
 3 | ---
 4 | 
 5 | {% include head.html %}
 6 | <body>
 7 |   <div class="container">
 8 |     {{ content }}
 9 |   </div>
10 | </body>


--------------------------------------------------------------------------------
/_layouts/home.html:
--------------------------------------------------------------------------------
 1 | ---
 2 | layout: base
 3 | ---
 4 | 
 5 | <h1 class="sr-only">Coding Train Team Trees</h1>
 6 | <div class="row">
 7 |   <div class="six columns">
 8 |     <a href="https://thecodingtrain.com" target="_blank"><img class="img-title" src="{{ '/assets/images/CodingTrain.png' | relative_url }}" alt="Coding Train Logo"></a>
 9 |   </div>
10 |   <div class="six columns">
11 |     <a href="https://teamtrees.org" target="_blank"><img class="img-title" src="{{ '/assets/images/TeamTrees.svg' | relative_url }}" alt="Team Trees Logo"></a>
12 |   </div>
13 | </div>
14 | <div>
15 |   {{ content }}
16 | </div>
17 | 
18 | <div>
19 |   <h2>Sketches</h2>
20 | 
21 |   <ul class="ul-unstyled">
22 |     {% assign sketches = page.sketches %}
23 |     {% for sketch in sketches %}
24 |       <li>
25 |         <div class="row bar">
26 |           <div class="eight columns">
27 |             <h3>{{sketch.name}}</h3>
28 |             by {{sketch.creator}}
29 |             {% if sketch.description %}
30 |             <br>
31 |             {{sketch.description}}
32 |             {% endif %}
33 |           </div>
34 |           <div class="four columns mt-1">
35 |             <a class="button u-pull-right" href="code/{{ sketch.url | default: '#' }}">Check it out!</a>
36 |             <a class="button u-pull-right" href="https://github.com/CodingTrain/teamtrees/tree/master/code/{{ sketch.url | default: '#' }}">Source Code</a>
37 |           </div>
38 |         </div>
39 |       </li>
40 |     {% endfor %}
41 |   </ul>
42 |   <div class="bar"></div>
43 | </div>
44 | 
45 | <div>
46 |   <h2>Videos</h2>
47 | 
48 |   <ul class="ul-unstyled">
49 |     {% assign videos = page.videos %}
50 |     {% for video in videos %}
51 |       <li>
52 |         <div class="row bar">
53 | 
54 |           <h3>{{video.name}}</h3>
55 | 
56 |           {% if video.website %}
57 |             <a href="{{video.website}}">View on thecodingtrain.com</a>
58 |           {% endif %}
59 |           
60 |           <div class="vid-height">
61 |             <iframe class="vid-frame" src="https://www.youtube.com/embed/{{video.video_id}}" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
62 |           </div>
63 |           
64 |         </div>
65 |       </li>
66 |     {% endfor %}
67 |   </ul>
68 |   <div class="bar"></div>
69 | </div>
70 | 


--------------------------------------------------------------------------------
/assets/css/main.css:
--------------------------------------------------------------------------------
 1 | body {
 2 |   background: #2F7F47;
 3 | }
 4 | 
 5 | h2 {
 6 |   font-size: 3rem;
 7 | }
 8 | 
 9 | h3 {
10 |   font-size: 2rem;
11 | }
12 | 
13 | a {
14 |   color: #2F7F47;
15 | }
16 | 
17 | a:hover {
18 |   color: #223753;
19 | }
20 | 
21 | .button {
22 |   text-transform: none;
23 | }
24 | 
25 | .container {
26 |   background: white;
27 |   padding: 3rem;
28 |   margin-top: 2rem;
29 |   border-radius: 8px;
30 | }
31 | 
32 | .img-title {
33 |   width: 100%;
34 | }
35 | 
36 | .ul-unstyled {
37 |   list-style: none;
38 |   margin: 0px;
39 | }
40 | 
41 | .bar {
42 |   border-top: 1px solid #bbb;
43 |   padding: 1rem 0rem;
44 |   width: 100%;
45 | }
46 | 
47 | .mt-1 {
48 |   margin-top: 1rem;
49 | }
50 | 
51 | .sr-only {
52 |   display: none;
53 | }
54 | 
55 | .vid-height {
56 |   position: relative;
57 |   padding-bottom: 56.25%;
58 |   height: 0;
59 |   margin: 1rem;
60 | }
61 | 
62 | .vid-frame {
63 |   position: absolute;
64 |   top: 0;
65 |   left: 0;
66 |   width: 100%;
67 |   height: 100%;
68 | }
69 | 


--------------------------------------------------------------------------------
/assets/images/CodingTrain.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/CodingTrain/teamtrees/af3f4c8db8983658bbd81c6bbe56eacbc844c93c/assets/images/CodingTrain.png


--------------------------------------------------------------------------------
/assets/images/TeamTrees.svg:
--------------------------------------------------------------------------------
1 | <svg id="Layer_1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 302.6"><style>.st0{fill:#8ab73f}.st1{fill:#273755}.st2{fill:#263754}</style><path class="st0" d="M1200 189.2H138.3L0 302.6h1061.7z"/><path class="st1" d="M223 237.8l-2.9 16.2h13.6l-1.1 5.4h-13.4l-3.1 17.4h-5.7l3.1-17.4h-17.8l-3.1 17.4h-5.7l3.1-17.4h-13.1l1.1-5.4h12.9l2.9-16.2h-13l1.1-5.5h12.9l3.1-17.3h5.7l-3.1 17.3h17.8l3.1-17.3h5.7l-3.1 17.3h13.6l-1.1 5.5H223zm-5.8 0h-17.8l-2.9 16.2h17.8l2.9-16.2zM323.4 221.7h-24.5v55.1h-7.1v-55.1h-24.4V215h56v6.7zM405.7 270v6.8h-48V215h47.5v6.7h-40.4v20.7h26v6.7h-26V270h40.9zM498.7 276.2v.6h-7.3l-6.7-14.5h-35.9l-6.7 14.5h-7.3v-.6l28.8-61.2h6.4l28.7 61.2zm-17.3-20.7l-14.8-31.9-14.8 31.9h29.6zM594.8 215v61.8h-7.1v-49.7L564 259h-.9l-23.8-31.9v49.7h-7.1V215h6.4l25 33.5 25.1-33.5h6.1zM684.1 232.7h-18.5v44.1h-19.4v-44.1h-18.5V215h56.4v17.7zM773.3 275.9v.9H753L741.3 259h-8.6v17.8h-19.4V215h33.5c13.3 0 22.9 8.8 22.9 22 0 8.4-4 15.1-10.3 18.8l13.9 20.1zm-40.6-32.8h11.2c4.1 0 6.4-2.2 6.4-5.6 0-3.4-2.4-5.6-6.4-5.6h-11.2v11.2zM854.5 259.5v17.3h-52.1V215H854v17.3h-32.2v5.9h20.3v15.2h-20.3v6.1h32.7zM937.4 259.5v17.3h-52.1V215H937v17.3h-32.2v5.9h20.3v15.2h-20.3v6.1h32.6zM964.3 270.1l7.9-16.1c6.6 5.3 14 7.4 22.7 7.4 5.6 0 8.9-.6 8.9-3.2 0-1.9-2-2.4-12.1-4-13.6-2.2-25.8-4.2-25.8-18.8 0-13.9 11.6-21.9 27.7-21.9 14.7 0 23.8 6.3 27.4 14.4l-15.4 7.7c-1.7-4.6-7-5.6-12.3-5.6-6.6 0-8.1 1.7-8.1 3.6 0 1.8 1.9 2.5 12 4 13.3 2 25.9 4.9 25.9 19.5 0 14.2-12.3 21.1-29.8 21.1-11.4 0-20.7-2.8-29-8.1z"/><path class="st2" d="M614.7 0c-4.8 0-48.7 152.6-44.2 157.8C575 163.1 593 170 614 170s39.6-10 41.1-14-33-156-40.4-156z"/><path class="st0" d="M632.2 122l-1.4-1.4-16.1 16V49h-1.9v60.2l-16-16.1-1.4 1.4 17.4 17.4v9.3l-16-16.1-1.4 1.4 17.4 17.4v67.8h1.9v-52.3z"/><path class="st2" d="M564 77.3c-2.9 0-29.1 91-26.4 94.2 2.7 3.1 13.4 7.3 26 7.3 12.5 0 23.6-6 24.6-8.4.8-2.4-19.8-93.1-24.2-93.1z"/><path class="st0" d="M574.4 150.1l-.8-.8-9.6 9.5v-52.3h-1.1v35.9l-9.6-9.5-.8.8 10.4 10.4v5.5l-9.6-9.6-.8.9 10.4 10.4v40.4h1.1v-31.2zM714.6 77.3c-2.9 0-29.1 91-26.4 94.2 2.7 3.1 13.4 7.3 26 7.3s23.6-6 24.6-8.4c.8-2.4-19.8-93.1-24.2-93.1z"/><path class="st1" d="M725 150.1l-.8-.8-9.6 9.5v-52.3h-1.1v35.9l-9.6-9.5-.8.8 10.4 10.4v5.5l-9.6-9.6-.8.9 10.4 10.4v40.4h1.1v-31.2z"/></svg>


--------------------------------------------------------------------------------
/code/Okaghana/branch.js:
--------------------------------------------------------------------------------
 1 | const scale = 0.67;
 2 | 
 3 | class Branch {
 4 | 	constructor(begin, end, level) {
 5 | 		this.begin = begin;
 6 | 		this.end = end;
 7 | 		this.level = level;
 8 | 		this.finished = false;
 9 | 		
10 | 		let d = dist(this.end.x, this.end.y, this.begin.x, this.begin.y);
11 | 		
12 | 		// Pull Joint to original position
13 | 		this.hook = new VerletParticle2D(this.end)  												// Creates a copy of the Joint on the same Position as the end of the Branch
14 | 		this.hook.lock()																			// Locks the Particle
15 | 		let springforce = map(this.level, 0, totalLevels, 0.01, 0.004)
16 | 		this.puller = new VerletSpring2D(this.hook, this.end, 10, springforce)
17 | 		this.puller.lockA()																			// Additionally locks one end of the Spring
18 | 		physics.addSpring(this.puller)
19 | 		
20 | 		// Spring from start to end
21 | 		let spring = new VerletSpring2D(this.begin, this.end, d, 0.01);
22 | 		physics.addSpring(spring);
23 | 	}
24 | 
25 | 	show() {
26 | 		stroke(255);
27 | 		let sw = 4 / log(this.level + 2);
28 | 		strokeWeight(sw);
29 | 		line(this.begin.x, this.begin.y, this.end.x, this.end.y);
30 | 	}
31 | 	
32 | 	// Returns new Brach starting from this.end
33 | 	createBranch(angle) {
34 | 		let dir = this.end.sub(this.begin);
35 | 		dir.rotate(angle);
36 | 		dir.scaleSelf(scale);
37 | 		
38 | 		let newEnd = new VerletParticle2D(this.end.add(dir));
39 | 		physics.addParticle(newEnd);
40 | 		
41 | 		let branch = new Branch(this.end, newEnd, this.level + 1);
42 | 		return branch;
43 | 	}
44 | }
45 | 


--------------------------------------------------------------------------------
/code/Okaghana/index.html:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html>
 3 |   <head>
 4 |     <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.9.0/p5.js"></script>
 5 |     <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.9.0/addons/p5.dom.min.js"></script>
 6 |     <script src="libraries/toxiclibs.js"></script>
 7 |     <script src="libraries/toxichelper.js"></script>
 8 |     <meta charset="utf-8" />
 9 |     <style>
10 |       html,
11 |       body {
12 |         margin: 0;
13 |         padding: 0;
14 |       }
15 |       canvas {
16 |         display: block;
17 |       }
18 |     </style>
19 |   </head>
20 |   <body>
21 |     <script src="branch.js"></script>
22 |     <script src="wind.js"></script>
23 |     <script src="sketch.js"></script>
24 |   </body>
25 | </html>
26 | 


--------------------------------------------------------------------------------
/code/Okaghana/libraries/toxichelper.js:
--------------------------------------------------------------------------------
 1 | // The Nature of Code
 2 | // Daniel Shiffman
 3 | // http://natureofcode.com
 4 | 
 5 | // Making it easier to use all these classes
 6 | // Maybe this is a bad idea?
 7 | const VerletPhysics2D = toxi.physics2d.VerletPhysics2D;
 8 | const GravityBehavior = toxi.physics2d.behaviors.GravityBehavior;
 9 | const AttractionBehavior = toxi.physics2d.behaviors.AttractionBehavior;
10 | const VerletParticle2D = toxi.physics2d.VerletParticle2D;
11 | const VerletSpring2D = toxi.physics2d.VerletSpring2D;
12 | const VerletMinDistanceSpring2D = toxi.physics2d.VerletMinDistanceSpring2D;
13 | const Vec2D = toxi.geom.Vec2D;
14 | const Rect = toxi.geom.Rect;


--------------------------------------------------------------------------------
/code/Okaghana/sketch.js:
--------------------------------------------------------------------------------
 1 | const totalLevels = 9;
 2 | 
 3 | let tree = [];
 4 | let leaves = [];
 5 | 
 6 | let physics;										// holds Physics Engine
 7 | let gb;												// holds the Gravity Behaviour
 8 | let wind;											// holds Wind
 9 | 
10 | function setup(){
11 | 	createCanvas(windowWidth, windowHeight);
12 |     physics = new VerletPhysics2D();
13 |   
14 |     wind = new Wind(0);
15 |   
16 |     gb = new GravityBehavior(new Vec2D(wind, -0.05));
17 |     physics.addBehavior(gb);
18 | 
19 | 	// Create inital Branch (basically the root)
20 |     let a = new VerletParticle2D(width / 2, height).lock();
21 |     let b = new VerletParticle2D(width / 2, height - height / 4);
22 |     physics.addParticle(a);
23 |     physics.addParticle(b);
24 |     tree.push(new Branch(a, b, 0));
25 | 
26 | 	// Loop for every Level the Tree has
27 |     for (let n = 0; n < totalLevels; n++) {
28 | 		// Loop through every element in tree
29 |     	for (let i = tree.length - 1; i >= 0; i--) {
30 | 			// Only create Branches if the Tree hasn't previously branched
31 | 			if (!tree[i].finished) {
32 | 				let a = tree[i].createBranch(PI/6);
33 | 				let b = tree[i].createBranch(-PI/4);
34 | 				tree.push(a);
35 | 				tree.push(b);
36 | 			}
37 | 		tree[i].finished = true;
38 | 		}
39 | 	}
40 | }
41 | 
42 | function mousePressed(){
43 |   // console.log(gb);
44 |   // gb.force.x = 0;
45 |   // gb.force.y = -50;
46 |   // gb.scaledForce.x = 0;
47 |   // gb.scaledForce.y = -50;
48 | }
49 | 
50 | function draw(){
51 | 	background(51);
52 | 	physics.update();
53 | 
54 |     // if (mouseIsPressed) {
55 |     //   let last = tree[tree.length - 1].end;
56 |     //   last.lock();
57 |     //   last.x = mouseX;
58 |     //   last.y = mouseY;
59 |     //   last.unlock();
60 |     // }
61 |   
62 | 	wind.createWind()	 // Randomly Create wind
63 | 	wind.draw()
64 | 	wind.update()
65 | 	
66 | 	// Draw tree
67 | 	for (let i = 0; i < tree.length; i++) {
68 | 		tree[i].show();
69 | 	}
70 | }
71 | 


--------------------------------------------------------------------------------
/code/Okaghana/wind.js:
--------------------------------------------------------------------------------
 1 | const BUILDUP_STRENGTH = [-2, 2]							// Min and Max Strength per Frame during Buildup
 2 | const BUILDUP_DURATION = [15, 100]							// Min and Max Duration of the Buildup time
 3 | const CREATING_CHANCE = 0.1									// How rare the creation is
 4 | const DECREASE_VALUE = 0.97									// How strongly the wind decreases per Frame
 5 | 
 6 | const verbose = false										// Log the events?
 7 | 
 8 | 
 9 | function randomInt(low, hih){
10 | 	return floor(random() * (hih-low) + low)
11 | }
12 | 
13 | 
14 | class Wind {
15 | 	constructor(initialStrength){
16 | 		this.strength = initialStrength
17 | 		this.buildupStrength = 0														// Strength the wind gains per Frame
18 | 		this.buildupDuration = 0														// How long the wind builds up
19 | 		
20 | 		this.markers = []
21 | 	}
22 | 	
23 | 	createWind(){
24 | 		if (random() > CREATING_CHANCE || this.strength != 0) return;					// Only create Wind sometimes
25 | 		
26 | 		this.buildupStrength = random(BUILDUP_STRENGTH[0], BUILDUP_STRENGTH[1])
27 | 		this.buildupDuration = randomInt(BUILDUP_DURATION[0], BUILDUP_DURATION[1])
28 | 		
29 | 		this.initDraw()
30 | 		if(verbose) console.log("Created Wind - Strength: " + this.buildupStrength + ", Duration: " + this.buildupDuration);
31 | 	}
32 | 	
33 | 	update(){
34 | 		// Increase Wind
35 | 		if (this.buildupStrength != 0 && this.buildupDuration != 0){					// We dont need to reset buildupStrength, because buildupDuration will decrease
36 | 			this.strength += this.buildupStrength
37 | 			this.buildupDuration--
38 | 		}
39 | 		
40 | 		// Decrease Wind
41 | 		if (this.strength != 0 && this.buildupDuration == 0){
42 | 			this.strength *= DECREASE_VALUE
43 | 			if ((this.strength > 0 && this.strength < 0.5) || (this.strength < 0 && this.strength > -0.5)){this.strength = 0}
44 | 		}
45 | 		
46 | 		// Apply
47 | 		gb.setForce(new Vec2D(this.strength, -0.05))
48 | 		if(verbose) console.log("Wind has Strength " + this.strength);
49 | 	}
50 | 	
51 | 	initDraw(){
52 | 		this.markers = []
53 | 		for (let i = 0; i < 4; i++){
54 | 			let line = new wigglyLine(this.buildupStrength)
55 | 			this.markers.push(line)
56 | 		}
57 | 	}
58 | 	
59 | 	draw(){
60 | 		if (this.buildupDuration != 0){
61 | 			// Draw Lines
62 | 			for (let i = 0; i < this.markers.length; i++){
63 | 				this.markers[i].draw()
64 | 				this.markers[i].update()
65 | 			}
66 | 		}
67 | 	}
68 | }
69 | 
70 | // Wiggly lines
71 | class wigglyLine{
72 | 	constructor(strength){
73 | 		this.strength = strength
74 | 		this.alpha = 255
75 | 		
76 | 		let x = strength>0 ? random(-500, -50) : random(width+500, width+50)
77 | 		this.pos = createVector(x, random(100, height-100))
78 | 	}
79 | 
80 | 	draw(){
81 | 		let x = this.pos.x
82 | 		let y = this.pos.y
83 | 		
84 | 		noFill()
85 | 		stroke(255, this.alpha)
86 | 		strokeWeight(3)
87 | 		bezier(x-150, y, x-40, y-100, x+40, y+100, x+150, y)
88 | 	}
89 | 	
90 | 	update(){
91 | 		this.pos.x += this.strength * 10
92 | 		this.alpha -= 6
93 | 	}
94 | }
95 | 


--------------------------------------------------------------------------------
/code/original/branch.js:
--------------------------------------------------------------------------------
 1 | class Branch {
 2 |   constructor(begin, end, level) {
 3 |     this.level = level;
 4 |     this.begin = begin;
 5 |     this.end = end;
 6 |     let d = dist(this.end.x, this.end.y, this.begin.x, this.begin.y);
 7 |     let repulsion = new AttractionBehavior(this.end, d * 0.5, -0.5);
 8 |     physics.addBehavior(repulsion);
 9 | 
10 |     let spring = new VerletSpring2D(this.begin, this.end, d, 0.01);
11 |     physics.addSpring(spring);
12 |     this.finished = false;
13 |   }
14 | 
15 |   show() {
16 |     stroke(255);
17 |     let sw = 4 / log(this.level + 2);
18 |     strokeWeight(sw);
19 |     // strokeWeight(map(this.level, 0, totalLevels, 8, 1));
20 |     line(this.begin.x, this.begin.y, this.end.x, this.end.y);
21 |   }
22 | 
23 |   branchA() {
24 |     let dir = this.end.sub(this.begin);
25 |     dir.rotate(PI / 6);
26 |     dir.scaleSelf(0.67);
27 |     let newEnd = new VerletParticle2D(this.end.add(dir));
28 |     physics.addParticle(newEnd);
29 |     let b = new Branch(this.end, newEnd, this.level + 1);
30 |     return b;
31 |   }
32 | 
33 |   branchB() {
34 |     let dir = this.end.sub(this.begin);
35 |     dir.rotate(-PI / 4);
36 |     dir.scaleSelf(0.67);
37 |     let newEnd = new VerletParticle2D(this.end.add(dir));
38 |     physics.addParticle(newEnd);
39 |     let b = new Branch(this.end, newEnd, this.level + 1);
40 |     return b;
41 |   }
42 | }
43 | 


--------------------------------------------------------------------------------
/code/original/index.html:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html>
 3 |   <head>
 4 |     <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.9.0/p5.js"></script>
 5 |     <script src="libraries/toxiclibs.js"></script>
 6 |     <script src="libraries/toxichelper.js"></script>
 7 |     <meta charset="utf-8" />
 8 |     <style>
 9 |       html,
10 |       body {
11 |         margin: 0;
12 |         padding: 0;
13 |       }
14 |       canvas {
15 |         display: block;
16 |       }
17 |     </style>
18 |   </head>
19 |   <body>
20 |     <script src="branch.js"></script>
21 |     <script src="sketch.js"></script>
22 |   </body>
23 | </html>
24 | 


--------------------------------------------------------------------------------
/code/original/libraries/toxichelper.js:
--------------------------------------------------------------------------------
 1 | // The Nature of Code
 2 | // Daniel Shiffman
 3 | // http://natureofcode.com
 4 | 
 5 | // Making it easier to use all these classes
 6 | // Maybe this is a bad idea?
 7 | const VerletPhysics2D = toxi.physics2d.VerletPhysics2D;
 8 | const GravityBehavior = toxi.physics2d.behaviors.GravityBehavior;
 9 | const AttractionBehavior = toxi.physics2d.behaviors.AttractionBehavior;
10 | const VerletParticle2D = toxi.physics2d.VerletParticle2D;
11 | const VerletSpring2D = toxi.physics2d.VerletSpring2D;
12 | const VerletMinDistanceSpring2D = toxi.physics2d.VerletMinDistanceSpring2D;
13 | const Vec2D = toxi.geom.Vec2D;
14 | const Rect = toxi.geom.Rect;


--------------------------------------------------------------------------------
/code/original/sketch.js:
--------------------------------------------------------------------------------
 1 | let tree = [];
 2 | let leaves = [];
 3 | 
 4 | let count = 0;
 5 | 
 6 | let physics;
 7 | let totalLevels = 8;
 8 | 
 9 | let gb;
10 | 
11 | function setup() {
12 |   createCanvas(windowWidth, windowHeight);
13 |   physics = new VerletPhysics2D();
14 |   gb = new GravityBehavior(new Vec2D(0, -0.01));
15 |   physics.addBehavior(gb);
16 |   // physics.setWorldBounds(new Rect(0, 0, width, height));
17 | 
18 |   let a = new VerletParticle2D(width / 2, height);
19 |   let b = new VerletParticle2D(width / 2, height - height / 4);
20 |   a.lock();
21 |   //b.lock();
22 |   physics.addParticle(a);
23 |   physics.addParticle(b);
24 |   let root = new Branch(a, b, 0);
25 |   tree[0] = root;
26 |   for (let n = 0; n < totalLevels; n++) {
27 |     for (let i = tree.length - 1; i >= 0; i--) {
28 |       if (!tree[i].finished) {
29 |         let a = tree[i].branchA();
30 |         let b = tree[i].branchB();
31 |         tree.push(a);
32 |         tree.push(b);
33 |         // if (n == 5) {
34 |         //   let holder1 = new VerletParticle2D(a.end.x, 0);
35 |         //   holder1.lock();
36 |         //   let d1 = dist(holder1.x, holder1.y, a.end.x, a.end.y);
37 |         //   let spring1 = new VerletSpring2D(holder1, a.end, d1, 0.01);
38 |         //   physics.addSpring(spring1);
39 |         //   let holder2 = new VerletParticle2D(b.end.x, 0);
40 |         //   holder2.lock();
41 |         //   let d2 = dist(holder2.x, holder2.y, b.end.x, b.end.y);
42 |         //   let spring2 = new VerletSpring2D(holder2, b.end, d2, 0.01);
43 |         //   physics.addSpring(spring2);
44 |         // }
45 |       }
46 |       tree[i].finished = true;
47 |     }
48 |   }
49 | }
50 | 
51 | function mousePressed() {
52 |   // console.log(gb);
53 |   // gb.force.x = 0;
54 |   // gb.force.y = -50;
55 |   // gb.scaledForce.x = 0;
56 |   // gb.scaledForce.y = -50;
57 | }
58 | 
59 | let xoff = 0;
60 | function draw() {
61 |   background(51);
62 |   physics.update();
63 | 
64 |   xoff += 0.01;
65 |   gb.scaledForce.y = map(noise(xoff + 1000), 0, 1, -0.02, 0.005);
66 |   gb.scaledForce.x = map(noise(xoff), 0, 1, -0.02, 0.02);
67 | 
68 |   // if (mouseIsPressed) {
69 |   //   let last = tree[tree.length - 1].end;
70 |   //   last.lock();
71 |   //   last.x = mouseX;
72 |   //   last.y = mouseY;
73 |   //   last.unlock();
74 |   // }
75 | 
76 |   for (let i = 0; i < tree.length; i++) {
77 |     tree[i].show();
78 |   }
79 |   //console.log(frameCount);
80 | }
81 | 


--------------------------------------------------------------------------------
/index.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | layout: home
 3 | title: Home
 4 | 
 5 | sketches:
 6 |   - name: "Original Tree"
 7 |     description: "Code from the live stream!"
 8 |     creator: "The Coding Train"
 9 |     url: "original"
10 |   - name: "Minimalistic yet Realistic"
11 |     description: "The tree isn't completely collapsing. YAY!"
12 |     creator: "Okaghana"
13 |     url: "Okaghana"
14 | 
15 | videos:
16 |   - name: "Fractal Trees - Recursive - CC14"
17 |     website: "https://thecodingtrain.com/CodingChallenges/014-fractaltree.html"
18 |     video_id: "0jjeOYMjmDU"
19 |   - name: "Fractal Trees - Object Oriented - CC15"
20 |     website: "https://thecodingtrain.com/CodingChallenges/015-fractaltreearray.html"
21 |     video_id: "fcdNSZ9IzJM"
22 |   - name: "Fractal Trees - L-System - CC16"
23 |     website: "https://thecodingtrain.com/CodingChallenges/016-lsystem.html"
24 |     video_id: "E1B4UoSQMFw"
25 |   - name: "Fractal Trees - Space Colonization - CC17"
26 |     website: "https://thecodingtrain.com/CodingChallenges/017-spacecolonizer.html"
27 |     video_id: "kKT0v3qhIQY"
28 |   - name: "3D Fractal Trees - CC18"
29 |     website: "https://thecodingtrain.com/CodingChallenges/018-spacecolonizer3d.html"
30 |     video_id: "JcopTKXt8L8"
31 |   - name: "Phyllotaxis - CC30"
32 |     website: "https://thecodingtrain.com/CodingChallenges/030-phyllotaxis.html"
33 |     video_id: "KWoJgHFYWxY"
34 |   - name: "Barnsley Fern - CC108"
35 |     website: "https://thecodingtrain.com/CodingChallenges/108-barnsley-fern.html"
36 |     video_id: "JFugGF1URNo"
37 |   - name: "Fractal #TeamTrees Live Stream"
38 |     video_id: "HhceJ5xxl-4"
39 | ---
40 | 
41 | This is a site a site based around The Coding Train's \#TeamTrees live stream. <a href="https://www.youtube.com/watch?v=HhceJ5xxl-4">Here is a link</a> to the original live stream. You can also view all coding tree videos associated with the fundraiser below. Below you will find the original code from that stream as well as community created remixes. For more information on \#TeamTrees you can go to <a href="https://teamtrees.org/">teamtrees.org</a>. Learn how to contribute your code on the <a href="https://github.com/CodingTrain/teamtrees">github repository for this project</a>!
42 | 


--------------------------------------------------------------------------------