├── .gitattributes
├── README.md
├── awesome-menu.js
├── db-init.js
├── db-populate.js
├── fonts
    ├── ABeeZee-Regular.ttf
    ├── OFL-ABeeZee.txt
    ├── OFL-Oswald.txt
    ├── Oswald-Regular.ttf
    ├── icomoon.eot
    ├── icomoon.svg
    ├── icomoon.ttf
    └── icomoon.woff
├── gencode.js
├── index.php
├── licenses
    ├── license-taffydb.txt
    └── public-domain-studygamedev.txt
├── search.js
├── section-toggle.js
├── style.css
└── taffy-min.js


/.gitattributes:
--------------------------------------------------------------------------------
1 | # Auto detect text files and perform LF normalization
2 | * text=auto
3 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # StudyGameDev.com
 2 | This is a simple online resource database, categorized according to branch of study and then further organized by topics/skill sets under the field that one can learn. The fields are programming, writing, sound design, music production, art, 3D modelling, game design, user experience, quality assurance, production & management, marketing, finanace, and business & legal. The resources are primarily intended for United States game developers, although those who can read and speak english will find numerous resources that are of value to them. You can view the site at https://studygamedev.com/.
 3 | 
 4 | ## Basic Usage of the Site
 5 | This website is primarily a portal to other websites with information. To navigate the portal, either use the menu or the featured content links at the welcoming section of the page. The entire website is keyboard accessible with the use of tab, shift+tab, and spacebar. The keyboard shortcuts `Ctrl+Z` or `Ctrl+/` will bookmark your current navigation spot and select the menu again. Accessibility controls can help increase the font size, change the theme from dark to bright, and disable content folding for users who can use the mouse for navigation and want to navigate the website faster. Additionally, there is a search bar at the top of the website for looking for entries according to your exact string of input.
 6 | 
 7 | ## Guide to the Files on StudyGameDev.
 8 | StudyGameDev is a relatively simple website project, facilitating the use of HTML, CSS, and JavaScript. Here is a list of the file names and the general functions for each:
 9 | 
10 | * index.php - This is the project's "starting point." It is the page where all of the components come together. Mostly HTML.
11 | * style.css - Used to detail the website with a responsive, high contrast theme.
12 | * section-toggle.js - Script for accessing different website sections and turning them off and on.
13 | * taffy-min.js - A JS library for object-based libraries that perform faster than arrays.
14 | * db-init.js - The database of game development resources and all their entries.
15 | * db-populate.js - (Most of) the functionality for adding topics, sections, and resources to the site.
16 | * awesome-menu.js - Modular script for the A.W.E.S.O.M.E. menu, a keyboard-accessible, screen reader-tested, slide-in menu system.
17 | * gencode.js - A quick tool for generating database entries for existing sections and topics.
18 | * search.js - The code for reading and responding to user input in the search bar.
19 | 
20 | ## Licenses
21 | * This version of Taffy DB is under the [MIT license](https://tldrlegal.com/license/mit-license).
22 | * The font licenses (Open Font License) for ABeeZee and Oswald are contained within the font directory.
23 | 
24 | # How a Beginner Can Contribute to StudyGameDev.com
25 | ## Step One: Set Up Your Git Repository Software.
26 | I recommend that beginners download https://desktop.github.com/. Simply install it.
27 | ## Step Two: Launch the Github Desktop Software
28 | The installer should do this step for you, once it is done installing. But if it doesn't go ahead and launch it, yourself.
29 | ## Step Three: Clone the StudyGameDev.com repository to your Github Desktop software.
30 | This action is performed in a few simple steps, but depends on your familiarity with the software.
31 | 1. This step depends on whether you have used Github Desktop to work with a repository, before, or not.
32 | * If this is your first time using the software, click the button that is labelled with "Clone a repository from the Internet."
33 | * If you have used this software before and do not see this button, then open the File menu at the top of the window of the Github Desktop software and select "Clone repository." The shortcut key combination for this action is `Ctrl+Shift+O`.
34 | 2. The software will prompt you for the location of the repository. Type in `nitronova/StudyGameDev.com` and define the installation path on your hard drive where you'd like the StudyGameDev.com project files to be placed.
35 | ## Step Four: Look for a Potential Issue to Fix
36 | On this page, you can find StudyGameDev.com's current Issues under the Issues tab near the top of this website. See if there is an issue that you believe you can fix using code.
37 | 
38 | If there are not any issues that you can fix with code, that's okay! You can still make a contribution to the project!
39 | 1. Think of a website where you learned information that could be included on StudyGameDev.com.
40 | 2. Copy the URL to that resource and fill out the form on StudyGameDev.com's Code Generator. This tool will generate a small piece of code that you can add to the db-init.js file. Remember to specify the category topic of this resource as well as the media type that it is in. Write a title and a brief summary of the content. Press the copy button to copy the resulting code.
41 | ## Step Five: Create a New Branch for Your Own Modifications
42 | This will group your changes so that you can later request they be made to the original version. Let's assume the above example of using the code generator to edit the db-init.js file.
43 | 
44 | In your Github Desktop software, navigate to the Branch menu at the top of the screen, and select "New Branch." The keyboard shortcut for this is `Ctrl+Shift+N`. Alternatively, you can use the "Current Branch" submenu to create a new branch. You can give this branch whatever name you wish to use. You could name it something like "db New Resources," if you want a suggestion.
45 | ## Step Six: Publish the Branch to Github
46 | This will make your branch visible on the Github page for the StudyGameDev.com project.
47 | 1. Ensure that your newly created branch is selected by looking at the Current Branch dropdown menu. If your branch's name is visible, you can proceed to step two. Otherwise, use the dropdown menu to select your branch.
48 | 2. To publish the branch, click the button just to the right of the Current Branch dropdown menu that says "Publish Branch to Github".
49 | ## Step Seven: Begin Making Modifications
50 | 1. Ensure that your newly created branch is selected by looking at the Current Branch dropdown menu. If your branch's name is visible, you can proceed to step two. Otherwise, use the dropdown menu to select your branch.
51 | 2. Simply open the db-init.js file in any plaintext editor (such as Notepad or Atom, but not Microsoft Word or OpenOffice Writer, those are rich text editors!) and paste the code in a reasonable location (usually amongst similarly categorized information.
52 | 3. Github Desktop will detect your changes and show them in its user interface.
53 | 4. Remember to test your changes to ensure that your resource appears in the right place and that your changes haven't caused a glitch somewhere!
54 | You can repeat this process and end up with 2 or even more new blocks of code to be added to db-init.js.
55 | ## Step Eight: Commit and Push the Changes to Your Branch
56 | 1. Commit: To update your branch with your changes, navigate to the bottom-left corner of the window where you can see the form to commit your edits. Name your edit in the title (example: "DB Add: `Name of resource goes here`"). Add a brief description or summary of what changes you made to which files. Then click "Commit to `Name of branch`" to commit the changes.
57 | 2. Push: Next to the Current Branch dropdown menu, the button has changed to be labelled with "Push Origin." Press this button. Your branch is now a newer version of the project than the original.
58 | ## Step Nine: Perform a Pull Request
59 | Performing a pull request means that you wish to add your changes to the original project. This has to be requested of me, nitronova, the project maintainer.
60 | 1. Navigate to the Branch menu at the top of the window of your Github Desktop software and select "Create Pull Request." The keyboard shortcut to this is `Ctrl+R`. This will open a new tab in your web browser where you can go into detail with the issues or additions you wish to fix.
61 | 2. If you are following the db-init.js example, select the label that says "New Resource for db-init.js".
62 | 3. When everything looks good, click the green button that says "Create Pull Request." You can make edits if you realize you forgot anything in particular.
63 | 
64 | I will at that point review your submission. If the request is approved, we will work on merging it. For simple database additions, this is as simple as merging the pull request with the master. Once this is done, you can at that point delete the branch you have created by going back to Github Desktop, navigating to the Branch menu, and select "Delete," checking "Yes" for deleting the remote. If you forget to check it then see this [guide to deleting a branch on Github](https://help.github.com/en/articles/creating-and-deleting-branches-within-your-repository).
65 | 
66 | If the original version of the site changes, make sure to keep your source code up to date. Make sure that the Current Branch is selecting the master and press Fetch Origin. This may check the github project for updates. If there are, press the button again (it should say "Pull Origin," this time). You are ready to begin making another change. Begin again at Step Four for new updates.
67 | 


--------------------------------------------------------------------------------
/awesome-menu.js:
--------------------------------------------------------------------------------
  1 | /*
  2 |  I hereby release this code into the public domain.
  3 |  Let it be freely used and improved by all.
  4 |  I highly recommend that forks of this project,
  5 |  should they be licensed, be licensed with a
  6 |  libre license for free software.
  7 | 
  8 |  Important point to make: If you use this, and something breaks, yeah that sucks.
  9 |  But I will legally have to say: This program is distributed in the hope that it will be useful,
 10 |  but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
 11 |  Please seek the consultation of a professional developer before using foreign code.
 12 | 
 13 |  I based a lot of my code from these two projects:
 14 |  https://codepen.io/marcysutton/pen/JoQqVw
 15 |  https://codepen.io/rjmccollam/pen/ZYNEXd
 16 | */
 17 | var oAwesomeMenu = {};
 18 | oAwesomeMenu.fMenuApplication = ( function()
 19 | {
 20 |  var bIsFirefox = typeof InstallTrigger !== "undefined",
 21 |  hLastFocusedID = null;//document.getElementById( "text-site-title" ).children[ 0 ],
 22 |  bShortcutToSearch = false;
 23 |  bAccessibilityDialogOpen = false,
 24 |  kTab = { 9: 1 };
 25 |  kMenuShortcut = { 90: 1,  191: 1 }, // Z and slash
 26 |  kSearchShortcut = { 88: 1, 190: 1 } // X and .
 27 |  kScroll = { 32: 1,  37: 1,  38: 1,  39: 1,  40: 1 }, // ARROWS
 28 |  kMouse = { 0: 1,  1: 1,  2: 1 },
 29 |  hMainMenuButton = document.getElementById( "button-main-menu" ),
 30 |  hMainMenuWrapper = document.getElementById( "wrapper-main-menu" ),
 31 |  aByClassButtonToggleSubmenu = hMainMenuWrapper.getElementsByClassName( "button-toggle-submenu" ),
 32 |  hBlackBackground = document.getElementById( "background-black-alpha" ),
 33 |  hAccessibilityDialogButton = document.getElementById( "button-settings-accessibility" ),
 34 |  hAccessibilityDialog = document.getElementById( "wrapper-settings-accessibility" );
 35 | 
 36 | 
 37 |  /* Set Cookie Settings: 1. dark/bright, 2. default/larger/largest 3. yes/no to unfolding */
 38 |  function fSetCookie( sTheme, sFontSize, sUnfoldContent, nLifespanDays, sValidDomain )
 39 |  {
 40 |   // https://www.thesitewizard.com/javascripts/cookies.shtml (Thank youuu)
 41 |   var sDomain = sValidDomain ? ( "; domain=" + sValidDomain ) : '';
 42 |   document.cookie = "theme" + "=" + encodeURIComponent( sTheme ) +
 43 |    "; max-age=" + 60 * 60 * 24 * nLifespanDays +
 44 |    "; path=/" + sDomain ;
 45 |   document.cookie = "fontsize" + "=" + encodeURIComponent( sFontSize ) +
 46 |    "; max-age=" + 60 * 60 * 24 * nLifespanDays +
 47 |    "; path=/" + sDomain ;
 48 |   document.cookie = "showcontent" + "=" + encodeURIComponent( sUnfoldContent ) +
 49 |    "; max-age=" + 60 * 60 * 24 * nLifespanDays +
 50 |    "; path=/" + sDomain ;
 51 |  }
 52 | 
 53 | 
 54 |  /* Get Cookie once it has been set. */
 55 |  function fGetCookie( sCookieName )
 56 |  {
 57 |   // https://www.thesitewizard.com/javascripts/cookies.shtml
 58 |   var sCookie = document.cookie;
 59 |   if( sCookie.length != 0 )
 60 |   {
 61 |    var aCookie = sCookie.split( '; ' );
 62 |    for( let nCookieIndex = 0; nCookieIndex < aCookie.length; nCookieIndex++ )
 63 |    {
 64 |     let aCookieValue = aCookie[ nCookieIndex ].match( sCookieName + '=(.*)' );
 65 |     if( aCookieValue != null )
 66 |     {
 67 |      return decodeURIComponent( aCookieValue[ 1 ] ); // The value in () above.
 68 |     }
 69 |    }
 70 |   }
 71 |   return '';
 72 |  }
 73 | 
 74 | 
 75 |  /// Site settings, set by cookies and forms.
 76 |  function fApplySettings( sSettingTheme, sSettingFontSize, sSettingShowContent )
 77 |  {
 78 |   document.body.className = sSettingTheme;
 79 |   document.getElementsByTagName( "html" )[ 0 ].className = sSettingFontSize;
 80 |   document.getElementById( "setting-unfolding-marker" ).className = sSettingShowContent;
 81 |  }
 82 | 
 83 | 
 84 |  /// Focus after a small timer.
 85 |  function fDelayFocusOnElement( hElement )
 86 |  {
 87 |   setTimeout( function(){ hElement.focus(); }, 100 );  // For readability.
 88 |  }
 89 | 
 90 | 
 91 |  /// Scroll Disabling (mouse)
 92 |  function preventDefault( hEvent )
 93 |  {
 94 |   hEvent = hEvent || window.event;
 95 |   if( hEvent.preventDefault )
 96 |   {
 97 |    hEvent.preventDefault();
 98 |   }
 99 |   hEvent.returnValue = false;
100 |  }
101 |  function fPreventScrollKeys( hEvent )
102 |  { /// Keyboard
103 |   if( kScroll[ hEvent.keyCode ] )
104 |   {
105 |    preventDefault( hEvent );
106 |    return false;
107 |   }
108 |  }
109 |  function fEnableScroll()
110 |  { /// Re-enabling scroll
111 |   document.onkeydown = null;
112 |  }
113 |  function fDisableScroll()
114 |  { /// Re-enabling keys
115 |   document.onkeydown = fPreventScrollKeys;
116 |  }
117 | 
118 | 
119 |  /// Tabindex and ARIA-Hidden
120 |  function fTabScreenReaderOn( hElement )
121 |  {
122 |   hElement.removeAttribute( "tabindex" );
123 |   hElement.removeAttribute( "aria-hidden" );
124 |  }
125 |  function fTabScreenReaderOff( hElement )
126 |  {
127 |   hElement.setAttribute( "tabindex", "-1" );
128 |   hElement.setAttribute( "aria-hidden", "true" );
129 |  }
130 |  function fSubmenuTabScreenOn( hElement )
131 |  {
132 |   for( let nSubmenuChildrenIndex = 0; nSubmenuChildrenIndex < hElement.children.length; nSubmenuChildrenIndex++ )
133 |   {
134 |    fTabScreenReaderOn( hElement.children[ nSubmenuChildrenIndex ].children[ 0 ] );
135 |   }
136 |  }
137 |  function fSubmenuTabScreenOff( hElement )
138 |  {
139 |   for( let nSubmenuChildrenIndex = 0; nSubmenuChildrenIndex < hElement.children.length; nSubmenuChildrenIndex++ )
140 |   {
141 |    fTabScreenReaderOff( hElement.children[ nSubmenuChildrenIndex ].children[ 0 ] );
142 |   }
143 |  }
144 |  function fAllTabScreenOn()
145 |  { // Links lose their tabIndex="-1" thing.
146 |   fTabScreenReaderOn( hMainMenuWrapper );
147 |   let aMainMenuChildren = hMainMenuWrapper.children[ 1 ].children;
148 |   for( let nMenuChildrenIndex = 0; nMenuChildrenIndex < aMainMenuChildren.length; nMenuChildrenIndex++ )
149 |   {
150 |    let hButton = aMainMenuChildren[ nMenuChildrenIndex ].children[ 0 ];
151 |    fTabScreenReaderOn( hButton );
152 |    if( aMainMenuChildren[ nMenuChildrenIndex ].classList.contains( "wrapper-submenu-parent" ) )
153 |    {
154 |     let hSiblingList = hButton.nextElementSibling;
155 |     fSubmenuTabScreenOn( hSiblingList );
156 |    }
157 |   }
158 |  }
159 |  function fAllTabScreenOff()
160 |  { // Links lose their tabIndex="-1" thing.
161 |   fTabScreenReaderOff( hMainMenuWrapper );
162 |   var aMainMenuChildren = hMainMenuWrapper.children[ 1 ].children;
163 |   for( let nMenuChildrenIndex = 0; nMenuChildrenIndex < aMainMenuChildren.length; nMenuChildrenIndex++ )
164 |   {
165 |    var hButton = aMainMenuChildren[ nMenuChildrenIndex ].children[ 0 ];
166 |    fTabScreenReaderOff( hButton );
167 |    if( aMainMenuChildren[ nMenuChildrenIndex ].classList.contains( "wrapper-submenu-parent" ) )
168 |    {
169 |     let hSiblingList = hButton.nextElementSibling;
170 |     fSubmenuTabScreenOff( hSiblingList );
171 |    }
172 |   }
173 |  }
174 | 
175 |  /// Opening/Closing Navigation
176 |  function fMoveMenuButtonToOpen()
177 |  {
178 |   document.getElementById( "wrapper-button-menu-closed" ).removeChild( hMainMenuButton );
179 |   document.getElementById( "wrapper-button-menu-open" ).appendChild( hMainMenuButton );
180 |  }
181 |  function fMoveMenuButtonToClosed()
182 |  {
183 |   document.getElementById( "wrapper-button-menu-open" ).removeChild( hMainMenuButton );
184 |   document.getElementById( "wrapper-button-menu-closed" ).appendChild( hMainMenuButton );
185 |  }
186 |  function fOpenMainMenu()
187 |  {
188 |   hBlackBackground.className = "state-open";
189 |   hMainMenuButton.className = "state-open";
190 |   hMainMenuWrapper.className = "state-open";
191 |   hMainMenuButton.setAttribute( "aria-label", "Close the menu " );
192 |   fDisableScroll();
193 |   fAllTabScreenOn();
194 |   fDelayFocusOnElement( hMainMenuWrapper.children[ 1 ].children[ 0 ].children[ 0 ] );
195 |   fMoveMenuButtonToOpen();
196 |   hMainMenuWrapper.children[ 1 ].children[ 0 ].children[ 0 ].focus();
197 |  }
198 |  function fCloseMainMenu()
199 |  {
200 |   if( bAccessibilityDialogOpen )
201 |   {
202 |    return;
203 |   }
204 |   let aSlicedMenuOpenChildren = Array.prototype.slice.call( hMainMenuWrapper.getElementsByClassName( "state-open" ) );
205 |   for( let hMenuOpenChild of aSlicedMenuOpenChildren )
206 |   {
207 |    hMenuOpenChild.classList.remove( "state-open" );
208 |   }
209 |   hMainMenuWrapper.classList.remove( "state-open" );
210 |   hBlackBackground.classList.remove( "state-open" );
211 |   hMainMenuButton.classList.remove( "state-open" );
212 |   hMainMenuButton.setAttribute( "aria-label", "Open the menu " );
213 |   fEnableScroll();
214 |   fAllTabScreenOff();
215 |   fMoveMenuButtonToClosed();
216 |  }
217 | 
218 | 
219 |  /// Is child a descendent of parent?
220 |  function fIsDescendent( hParent, hChild )
221 |  {
222 |   let hNode = hChild.parentNode;
223 |   while( hNode != null )
224 |   {
225 |    if( hNode == hParent )
226 |    {
227 |     return true;
228 |    }
229 |    hNode = hNode.parentNode;
230 |   }
231 |   return false;
232 |  }
233 | 
234 | 
235 |  /// Are we focused on something in the menu?
236 |  function fIsNavFocused()
237 |  {
238 |   return fIsDescendent( hMainMenuWrapper, document.activeElement );
239 |  }
240 | 
241 | 
242 |  /// Wait, you mean INNERTEXT ISN'T CROSS-BROWSER, YET?!
243 |  function fRetrieveText( hElement )
244 |  {
245 |   if( typeof hElement.textContent != null )
246 |   {
247 |    return hElement.textContent;
248 |   }
249 |   return hElement.innerText;
250 |  }
251 | 
252 | 
253 |  /// Toggle Opening/Closing of Submenus
254 |  function fOpenSubmenu( hSubmenu )
255 |  {
256 |   hSubmenu.classList.add( "state-open" );
257 |   fSubmenuTabScreenOn( hSubmenu.nextElementSibling );
258 |   let hFirstSubmenuItem = hSubmenu.nextElementSibling.children[ 0 ].children[ 0 ];
259 |   hFirstSubmenuItem.focus();
260 |  }
261 |  function fCloseSubmenu( hSubmenu )
262 |  {
263 |   hSubmenu.classList.remove( "state-open" );
264 |   fSubmenuTabScreenOff( hSubmenu.nextElementSibling );
265 |  }
266 |  function fCloseAllSubmenus()
267 |  {
268 |   let aSlicedSubmenuButtons = Array.prototype.slice.call( aByClassButtonToggleSubmenu );
269 |   for( let hSubmenuButton of aSlicedSubmenuButtons )
270 |   {
271 |    if( fIsDescendent( hSubmenuButton.parentNode, document.activeElement ) == false )
272 |    {
273 |     fCloseSubmenu( hSubmenuButton );
274 |    }
275 |   }
276 |  }
277 |  function fToggleSubmenu( hSubmenu )
278 |  {
279 |   if( hSubmenu.classList.contains( "state-open" ) )
280 |   {
281 |    fCloseSubmenu( hSubmenu );
282 |    hSubmenu.setAttribute( "aria-label", "Open the " + fRetrieveText( hSubmenu ) + " sub-menu" );
283 |   }
284 |   else
285 |   {
286 |    fOpenSubmenu( hSubmenu );
287 |    hSubmenu.setAttribute( "aria-label", "Close the " + fRetrieveText( hSubmenu ) + " sub-menu" );
288 |   }
289 |  }
290 | 
291 | 
292 |  /// Events
293 |  function fEventClickSubmenu()
294 |  {
295 |   fCloseAllSubmenus();
296 |   fToggleSubmenu( this );
297 |  }
298 |  function fEventClickMainMenuButton( hEvent )
299 |  {
300 |   if( this.className == "state-open" )
301 |   {
302 |    fCloseMainMenu();
303 |    if( hLastFocusedID != null )
304 |    {
305 |     hLastFocusedID.focus();
306 |     hLastFocusedID == null;
307 |    }
308 |   }
309 |   else
310 |   {
311 |    fOpenMainMenu();
312 |   }
313 |  }
314 | 
315 | 
316 |  function fCloseAccessibilityDialog()
317 |  {
318 |   hBlackBackground.classList.remove( "state-accessibility-settings" );
319 |   hAccessibilityDialog.classList.remove( "state-open" );
320 |   fTabScreenReaderOff( hAccessibilityDialog );
321 |   // Do the same for all selects and buttons in hAccessibilityDialog
322 |   let aByTagNameButton = hAccessibilityDialog.getElementsByTagName( "button" );
323 |   let aByTagNameSelect = hAccessibilityDialog.getElementsByTagName( "select" );
324 |   aByTagNameButton = Array.prototype.slice.call( aByTagNameButton );
325 |   aByTagNameSelect = Array.prototype.slice.call( aByTagNameSelect );
326 | 
327 |   for( let hButtonArrayIndex = 0; hButtonArrayIndex < aByTagNameButton.length; hButtonArrayIndex++ )
328 |   {
329 |    fTabScreenReaderOff( aByTagNameButton[ hButtonArrayIndex ] );
330 |   }
331 |   for( let hSelectArrayIndex = 0; hSelectArrayIndex < aByTagNameSelect.length; hSelectArrayIndex++  )
332 |   {
333 |    fTabScreenReaderOff( aByTagNameSelect[ hSelectArrayIndex ] );
334 |   }
335 |   fTabScreenReaderOff( document.getElementById( "setting-content-unfold" ) );
336 |   hAccessibilityDialog.children[ 0 ].setAttribute( "tabindex", "-1" );
337 |   bAccessibilityDialogOpen = false;
338 |   hAccessibilityDialogButton.focus();
339 |  }
340 | 
341 | 
342 |  function fEventKeyUpGlobal( hEvent )
343 |  {
344 |   if( bAccessibilityDialogOpen )
345 |   {
346 |    if( fIsDescendent( hAccessibilityDialog, document.activeElement ) == false )
347 |    {
348 |     fCloseAccessibilityDialog();
349 |    }
350 |   }
351 |   else if( fIsNavFocused() )
352 |   {
353 |    fCloseAllSubmenus(); // Automatically close non-focused submenus.
354 |   }
355 |   else if( document.activeElement != hMainMenuButton )
356 |   {
357 |    if( hMainMenuWrapper.className == "state-open" )
358 |    {
359 |     fCloseMainMenu();
360 |     if( hLastFocusedID != null )
361 |     {
362 |      hLastFocusedID.focus();
363 |      hLastFocusedID == null;
364 |     }
365 |    }
366 |    else
367 |    {
368 |     if( kTab[ hEvent.keyCode ] )
369 |     {
370 |      if( hEvent.shiftKey == false )
371 |      {
372 |       if( bShortcutToSearch )
373 |       {
374 |        if( hLastFocusedID != null )
375 |        {
376 |         hLastFocusedID.focus();
377 |         bShortcutToSearch = false;
378 |         hLastFocusedID == null;
379 |        }
380 |       }
381 |      }
382 |      if( hLastFocusedID != null )
383 |      {
384 |       if( document.activeElement == document.getElementById( "line-input-search" ) )
385 |       {
386 |        bShortcutToSearch = true;
387 |       }
388 |       else
389 |       {
390 |        bShortcutToSearch = false;
391 |       }
392 |      }
393 |     }
394 |     else if( hEvent.ctrlKey && kMenuShortcut[ hEvent.keyCode ] )
395 |     {
396 |      let sActiveNodeName = document.activeElement.nodeName;
397 |      if( sActiveNodeName != "INPUT" && sActiveNodeName != "TEXTAREA" )
398 |      {
399 |       hLastFocusedID = document.activeElement;
400 |       hMainMenuButton.focus();
401 |      }
402 |     }
403 |     else if( hEvent.ctrlKey && kSearchShortcut[ hEvent.keyCode ] )
404 |     {
405 |      hLastFocusedID = document.activeElement;
406 |      bShortcutToSearch = true;
407 |      document.getElementById( "line-input-search" ).focus();
408 |     }
409 |    }
410 |   }
411 |  }
412 |  function fEventBlurLastMenuItem()
413 |  {
414 |   var hLastMenuItem = this;
415 |   setTimeout( function()
416 |   {
417 |    if( fIsNavFocused() == false )
418 |    {
419 |     if( hLastMenuItem.classList.contains( "state-open" ) == false )
420 |     {
421 |      fCloseMainMenu();
422 |      hLastFocusedID.focus();
423 |     }
424 |    }
425 |   }, 1 );
426 |  }
427 | 
428 |  function fEventBlurAccessibility( hEvent )
429 |  {
430 |   setTimeout( function()
431 |   {
432 |    if( fIsDescendent( hAccessibilityDialog, document.activeElement ) == false )
433 |    {
434 |     if( document.activeElement == document.body )
435 |     { // The mouse was probably clicked.
436 |      return;
437 |     }
438 |     fCloseAccessibilityDialog();
439 |    }
440 |   }, 100 );
441 |  }
442 |  function fEventClickBlackBackground()
443 |  {
444 |   if( this.classList.contains( "state-accessibility-settings" ) )
445 |   {
446 |    fCloseAccessibilityDialog();
447 |   }
448 |   else if( hMainMenuWrapper.className == "state-open" )
449 |   {
450 |    fCloseMainMenu();
451 |   }
452 |  }
453 |  function fEventClickAccessibilityDialogButton()
454 |  {
455 |   hAccessibilityDialog.classList.add( "state-open" );
456 |   hBlackBackground.classList.add( "state-accessibility-settings" );
457 |   fTabScreenReaderOn( hAccessibilityDialog );
458 |   let aByTagNameButton = hAccessibilityDialog.getElementsByTagName( "button" );
459 |   aByTagNameButton = Array.prototype.slice.call( aByTagNameButton );
460 |   let aByTagNameSelect = hAccessibilityDialog.getElementsByTagName( "select" );
461 |   aByTagNameSelect = Array.prototype.slice.call( aByTagNameSelect );
462 |   for( let hButtonArrayIndex = 0; hButtonArrayIndex < aByTagNameButton.length; hButtonArrayIndex++ )
463 |   {
464 |    fTabScreenReaderOn( aByTagNameButton[ hButtonArrayIndex ] );
465 |   }
466 |   for( let hSelectArrayIndex = 0; hSelectArrayIndex < aByTagNameSelect.length; hSelectArrayIndex++  )
467 |   {
468 |    fTabScreenReaderOn( aByTagNameSelect[ hSelectArrayIndex ] );
469 |   }
470 |   TabScreenReaderOn( document.getElementById( "setting-content-unfold" ) );
471 |   hAccessibilityDialog.children[ 0 ].setAttribute( "tabindex", "0" );
472 |   // Do the same for all selects and buttons in hAccessibilityDialog
473 |   bAccessibilityDialogOpen = true;
474 |   hAccessibilityDialog.children[ 0 ].focus();
475 |  }
476 | 
477 |  function fEventClickAccessibilitySaveButton()
478 |  {
479 |   let hUnfoldCheckbox = document.querySelector( "#setting-content-unfold:checked" );
480 |   let sUnfoldSetting = "null";
481 |   if( hUnfoldCheckbox != null )
482 |   {
483 |    sUnfoldSetting = hUnfoldCheckbox.value;
484 |   }
485 |   var aOptions = [
486 |    document.getElementById( "setting-theme" ).value,
487 |    document.getElementById( "setting-font-size" ).value,
488 |    sUnfoldSetting
489 |   ];
490 |   fApplySettings( aOptions[ 0 ], aOptions[ 1 ], aOptions[ 2 ] );
491 |   fSetCookie( aOptions[ 0 ], aOptions[ 1 ], aOptions[ 2 ], 30, "studygamedev.com" );
492 |  }
493 | 
494 |  function fEventKeyDownOnButton( hEvent )
495 |  {
496 |   if( hEvent.keyCode == 32 )
497 |   {
498 |    this.click();
499 |   }
500 |  }
501 | 
502 |  /// Custom function for when the menu items are clicked in studygamedev.
503 |  function fHandleMenuClick( hEvent )
504 |  {
505 |   ///
506 |   let aByClassTopic = document.getElementsByClassName( "topic" );
507 |   let sToAttribute = hEvent.target.getAttribute( "to" );
508 |   // In this part, we set all of the attributes appropriately.
509 |   fRemoveResourceNodes(); // Clear out nodes we are no longer using (reduce RAM usage)
510 |   fPopulateViaMenu( sToAttribute );
511 | 
512 |   var iTimer = setTimeout( function()
513 |   {
514 |    var hTopic = document.getElementById( sToAttribute );
515 |    if( hMainMenuWrapper.className == "state-open" )
516 |    {
517 |     fCloseMainMenu();
518 |    }
519 |    document.getElementById( "wrapper-home-page-content" ).className = "state-hidden";
520 |    let hTopicChapterButton = hTopic.getElementsByTagName( "button" )[ 0 ];
521 |    hTopicChapterButton.focus();
522 | 
523 |   }, 26 ); // 5 to give enough of a buffer
524 |  }
525 | 
526 |  function fInitApplication()
527 |  { // Bind actions to functions.
528 |   document.body.focus();
529 |   hMainMenuButton.addEventListener( "click", fEventClickMainMenuButton, false );
530 |   hMainMenuButton.setAttribute( "aria-label", "Open the menu" );
531 |   let aSlicedSubmenuButtons = Array.prototype.slice.call( aByClassButtonToggleSubmenu );
532 | 
533 |   for( let hSubmenuButton = 0; hSubmenuButton < aSlicedSubmenuButtons.length; hSubmenuButton++ )
534 |   {
535 |    aSlicedSubmenuButtons[ hSubmenuButton ].addEventListener( "click", fEventClickSubmenu, false );
536 |    aSlicedSubmenuButtons[ hSubmenuButton ].setAttribute( "aria-label", "Open the " +
537 |                                   fRetrieveText( aSlicedSubmenuButtons[ hSubmenuButton ] ) + " sub-menu" );
538 |   }
539 | 
540 |   let hLastMenuItem = hMainMenuWrapper.children[ 1 ].children;
541 |   hLastMenuItem = hLastMenuItem[ hLastMenuItem.length - 1 ].children[ 0 ];
542 |   hLastMenuItem.addEventListener( "blur", fEventBlurLastMenuItem, false ); // button or a
543 |   if( hLastMenuItem.parentNode.classList.contains("wrapper-submenu-parent") )
544 |   {
545 |    hLastMenuItem = hLastMenuItem.nextElementSibling.children;
546 |    hLastMenuItem = hLastMenuItem[ hLastMenuItem.length - 1 ].children[0]; // ul ul a
547 |    hLastMenuItem.addEventListener( "blur", fEventBlurLastMenuItem, false );
548 |   }
549 | 
550 |   hBlackBackground.addEventListener( "click", fEventClickBlackBackground, false );
551 |   document.body.addEventListener( "keyup", fEventKeyUpGlobal, false );
552 | 
553 |   fAllTabScreenOff();
554 | 
555 |   hAccessibilityDialogButton.addEventListener( "click", fEventClickAccessibilityDialogButton, false );
556 |   document.getElementById( "button-settings-accessibility-close" ).addEventListener( "click", fCloseAccessibilityDialog, false );
557 |   document.getElementById( "button-settings-accessibility-close" ).addEventListener( "blur", fEventBlurAccessibility, false );
558 |   hAccessibilityDialog.children[ 0 ].addEventListener( "blur", fEventBlurAccessibility, false );
559 |   document.getElementById( "button-settings-accessibility-save" ).addEventListener( "click", fEventClickAccessibilitySaveButton, false );
560 | 
561 |   if( bIsFirefox == false )
562 |   {
563 |    let aByTagNameButton = document.getElementsByTagName( "button" );
564 |    for( let nButtonIndex = 0; nButtonIndex < aByTagNameButton.length; nButtonIndex++ )
565 |    {
566 |     aByTagNameButton[ nButtonIndex ].addEventListener( "keyup", fEventKeyDownOnButton, false );
567 |    }
568 |   }
569 |   let aMenuAnchors = document.querySelectorAll(".wrapper-submenu-parent a");
570 |   for( let nMenuAnchorIndex = 0; nMenuAnchorIndex < aMenuAnchors.length; nMenuAnchorIndex++ )
571 |   {
572 |    aMenuAnchors[ nMenuAnchorIndex ].addEventListener( "click", fHandleMenuClick, false );
573 |    aMenuAnchors[ nMenuAnchorIndex ].addEventListener( "keyup", fEventKeyDownOnButton, false );
574 |   }
575 |   let aRecommendedTopicLinks = document.querySelectorAll("#text-recommended-topics a");
576 |   for( let nRecommendedIndex = 0; nRecommendedIndex < aRecommendedTopicLinks.length; nRecommendedIndex++ )
577 |   {
578 |    aRecommendedTopicLinks[ nRecommendedIndex ].addEventListener( "click", fHandleMenuClick, false );
579 |    aRecommendedTopicLinks[ nRecommendedIndex ].addEventListener( "keyup", fEventKeyDownOnButton, false );
580 |   }
581 |   fCloseAccessibilityDialog();
582 |   fApplySettings( fGetCookie("theme"), fGetCookie("fontsize"), fGetCookie("showcontent") );
583 |  }
584 | 
585 | 
586 |  return {
587 |   init: function()
588 |   {
589 |    fInitApplication();
590 |   }
591 |  };
592 | } )();
593 | 
594 | window.addEventListener( "load", function()
595 | {
596 |  new oAwesomeMenu.fMenuApplication.init();
597 | });
598 | 


--------------------------------------------------------------------------------
/db-populate.js:
--------------------------------------------------------------------------------
  1 | /* dLinks-populate.js
  2 |  This script provides controls for populating the content in the site.
  3 |  Other parts only need to refer to the functions provided here.
  4 | */
  5 | 
  6 | /// This global variable is dual-purposed for removing nodes and adding them.
  7 | var dResourceStack = TAFFY([]); // Stacks made from queries of other databases.
  8 | var bInterrupt = false; // Interruption flag for canceling async operations.
  9 | var nCurrentTask = 0;
 10 | var nTotalTasks = 0;
 11 | var nBarWidthPercentage = 0; // For drawing the loading bar.
 12 | 
 13 | /* Remove node and its children. */
 14 | function fRemoveElement( hElement )
 15 | {
 16 |  let hRange = document.createRange();
 17 |  hRange.selectNodeContents( hElement );
 18 |  hRange.deleteContents();
 19 |  hRange = null;
 20 |  let hParentElement = hElement.parentNode;
 21 |  hParentElement.removeChild( hElement );
 22 |  hParentElement = null;
 23 | }
 24 | 
 25 | /* Erase contents of stack database. */
 26 | function fClearDResourceStack()
 27 | {
 28 |  dResourceStack().remove();
 29 | }
 30 | 
 31 | /* Appends a resource link from the stack to the website. */
 32 | function fAddNewResource()
 33 | {
 34 |  let hDiv = document.createElement( "div" );
 35 |  let hTag = document.createElement( "span" );
 36 |  let hLink = document.createElement( "a" );
 37 |  let hDetails = document.createElement( "span" );
 38 |  let oResource = dResourceStack().first();
 39 | 
 40 |  // Containing div that acts similar to details.
 41 |  hDiv.setAttribute( "aria-label", "Expand description" );
 42 |  hDiv.setAttribute( "tabindex", "0" );
 43 |  hDiv.className = "resource";
 44 |  hDiv.addEventListener( "keyup", fHandleKeyUpResource, false );
 45 |  hDiv.addEventListener( "click", fHandleClickResource, false );
 46 |  // The tag in each summary.
 47 |  hTag.classList.add( "tag" );
 48 |  hTag.classList.add( oResource.sTagColor );
 49 |  hTag.appendChild( document.createTextNode( oResource.sTag ) );
 50 |  // The link in the summary.
 51 |  hLink.href = oResource.sURL;
 52 |  hLink.setAttribute( "target", "_BLANK" );
 53 |  hLink.className = "icon-external-link";
 54 |  hLink.appendChild( document.createTextNode( oResource.sSummary ) );
 55 |  // The description.
 56 |  hDetails.className = "resource-details";
 57 |  hDetails.appendChild( document.createTextNode( oResource.sDetails ) );
 58 |  // Assemble it.
 59 |  hDiv.appendChild( hTag );
 60 |  hDiv.appendChild( hLink );
 61 |  hDiv.appendChild( hDetails );
 62 | 
 63 |  document.getElementById( oResource.sSection ).appendChild( hDiv );
 64 | 
 65 |  dResourceStack().limit( 1 ).remove();
 66 |  fUpdateLoadingBar();
 67 | }
 68 | 
 69 | /* Creates and returns a new empty chapter */
 70 | function fCreateNewChapter( sChapterID, sChapterName )
 71 | {
 72 |  let hDiv = document.createElement( "div" );
 73 |  let hButton = document.createElement( "button" );
 74 |  let hSection = document.createElement( "section" );
 75 | 
 76 |  hDiv.className = "chapter";
 77 | 
 78 |  hButton.className = "button-chapter-name";
 79 |  hButton.setAttribute( "type", "button" );
 80 |  hButton.setAttribute( "aria-label", "Expand description" );
 81 |  hButton.appendChild( document.createTextNode( sChapterName ) );
 82 | 
 83 |  hSection.id = sChapterID;
 84 |  // Assemble it.
 85 |  hDiv.appendChild( hButton );
 86 |  hDiv.appendChild( hSection );
 87 | 
 88 |  return hDiv;
 89 | }
 90 | 
 91 | /* Adds a child to a topic in response to a menu click. */
 92 | function fAddChapterFromMenu( hTopic, nChapterArrayIndex, aChapters )
 93 | {
 94 |  let sChapterID = aChapters[ nChapterArrayIndex ][ 0 ];
 95 |  let sChapterName = aChapters[ nChapterArrayIndex ][ 1 ];
 96 |  let hChapter = fCreateNewChapter( sChapterID, sChapterName );
 97 | 
 98 |  hTopic.appendChild( hChapter );
 99 |  return nChapterArrayIndex + 1;
100 | }
101 | 
102 | /* Creates, appends to site, and returns a topic element. */
103 | function fCreateAndAddNewTopic( sTopicID, sTopicName )
104 | {
105 |  let hDiv = document.createElement( "div" );
106 |  let hH2 = document.createElement( "h2" );
107 | 
108 |  hDiv.className = "topic";
109 |  hDiv.id = sTopicID;
110 | 
111 |  hH2.appendChild( document.createTextNode( sTopicName ) );
112 | 
113 |  /// Assemble.
114 |  hDiv.appendChild( hH2 );
115 | 
116 |  document.getElementById( "wrapper-resource-content" ).appendChild( hDiv );
117 |  return hDiv;
118 | }
119 | 
120 | /* Someone very kind has provided a basic way to do this.
121 | https://stackoverflow.com/questions/41366438/how-to-output-to-console-in-real-time-in-javascript
122 | */
123 | 
124 | /* Updates loading bar with increased amount. */
125 | function fUpdateLoadingBar()
126 | {
127 |  // And to do that, we want one action, like this, repeated
128 |  nBarWidthPercentage = ++nCurrentTask / nTotalTasks * 100;
129 |  // And for the browser to update like so,
130 |  var hLoadingBar = document.getElementById( "dynamic-loading-bar" );
131 |  hLoadingBar.style.width = nBarWidthPercentage + '%';
132 |  // but without processing the increase all at once.
133 |  hLoadingBar.setAttribute('loading', nCurrentTask + ' / ' + nTotalTasks );
134 |  if( nBarWidthPercentage == 100 )
135 |  {
136 |   hLoadingBar.className = 'loading-complete';
137 |  }
138 | }
139 | 
140 | /* This function initiates an asynchronously performed task. */
141 | function fStartAsyncTask( oParameters )
142 | {
143 |  let nMillisecondsAllotted = oParameters.nMillisecondsAllotted;
144 |  let nTasksAllotted = oParameters.nTasksAllotted;
145 |  let nTasksPerTick = oParameters.nTasksPerTick;
146 |  let nCompletedTasks = 0;
147 |  let nTotalTicks = Math.ceil( nTasksAllotted / nTasksPerTick );
148 |  let iCurrentAsyncTask = null;
149 |  let hLoadingBar = document.getElementById( "dynamic-loading-bar" );
150 | 
151 |  nCurrentTask = 0;
152 |  hLoadingBar.classList.remove( "loading-complete" );
153 |  hLoadingBar.setAttribute( "loading", nCurrentTask + " / " + nTotalTasks );
154 | 
155 |  if( nTotalTicks === 0 )
156 |  {
157 |   return;
158 |  }
159 | 
160 |  var fTickTask = function()
161 |  {
162 |   let nCompletedTasksByTickEnd = Math.min( nCompletedTasks + nTasksPerTick, nTasksAllotted );
163 |   do
164 |   {
165 |    oParameters.fTask( nCompletedTasks++ );
166 |   } while( nCompletedTasks < nCompletedTasksByTickEnd );
167 | 
168 |   if( nCompletedTasks >= nTasksAllotted || bInterrupt )
169 |   {
170 |    if( bInterrupt == false )
171 |    {
172 |     oParameters.fUponAsyncTaskCompletion();
173 |    }
174 |    clearInterval( iCurrentAsyncTask );
175 |   }
176 |  };
177 |  // Tick once immediately, and then as many times as needed using setInterval
178 |  fTickTask();
179 |  if( nTotalTicks > 1 )
180 |  {
181 |   iCurrentAsyncTask = setInterval( fTickTask, nMillisecondsAllotted / nTotalTicks );
182 |  }
183 | }
184 | 
185 | /* Remove all active topics. */
186 | function fRemoveTopicNodes()
187 | {
188 |  let aTopics = Array.prototype.slice.call( document.getElementsByClassName( "topic" ) );
189 | 
190 |  for( let nTopicsIndex = aTopics.length - 1; nTopicsIndex >= 0; nTopicsIndex--  )
191 |  {
192 |   fRemoveElement( aTopics[ nTopicsIndex ] );
193 |  }
194 | }
195 | /* Remove all Resources */
196 | function fRemoveResourceNodes()
197 | {
198 |  let aResources = Array.prototype.slice.call( document.getElementsByClassName( "resource" ) );
199 |  for( let nResourcesIndex = aResources.length - 1; nResourcesIndex >= 0; nResourcesIndex--  )
200 |  {
201 |   fRemoveElement( aResources[ nResourcesIndex ] );
202 |  }
203 | }
204 | 
205 | /* Copies a record entry (an array made of a dLinks entry) to the stack. */
206 | function fCopyRecordToStack( aRecord )
207 | {
208 |  dResourceStack.insert(
209 |   {
210 |    "sTag" : aRecord[ "sTag" ], "sTagColor" : aRecord[ "sTagColor" ],
211 |    "sSection" : aRecord[ "sSection" ], "sSummary" : aRecord[ "sSummary" ],
212 |    "sURL" : aRecord[ "sURL" ], "sDetails" : aRecord[ "sDetails" ]
213 |   }
214 |  );
215 | }
216 | 
217 | /* Populate the dResourceStack object according to section (handled by menu clicks) */
218 | function fPopulateStackBySection( aSectionNames )
219 | {
220 |  for( let nSectionArrayIndex = 0; nSectionArrayIndex < aSectionNames.length; nSectionArrayIndex++ )
221 |  {
222 |   dLinks( { "sSection" : aSectionNames[ nSectionArrayIndex ] } ).each( function( record, recordnumber )
223 |   {
224 |    fCopyRecordToStack( record );
225 |   } );
226 |  }
227 | }
228 | 
229 | /* Populate dResourceStack with results from search input string. */
230 | function fPopulateStackBySearch( sSearch )
231 | {
232 |  dLinks( function()
233 |  {
234 |   if( this.sSection.includes( sSearch ) || this.sSummary.includes( sSearch ) ||
235 |        this.sDetails.includes( sSearch ) || this.sURL.includes( sSearch ) ||
236 |        this.sTag.includes( sSearch ) )
237 |   {
238 |    return true;
239 |   }
240 |   return false;
241 |  } ).each( function( record, recordnumber )
242 |  {
243 |    fCopyRecordToStack( record );
244 |  } );
245 | }
246 | 
247 | /* After database entries are appended to the site, we add event listeners. */
248 | function fAddAllEventListeners()
249 | {
250 |  let aByClassChapter = document.getElementsByClassName( "chapter" );
251 |  for( let nChapterIndex = 0; nChapterIndex < aByClassChapter.length; nChapterIndex++ )
252 |  {
253 |   aByClassChapter[ nChapterIndex ].addEventListener( "click", fHandleClickChapter, false );
254 |   aByClassChapter[ nChapterIndex ].addEventListener( "keyup", fHandleKeyUpChapter, false );
255 |  }
256 |  let aByClassChapterButtonName = document.getElementsByClassName( "button-chapter-name" );
257 |  for( let nButtonIndex = 0; nButtonIndex < aByClassChapterButtonName.length; nButtonIndex++ )
258 |  {
259 |   fSetNewARIALabel( aByClassChapterButtonName[ nButtonIndex ], "Expand" );
260 |   aByClassChapterButtonName[ nButtonIndex ].addEventListener( "click", fHandleClickChapterButton, false );
261 |  }
262 | }
263 | 
264 | /* Retrieves an array of chapters from the queried topic. */
265 | function fGetChapterArray( sQueriedTopicID )
266 | {
267 |  return dTopics( { "sTopicID" : sQueriedTopicID } ).first().aChapters;
268 | }
269 | 
270 | /* Asynchronously Populates a stack and then populates a topic with the stack. */
271 | function fPopulateTopicWithStack( sQueriedTopicID )
272 | {
273 |  bInterrupt = false;
274 |  var aChaptersFromQuery = fGetChapterArray( sQueriedTopicID );
275 |  fPopulateStackBySection( aChaptersFromQuery );
276 |  nTotalTasks = dResourceStack().count();
277 | 
278 |  fStartAsyncTask(
279 |   { // And supply a bunch of arguments in the form of an object.
280 |    nMillisecondsAllotted: 25,
281 |    nTasksAllotted: nTotalTasks,
282 |    nTasksPerTick: 1,
283 |    fTask: function() // In here we attach a function.
284 |    {
285 |     fAddNewResource();
286 |    },
287 |    fUponAsyncTaskCompletion: function()
288 |    {
289 |     fAddAllEventListeners();
290 |    }
291 |   }
292 |  );
293 | }
294 | 
295 | /* Handled via menu click, make a topic and append chapters to it. */
296 | function fPopulateTopicsViaSection( sQueriedTopicID )
297 | {
298 |  var aChaptersFromQuery = fGetChapterArray( sQueriedTopicID );
299 |  var nChaptersQueryIndex = 0;
300 |  nTotalTasks = aChaptersFromQuery.length;
301 |  bInterrupt = false;
302 | 
303 |  /// Create the topic element.
304 |  let sTopicName = dTopics( { "sTopicID" : sQueriedTopicID } ).first().sTopic;
305 |  var hTopic = fCreateAndAddNewTopic( sQueriedTopicID, sTopicName );
306 | 
307 |  fStartAsyncTask(
308 |   {
309 |    nMillisecondsAllotted: 25,
310 |    nTasksAllotted: nTotalTasks,
311 |    nTasksPerTick: 1,
312 |    fTask: function()
313 |    {
314 |     nChaptersQueryIndex = fAddChapterFromMenu( hTopic, nChaptersQueryIndex, aChaptersFromQuery );
315 |    },
316 |    fUponAsyncTaskCompletion: function()
317 |    {
318 |     hTopic = null;
319 |     fPopulateTopicWithStack( sQueriedTopicID );
320 |    }
321 |   }
322 |  );
323 | }
324 | 
325 | /* Wrapper function for the search function to create topics. */
326 | function fPrepareTopicViaSearch( sQueriedTopicID )
327 | {
328 |  let aChaptersFromQuery = fGetChapterArray( sQueriedTopicID );
329 |  nTotalTasks = aChaptersFromQuery.length;
330 |  bInterrupt = false;
331 |  //let i = 0;
332 | 
333 |  let sTopicName = dTopics( { "sTopicID" : sQueriedTopicID } ).first().sTopic;
334 |  fCreateAndAddNewTopic( sQueriedTopicID, sTopicName );
335 | }
336 | 
337 | /* Using a search term, append topics to the website. */
338 | function fPopulateTopicsViaSearch( nSectionIndex, nTopicsIndex, aSections, aTopics )
339 | {
340 |  let sChapterName = "";
341 |  let sCurrentSection = aSections[ nSectionIndex ];
342 |  let oSelectedTopic = dTopics( function()
343 |   {
344 |    for( let nChaptersIndex = 0; nChaptersIndex < this.aChapters.length; nChaptersIndex++ )
345 |    {
346 |     if( this.aChapters[ nChaptersIndex ][ 0 ] == sCurrentSection )
347 |     {
348 |      sChapterName = this.aChapters[ nChaptersIndex ][ 1 ];
349 |      return true;
350 |     }
351 |    }
352 |    return false;
353 |   }
354 |  ).first();
355 |  let bAlreadyMadeTopic = false;
356 | 
357 |  // This groups the topics into one place.
358 |  for( let nAlreadyTopicsIndex = 0; nAlreadyTopicsIndex < aTopics.length; nAlreadyTopicsIndex++ )
359 |  {
360 |   if( aTopics[ nAlreadyTopicsIndex ] == oSelectedTopic.sTopic )
361 |   {
362 |    nAlreadyTopicsIndex = aSections.length;
363 |    bAlreadyMadeTopic = true;
364 |   }
365 |  }
366 | 
367 |  if( bAlreadyMadeTopic == false )
368 |  {
369 |   aTopics[ nTopicsIndex ] = oSelectedTopic.sTopic;
370 |   nTopicsIndex++;
371 |   fPrepareTopicViaSearch( oSelectedTopic.sTopicID );
372 |  }
373 |  var node_chapter = fCreateNewChapter( aSections[ nSectionIndex ], sChapterName );
374 |  document.getElementById( oSelectedTopic.sTopicID ).appendChild( node_chapter );
375 | 
376 |  return { nSectionIndexValue : nSectionIndex + 1, nTopicsIndexValue: nTopicsIndex };
377 | }
378 | 
379 | 
380 | /* This iterates through all of the appended db elements and removes event listeners. */
381 | function fEraseEventListeners()
382 | {
383 |  let aByClassChapterButtonName = document.getElementsByClassName( "button-chapter-name" );
384 |  for( let nButtonIndex = 0; nButtonIndex < aByClassChapterButtonName.length; nButtonIndex++ )
385 |  {
386 |   aByClassChapterButtonName[ nButtonIndex ].removeEventListener( "click", fHandleClickChapterButton, false );
387 |  }
388 |  let aByClassChapter = document.getElementsByClassName( "chapter" );
389 |  for( let nChapterIndex = 0; nChapterIndex < aByClassChapter.length; nChapterIndex++ )
390 |  {
391 |   aByClassChapter[ nChapterIndex ].removeEventListener( "click", fHandleClickChapter, false );
392 |   aByClassChapter[ nChapterIndex ].removeEventListener( "keyup", fHandleKeyUpChapter, false );
393 |  }
394 |  let aByClassTopic = document.getElementsByClassName( "topic" );
395 |  for( let nTopicIndex = aByClassTopic.length - 1; nTopicIndex >= 0 ; nTopicIndex-- )
396 |  {
397 |   fRemoveElement( aByClassTopic[ nTopicIndex ] );
398 |  }
399 | }
400 | 
401 | /* Wrapper function for erasing event listeners and populating topics. */
402 | function fPopulateViaMenu( sQueriedTopicID )
403 | {
404 |  bInterrupt = true; // First, cancel all existing timers.
405 |  fEraseEventListeners();
406 |  setTimeout( fPopulateTopicsViaSection( sQueriedTopicID ), 26 );
407 | }
408 | 


--------------------------------------------------------------------------------
/fonts/ABeeZee-Regular.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/programnoir/StudyGameDev-website/b94d830b6b32cedf00cdfac16e8bf52515d2e9b8/fonts/ABeeZee-Regular.ttf


--------------------------------------------------------------------------------
/fonts/OFL-ABeeZee.txt:
--------------------------------------------------------------------------------
 1 | Copyright (c) 2011 by Anja Meiners, with Reserved Font Name 'ABeeZee'
 2 | 
 3 | This Font Software is licensed under the SIL Open Font License, Version 1.1.
 4 | This license is copied below, and is also available with a FAQ at:
 5 | http://scripts.sil.org/OFL
 6 | 
 7 | 
 8 | -----------------------------------------------------------
 9 | SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
10 | -----------------------------------------------------------
11 | 
12 | PREAMBLE
13 | The goals of the Open Font License (OFL) are to stimulate worldwide
14 | development of collaborative font projects, to support the font creation
15 | efforts of academic and linguistic communities, and to provide a free and
16 | open framework in which fonts may be shared and improved in partnership
17 | with others.
18 | 
19 | The OFL allows the licensed fonts to be used, studied, modified and
20 | redistributed freely as long as they are not sold by themselves. The
21 | fonts, including any derivative works, can be bundled, embedded, 
22 | redistributed and/or sold with any software provided that any reserved
23 | names are not used by derivative works. The fonts and derivatives,
24 | however, cannot be released under any other type of license. The
25 | requirement for fonts to remain under this license does not apply
26 | to any document created using the fonts or their derivatives.
27 | 
28 | DEFINITIONS
29 | "Font Software" refers to the set of files released by the Copyright
30 | Holder(s) under this license and clearly marked as such. This may
31 | include source files, build scripts and documentation.
32 | 
33 | "Reserved Font Name" refers to any names specified as such after the
34 | copyright statement(s).
35 | 
36 | "Original Version" refers to the collection of Font Software components as
37 | distributed by the Copyright Holder(s).
38 | 
39 | "Modified Version" refers to any derivative made by adding to, deleting,
40 | or substituting -- in part or in whole -- any of the components of the
41 | Original Version, by changing formats or by porting the Font Software to a
42 | new environment.
43 | 
44 | "Author" refers to any designer, engineer, programmer, technical
45 | writer or other person who contributed to the Font Software.
46 | 
47 | PERMISSION & CONDITIONS
48 | Permission is hereby granted, free of charge, to any person obtaining
49 | a copy of the Font Software, to use, study, copy, merge, embed, modify,
50 | redistribute, and sell modified and unmodified copies of the Font
51 | Software, subject to the following conditions:
52 | 
53 | 1) Neither the Font Software nor any of its individual components,
54 | in Original or Modified Versions, may be sold by itself.
55 | 
56 | 2) Original or Modified Versions of the Font Software may be bundled,
57 | redistributed and/or sold with any software, provided that each copy
58 | contains the above copyright notice and this license. These can be
59 | included either as stand-alone text files, human-readable headers or
60 | in the appropriate machine-readable metadata fields within text or
61 | binary files as long as those fields can be easily viewed by the user.
62 | 
63 | 3) No Modified Version of the Font Software may use the Reserved Font
64 | Name(s) unless explicit written permission is granted by the corresponding
65 | Copyright Holder. This restriction only applies to the primary font name as
66 | presented to the users.
67 | 
68 | 4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
69 | Software shall not be used to promote, endorse or advertise any
70 | Modified Version, except to acknowledge the contribution(s) of the
71 | Copyright Holder(s) and the Author(s) or with their explicit written
72 | permission.
73 | 
74 | 5) The Font Software, modified or unmodified, in part or in whole,
75 | must be distributed entirely under this license, and must not be
76 | distributed under any other license. The requirement for fonts to
77 | remain under this license does not apply to any document created
78 | using the Font Software.
79 | 
80 | TERMINATION
81 | This license becomes null and void if any of the above conditions are
82 | not met.
83 | 
84 | DISCLAIMER
85 | THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
86 | EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
87 | MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
88 | OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
89 | COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
90 | INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
91 | DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
92 | FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
93 | OTHER DEALINGS IN THE FONT SOFTWARE.
94 | 


--------------------------------------------------------------------------------
/fonts/OFL-Oswald.txt:
--------------------------------------------------------------------------------
 1 | Copyright 2016 The Oswald Project Authors (https://github.com/googlefonts/OswaldFont)
 2 | 
 3 | This Font Software is licensed under the SIL Open Font License, Version 1.1.
 4 | This license is copied below, and is also available with a FAQ at:
 5 | http://scripts.sil.org/OFL
 6 | 
 7 | 
 8 | -----------------------------------------------------------
 9 | SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
10 | -----------------------------------------------------------
11 | 
12 | PREAMBLE
13 | The goals of the Open Font License (OFL) are to stimulate worldwide
14 | development of collaborative font projects, to support the font creation
15 | efforts of academic and linguistic communities, and to provide a free and
16 | open framework in which fonts may be shared and improved in partnership
17 | with others.
18 | 
19 | The OFL allows the licensed fonts to be used, studied, modified and
20 | redistributed freely as long as they are not sold by themselves. The
21 | fonts, including any derivative works, can be bundled, embedded, 
22 | redistributed and/or sold with any software provided that any reserved
23 | names are not used by derivative works. The fonts and derivatives,
24 | however, cannot be released under any other type of license. The
25 | requirement for fonts to remain under this license does not apply
26 | to any document created using the fonts or their derivatives.
27 | 
28 | DEFINITIONS
29 | "Font Software" refers to the set of files released by the Copyright
30 | Holder(s) under this license and clearly marked as such. This may
31 | include source files, build scripts and documentation.
32 | 
33 | "Reserved Font Name" refers to any names specified as such after the
34 | copyright statement(s).
35 | 
36 | "Original Version" refers to the collection of Font Software components as
37 | distributed by the Copyright Holder(s).
38 | 
39 | "Modified Version" refers to any derivative made by adding to, deleting,
40 | or substituting -- in part or in whole -- any of the components of the
41 | Original Version, by changing formats or by porting the Font Software to a
42 | new environment.
43 | 
44 | "Author" refers to any designer, engineer, programmer, technical
45 | writer or other person who contributed to the Font Software.
46 | 
47 | PERMISSION & CONDITIONS
48 | Permission is hereby granted, free of charge, to any person obtaining
49 | a copy of the Font Software, to use, study, copy, merge, embed, modify,
50 | redistribute, and sell modified and unmodified copies of the Font
51 | Software, subject to the following conditions:
52 | 
53 | 1) Neither the Font Software nor any of its individual components,
54 | in Original or Modified Versions, may be sold by itself.
55 | 
56 | 2) Original or Modified Versions of the Font Software may be bundled,
57 | redistributed and/or sold with any software, provided that each copy
58 | contains the above copyright notice and this license. These can be
59 | included either as stand-alone text files, human-readable headers or
60 | in the appropriate machine-readable metadata fields within text or
61 | binary files as long as those fields can be easily viewed by the user.
62 | 
63 | 3) No Modified Version of the Font Software may use the Reserved Font
64 | Name(s) unless explicit written permission is granted by the corresponding
65 | Copyright Holder. This restriction only applies to the primary font name as
66 | presented to the users.
67 | 
68 | 4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
69 | Software shall not be used to promote, endorse or advertise any
70 | Modified Version, except to acknowledge the contribution(s) of the
71 | Copyright Holder(s) and the Author(s) or with their explicit written
72 | permission.
73 | 
74 | 5) The Font Software, modified or unmodified, in part or in whole,
75 | must be distributed entirely under this license, and must not be
76 | distributed under any other license. The requirement for fonts to
77 | remain under this license does not apply to any document created
78 | using the Font Software.
79 | 
80 | TERMINATION
81 | This license becomes null and void if any of the above conditions are
82 | not met.
83 | 
84 | DISCLAIMER
85 | THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
86 | EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
87 | MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
88 | OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
89 | COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
90 | INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
91 | DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
92 | FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
93 | OTHER DEALINGS IN THE FONT SOFTWARE.
94 | 


--------------------------------------------------------------------------------
/fonts/Oswald-Regular.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/programnoir/StudyGameDev-website/b94d830b6b32cedf00cdfac16e8bf52515d2e9b8/fonts/Oswald-Regular.ttf


--------------------------------------------------------------------------------
/fonts/icomoon.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/programnoir/StudyGameDev-website/b94d830b6b32cedf00cdfac16e8bf52515d2e9b8/fonts/icomoon.eot


--------------------------------------------------------------------------------
/fonts/icomoon.svg:
--------------------------------------------------------------------------------
 1 | <?xml version="1.0" standalone="no"?>
 2 | <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
 3 | <svg xmlns="http://www.w3.org/2000/svg">
 4 | <metadata>Generated by IcoMoon</metadata>
 5 | <defs>
 6 | <font id="icomoon" horiz-adv-x="1024">
 7 | <font-face units-per-em="1024" ascent="960" descent="-64" />
 8 | <missing-glyph horiz-adv-x="1024" />
 9 | <glyph unicode="&#x20;" horiz-adv-x="512" d="" />
10 | <glyph unicode="&#xf00d;" glyph-name="close, remove, times" horiz-adv-x="805" d="M741.714 195.428c0-14.286-5.714-28.571-16-38.857l-77.714-77.714c-10.286-10.286-24.571-16-38.857-16s-28.571 5.714-38.857 16l-168 168-168-168c-10.286-10.286-24.571-16-38.857-16s-28.571 5.714-38.857 16l-77.714 77.714c-10.286 10.286-16 24.571-16 38.857s5.714 28.571 16 38.857l168 168-168 168c-10.286 10.286-16 24.571-16 38.857s5.714 28.571 16 38.857l77.714 77.714c10.286 10.286 24.571 16 38.857 16s28.571-5.714 38.857-16l168-168 168 168c10.286 10.286 24.571 16 38.857 16s28.571-5.714 38.857-16l77.714-77.714c10.286-10.286 16-24.571 16-38.857s-5.714-28.571-16-38.857l-168-168 168-168c10.286-10.286 16-24.571 16-38.857z" />
11 | <glyph unicode="&#xf02b;" glyph-name="tag" horiz-adv-x="866" d="M256 694.857c0 40.571-32.571 73.143-73.143 73.143s-73.143-32.571-73.143-73.143 32.571-73.143 73.143-73.143 73.143 32.571 73.143 73.143zM865.714 365.714c0-19.429-8-38.286-21.143-51.429l-280.571-281.143c-13.714-13.143-32.571-21.143-52-21.143s-38.286 8-51.429 21.143l-408.571 409.143c-29.143 28.571-52 84-52 124.571v237.714c0 40 33.143 73.143 73.143 73.143h237.714c40.571 0 96-22.857 125.143-52l408.571-408c13.143-13.714 21.143-32.571 21.143-52z" />
12 | <glyph unicode="&#xf067;" glyph-name="plus" horiz-adv-x="805" d="M804.571 530.286v-109.714c0-30.286-24.571-54.857-54.857-54.857h-237.714v-237.714c0-30.286-24.571-54.857-54.857-54.857h-109.714c-30.286 0-54.857 24.571-54.857 54.857v237.714h-237.714c-30.286 0-54.857 24.571-54.857 54.857v109.714c0 30.286 24.571 54.857 54.857 54.857h237.714v237.714c0 30.286 24.571 54.857 54.857 54.857h109.714c30.286 0 54.857-24.571 54.857-54.857v-237.714h237.714c30.286 0 54.857-24.571 54.857-54.857z" />
13 | <glyph unicode="&#xf068;" glyph-name="minus" horiz-adv-x="805" d="M804.571 530.286v-109.714c0-30.286-24.571-54.857-54.857-54.857h-694.857c-30.286 0-54.857 24.571-54.857 54.857v109.714c0 30.286 24.571 54.857 54.857 54.857h694.857c30.286 0 54.857-24.571 54.857-54.857z" />
14 | <glyph unicode="&#xf06e;" glyph-name="eye" d="M950.857 402.286c-54.286 84-128.571 156-217.714 201.714 22.857-38.857 34.857-83.429 34.857-128.571 0-141.143-114.857-256-256-256s-256 114.857-256 256c0 45.143 12 89.714 34.857 128.571-89.143-45.714-163.429-117.714-217.714-201.714 97.714-150.857 255.429-256 438.857-256s341.143 105.143 438.857 256zM539.429 621.714c0 14.857-12.571 27.429-27.429 27.429-95.429 0-173.714-78.286-173.714-173.714 0-14.857 12.571-27.429 27.429-27.429s27.429 12.571 27.429 27.429c0 65.143 53.714 118.857 118.857 118.857 14.857 0 27.429 12.571 27.429 27.429zM1024 402.286c0-14.286-4.571-27.429-11.429-39.429-105.143-173.143-297.714-289.714-500.571-289.714s-395.429 117.143-500.571 289.714c-6.857 12-11.429 25.143-11.429 39.429s4.571 27.429 11.429 39.429c105.143 172.571 297.714 289.714 500.571 289.714s395.429-117.143 500.571-289.714c6.857-12 11.429-25.143 11.429-39.429z" />
15 | <glyph unicode="&#xf08e;" glyph-name="external-link" d="M804.571 420.571v-182.857c0-90.857-73.714-164.571-164.571-164.571h-475.429c-90.857 0-164.571 73.714-164.571 164.571v475.429c0 90.857 73.714 164.571 164.571 164.571h402.286c10.286 0 18.286-8 18.286-18.286v-36.571c0-10.286-8-18.286-18.286-18.286h-402.286c-50.286 0-91.429-41.143-91.429-91.429v-475.429c0-50.286 41.143-91.429 91.429-91.429h475.429c50.286 0 91.429 41.143 91.429 91.429v182.857c0 10.286 8 18.286 18.286 18.286h36.571c10.286 0 18.286-8 18.286-18.286zM1024 914.286v-292.571c0-20-16.571-36.571-36.571-36.571-9.714 0-18.857 4-25.714 10.857l-100.571 100.571-372.571-372.571c-3.429-3.429-8.571-5.714-13.143-5.714s-9.714 2.286-13.143 5.714l-65.143 65.143c-3.429 3.429-5.714 8.571-5.714 13.143s2.286 9.714 5.714 13.143l372.571 372.571-100.571 100.571c-6.857 6.857-10.857 16-10.857 25.714 0 20 16.571 36.571 36.571 36.571h292.571c20 0 36.571-16.571 36.571-36.571z" />
16 | <glyph unicode="&#xf0c1;" glyph-name="chain, link" horiz-adv-x="951" d="M832 256c0 14.857-5.714 28.571-16 38.857l-118.857 118.857c-10.286 10.286-24.571 16-38.857 16-16.571 0-29.714-6.286-41.143-18.286 18.857-18.857 41.143-34.857 41.143-64 0-30.286-24.571-54.857-54.857-54.857-29.143 0-45.143 22.286-64 41.143-12-11.429-18.857-24.571-18.857-41.714 0-14.286 5.714-28.571 16-38.857l117.714-118.286c10.286-10.286 24.571-15.429 38.857-15.429s28.571 5.143 38.857 14.857l84 83.429c10.286 10.286 16 24 16 38.286zM430.286 658.857c0 14.286-5.714 28.571-16 38.857l-117.714 118.286c-10.286 10.286-24.571 16-38.857 16s-28.571-5.714-38.857-15.429l-84-83.429c-10.286-10.286-16-24-16-38.286 0-14.857 5.714-28.571 16-38.857l118.857-118.857c10.286-10.286 24.571-15.429 38.857-15.429 16.571 0 29.714 5.714 41.143 17.714-18.857 18.857-41.143 34.857-41.143 64 0 30.286 24.571 54.857 54.857 54.857 29.143 0 45.143-22.286 64-41.143 12 11.429 18.857 24.571 18.857 41.714zM941.714 256c0-43.429-17.714-85.714-48.571-116l-84-83.429c-30.857-30.857-72.571-47.429-116-47.429-44 0-85.714 17.143-116.571 48.571l-117.714 118.286c-30.857 30.857-47.429 72.571-47.429 116 0 45.143 18.286 88 50.286 119.429l-50.286 50.286c-31.429-32-73.714-50.286-118.857-50.286-43.429 0-85.714 17.143-116.571 48l-118.857 118.857c-31.429 31.429-48 72.571-48 116.571 0 43.429 17.714 85.714 48.571 116l84 83.429c30.857 30.857 72.571 47.429 116 47.429 44 0 85.714-17.143 116.571-48.571l117.714-118.286c30.857-30.857 47.429-72.571 47.429-116 0-45.143-18.286-88-50.286-119.429l50.286-50.286c31.429 32 73.714 50.286 118.857 50.286 43.429 0 85.714-17.143 116.571-48l118.857-118.857c31.429-31.429 48-72.571 48-116.571z" />
17 | <glyph unicode="&#xf15c;" glyph-name="file-text" horiz-adv-x="878" d="M838.857 678.857c5.714-5.714 10.857-12.571 16-20.571h-269.714v269.714c8-5.143 14.857-10.286 20.571-16zM566.857 585.143h310.857v-603.429c0-30.286-24.571-54.857-54.857-54.857h-768c-30.286 0-54.857 24.571-54.857 54.857v914.286c0 30.286 24.571 54.857 54.857 54.857h457.143v-310.857c0-30.286 24.571-54.857 54.857-54.857zM658.286 164.571v36.571c0 10.286-8 18.286-18.286 18.286h-402.286c-10.286 0-18.286-8-18.286-18.286v-36.571c0-10.286 8-18.286 18.286-18.286h402.286c10.286 0 18.286 8 18.286 18.286zM658.286 310.857v36.571c0 10.286-8 18.286-18.286 18.286h-402.286c-10.286 0-18.286-8-18.286-18.286v-36.571c0-10.286 8-18.286 18.286-18.286h402.286c10.286 0 18.286 8 18.286 18.286zM658.286 457.143v36.571c0 10.286-8 18.286-18.286 18.286h-402.286c-10.286 0-18.286-8-18.286-18.286v-36.571c0-10.286 8-18.286 18.286-18.286h402.286c10.286 0 18.286 8 18.286 18.286z" />
18 | <glyph unicode="&#xf1a1;" glyph-name="reddit" d="M625.714 284c5.143-5.143 5.143-13.143 0-17.714-32.571-32.571-95.429-35.429-113.714-35.429s-81.143 2.857-113.714 35.429c-5.143 4.571-5.143 12.571 0 17.714 4.571 4.571 12.571 4.571 17.143 0 20.571-21.143 65.143-28 96.571-28s75.429 6.857 96.571 28c4.571 4.571 12.571 4.571 17.143 0zM450.286 387.428c0-28-22.857-50.857-50.857-50.857-28.571 0-51.429 22.857-51.429 50.857 0 28.571 22.857 51.429 51.429 51.429 28 0 50.857-22.857 50.857-51.429zM676 387.428c0-28-22.857-50.857-51.429-50.857-28 0-50.857 22.857-50.857 50.857 0 28.571 22.857 51.429 50.857 51.429 28.571 0 51.429-22.857 51.429-51.429zM819.429 456c0 37.714-30.857 68-68.571 68-19.429 0-36.571-8-49.143-20.571-46.286 32-108.571 52.571-177.714 54.857l36 161.714 114.286-25.714c0-28 22.857-50.857 50.857-50.857 28.571 0 51.429 23.429 51.429 51.429s-22.857 51.429-51.429 51.429c-20 0-37.143-12-45.714-28.571l-126.286 28c-6.286 1.714-12.571-2.857-14.286-9.143l-39.429-178.286c-68.571-2.857-130.286-23.429-176.571-55.429-12.571 13.143-30.286 21.143-49.714 21.143-37.714 0-68.571-30.286-68.571-68 0-27.429 16-50.286 38.857-61.714-2.286-10.286-3.429-21.143-3.429-32 0-108.571 122.286-196.571 272.571-196.571 150.857 0 273.143 88 273.143 196.571 0 10.857-1.143 22.286-4 32.571 22.286 11.429 37.714 34.286 37.714 61.143zM1024 438.857c0-282.857-229.143-512-512-512s-512 229.143-512 512 229.143 512 512 512 512-229.143 512-512z" />
19 | <glyph unicode="&#xf1c1;" glyph-name="file-pdf-o" horiz-adv-x="878" d="M838.857 733.714c21.143-21.143 38.857-63.429 38.857-93.714v-658.286c0-30.286-24.571-54.857-54.857-54.857h-768c-30.286 0-54.857 24.571-54.857 54.857v914.286c0 30.286 24.571 54.857 54.857 54.857h512c30.286 0 72.571-17.714 93.714-38.857zM585.143 873.143v-214.857h214.857c-3.429 9.714-8.571 19.429-12.571 23.429l-178.857 178.857c-4 4-13.714 9.143-23.429 12.571zM804.571 0v585.143h-237.714c-30.286 0-54.857 24.571-54.857 54.857v237.714h-438.857v-877.714h731.429zM510.857 338.857c14.286-11.429 30.286-21.714 48-32 24 2.857 46.286 4 66.857 4 38.286 0 86.857-4.571 101.143-28 4-5.714 7.429-16 1.143-29.714-0.571-0.571-1.143-1.714-1.714-2.286v-0.571c-1.714-10.286-10.286-21.714-40.571-21.714-36.571 0-92 16.571-140 41.714-79.429-8.571-162.857-26.286-224-47.429-58.857-100.571-104-149.714-138.286-149.714-5.714 0-10.857 1.143-16 4l-13.714 6.857c-1.714 0.571-2.286 1.714-3.429 2.857-2.857 2.857-5.143 9.143-3.429 20.571 5.714 26.286 36.571 70.286 107.429 107.429 4.571 2.857 10.286 1.143 13.143-3.429 0.571-0.571 1.143-1.714 1.143-2.286 17.714 29.143 38.286 66.286 61.143 112.571 25.714 51.429 45.714 101.714 59.429 149.714-18.286 62.286-24 126.286-13.714 164 4 14.286 12.571 22.857 24 22.857h12.571c8.571 0 15.429-2.857 20-8.571 6.857-8 8.571-20.571 5.143-38.857-0.571-1.714-1.143-3.429-2.286-4.571 0.571-1.714 0.571-2.857 0.571-4.571v-17.143c-0.571-36-1.143-70.286-8-109.714 20-60 49.714-108.571 83.429-136zM181.714 104c17.143 8 41.714 32.571 78.286 90.286-42.857-33.143-69.714-70.857-78.286-90.286zM409.143 629.714c-5.714-16-5.714-43.429-1.143-75.429 1.714 9.143 2.857 17.714 4 25.143 1.143 9.714 2.857 17.714 4 24.571 0.571 1.714 1.143 2.857 2.286 4.571-0.571 0.571-0.571 1.714-1.143 2.857-0.571 10.286-4 16.571-7.429 20.571 0-1.143-0.571-1.714-0.571-2.286zM338.286 252c50.286 20 106.286 36 162.286 46.286-5.714 4.571-11.429 8.571-16.571 13.143-28 24.571-53.143 58.857-72.571 100.571-10.857-34.857-26.857-72-47.429-112.571-8.571-16-17.143-32-25.714-47.429zM707.429 261.143c-2.857 2.857-17.714 13.714-80 13.714 28-10.286 53.714-16 70.857-16 5.143 0 8 0 10.286 0.571 0 0.571-0.571 1.143-1.143 1.714z" />
20 | </font></defs></svg>


--------------------------------------------------------------------------------
/fonts/icomoon.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/programnoir/StudyGameDev-website/b94d830b6b32cedf00cdfac16e8bf52515d2e9b8/fonts/icomoon.ttf


--------------------------------------------------------------------------------
/fonts/icomoon.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/programnoir/StudyGameDev-website/b94d830b6b32cedf00cdfac16e8bf52515d2e9b8/fonts/icomoon.woff


--------------------------------------------------------------------------------
/gencode.js:
--------------------------------------------------------------------------------
  1 | /*
  2 |  Init:
  3 |   gather all .xc IDs and h2s underneath
  4 |   add each as an option to #section select.
  5 | 
  6 |  Button: Make Code
  7 |   .background-black-alpha -- .open .gen
  8 |   #wrapper-code-generator -- .active, remove tabIndex="-1"
  9 |   focus on h1.
 10 |  Inputs -> Textarea
 11 |   keyup or value change updates textarea.
 12 |  Copy -> Copy
 13 |   copies to clipboard.
 14 |  Exit: Exit Make Code
 15 |   self remove .active, set tabIndex = -1
 16 |   .background-black-alpha clear of classes.
 17 |   focus the button again
 18 | */
 19 | 
 20 | oAwesomeMenu.fCodeGeneratorApplication = ( function()
 21 | {
 22 |  var hCodeGeneratorWrapper = document.getElementById( "wrapper-code-generator" );
 23 | 
 24 |  /// Is child a descendent of parent?
 25 | 
 26 |  function fIsDescendent( hParent, hChild )
 27 |  {
 28 |   var hNode = hChild.parentNode;
 29 |   while( hNode != null )
 30 |   {
 31 |    if( hNode == hParent )
 32 |    {
 33 |     return true;
 34 |    }
 35 |    hNode = hNode.parentNode;
 36 |   }
 37 |   return false;
 38 |  }
 39 | 
 40 |  /// Access enablement and disablement.
 41 | 
 42 |  function fTabScreenReaderOn( hElement )
 43 |  {
 44 |   hElement.removeAttribute("tabindex");
 45 |   hElement.removeAttribute("aria-hidden");
 46 |  }
 47 |  function fTabScreenReaderOff( hElement )
 48 |  {
 49 |   hElement.setAttribute( "tabindex", "-1" );
 50 |   hElement.setAttribute( "aria-hidden", "true" );
 51 |  }
 52 | 
 53 |  /// Populate one of the inputs with options.
 54 | 
 55 |  function fPopulateSectionParameter()
 56 |  {
 57 |   let hSelectSection = document.getElementById( "parameter-select-section" );
 58 |   dTopics().each( function( record, recordNumber )
 59 |    {
 60 |     for( let nTopicArrayIndex = 0; nTopicArrayIndex < record[ "aChapters" ].length; nTopicArrayIndex++ )
 61 |     {
 62 |      let hOption = document.createElement( "option" );
 63 |      hOption.value = record[ "aChapters" ][ nTopicArrayIndex ][ 0 ];
 64 |      hOption.innerHTML = record[ "aChapters" ][ nTopicArrayIndex ][ 1 ];
 65 |      hSelectSection.appendChild( hOption );
 66 |     }
 67 |    }
 68 |   );
 69 |  }
 70 | 
 71 |  /// Creates a generated string of code to use in db.js.
 72 | 
 73 |  function fCreateCodeString()
 74 |  {
 75 |   let sCode = "dLinks.insert( { \"sSection\" : \"";
 76 |   sCode += document.getElementById( "parameter-select-section" ).value;
 77 |   sCode += "\", \"sTag\" : \"";
 78 |   var aTagValues = document.getElementById( "parameter-select-tag" ).value.split(",");
 79 |   sCode += aTagValues[ 1 ];
 80 |   sCode += "\", \"sTagColor\" : \"";
 81 |   sCode += aTagValues[ 0 ];
 82 |   sCode += "\",\n \"sURL\"     : \"";
 83 |   sCode += document.getElementById( "parameter-resource-url" ).value;
 84 |   sCode += "\",\n \"sSummary\" : \"";
 85 |   sCode += document.getElementById( "parameter-resource-summary" ).value;
 86 |   sCode += "\",\n \"sDetails\" : \"";
 87 |   sCode += document.getElementById( "parameter-resource-details" ).value;
 88 |   sCode += "\"\n} );";
 89 |   return sCode;
 90 |  }
 91 | 
 92 |  /// Utilize the fCreateCodeString function to update it.
 93 | 
 94 |  function fUpdateOutputText()
 95 |  {
 96 |   document.getElementById( "text-output-code-generator" ).value = fCreateCodeString();
 97 |  }
 98 | 
 99 |  /// Close the code generation dialog.
100 | 
101 |  function fCloseCodeGenerator()
102 |  {
103 |   if( document.getElementById( "background-black-alpha" ).classList.contains( "state-code-generator" ) )
104 |   {
105 |    document.getElementById( "background-black-alpha" ).classList.remove( "state-open" );
106 |    document.getElementById( "background-black-alpha" ).classList.remove( "state-code-generator" );
107 |    document.getElementById( "wrapper-code-generator" ).classList.remove( "state-active" );
108 |    fTabScreenReaderOff( hCodeGeneratorWrapper );
109 | 
110 |    let aByClassFocusableFields = hCodeGeneratorWrapper.getElementsByClassName("group-focusable-code-generator");
111 |    for( var nFocusableFieldsIndex = 0; nFocusableFieldsIndex < aByClassFocusableFields.length; nFocusableFieldsIndex++ )
112 |    {
113 |     fTabScreenReaderOff( aByClassFocusableFields[ nFocusableFieldsIndex ] );
114 |    }
115 |    document.getElementById( "button-code-generator" ).focus();
116 |   }
117 |  }
118 | 
119 |  function fEventBlueCodeGenerator( hEvent )
120 |  {
121 |   setTimeout( function()
122 |   {
123 |    if( fIsDescendent( hCodeGeneratorWrapper, document.activeElement ) == false )
124 |    {
125 |     if( document.activeElement == document.body )
126 |     { // The mouse was probably clicked.
127 |      return;
128 |     }
129 |     fCloseCodeGenerator();
130 |    }
131 |   }, 100 );
132 |  }
133 | 
134 |  /// Assign multiple event listeners at once.
135 | 
136 |  function fApplyEventListeners()
137 |  {
138 |   document.getElementById( "button-code-generator" ).addEventListener( "click", function()
139 |   {
140 |    document.getElementById( "background-black-alpha" ).classList.add( "state-open" );
141 |    document.getElementById( "background-black-alpha" ).classList.add( "state-code-generator" );
142 |    document.getElementById( "wrapper-code-generator" ).classList.add( "state-active" );
143 |    fTabScreenReaderOn( hCodeGeneratorWrapper );
144 | 
145 |    let aByClassFocusableFields = hCodeGeneratorWrapper.getElementsByClassName("group-focusable-code-generator");
146 |    for( var nFocusableFieldsIndex = 0; nFocusableFieldsIndex < aByClassFocusableFields.length; nFocusableFieldsIndex++ )
147 |    {
148 |     fTabScreenReaderOn( aByClassFocusableFields[ nFocusableFieldsIndex ] );
149 |    }
150 |    document.getElementById( "text-code-generator-title" ).setAttribute( "tabIndex", "0" );
151 |    document.getElementById( "text-code-generator-title" ).focus();
152 |   }, false );
153 | 
154 |   let aByClassLineInput = document.getElementsByClassName("form-line-input-code-generator");
155 |   for( var nLineInputsIndex = 0; nLineInputsIndex < aByClassLineInput.length; nLineInputsIndex++ )
156 |   {
157 |    aByClassLineInput[ nLineInputsIndex ].addEventListener( "keyup", fUpdateOutputText, false );
158 |   }
159 | 
160 |   let aByClassSelect = document.getElementsByClassName("form-select-code-generator");
161 |   for( var nSelectsIndex = 0; nSelectsIndex < aByClassSelect.length; nSelectsIndex++ )
162 |   {
163 |    aByClassSelect[ nSelectsIndex ].addEventListener( "change", fUpdateOutputText, false );
164 |   }
165 | 
166 |   let hCopyButton = document.getElementById('button-code-generator-copy-output');
167 |   hCopyButton.addEventListener( "click", function( hEvent )
168 |    { // Copy button
169 |     document.getElementById( "text-output-code-generator" ).select();
170 |     document.execCommand( "copy" );
171 |    }
172 |   );
173 | 
174 |   document.getElementById( "text-code-generator-title" ).addEventListener( "blur", fEventBlueCodeGenerator, false );
175 |   document.getElementById( "button-code-generator-close" ).addEventListener( "blur", fEventBlueCodeGenerator, false );
176 |   document.getElementById( "button-code-generator-close" ).addEventListener( "click", fCloseCodeGenerator, false );
177 |   document.getElementById( "background-black-alpha" ).addEventListener( "click", fCloseCodeGenerator, false );
178 |  }
179 | 
180 |  function fInitApplication()
181 |  {
182 |   fPopulateSectionParameter();
183 |   fApplyEventListeners();
184 |   fTabScreenReaderOff( hCodeGeneratorWrapper );
185 | 
186 |   let aByClassFocusableFields = hCodeGeneratorWrapper.getElementsByClassName("group-focusable-code-generator");
187 |   for( let nFocusableFieldsIndex = 0; nFocusableFieldsIndex < aByClassFocusableFields.length; nFocusableFieldsIndex++ )
188 |   {
189 |    fTabScreenReaderOff( aByClassFocusableFields[ nFocusableFieldsIndex ] );
190 |   }
191 |  }
192 | 
193 |  return {
194 |   init: function()
195 |   {
196 |    fInitApplication();
197 |   }
198 |  };
199 | })();
200 | 
201 | window.addEventListener( "load", function()
202 | {
203 |  new oAwesomeMenu.fCodeGeneratorApplication.init();
204 | });
205 | 


--------------------------------------------------------------------------------
/index.php:
--------------------------------------------------------------------------------
  1 | <html lang="en" prefix="og: http://ogp.me/ns#">
  2 |  <head>
  3 |   <title>Study Game Development</title>
  4 |   <link href="https://www.studygamedev.com/" rel="canonical"/>
  5 |   <link href="https://www.studygamedev.com/" rel="shortlink"/>
  6 |   <meta charset="UTF-8"/>
  7 |   <link href="./style.css" media="screen, speech" rel="stylesheet"/>
  8 |   <meta name="description" content="Study game development online in fields such as programming, writing, sound effects, music, art, 3D models, design, user experience, quality assurance, production, marketing, finances, and management."/>
  9 |   <meta property="og:type" content="website"/>
 10 |   <meta property="og:locale" content="en_US"/>
 11 |   <meta property="og:title" content="Study Game Development - Learn Online"/>
 12 |   <meta property="og:description" content="Study game development online in fields such as programming, writing, sound effects, music, art, 3D models, design, user experience, quality assurance, production, marketing, finances, and management."/>
 13 |   <meta property="og:url" content="https://www.studygamedev.com/"/>
 14 |   <meta property="og:image" content="https://www.studygamedev.com/i/meta.png">
 15 |   <meta property="og:site_name" content="Study Game Dev"/>
 16 |   <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"/>
 17 |   <link href="" rel="shortcut icon"/>
 18 |  </head>
 19 |  <body class="setting-theme-dark">
 20 |   <div id="setting-unfolding-marker"></div>
 21 |   <nav id="wrapper-button-menu-closed" role="navigation">
 22 |    <button id="button-main-menu" aria-controls="wrapper-main-menu" aria-haspopup="menu" type="button">
 23 |     <span class="icon-main-menu" aria-hidden="true">
 24 |      <svg version="1.1" viewBox="0 0 50 37" height="37px" width="50px" x="0px" y="0px">
 25 |       <rect height="5" width="20" x="5" y="10"/>
 26 |       <rect height="5" width="20" x="25" y="10"/>
 27 |       <rect height="5" width="20" x="5" y="22"/>
 28 |       <rect height="5" width="20" x="25" y="22"/>
 29 |      </svg>
 30 |     </span>
 31 |     Menu
 32 |    </button>
 33 |   </nav>
 34 |   <input id="line-input-search" placeholder="🔎 Search..." type="text">
 35 |   <header role="banner">
 36 |    <h1 id="text-site-title"><a aria-label="Header Title" data-char="StudyGameDev" href="#" tabindex="1">StudyGameDev</a></h1>
 37 |   </header>
 38 | 
 39 |   <div id="background-black-alpha"></div>
 40 | 
 41 |   <nav id="wrapper-main-menu" aria-label="Main" role="dialog">
 42 |    <nav id="wrapper-button-menu-open"></nav>
 43 |    <ul role="menu">
 44 |     <li role="menuitem" tabindex="-1">
 45 |      <button id="button-settings-accessibility" aria-controls="wrapper-settings-accessibility" aria-haspopup="menu" aria-label="Open the accessibilities settings" type="button">Accessibility</button>
 46 |     </li>
 47 |     <li role="menuitem" tabindex="-1">
 48 |      <a class="icon-external-link" href="https://github.com/nitronova/StudyGameDev.com/">Github Page</a>
 49 |     </li>
 50 |     <li role="menuitem" tabindex="-1">
 51 |      <a class="icon-external-link" href="https://twitter.com/nitro_nova">My Twitter</a>
 52 |     </li>
 53 |     <li class="wrapper-submenu-parent" role="menuitem" tabindex="-1">
 54 |      <button id="button-submenu-programming" class="button-toggle-submenu red" aria-controls="submenu-programming" aria-haspopup="menu" type="button">Programming</button>
 55 |      <ul id="submenu-programming" tabindex="-1">
 56 |       <li><a href="#" to="prog-intro">Intro to Programming</a></li>
 57 |       <li><a href="#" to="prog-c">Learn C</a></li>
 58 |       <li><a href="#" to="prog-c-sharp">Learn C#</a></li>
 59 |       <li><a href="#" to="prog-lua">Learn Lua</a></li>
 60 |       <li><a href="#" to="prog-eng-love2d">Love2D (Lua)</a></li>
 61 |       <li><a href="#" to="prog-eng-godot">Godot (GDScript)</a></li>
 62 |      </ul>
 63 |     </li>
 64 |     <li class="wrapper-submenu-parent" role="menuitem" tabindex="-1">
 65 |      <button id="button-submenu-writing" class="button-toggle-submenu scarlet" aria-controls="submenu-writing" aria-haspopup="menu" type="button">Writing</button>
 66 |      <ul id="submenu-writing" tabindex="-1">
 67 |       <li><a href="#" to="writ-intro">Intro to Writing</a></li>
 68 |       <li><a href="#" to="writ-worldbuilding">Worldbuilding</a></li>
 69 |      </ul>
 70 |     </li>
 71 |     <li class="wrapper-submenu-parent" role="menuitem" tabindex="-1">
 72 |      <button id="button-submenu-sound-design" class="button-toggle-submenu orange" aria-controls="submenu-sound-design" aria-haspopup="menu" type="button">Sound Design</button>
 73 |      <ul id="submenu-sound-design" tabindex="-1">
 74 |       <li><a href="#" to="sd-intro">Intro to Sound Design</a></li>
 75 |       <li><a href="#" to="sd-fundamentals">Fundamentals of Audio</a></li>
 76 |       <li><a href="#" to="sd-recording">Recording Techniques</a></li>
 77 |       <li><a href="#" to="sd-processing">Processing Techniques</a></li>
 78 |      </ul>
 79 |     </li>
 80 |     <li class="wrapper-submenu-parent" role="menuitem" tabindex="-1">
 81 |      <button id="button-submenu-music-production" class="button-toggle-submenu yellow" aria-controls="submenu-music-production" aria-haspopup="menu" type="button">Music Production</button>
 82 |      <ul id="submenu-music-production" tabindex="-1">
 83 |       <li><a href="#" to="mp-intro">Intro to Music Production</a></li>
 84 |       <li><a href="#" to="mp-music-theory">Music Theory</a></li>
 85 |       <li><a href="#" to="mp-tracking-stage">Tracking Stage</a></li>
 86 |       <li><a href="#" to="mp-mixing-stage">Mixing and Mastering</a></li>
 87 |       <li><a href="#" to="mp-applications">Applications of Video Game Music</a></li>
 88 |      </ul>
 89 |     </li>
 90 |     <li class="wrapper-submenu-parent" role="menuitem" tabindex="-1">
 91 |      <button id="button-submenu-art" class="button-toggle-submenu lime" aria-controls="submenu-art" aria-haspopup="menu" type="button">Art</button>
 92 |      <ul id="submenu-art" tabindex="-1">
 93 |       <li><a href="#" to="art-intro">Intro to Art</a></li>
 94 |       <li><a href="#" to="art-fundamentals-topic">Art Fundamentals</a></li>
 95 |       <li><a href="#" to="art-human-anatomy-topic">Human Anatomy</a></li>
 96 |       <li><a href="#" to="art-drawing">Drawing Other Things</a></li>
 97 |       <li><a href="#" to="art-specializations">Types of Artists</a></li>
 98 |       <li><a href="#" to="art-animation">2D Animation</a></li>
 99 |      </ul>
100 |     </li>
101 |     <li class="wrapper-submenu-parent" role="menuitem" tabindex="-1">
102 |      <button type="button" id="button-submenu-3d-modelling" aria-controls="submenu-3d-modelling" aria-haspopup="menu" class="button-toggle-submenu green">3D Modelling</button>
103 |      <ul id="submenu-3d-modelling" tabindex="-1">
104 |       <li><a href="#" to="3d-intro">Intro to 3D</a></li>
105 |       <li><a href="#" to="3d-softwares">3D Software</a></li>
106 |       <li><a href="#" to="3d-blender">Blender</a></li>
107 |       <li><a href="#" to="3d-animation-topic">3D Animation</a></li>
108 |      </ul>
109 |     </li>
110 |     <li class="wrapper-submenu-parent" role="menuitem" tabindex="-1">
111 |      <button id="button-submenu-design" class="button-toggle-submenu turquoise" aria-controls="submenu-design" aria-haspopup="menu" type="button">Design</button>
112 |      <ul id="submenu-design" tabindex="-1">
113 |       <li><a href="#" to="gd-intro">Intro to Design</a></li>
114 |      </ul>
115 |     </li>
116 |     <li class="wrapper-submenu-parent" role="menuitem" tabindex="-1">
117 |      <button id="button-submenu-user-experience" class="button-toggle-submenu skyblue" aria-controls="submenu-user-experience" aria-haspopup="menu" type="button">User Experience</button>
118 |      <ul id="submenu-user-experience" tabindex="-1">
119 |       <li><a href="#" to="ux-intro">Intro to UX</a></li>
120 |       <li><a href="#" to="ux-menus">User-Friendly Menus</a></li>
121 |      </ul>
122 |     </li>
123 |     <li class="wrapper-submenu-parent" role="menuitem" tabindex="-1">
124 |      <button id="button-submenu-quality-assurance" class="button-toggle-submenu cobalt" aria-controls="submenu-quality-assurance" aria-haspopup="menu" type="button">Quality Assurance</button>
125 |      <ul id="submenu-quality-assurance" tabindex="-1">
126 |       <li><a href="#" to="qa-intro">Intro to QA</a></li>
127 |       <li><a href="#" to="qa-techniques">Testing Techniques</a></li>
128 |      </ul>
129 |     </li>
130 |     <li class="wrapper-submenu-parent" role="menuitem" tabindex="-1">
131 |      <button id="button-submenu-production-management" class="button-toggle-submenu blue" aria-controls="submenu-production-management" aria-haspopup="menu" type="button">Production & Management</button>
132 |      <ul id="submenu-production-management" tabindex="-1">
133 |       <li><a href="#" to="ppm-intro">Intro to Production & Management</a></li>
134 |       <li><a href="#" to="ppm-documentation">Documentation</a></li>
135 |      </ul>
136 |     </li>
137 |     <li class="wrapper-submenu-parent" role="menuitem" tabindex="-1">
138 |      <button id="button-submenu-marketing" class="button-toggle-submenu purple" aria-controls="submenu-marketing" aria-haspopup="menu" type="button">Marketing</button>
139 |      <ul id="submenu-marketing" tabindex="-1">
140 |       <li><a href="#" to="mkt-intro">Intro to Marketing</a></li>
141 |       <li><a href="#" to="mkt-inbound">Inbound Marketing</a></li>
142 |       <li><a href="#" to="mkt-outbound">Outbound Marketing</a></li>
143 |      </ul>
144 |     </li>
145 |     <li class="wrapper-submenu-parent" role="menuitem" tabindex="-1">
146 |      <button id="button-submenu-finance" class="button-toggle-submenu violet" aria-controls="submenu-finance" aria-haspopup="menu" type="button">Finance</button>
147 |      <ul id="submenu-finance" tabindex="-1">
148 |       <li><a href="#" to="fm-intro">Intro to Finance</a></li>
149 |       <li><a href="#" to="fm-logistics-projections">Logistics & Projections</a></li>
150 |       <li><a href="#" to="fm-taxes">Business Taxes</a></li>
151 |      </ul>
152 |     </li>
153 |     <li class="wrapper-submenu-parent" role="menuitem" tabindex="-1">
154 |      <button id="button-submenu-biz-legal" class="button-toggle-submenu rose" aria-controls="submenu-biz-legal" aria-haspopup="menu" type="button">Business & Legal</button>
155 |      <ul id="submenu-biz-legal" tabindex="-1">
156 |       <li><a href="#" to="bl-intro">Intro to Business & Law</a></li>
157 |       <li><a href="#" to="bl-start">Starting a Business</a></li>
158 |       <li><a href="#" to="bl-labor">Labor & Safety</a></li>
159 |      </ul>
160 |     </li>
161 |    </ul>
162 |   </nav>
163 | 
164 |   <form id="wrapper-settings-accessibility" aria-describedby="text-accessibility-settings-description" aria-labelledby="text-accessibility-settings-title" role="dialog" tabindex="-1">
165 |    <h2 id="text-accessibility-settings-title">Accessibility Controls</h2>
166 |    <p id="text-accessibility-settings-description">Enhance your experience on the site by operating the settings in the menu below.</p>
167 |    <p>This site is keyboard-navigable. Combining the ctrl key with z or slash will bookmark your spot and jump to the navigation menu. Use tab, shift-tab, and space to navigate the menu (it is screen reader compatible).
168 |        Once you hit Save, you will be opted in for a cookie file that saves your settings for next time you browse the website.</p>
169 |    <ul role="menu" tabindex="-1">
170 |     <li role="menuitem" tabindex="-1">
171 |      <label for="setting-theme">Theme</label>
172 |      <select id="setting-theme" name="setting-theme">
173 |       <option value="setting-theme-dark">Dark theme</option>
174 |       <option value="setting-theme-bright">Bright theme</option>
175 |      </select>
176 |     </li>
177 |     <li role="menuitem" tabindex="-1">
178 |      <label for="setting-font-size">Font Size</label>
179 |      <select id="setting-font-size">
180 |       <option value="setting-font-default">Default</option>
181 |       <option value="setting-font-larger">Larger</option>
182 |       <option value="setting-font-largest">Largest</option>
183 |      </select>
184 |     </li>
185 |     <li role="menuitem" tabindex="-1">
186 |      <input id="setting-content-unfold" name="setting-content-unfold" type="checkbox" value="setting-content-unfolded">
187 |      <label for="setting-content-unfold">Display All Content Unfolded (note: this can make the site less accessible.)</label>
188 |     </li>
189 |     <li role="menuitem" id="wrapper-accessibility-save-exit" tabindex="-1">
190 |      <button id="button-settings-accessibility-save" aria-label="Save your accessibilities settings." type="button">Save</button>
191 |      <button id="button-settings-accessibility-close" aria-label="Close the accessibilities settings dialog and return to the navigation menu." type="button">Exit</button>
192 |     </li>
193 |    </ul>
194 |   </form>
195 |   <form id="wrapper-code-generator" aria-describedby="text-code-generator-description" aria-hidden="true" aria-labelledby="text-code-generator-title" role="dialog" tabindex="-1">
196 |    <h3 id="text-code-generator-title" class="group-focusable-code-generator">Generate a Code that can be used in db.js</h3>
197 |    <p id="text-code-generator-description">This is for developer use, but please do send codes to my Twitter!</p>
198 |    <div class="wrapper-layout-half-left">
199 |     <ul role="menu" tabindex="-1">
200 |      <li role="menu-item" tabindex="-1">
201 |       <label for="parameter-select-section">Information Category</label>
202 |       <select id="parameter-select-section" class="form-select-code-generator group-focusable-code-generator"></select>
203 |      </li>
204 |      <li role="menu-item" tabindex="-1">
205 |       <label for="parameter-select-tag">Content Type</label>
206 |       <select id="parameter-select-tag" class="form-select-code-generator group-focusable-code-generator">
207 |        <option value="orange,Article">Article</option>
208 |        <option value="green,Book">Book</option>
209 |        <option value="yellow,Channel">Channel</option>
210 |        <option value="scarlet,Code">Code</option>
211 |        <option value="blue,Course">Course</option>
212 |        <option value="purple,Download">Download</option>
213 |        <option value="red,Graphic">Graphic</option>
214 |        <option value="orange,List">List</option>
215 |        <option value="green,Online Manual">Online Manual</option>
216 |        <option value="green,PDF">PDF</option>
217 |        <option value="red,Playlist">Playlist</option>
218 |        <option value="scarlet,Podcast">Podcast</option>
219 |        <option value="purple,Software">Software</option>
220 |        <option value="purple,Supplies">Supplies</option>
221 |        <option value="red,Video">Video</option>
222 |        <option value="yellow,Website">Website</option>
223 |        <option value="yellow,Wiki">Wiki</option>
224 |        <option value="blue,Udemy">Udemy</option>
225 |       </select>
226 |      </li>
227 |      <li role="menu-item" tabindex="-1">
228 |       <label for="parameter-resource-url">Content Source</label>
229 |       <input id="parameter-resource-url" class="form-line-input-code-generator group-focusable-code-generator" placeholder="https://..." type="text">
230 |      </li>
231 |      <li role="menu-item" tabindex="-1">
232 |       <label for="parameter-resource-summary">Content Summary</label>
233 |       <input id="parameter-resource-summary" class="form-line-input-code-generator group-focusable-code-generator" placeholder="Short summary of item." type="text">
234 |      </li>
235 |      <li role="menu-item" tabindex="-1">
236 |       <label for="parameter-resource-details">Content Details</label>
237 |       <input id="parameter-resource-details" class="form-line-input-code-generator group-focusable-code-generator" placeholder="Longer explanation of the item." type="text">
238 |      </li>
239 |     </ul>
240 |    </div>
241 |    <ul role="menu" tabindex="-1">
242 |     <li role="menu-item" tabindex="-1">
243 |      <label for="text-output-code-generator">Generated code:</label>
244 |      <textarea id="text-output-code-generator" class="group-focusable-code-generator"></textarea>
245 |     </li>
246 |     <li role="menu-item" tabindex="-1">
247 |      <button id="button-code-generator-copy-output" class="group-focusable-code-generator" type="button">Copy code</button>
248 |      <button id="button-code-generator-close" class="group-focusable-code-generator" type="button">Exit code generator</button>
249 |     </li>
250 |    </ul>
251 |   </form>
252 | 
253 |   <main id="wrapper-main-site-content" role="main">
254 |    <div id="wrapper-resource-content"></div>
255 |    <div id="wrapper-home-page-content">
256 |     <h2>Study one of many fields of game development.</h2>
257 |     <p>We list resources that explain topics of game development. Under each category, we try to arrange information in an academic order. There are a lot of resources to dive into, here, so let's get you started with a few recommended subjects.</p>
258 |     <p>These resources are coming soon, stay tuned while we continue to populate the site.</p>
259 |     <p id="text-recommended-topics">
260 |      <a class="red" href="#" to="prog-eng-godot">Learn GDScript</a>
261 |      <a class="scarlet" href="#" to="writ-worldbuilding">Worldbuilding</a>
262 |      <a class="orange" href="#" to="sd-recording">Recording Techniques</a>
263 |      <a class="yellow" href="#" to="mp-music-theory">Music Theory</a>
264 |      <a class="lime" href="#" to="art-intro">How to Draw</a>
265 |      <a class="green" href="#" to="3d-blender">Learn Blender 3D</a>
266 |      <a class="turquoise" href="#" to="gd-intro">Game Design</a>
267 |      <a class="skyblue" href="#" to="ux-menus">User-Friendliness</a>
268 |      <a class="cobalt" href="#" to="qa-intro">Game Testing</a>
269 |      <a class="blue" href="#" to="ppm-documentation">Design Documents</a>
270 |      <a class="purple" href="#" to="mkt-inbound">Market Research</a>
271 |      <a class="violet" href="#" to="fm-taxes">Business Taxes</a>
272 |      <a class="rose" href="#" to="bl-start">Starting a Business</a>
273 |     </p>
274 |    </div>
275 |   </main>
276 |   <div id="dynamic-loading-bar" class="loading-complete" loading="0"></div>
277 |   <button id="button-code-generator" aria-controls="wrapper-code-generator" aria-haspopup="menu" aria-label="Open the dialog for generating content codes" type="button">Make<br/>Code</button>
278 |   <script defer src="./section-toggle.js" type="text/javascript"></script>
279 |   <script defer src="./taffy-min.js" type="text/javascript"></script>
280 |   <script defer src="./db-init.js" type="text/javascript"></script>
281 |   <script defer src="./db-populate.js" type="text/javascript"></script>
282 |   <script defer src="./awesome-menu.js" type="text/javascript"></script>
283 |   <script defer src="./gencode.js" type="text/javascript"></script>
284 |   <script defer src="./search.js" type="text/javascript"></script>
285 |  </body>
286 | </html>
287 | 


--------------------------------------------------------------------------------
/licenses/license-taffydb.txt:
--------------------------------------------------------------------------------
1 | Copyright 2018 joe@taffydb.com
2 | 
3 | Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
4 | 
5 | The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
6 | 
7 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
8 | 


--------------------------------------------------------------------------------
/licenses/public-domain-studygamedev.txt:
--------------------------------------------------------------------------------
1 | taffy-min.js, developed by joe@taffydb.com and created by Ian Smith, is licensed under the MIT license.
2 | 
3 | I, nitronova, the developer of the remainder of the StudyGameDev project, release the remaining code into the public domain.
4 | 


--------------------------------------------------------------------------------
/search.js:
--------------------------------------------------------------------------------
  1 | var hSearch = document.getElementById( "line-input-search" );
  2 | var sSavedChapter = null;
  3 | var sSearchQuery = "";
  4 | var iSearchTimer = null;
  5 | 
  6 | 
  7 | function fNewSearch()
  8 | {
  9 |  fEraseEventListeners(); // Erases event listeners and resource nodes.
 10 |  fRemoveResourceNodes();
 11 |  fRemoveTopicNodes();
 12 |  fClearDResourceStack();
 13 | 
 14 |  sSavedChapter = document.getElementsByClassName( "topic" );
 15 |  if( sSavedChapter.length == 0 )
 16 |  {
 17 |   sSavedChapter = null;
 18 |  }
 19 |  else
 20 |  {
 21 |   sSavedChapter = document.getElementsByClassName( "topic" )[0].id;
 22 |  }
 23 | 
 24 |  fPopulateStackBySearch( sSearchQuery );
 25 | 
 26 |  let aDistinctQueriedChapters = dResourceStack().distinct( "sSection" ); // This gets an array of refs sections.
 27 | 
 28 |   // Now I just need topics.
 29 |  let aQuerysTopics = [];
 30 |  let nQuerysTopicsIndex = 0;
 31 |  nTotalTasks = aDistinctQueriedChapters.length;
 32 |  let nSectionIndexValue = 0;
 33 | 
 34 |  fStartAsyncTask(
 35 |   { // And supply a bunch of arguments in the form of an object.
 36 |    nMillisecondsAllotted: 25,
 37 |    nTasksAllotted: nTotalTasks,
 38 |    nTasksPerTick: 1,
 39 |    fTask: function() // In here we attach a function.
 40 |    {
 41 |     let oSectionsTopicsIndices = fPopulateTopicsViaSearch( nSectionIndexValue, nQuerysTopicsIndex, aDistinctQueriedChapters, aQuerysTopics );
 42 |     nSectionIndexValue = oSectionsTopicsIndices.nSectionIndexValue;
 43 |     nQuerysTopicsIndex = oSectionsTopicsIndices.nTopicsIndexValue;
 44 |     oSectionsTopicsIndices = null;
 45 |    },
 46 |    fUponAsyncTaskCompletion: function()
 47 |    {
 48 |     nTotalTasks = dResourceStack().count();
 49 |     fStartAsyncTask(
 50 |     { // And supply a bunch of arguments in the form of an object.
 51 |      nMillisecondsAllotted: 25,
 52 |      nTasksAllotted: nTotalTasks,
 53 |      nTasksPerTick: 1,
 54 |      fTask: function() // In here we attach a function.
 55 |      {
 56 |       fAddNewResource();
 57 |      },
 58 |      fUponAsyncTaskCompletion: function()
 59 |      {
 60 |       fAddAllEventListeners();
 61 |      }
 62 |     }
 63 |    );
 64 |   }
 65 |  }
 66 |  );
 67 | }
 68 | 
 69 | 
 70 | /// Called when the search box is empty.
 71 | function fHandleSearchEmpty()
 72 | {
 73 |  // First, we eliminate all resource nodes.
 74 |  fEraseEventListeners(); // Erases event listeners and resource nodes.
 75 |  fRemoveResourceNodes();
 76 |  fRemoveTopicNodes();
 77 |  fClearDResourceStack();
 78 |  // Next, we check if we have saved a section.
 79 |  // If there is one, we load that node.
 80 |  if( sSavedChapter == null )
 81 |  {
 82 |   return;
 83 |  }
 84 |  setTimeout( function()
 85 |  {
 86 |   fPopulateTopicsViaSection( sSavedChapter );
 87 |   sSavedChapter = null;
 88 |  }, 26 );
 89 | }
 90 | 
 91 | /// fHandleSearchInput is the main processor of the search functions.
 92 | function fHandleSearchInput()
 93 | {
 94 |  /// First, we need a iSearchTimer before we process all of these for loops.
 95 | 
 96 |  // Compare the strings.
 97 |  let sSearchValue = hSearch.value.toLowerCase();
 98 | 
 99 |  if( sSearchValue == sSearchQuery || ( sSearchValue.length > 0 && sSearchValue.length < 4 ) )
100 |  {
101 |   return;
102 |  }
103 |  sSearchQuery = sSearchValue;
104 |  if( sSearchValue == "" )
105 |  {
106 |   // If we have completely cleared the input, we need to revert to normal.
107 |   clearTimeout(iSearchTimer);
108 |   fHandleSearchEmpty();
109 |   return;
110 |  }
111 | 
112 |  // Otherwise, we need to check the iSearchTimer. If it is null, we start one.
113 |  if( iSearchTimer != null )
114 |  {
115 |   clearTimeout( iSearchTimer ); // Only counts down until we have a search result.
116 |  }
117 | 
118 |  iSearchTimer = setTimeout( fNewSearch, 2000 );
119 | 
120 | }
121 | 
122 | hSearch.addEventListener( "keyup", fHandleSearchInput );
123 | 


--------------------------------------------------------------------------------
/section-toggle.js:
--------------------------------------------------------------------------------
  1 | /*
  2 |  on button click, it toggles its own css class.
  3 |  css class toggle means .desc is no longer hidden.
  4 |  but wait, some screen reader users have vision.
  5 | */
  6 | var kConfirm = { 13: 1, 32: 1 };
  7 | 
  8 | /* Resets the ARIA label for the specified topic/chapter/resource. */
  9 | function fSetNewARIALabel( hRelabeledElement, sReplacementLabel )
 10 | {
 11 |  sReplacementLabel += " the ";
 12 |  sReplacementLabel += hRelabeledElement.textContent || hRelabeledElement.innerText;
 13 |  sReplacementLabel += " details";
 14 |  hRelabeledElement.setAttribute( "aria-label", sReplacementLabel );
 15 | }
 16 | 
 17 | /* Toggles the folding of a topic/chapter/resource. */
 18 | function fToggleFoldingTopicChapterResource( hElement )
 19 | {
 20 |  let sNewARIALabel = "";
 21 |  if( hElement.classList.contains( "state-open" ) )
 22 |  {
 23 |   hElement.classList.remove( "state-open" );
 24 |   if( hElement.classList.contains( "button-chapter-name" ) )
 25 |   {
 26 |    hElement.parentNode.classList.remove( "state-open" );
 27 |   }
 28 |   else if( hElement.classList.contains( "chapter" ) )
 29 |   {
 30 |    hElement = hElement.getElementsByClassName( "button-chapter-name" )[ 0 ];
 31 |    hElement.classList.remove( "state-open" );
 32 |   }
 33 |   sNewARIALabel = "Expand";
 34 |  }
 35 |  else
 36 |  {
 37 |   hElement.classList.add( "state-open" );
 38 |   if( hElement.classList.contains( "button-chapter-name" ) )
 39 |   {
 40 |    hElement.parentNode.classList.add( "state-open" );
 41 |   }
 42 |   else if( hElement.classList.contains( "chapter" ) )
 43 |   {
 44 |    hElement = hElement.getElementsByClassName( "button-chapter-name" )[ 0 ];
 45 |    hElement.classList.add( "state-open" );
 46 |   }
 47 |   sNewARIALabel = "Collapse";
 48 |  }
 49 |  if( hElement.classList.contains( "button-chapter-name" ) )
 50 |  {
 51 |   fSetNewARIALabel( hElement, sNewARIALabel );
 52 |  }
 53 |  else
 54 |  {
 55 |   hElement.setAttribute( "aria-label", sNewARIALabel );
 56 |  }
 57 | }
 58 | 
 59 | /* Handles key input for a a resource. */
 60 | function fHandleKeyUpResource( event )
 61 | {
 62 |  if( kConfirm[ event.keyCode ] )
 63 |  {
 64 |   let sNodeTagName = document.activeElement.nodeName;
 65 |   if( sNodeTagName != "A" )
 66 |   {
 67 |    fToggleFoldingTopicChapterResource( this );
 68 |   }
 69 |  }
 70 | }
 71 | 
 72 | /* Handles key input for a a resource. */
 73 | function fHandleClickResource( event )
 74 | {
 75 |  let sNodeTagName = event.target.nodeName;
 76 |  if( sNodeTagName != "SPAN" && sNodeTagName != "A" )
 77 |  {
 78 |   fToggleFoldingTopicChapterResource( this );
 79 |  }
 80 | }
 81 | 
 82 | /* A wrapper function for toggling a chapter and focusing its first child. */
 83 | function fWrapperToggleChapter( hTargetChapter )
 84 | {
 85 |  let aByClassChapter = document.getElementsByClassName( "chapter" );
 86 |  var aSlicedChapters = Array.prototype.slice.call( aByClassChapter );
 87 |  /// Note to self: Why does this for loop need to happen?
 88 |  for( let i = 0; i < aSlicedChapters.length; i++ )
 89 |  {
 90 |   if( hTargetChapter == aSlicedChapters[ i ] )
 91 |   {
 92 |    fToggleFoldingTopicChapterResource( aSlicedChapters[ i ] );
 93 |    i = aSlicedChapters.length;
 94 |   }
 95 |  }
 96 |  if( hTargetChapter.classList.contains( "state-open" ) == false && hTargetChapter.classList.contains( "resource" ) == false )
 97 |  {
 98 |   if( hTargetChapter.classList.contains( "button-chapter-name" ) )
 99 |   {
100 |    hTargetChapter = hTargetChapter.parentNode;
101 |   }
102 |   hTargetChapter = hTargetChapter.getElementsByTagName( "section" )[ 0 ];
103 |   hTargetChapter = hTargetChapter.getElementsByTagName( "div" )[ 0 ];
104 |   setTimeout( function()
105 |    {
106 |     hTargetChapter.focus();
107 |    }, 1 // Needs one tick to render.
108 |   );
109 |  }
110 | }
111 | 
112 | /* Functions for key and mouse interactions with chapters. */
113 | function fHandleClickChapter( event )
114 | {
115 |  if( event.type == "mousedown" || kConfirm[ event.keyCode ] )
116 |  {
117 |   fWrapperToggleChapter( event.target );
118 |  }
119 | }
120 | function fHandleKeyUpChapter( event )
121 | {
122 |  if( kConfirm[ event.keyCode ] )
123 |  {
124 |   fWrapperToggleChapter( document.activeElement );
125 |  }
126 | }
127 | 
128 | /* Handles mouse input on the chapter folding toggle button. */
129 | function fHandleClickChapterButton( event )
130 | {
131 |  fToggleFoldingTopicChapterResource( this );
132 | }
133 | 


--------------------------------------------------------------------------------
/style.css:
--------------------------------------------------------------------------------
   1 | /*
   2 |  User Interface Layout
   3 |  Layer 0: Body
   4 |  Layer 1: Above Content
   5 |  Layer 2: Search bar
   6 |  Layer 3: Dark Layer
   7 |  Layer 4: Drawer Menu
   8 |  Layer 5: Dark Layer .state-accessibility-settings
   9 |  Layer 6: Config Window
  10 | */
  11 | 
  12 | /* Global selector and plain tag modifications */
  13 | @font-face
  14 | {
  15 |  font-family: 'ABeeZee';
  16 |  src:  url('fonts/ABeeZee-Regular.ttf');
  17 |  font-display: swap;
  18 |  font-style: normal;
  19 |  font-weight: normal;
  20 | }
  21 | @font-face
  22 | {
  23 |  font-family: 'Oswald';
  24 |  src:  url('fonts/Oswald-Regular.ttf');
  25 |  font-display: swap;
  26 |  font-style: normal;
  27 |  font-weight: 700;
  28 | }
  29 | @font-face
  30 | {
  31 |  font-family: 'icomoon';
  32 |  src:  url('fonts/icomoon.eot?c7t6lo');
  33 |  src:  url('fonts/icomoon.eot?c7t6lo#iefix') format('embedded-opentype'),
  34 |         url('fonts/icomoon.ttf?c7t6lo') format('truetype'),
  35 |         url('fonts/icomoon.woff?c7t6lo') format('woff'),
  36 |         url('fonts/icomoon.svg?c7t6lo#icomoon') format('svg');
  37 |  font-display: swap;
  38 |  font-style: normal;
  39 |  font-weight: normal;
  40 | }
  41 | *
  42 | {
  43 |  box-sizing: border-box;
  44 |  margin: 0;
  45 |  padding: 0;
  46 |  font-family: "ABeeZee", Comic Sans;
  47 | }
  48 | html
  49 | {
  50 |  font-size: 100%;
  51 | }
  52 | .setting-font-larger
  53 | {
  54 |  font-size: 120%;
  55 | }
  56 | .setting-font-largest
  57 | {
  58 |  font-size: 150%;
  59 | }
  60 | ul
  61 | {
  62 |  list-style: none;
  63 | }
  64 | form select,
  65 | form button,
  66 | form input[ type="checkbox" ]
  67 | {
  68 |  margin-top: 20px;
  69 |  font-size: 1rem;
  70 | }
  71 | form select
  72 | {
  73 |  border-top: 0;
  74 |  border-left: 0;
  75 |  border-right: 0;
  76 |  padding-left: 1rem;
  77 |  padding-right: 1rem;
  78 |  background: transparent;
  79 | }
  80 | form button
  81 | {
  82 |  display: inline-block;
  83 |  border: 1px solid #ddd;;
  84 |  padding: 10px;
  85 |  width: 49%;
  86 | }
  87 | 
  88 | 
  89 | /* Mobile-sized, default states. */
  90 | 
  91 | #line-input-search
  92 | {
  93 |  position: fixed;
  94 |  top: 0;
  95 |  right: 0;
  96 |  left: calc( 13.5rem );
  97 |  border: 0;
  98 |  padding-bottom: 1px;
  99 |  width: calc( 100% - 13.5rem );
 100 |  background: transparent;
 101 |  line-height: 1.5rem;
 102 |  font-size: 1rem;
 103 |  transition: all 200ms;
 104 |  z-index: 2;
 105 | }
 106 | 
 107 | header[ role="banner" ]
 108 | {
 109 |  display: table-cell;
 110 |  position: fixed;
 111 |  top: 0;
 112 |  left: 0;
 113 |  right: 0;
 114 |  width: 100%;
 115 |  height: 1.8rem;
 116 |  vertical-align: top;
 117 |  line-height: 1.5rem;
 118 |  z-index: 1;
 119 | }
 120 | #text-site-title
 121 | {
 122 |  display: inline-block;
 123 |  float: left;
 124 |  padding: 0 5px 0 5px;
 125 |  min-width: 11.6rem;
 126 |  width: 12.5rem;
 127 |  line-height: 1.75rem;
 128 |  overflow: hidden;
 129 |  white-space: nowrap;
 130 |  letter-spacing: -3px;
 131 |  font-size: 4rem;
 132 |  transition: all 200ms;
 133 | }
 134 | #text-site-title a
 135 | {
 136 |  display: block;
 137 |  position: relative;
 138 |  margin: 0;
 139 |  height: 1.9rem;
 140 |  font-size: 1.8rem;
 141 |  transition: all 0.1s;
 142 | }
 143 | #text-site-title a::before
 144 | {
 145 |  content: attr( data-char );
 146 |  position: absolute;
 147 |  top: 0;
 148 |  letter-spacing: -3px;
 149 |  text-decoration: underline;
 150 |  opacity: 1;
 151 |  clip-path: polygon( 120% 0, 120% 110%, 4% 110% );
 152 |  transition: opacity 200ms;
 153 | }
 154 | 
 155 | #background-black-alpha
 156 | {
 157 |  position: fixed;
 158 |  z-index: 3;
 159 | }
 160 | 
 161 | #wrapper-main-menu
 162 | {
 163 |  position: fixed;
 164 |  top: 0;
 165 |  bottom: 0;
 166 |  left: 0px;
 167 |  width: 0;
 168 |  max-width: 200px;
 169 |  overflow-y: auto;
 170 |  z-index: 4;
 171 |  transition: width 200ms;
 172 | }
 173 | #wrapper-main-menu a,
 174 | #wrapper-main-menu ul button
 175 | {
 176 |  display: block;
 177 |  padding: 0.8rem 0;
 178 |  width: 100%;
 179 |  font-size: 1rem;
 180 |  transition: all 200ms;
 181 | }
 182 | #wrapper-main-menu ul button
 183 | {
 184 |  border: 0;
 185 |  text-align: left;
 186 |  cursor: pointer;
 187 | }
 188 | #wrapper-main-menu ul ul
 189 | {
 190 |  display: none;
 191 | }
 192 | #wrapper-main-menu ul ul a
 193 | {
 194 |  padding-left: 2rem;
 195 | }
 196 | 
 197 | #button-main-menu,
 198 | #button-code-generator
 199 | {
 200 |  display: block;
 201 |  position: fixed;
 202 |  top: 1.9rem;
 203 |  left: 2px;
 204 |  border: 1px solid #ccc;
 205 |  padding: 30px 5px 5px 5px;
 206 |  line-height: 1.2rem;
 207 |  box-shadow: 0 0 5px #000;
 208 |  font-family: 'Oswald';
 209 |  font-size: 1.2rem;
 210 |  text-transform: uppercase;
 211 |  cursor: pointer;
 212 |  transition: all 200ms;
 213 |  z-index: 4;
 214 | }
 215 | #button-main-menu::before
 216 | {
 217 |  content: "Open";
 218 |  display: block;
 219 |  margin-top: 5px;
 220 |  margin-bottom: 0;
 221 |  font-size: 1rem;
 222 | }
 223 | #button-main-menu svg
 224 | {
 225 |  display: block;
 226 |  position: absolute;
 227 |  top: 0;
 228 |  left: calc( 50% - 25px );
 229 |  height: 37px;
 230 |  width: 50px;
 231 | }
 232 | #button-main-menu svg rect
 233 | {
 234 |  position: relative;
 235 |  transition: all 300ms;
 236 |  transition-delay: 500ms;
 237 | }
 238 | #button-main-menu rect:first-child
 239 | {
 240 |  transform-origin: 15px 12.5px;
 241 | }
 242 | #button-main-menu rect:nth-child( 2 )
 243 | {
 244 |  transform-origin: 35px 12.5px;
 245 | }
 246 | #button-main-menu rect:nth-child( 3 )
 247 | {
 248 |  transform-origin: 15px 24.5px;
 249 | }
 250 | #button-main-menu rect:last-child
 251 | {
 252 |  transform-origin: 35px 24.5px;
 253 | }
 254 | 
 255 | #wrapper-settings-accessibility
 256 | {
 257 |  position: absolute;
 258 |  top: -50%;
 259 |  left: 50%;
 260 |  padding: 1rem;
 261 |  width: 100%;
 262 |  max-width: 500px;
 263 |  max-height: 100vh;
 264 |  overflow-y: auto;
 265 |  box-shadow: 0 0 3px #000;
 266 |  border-radius: 4px;
 267 |  transform: translateX(-50%) translateY(-50%);
 268 |  transition: top 200ms;
 269 |  z-index: 6;
 270 | }
 271 | #wrapper-settings-accessibility h2
 272 | {
 273 |  border-left: 0;
 274 |  transition: all 200ms;
 275 | }
 276 | #wrapper-settings-accessibility p
 277 | {
 278 |  margin-top: 1rem;
 279 |  font-size: 1rem;
 280 | }
 281 | #wrapper-accessibility-save-exit
 282 | {
 283 |  font-size: 0;
 284 | }
 285 | #button-settings-accessibility-save
 286 | {
 287 |  margin-right: 1%;
 288 | }
 289 | 
 290 | /* Code Generator Dialog */
 291 | #wrapper-code-generator
 292 | {
 293 |  position: absolute;
 294 |  top: -200vh;
 295 |  left: 50%;
 296 |  padding: 10px;
 297 |  width: 100%;
 298 |  max-width: 800px;
 299 |  max-height: 90vh;
 300 |  box-shadow: 0 0 10px rgba( 0, 0, 0, 0.3 );
 301 |  border-radius: 4px;
 302 |  transform: translateX(-50%) translateY(-50%);
 303 |  transition: all 0.5s;
 304 |  z-index: 6;
 305 | }
 306 | #wrapper-code-generator p
 307 | {
 308 |  margin-bottom: 1.5rem;
 309 | }
 310 | .wrapper-layout-half-left
 311 | {
 312 |  float: none;
 313 |  width: 100%;
 314 | }
 315 | #wrapper-code-generator select
 316 | {
 317 |  margin-top: 0;
 318 |  margin-bottom: 1rem;
 319 |  width: 100%;
 320 | }
 321 | #wrapper-code-generator input
 322 | {
 323 |  width: 100%;
 324 |  font-size: 1.2rem;
 325 |  margin-bottom: 1rem;
 326 | }
 327 | #wrapper-code-generator textarea
 328 | {
 329 |  width: 100%;
 330 |  margin-bottom: 1rem;
 331 |  height: 6.9rem;
 332 |  overflow-y: scroll;
 333 |  font-family: courier;
 334 | }
 335 | #wrapper-code-generator button
 336 | {
 337 |  margin-top: 0;
 338 | }
 339 | #button-code-generator-close
 340 | {
 341 |  width: 100%;
 342 | }
 343 | 
 344 | /* Main Site Structure */
 345 | #wrapper-main-site-content
 346 | {
 347 |  margin-top: 2.5em;
 348 |  margin-right: auto;
 349 |  margin-left: 4em;
 350 |  width: calc( 100% - 4em );
 351 |  min-width: 200px;
 352 |  transition: all 300ms;
 353 | }
 354 | /* Welcome Section */
 355 | #wrapper-home-page-content h2
 356 | {
 357 |  margin-top: 20px;
 358 |  margin-bottom: 2rem;
 359 |  text-align: center;
 360 |  font-size: 2.2rem;
 361 | }
 362 | #wrapper-home-page-content p
 363 | {
 364 |  transition: all 0.3s;
 365 | }
 366 | #text-recommended-topics
 367 | {
 368 |  margin: 0 auto;
 369 |  padding: 0.5em 1em 0.5em 1em;
 370 |  width: 100%;
 371 |  min-width: 200px;
 372 |  line-height: 1.8rem;
 373 |  font-size: 1.25rem;
 374 |  transition: all 0.2s;
 375 | }
 376 | #text-recommended-topics a
 377 | {
 378 |  display: block;
 379 |  margin: 0.5%;
 380 |  padding: 10px;
 381 |  width: 100%;
 382 |  font-weight: 600;
 383 |  transition: all 0.2s;
 384 | }
 385 | #text-recommended-topics a:before
 386 | {
 387 |  content:'🔗';
 388 |  display: inline-block;
 389 |  padding-right: 2px;
 390 |  text-decoration: none;
 391 | }
 392 | 
 393 | /* Topic/Chapter/Resource structure */
 394 | .topic
 395 | {
 396 |  display: block;
 397 | }
 398 | .chapter
 399 | {
 400 |  margin: 5px;
 401 |  padding: 5px;
 402 | }
 403 | section
 404 | {
 405 |  display: flex;
 406 |  flex-flow: wrap;
 407 |  align-items: flex-start;
 408 |  position: relative;
 409 |  margin: 10px auto;
 410 |  padding: 0;
 411 |  width: 100%;
 412 |  white-space: normal;
 413 |  overflow: hidden;
 414 | }
 415 | .chapter:not( .state-open ) section
 416 | {
 417 |  display: none;
 418 | }
 419 | [ class^="icon-" ]::before,
 420 | [ class^="icon-" ]::after,
 421 | [ class*=" icon-" ]::before,
 422 | [ class*=" icon-" ]::after,
 423 | .chapter::before,
 424 | .resource::before
 425 | {
 426 |  font-family: 'icomoon' !important;
 427 |  font-style: normal;
 428 |  font-weight: normal;
 429 |  font-variant: normal;
 430 |  text-transform: none;
 431 |  -webkit-font-smoothing: antialiased;
 432 |  -moz-osx-font-smoothing: grayscale;
 433 |  speak: none;
 434 | }
 435 | .icon-plus::before,
 436 | .chapter::before,
 437 | .resource::before
 438 | {
 439 |  content: "\f067";
 440 | }
 441 | .icon-external-link:after
 442 | {
 443 |  content: "\f08e";
 444 |  margin-left: 1rem;
 445 | }
 446 | .chapter::before,
 447 | .resource::before
 448 | {
 449 |  position: absolute;
 450 |  right: 10px;
 451 |  line-height: 24px;
 452 | }
 453 | .button-chapter-name
 454 | {
 455 |  padding-right: 1rem;
 456 |  width: 100%;
 457 |  border: 0;
 458 |  text-align: left;
 459 |  background: transparent;
 460 |  font-size: 1.5em;
 461 | }
 462 | .resource
 463 | {
 464 |  display: block;
 465 |  flex: 1;
 466 |  flex-basis: 100%;
 467 |  position: relative;
 468 |  margin: 3px;
 469 |  padding: 5px 25px 5px 5px;
 470 |  font-size: 1rem;
 471 |  cursor: pointer;
 472 | }
 473 | .resource a
 474 | {
 475 |  display: block;
 476 | }
 477 | .resource-details
 478 | {
 479 |  display: block;
 480 |  margin-top: 1rem;
 481 | }
 482 | .resource-details::before
 483 | {
 484 |  content: " ";
 485 |  display: block;
 486 |  height: 0;
 487 |  line-height: 0;
 488 |  overflow-y: hidden;
 489 |  font-size: 0;
 490 | }
 491 | .resource:not(.state-open) .resource-details
 492 | {
 493 |  position: absolute;
 494 |  height: 0;
 495 |  font-size: 0;
 496 |  overflow-y: hidden;
 497 | }
 498 | .tag
 499 | {
 500 |  margin-right: 1em;
 501 |  padding: 0 8px;
 502 |  border-radius: 20px;
 503 | }
 504 | 
 505 | /* Code Generation */
 506 | #button-code-generator
 507 | {
 508 |  position: fixed;
 509 |  top: auto;
 510 |  padding-top: 0.3rem;
 511 |  bottom: 0.2rem;
 512 |  left: 0.125rem;
 513 |  z-index: 1;
 514 | }
 515 | 
 516 | #dynamic-loading-bar
 517 | {
 518 |  position: absolute;
 519 |  top: 1.7rem;
 520 |  left: 0;
 521 |  height: 3px;
 522 |  background: green;
 523 |  transition: height 2s;
 524 | }
 525 | /* Just cool additions */
 526 | #dynamic-loading-bar:not( .loading-complete )::after
 527 | {
 528 |  content: attr(loading);
 529 |  display: block;
 530 |  position: absolute;
 531 |  top: 0;
 532 |  left: 5rem;
 533 |  height: 20px;
 534 |  padding: 5px;
 535 |  background: green;
 536 |  text-align: right;
 537 |  color: #fff;
 538 |  z-index: 1;
 539 | }
 540 | 
 541 | 
 542 | /* Dynamically-Applied Changes not related to screen sizes */
 543 | 
 544 | #button-main-menu:hover,
 545 | #button-code-generator:hover,
 546 | #button-main-menu:focus,
 547 | #button-code-generator:focus
 548 | {
 549 |  top: 0px;
 550 |  padding: 32px 7px 8px 7px;
 551 |  box-shadow: 0 0 10px rgba( 0, 0, 0, 0.5 );
 552 |  background: rgba( 40, 40, 40, 0.7 );
 553 | }
 554 | #button-main-menu:not( .state-open ):hover
 555 | {
 556 |  left: 0px;
 557 | }
 558 | #button-main-menu:focus,
 559 | #wrapper-main-menu a:focus,
 560 | #wrapper-main-menu ul button:focus,
 561 | #wrapper-settings-accessibility h2:focus,
 562 | #wrapper-settings-accessibility select:focus,
 563 | #wrapper-settings-accessibility button:focus,
 564 | #text-recommended-topics a:focus
 565 | {
 566 |  border-left: 5px solid #090;
 567 | }
 568 | #wrapper-code-generator.state-active
 569 | {
 570 |  top: 50%;
 571 | }
 572 | 
 573 | #button-main-menu:hover,
 574 | #button-main-menu:focus
 575 | {
 576 |  top: 1.8rem;
 577 | }
 578 | #button-main-menu.state-open
 579 | {
 580 |  left: 202px;
 581 | }
 582 | #button-main-menu.state-open::before
 583 | {
 584 |  content: "Close";
 585 | }
 586 | #button-main-menu.state-open:hover
 587 | {
 588 |  left: 200px;
 589 | }
 590 | #button-main-menu.state-open rect:first-child
 591 | {
 592 |  transform: rotate( 45deg ) translate( 3px, -3px );
 593 | }
 594 | #button-main-menu.state-open rect:nth-child( 2 )
 595 | {
 596 |  transform: rotate( -45deg ) translate( -3px, -3px );
 597 | }
 598 | #button-main-menu.state-open rect:nth-child( 3 )
 599 | {
 600 |  transform: rotate( -45deg ) translate( 3px, 3px );
 601 | }
 602 | #button-main-menu.state-open rect:nth-child( 4 )
 603 | {
 604 |  transform: rotate( 45deg ) translate( -3px, 3px );
 605 | }
 606 | #wrapper-main-menu.state-open
 607 | {
 608 |  width: 100%;
 609 | }
 610 | #wrapper-main-menu.state-open ul button,
 611 | #wrapper-main-menu.state-open a
 612 | {
 613 |  padding: 0.8rem 1rem;
 614 | }
 615 | #wrapper-main-menu ul button.state-open+ul,
 616 | #setting-unfolding-marker.setting-content-unfolded ~ #wrapper-main-menu ul button+ul
 617 | {
 618 |  display: initial;
 619 | }
 620 | #background-black-alpha.state-open
 621 | {
 622 |  top: 0;
 623 |  right: 0;
 624 |  bottom: 0;
 625 |  left: 0;
 626 | }
 627 | #wrapper-settings-accessibility.state-open
 628 | {
 629 |  top: 50%;
 630 | }
 631 | #wrapper-settings-accessibility h2:focus
 632 | {
 633 |  padding-left: 1rem;
 634 | }
 635 | #background-black-alpha.state-accessibility-settings,
 636 | #background-black-alpha.state-code-generator
 637 | {
 638 |  z-index: 5;
 639 | }
 640 | /* Top Row */
 641 | #line-input-search:focus:not(:placeholder-shown)
 642 | {
 643 |  left: 0;
 644 |  width: calc( 100% - 10px );
 645 | }
 646 | #line-input-search:focus:not(:placeholder-shown) ~ header #text-site-title
 647 | {
 648 |  padding: 0;
 649 |  min-width: 0;
 650 |  width: 0;
 651 | }
 652 | #text-site-title > a:focus::before
 653 | {
 654 |  opacity: 0;
 655 | }
 656 | .icon-plus::before,
 657 | .chapter.state-open::before,
 658 | .resource.state-open::before
 659 | {
 660 |  content: "\f068";
 661 | }
 662 | #line-input-search:focus:not(:placeholder-shown) ~ #wrapper-main-site-content #wrapper-home-page-content,
 663 | #wrapper-home-page-content.state-hidden
 664 | {
 665 |  display: none;
 666 | }
 667 | #line-input-search:not(:placeholder-shown) ~ #wrapper-main-site-content .chapter:not(.state-open) section,
 668 | #line-input-search:not(:placeholder-shown) ~ #wrapper-main-site-content .chapter.state-open section,
 669 | #setting-unfolding-marker.setting-content-unfolded ~  #wrapper-main-site-content .chapter section
 670 | {
 671 |  display: flex;
 672 | }
 673 | 
 674 | #button-code-generator:hover,
 675 | #button-code-generator:focus
 676 | {
 677 |  top: auto;
 678 |  bottom: 0;
 679 |  left: 0;
 680 |  padding-top: 0.4rem;
 681 | }
 682 | 
 683 | #dynamic-loading-bar.loading-complete
 684 | {
 685 |  height: 0;
 686 | }
 687 | 
 688 | 
 689 | /* Coloring - Default (Dark) */
 690 | 
 691 | body
 692 | {
 693 |  background-image: linear-gradient( 125deg,
 694 |   transparent 90%,
 695 |    #b33 0, #b33 90.77%,
 696 |    #a43 0, #a43 91.54%,
 697 |    #a63 0, #a63 92.31%,
 698 |    #984 0, #984 93.08%,
 699 |    #683 0, #683 93.85%,
 700 |    #474 0, #474 94.62%,
 701 |    #365 0, #365 95.39%,
 702 |    #466 0, #466 96.16%,
 703 |    #346 0, #346 96.93%,
 704 |    #335 0, #335 97.7%,
 705 |    #435 0, #435 98.47%,
 706 |    #635 0, #635 99.24%,
 707 |    #835 0
 708 |  );
 709 |  background-size: 100vw 100vh;
 710 |  background-attachment: fixed;
 711 | }
 712 | .setting-theme-dark,
 713 | body
 714 | {
 715 |  background-color: #050510;
 716 | }
 717 | #button-main-menu
 718 | {
 719 |  background: #111;
 720 | }
 721 | #button-main-menu,
 722 | #button-main-menu::before,
 723 | #wrapper-main-menu ul button,
 724 | #wrapper-main-menu a
 725 | {
 726 |  color: #ddd;
 727 | }
 728 | #button-main-menu:active
 729 | {
 730 |  background: rgba( 0, 0, 0, 0.95 );
 731 | }
 732 | #button-main-menu rect
 733 | {
 734 |  stroke: #ddd;
 735 |  fill: #ddd;
 736 | }
 737 | #wrapper-main-menu
 738 | {
 739 |  background: #224;
 740 | }
 741 | #wrapper-main-menu ul button,
 742 | .tag,
 743 | #wrapper-home-page-content p a
 744 | {
 745 |  text-shadow: 0 0 2px #000,
 746 |   -1px -1px 0 #000,
 747 |    1px  1px 0 #000,
 748 |    1px -1px 0 #000,
 749 |   -1px  1px 0 #000,
 750 |    0   -1px 0 #000,
 751 |    0    1px 0 #000,
 752 |   -1px  0   0 #000,
 753 |    1px  0   0 #000;
 754 | }
 755 | .tag,
 756 | .resource-details
 757 | {
 758 |  color: #ccc;
 759 | }
 760 | #wrapper-main-menu #button-settings-accessibility
 761 | {
 762 |  background: #222;
 763 | }
 764 | 
 765 | 
 766 | #wrapper-settings-accessibility
 767 | {
 768 |  background: #2F2F2F;
 769 |  color: #ddd;
 770 | }
 771 | #wrapper-settings-accessibility select
 772 | {
 773 |  color: #ddd;
 774 | }
 775 | #wrapper-settings-accessibility option
 776 | {
 777 |  background: #111;
 778 | }
 779 | #wrapper-settings-accessibility button
 780 | {
 781 |  background: #444;
 782 |  color: #fff;
 783 | }
 784 | form button
 785 | {
 786 |  border: 1px solid #fff;
 787 | }
 788 | form select
 789 | {
 790 |  border-bottom: 1px solid #fff;
 791 | }
 792 | #wrapper-code-generator
 793 | {
 794 |  background: #333;
 795 |  color: #bbb;
 796 | }
 797 | #wrapper-code-generator select
 798 | {
 799 |  color: #ccc;
 800 | }
 801 | #wrapper-code-generator option
 802 | {
 803 |  color: #bbb;
 804 |  background: #222;
 805 | }
 806 | #wrapper-code-generator input,
 807 | #wrapper-code-generator textarea,
 808 | #wrapper-code-generator button
 809 | {
 810 |  background: #444;
 811 |  border: 0;
 812 |  border-bottom: 1px solid #ddd;
 813 |  color: #ddd;
 814 | }
 815 | /* Dark Coloring (site) */
 816 | header[ role="banner" ]
 817 | {
 818 |  background: #111;
 819 | }
 820 | #text-site-title
 821 | {
 822 |  text-shadow: -4px 4px 0 #303;
 823 | }
 824 | 
 825 | #text-site-title a
 826 | {
 827 |  color: #c33;
 828 |  text-shadow: 0 0 5px rgba( 0, 0, 70, 0.5);
 829 | }
 830 | #text-site-title a::before
 831 | {
 832 |  color: #33d;
 833 | }
 834 | #line-input-search
 835 | {
 836 |  border-bottom: 1px solid #ccc;
 837 |  color: #ccc;
 838 | }
 839 | 
 840 | /* Dark Welcome section */
 841 | h2
 842 | {
 843 |  color: #ccc;
 844 | }
 845 | /* Main website content */
 846 | section
 847 | {
 848 |  box-shadow: 0 0 10px rgba( 0, 0, 0, 0.4 );
 849 | }
 850 | .chapter
 851 | {
 852 |  background: #0d0d0d;
 853 | }
 854 | .chapter::before,
 855 | .resource::before
 856 | {
 857 |  color: #bbb;
 858 | }
 859 | .resource
 860 | {
 861 |  box-shadow: 0 0 3px rgba( 0, 0, 0, 0.5 );
 862 |  background: #171717;
 863 | }
 864 | .resource a
 865 | {
 866 |  color: #ddd;
 867 | }
 868 | .button-chapter-name
 869 | {
 870 |  color: #bbb;
 871 | }
 872 | 
 873 | #wrapper-home-page-content p
 874 | {
 875 |  color: #bbd4d4;
 876 | }
 877 | #wrapper-home-page-content p a
 878 | {
 879 |  color: #ddd;
 880 | }
 881 | 
 882 | #button-code-generator
 883 | {
 884 |  background: #111;
 885 |  color: #ccc;
 886 | }
 887 | 
 888 | 
 889 | 
 890 | /* Coloring - setting-theme-bright (trend towards orange, here) */
 891 | 
 892 | body.setting-theme-bright
 893 | {
 894 |  background-color: #fed;
 895 |  color: #333;
 896 | }
 897 | .setting-theme-bright header[ role="banner" ]
 898 | {
 899 |  background: #ddd;
 900 | }
 901 | .setting-theme-bright #text-site-title a
 902 | {
 903 |  color: #900;
 904 |  text-shadow: 0 0 5px rgba( 255, 250, 240, 0.5);
 905 | }
 906 | .setting-theme-bright #text-site-title > a:before
 907 | {
 908 |  color: #00a;
 909 | }
 910 | .setting-theme-bright #line-input-search
 911 | {
 912 |  border-bottom-color: #222;
 913 |  color: #222;
 914 | }
 915 | .setting-theme-bright #button-main-menu
 916 | {
 917 |  background: #ccc;
 918 |  color: #111;
 919 | }
 920 | .setting-theme-bright #button-main-menu svg rect
 921 | {
 922 |  stroke: #111;
 923 |  fill: #111;
 924 | }
 925 | .setting-theme-bright #button-main-menu:active
 926 | {
 927 |  background: rgba( 255, 255, 255, 0.95 );
 928 | }
 929 | .setting-theme-bright #wrapper-main-menu
 930 | {
 931 |  background: #f3c551;
 932 | }
 933 | .setting-theme-bright #wrapper-main-menu button,
 934 | .setting-theme-bright .resource-details,
 935 | .setting-theme-bright #button-main-menu::before
 936 | {
 937 |  color: #111;
 938 | }
 939 | .setting-theme-bright #wrapper-main-menu #button-settings-accessibility
 940 | {
 941 |  background: #ddd;
 942 | }
 943 | .setting-theme-bright #wrapper-main-menu ul button,
 944 | .setting-theme-bright .tag,
 945 | .setting-theme-bright #wrapper-home-page-content p a
 946 | {
 947 |  font-weight: 900;
 948 |  text-shadow: 0 0 5px #fff,
 949 |   0 0 5px #fff, 0 0 5px #fff, 0 0 5px #fff,
 950 |   -1px -1px 0 #fff,
 951 |    1px  1px 0 #fff,
 952 |    1px -1px 0 #fff,
 953 |   -1px  1px 0 #fff,
 954 |    0   -1px 0 #fff,
 955 |    0    1px 0 #fff,
 956 |  -1px   0   0 #fff,
 957 |   1px   0   0 #fff;
 958 | }
 959 | .setting-theme-bright .tag
 960 | {
 961 |  color: #000;
 962 | }
 963 | .setting-theme-bright #wrapper-main-menu a
 964 | {
 965 |  color: #000;
 966 |  font-weight: 900;
 967 | }
 968 | 
 969 | .setting-theme-bright #wrapper-settings-accessibility
 970 | {
 971 |  background: #BFBFBF;
 972 |  color: #333;
 973 | }
 974 | .setting-theme-bright #wrapper-settings-accessibility select
 975 | {
 976 |  color: #222;
 977 | }
 978 | .setting-theme-bright #wrapper-settings-accessibility option
 979 | {
 980 |  background: #ddd;
 981 | }
 982 | .setting-theme-bright #wrapper-settings-accessibility button
 983 | {
 984 |  background: #ccc;
 985 |  color: #000;
 986 | }
 987 | .setting-theme-bright form select
 988 | {
 989 |  border-bottom: 1px solid #000;
 990 | }
 991 | .setting-theme-bright form button
 992 | {
 993 |  border: 1px solid #222;
 994 | }
 995 | /* Main Site */
 996 | .setting-theme-bright section
 997 | {
 998 |  box-shadow: 0 0 10px rgba( 255, 255, 255, 0.4 );
 999 | }
1000 | .setting-theme-bright .chapter
1001 | {
1002 |  background: #f2f2f2;
1003 | }
1004 | .setting-theme-bright .button-chapter-name
1005 | {
1006 |  color: #444;
1007 | }
1008 | .setting-theme-bright .resource
1009 | {
1010 |  box-shadow: 0 0 3px rgba( 255, 255, 255, 0.5 );
1011 |  background: #e8e8e8;
1012 | }
1013 | .setting-theme-bright .resource a
1014 | {
1015 |  color: #000;
1016 | }
1017 | .setting-theme-bright .chapter::before,
1018 | .setting-theme-bright .resource::before
1019 | {
1020 |  color: #444;
1021 | }
1022 | /* Welcome */
1023 | .setting-theme-bright h2
1024 | {
1025 |  color: #222;
1026 | }
1027 | .setting-theme-bright #wrapper-home-page-content p
1028 | {
1029 |  color: #222;
1030 | }
1031 | .setting-theme-bright #wrapper-home-page-content p a
1032 | {
1033 |  color: #000;
1034 | }
1035 | 
1036 | 
1037 | /* Rainbow colors */
1038 | .red
1039 | {
1040 |  background: #b33;
1041 | }
1042 | .scarlet
1043 | {
1044 |  background: #a43;
1045 | }
1046 | .orange
1047 | {
1048 |  background: #a63;
1049 | }
1050 | .yellow
1051 | {
1052 |  background: #984;
1053 | }
1054 | .lime
1055 | {
1056 |  background: #683;
1057 | }
1058 | .green
1059 | {
1060 |  background: #474;
1061 | }
1062 | .turquoise
1063 | {
1064 |  background: #365;
1065 | }
1066 | .skyblue
1067 | {
1068 |  background: #466;
1069 | }
1070 | .cobalt
1071 | {
1072 |  background: #346;
1073 | }
1074 | .blue
1075 | {
1076 |  background: #335;
1077 | }
1078 | .purple
1079 | {
1080 |  background: #435;
1081 | }
1082 | .violet
1083 | {
1084 |  background: #635;
1085 | }
1086 | .rose
1087 | {
1088 |  background: #835;
1089 | }
1090 | 
1091 | 
1092 | /* setting-theme-bright theme */
1093 | .setting-theme-bright #button-code-generator
1094 | {
1095 |  border: 0;
1096 |  background: #ccc;
1097 |  color: #111;
1098 | }
1099 | .setting-theme-bright #button-code-generator:hover
1100 | {
1101 |  color: #000;
1102 | }
1103 | 
1104 | .setting-theme-bright #wrapper-code-generator
1105 | {
1106 |  background: #bbb;
1107 |  color: #000;
1108 | }
1109 | .setting-theme-bright #wrapper-code-generator select
1110 | {
1111 |  color: #111;
1112 | }
1113 | .setting-theme-bright #wrapper-code-generator option
1114 | {
1115 |  color: #000;
1116 |  background: #eee;
1117 | }
1118 | .setting-theme-bright #wrapper-code-generator input,
1119 | .setting-theme-bright #wrapper-code-generator textarea,
1120 | .setting-theme-bright #wrapper-code-generator button
1121 | {
1122 |  background: #999;
1123 |  border-bottom: 1px solid #222;
1124 |  color: #000;
1125 | }
1126 | #wrapper-code-generator button,
1127 | #wrapper-code-generator button
1128 | {
1129 |  border: 0;
1130 | }
1131 | .setting-theme-bright .red
1132 | {
1133 |  background: #d17474;
1134 | }
1135 | .setting-theme-bright .scarlet
1136 | {
1137 |  background: #c57f74;
1138 | }
1139 | .setting-theme-bright .orange
1140 | {
1141 |  background: #c59674;
1142 | }
1143 | .setting-theme-bright .yellow
1144 | {
1145 |  background: #b9ae7f;
1146 | }
1147 | .setting-theme-bright .lime
1148 | {
1149 |  background: #96ae74;
1150 | }
1151 | .setting-theme-bright .green
1152 | {
1153 |  background: #7fa27f;
1154 | }
1155 | .setting-theme-bright .turquoise
1156 | {
1157 |  background: #74968b;
1158 | }
1159 | .setting-theme-bright .skyblue
1160 | {
1161 |  background: #7f9696;
1162 | }
1163 | .setting-theme-bright .cobalt
1164 | {
1165 |  background: #747f96;
1166 | }
1167 | .setting-theme-bright .blue
1168 | {
1169 |  background: #74748b;
1170 | }
1171 | .setting-theme-bright .purple
1172 | {
1173 |  background: #7f748b;
1174 | }
1175 | .setting-theme-bright .violet
1176 | {
1177 |  background: #96748b;
1178 | }
1179 | .setting-theme-bright .rose
1180 | {
1181 |  background: #ae748b;
1182 | }
1183 | 
1184 | /* State changes */
1185 | 
1186 | #line-input-search:focus
1187 | {
1188 |  border-bottom-color: #090;
1189 |  color: #fff;
1190 | }
1191 | #text-site-title a:focus,
1192 | #wrapper-home-page-content a:focus
1193 | {
1194 |  text-decoration-color: #090;
1195 | }
1196 | #text-site-title a:focus
1197 | {
1198 |  color: #e0e0e0;
1199 | }
1200 | #background-black-alpha.state-open
1201 | {
1202 |  background: rgba( 0, 0, 0, 0.8 );
1203 | }
1204 | #wrapper-code-generator input:focus,
1205 | #wrapper-code-generator select:focus,
1206 | #wrapper-code-generator textarea:focus,
1207 | #wrapper-code-generator button:focus,
1208 | #wrapper-code-generator h3:focus
1209 | {
1210 |  border-left: 5px solid #090 !important;
1211 | }
1212 | #wrapper-main-menu a:focus,
1213 | #wrapper-main-menu button.button-toggle-submenu:focus
1214 | {
1215 |  background: #111;
1216 | }
1217 | .chapter .button-chapter-name:focus,
1218 | .resource:focus
1219 | {
1220 |  border-left: 5px solid #090;
1221 | }
1222 | .resource:focus
1223 | {
1224 |  background: #1d1d1d;
1225 | }
1226 | .resource:focus a
1227 | {
1228 |  text-decoration-color: #090;
1229 | }
1230 | #wrapper-home-page-content p a:focus
1231 | {
1232 |  background: #001;
1233 |  color: #fff;
1234 | }
1235 | #button-code-generator:focus
1236 | {
1237 |  border-left: 5px solid #090;
1238 | }
1239 | #button-code-generator:hover
1240 | {
1241 |  color: #eee;
1242 | }
1243 | 
1244 | /* Bright theme state changes */
1245 | 
1246 | .setting-theme-bright #text-site-title a:focus,
1247 | .setting-theme-bright #wrapper-home-page-content a:focus
1248 | {
1249 |  text-decoration-color: #22b;
1250 | }
1251 | .setting-theme-bright #background-black-alpha.state-open
1252 | {
1253 |  background: rgba( 255, 255, 255, 0.8 );
1254 | }
1255 | .setting-theme-bright #wrapper-settings-accessibility button:focus,
1256 | .setting-theme-bright #button-code-generator:focus
1257 | {
1258 |  border-left: 5px solid #02b;
1259 | }
1260 | .setting-theme-bright #button-main-menu:focus,
1261 | .setting-theme-bright #wrapper-main-menu a:focus,
1262 | .setting-theme-bright #wrapper-main-menu button:focus,
1263 | .setting-theme-bright #wrapper-settings-accessibility h2:focus,
1264 | .setting-theme-bright #wrapper-settings-accessibility select:focus,
1265 | .setting-theme-bright #wrapper-settings-accessibility button:focus
1266 | .setting-theme-bright #text-recommended-topics a:focus
1267 | {
1268 |  border-left: 5px solid #22b;
1269 | }
1270 | .setting-theme-bright #wrapper-code-generator input:focus,
1271 | .setting-theme-bright #wrapper-code-generator select:focus,
1272 | .setting-theme-bright #wrapper-code-generator textarea:focus,
1273 | .setting-theme-bright #wrapper-code-generator button:focus,
1274 | .setting-theme-bright #wrapper-code-generator h3:focus
1275 | {
1276 |  border-left: 5px solid #02b !important;
1277 | }
1278 | .setting-theme-bright #wrapper-main-menu a:focus,
1279 | .setting-theme-bright #wrapper-main-menu button.button-toggle-submenu:focus
1280 | {
1281 |  background: #ddd;
1282 | }
1283 | .setting-theme-bright .resource:focus a
1284 | {
1285 |  text-decoration-color: #02b;
1286 | }
1287 | .setting-theme-bright #wrapper-home-page-content p a:focus
1288 | {
1289 |  border-left: 5px solid #02b;
1290 |  background: #fee;
1291 |  color: #000;
1292 |  text-decoration-color: #02b;
1293 | }
1294 | 
1295 | /* @media changes */
1296 | @media screen and ( min-width: 981px )
1297 | {
1298 |  .wrapper-layout-half-left
1299 |  {
1300 |   float: left;
1301 |   width: 50%;
1302 |   padding-right: 10px;
1303 |  }
1304 |  #wrapper-code-generator textarea
1305 |  {
1306 |   width: 50%;
1307 |   height: 12.6rem;
1308 |  }
1309 |  .resource
1310 |  {
1311 |   flex-basis: 32.9%;
1312 |  }
1313 |  .resource a
1314 |  {
1315 |   display: inline;
1316 |  }
1317 | }
1318 | 


--------------------------------------------------------------------------------
/taffy-min.js:
--------------------------------------------------------------------------------
1 | var TAFFY,exports,T;!function(){"use strict";var _t_,_e_,_n_,_r_,_i_,_s_,_u_,_o_,_c_,_a_,_l_,_f_,_h_,_T_,_g_,_F_,_p_,_d_,_A_,_v_,_y_,_m_,___,_x_;if(!TAFFY)for(_i_="2.7",_s_=1,_u_="000000",_o_=1e3,_c_={},_x_=function(_t_){var _e_=Array.prototype.slice.call(_t_);return _e_.sort()},_a_=function(_t_){return TAFFY.isArray(_t_)||TAFFY.isObject(_t_)?_t_:JSON.parse(_t_)},_A_=function(_t_,_e_){return _v_(_t_,function(_t_){return _e_.indexOf(_t_)>=0})},_v_=function(_t_,_e_,_n_){var _r_=[];return null==_t_?_r_:Array.prototype.filter&&_t_.filter===Array.prototype.filter?_t_.filter(_e_,_n_):(_l_(_t_,function(_t_,_i_,_s_){_e_.call(_n_,_t_,_i_,_s_)&&(_r_[_r_.length]=_t_)}),_r_)},___=function(_t_){return"[object RegExp]"===Object.prototype.toString.call(_t_)},_m_=function(_t_){var _e_=T.isArray(_t_)?[]:T.isObject(_t_)?{}:null;if(null===_t_)return _t_;for(var _n_ in _t_)_e_[_n_]=___(_t_[_n_])?_t_[_n_].toString():T.isArray(_t_[_n_])||T.isObject(_t_[_n_])?_m_(_t_[_n_]):_t_[_n_];return _e_},_y_=function(_t_){var _e_=JSON.stringify(_t_);return null===_e_.match(/regex/)?_e_:JSON.stringify(_m_(_t_))},_l_=function(_t_,_e_,_n_){var _r_,_i_,_s_,_u_;if(_t_&&(T.isArray(_t_)&&1===_t_.length||!T.isArray(_t_)))_e_(T.isArray(_t_)?_t_[0]:_t_,0);else for(_s_=0,_t_=T.isArray(_t_)?_t_:[_t_],_u_=_t_.length;_u_>_s_&&(_i_=_t_[_s_],T.isUndefined(_i_)&&!_n_||(_r_=_e_(_i_,_s_),_r_!==T.EXIT));_s_++);},_f_=function(_t_,_e_){var _n_,_r_,_i_=0;for(_r_ in _t_)if(_t_.hasOwnProperty(_r_)&&(_n_=_e_(_t_[_r_],_r_,_i_++),_n_===T.EXIT))break},_c_.extend=function(_t_,_e_){_c_[_t_]=function(){return _e_.apply(this,_x_(arguments))}},_h_=function(_t_){var _e_;return T.isString(_t_)&&/[t][0-9]*[r][0-9]*/i.test(_t_)?!0:T.isObject(_t_)&&_t_.___id&&_t_.___s?!0:T.isArray(_t_)?(_e_=!0,_l_(_t_,function(_t_){return _h_(_t_)?void 0:(_e_=!1,TAFFY.EXIT)}),_e_):!1},_g_=function(_t_,_e_){var _n_=!0;return _l_(_e_,function(_e_){switch(T.typeOf(_e_)){case"function":if(!_e_.apply(_t_))return _n_=!1,TAFFY.EXIT;break;case"array":_n_=1===_e_.length?_g_(_t_,_e_[0]):2===_e_.length?_g_(_t_,_e_[0])||_g_(_t_,_e_[1]):3===_e_.length?_g_(_t_,_e_[0])||_g_(_t_,_e_[1])||_g_(_t_,_e_[2]):4===_e_.length?_g_(_t_,_e_[0])||_g_(_t_,_e_[1])||_g_(_t_,_e_[2])||_g_(_t_,_e_[3]):!1,_e_.length>4&&_l_(_e_,function(_e_){_g_(_t_,_e_)&&(_n_=!0)})}}),_n_},_T_=function(_t_){var _e_=[];return T.isString(_t_)&&/[t][0-9]*[r][0-9]*/i.test(_t_)&&(_t_={___id:_t_}),T.isArray(_t_)?(_l_(_t_,function(_t_){_e_.push(_T_(_t_))}),_t_=function(){var _t_=this,_n_=!1;return _l_(_e_,function(_e_){_g_(_t_,_e_)&&(_n_=!0)}),_n_}):T.isObject(_t_)?(T.isObject(_t_)&&_t_.___id&&_t_.___s&&(_t_={___id:_t_.___id}),_f_(_t_,function(_t_,_n_){T.isObject(_t_)||(_t_={is:_t_}),_f_(_t_,function(_t_,_r_){var _i_,_s_=[];_i_="hasAll"===_r_?function(_t_,_e_){_e_(_t_)}:_l_,_i_(_t_,function(_t_){var _e_,_i_=!0;_e_=function(){var _e_,_s_=this[_n_],_u_="==",_o_="!=",_c_="===",_a_="<",_l_=">",_f_="<=",_h_=">=",_T_="!==";return"undefined"==typeof _s_?!1:(0===_r_.indexOf("!")&&_r_!==_o_&&_r_!==_T_&&(_i_=!1,_r_=_r_.substring(1,_r_.length)),_e_="regex"===_r_?_t_.test(_s_):"lt"===_r_||_r_===_a_?_t_>_s_:"gt"===_r_||_r_===_l_?_s_>_t_:"lte"===_r_||_r_===_f_?_t_>=_s_:"gte"===_r_||_r_===_h_?_s_>=_t_:"left"===_r_?0===_s_.indexOf(_t_):"leftnocase"===_r_?0===_s_.toLowerCase().indexOf(_t_.toLowerCase()):"right"===_r_?_s_.substring(_s_.length-_t_.length)===_t_:"rightnocase"===_r_?_s_.toLowerCase().substring(_s_.length-_t_.length)===_t_.toLowerCase():"like"===_r_?_s_.indexOf(_t_)>=0:"likenocase"===_r_?_s_.toLowerCase().indexOf(_t_.toLowerCase())>=0:_r_===_c_||"is"===_r_?_s_===_t_:_r_===_u_?_s_==_t_:_r_===_T_?_s_!==_t_:_r_===_o_?_s_!=_t_:"isnocase"===_r_?_s_.toLowerCase?_s_.toLowerCase()===_t_.toLowerCase():_s_===_t_:"has"===_r_?T.has(_s_,_t_):"hasall"===_r_?T.hasAll(_s_,_t_):"contains"===_r_?TAFFY.isArray(_s_)&&_s_.indexOf(_t_)>-1:-1!==_r_.indexOf("is")||TAFFY.isNull(_s_)||TAFFY.isUndefined(_s_)||TAFFY.isObject(_t_)||TAFFY.isArray(_t_)?T[_r_]&&T.isFunction(T[_r_])&&0===_r_.indexOf("is")?T[_r_](_s_)===_t_:T[_r_]&&T.isFunction(T[_r_])?T[_r_](_s_,_t_):!1:_t_===_s_[_r_],_e_=_e_&&!_i_?!1:_e_||_i_?_e_:!0)},_s_.push(_e_)}),_e_.push(1===_s_.length?_s_[0]:function(){var _t_=this,_e_=!1;return _l_(_s_,function(_n_){_n_.apply(_t_)&&(_e_=!0)}),_e_})})}),_t_=function(){var _t_=this,_n_=!0;return _n_=(1!==_e_.length||_e_[0].apply(_t_))&&(2!==_e_.length||_e_[0].apply(_t_)&&_e_[1].apply(_t_))&&(3!==_e_.length||_e_[0].apply(_t_)&&_e_[1].apply(_t_)&&_e_[2].apply(_t_))&&(4!==_e_.length||_e_[0].apply(_t_)&&_e_[1].apply(_t_)&&_e_[2].apply(_t_)&&_e_[3].apply(_t_))?!0:!1,_e_.length>4&&_l_(_e_,function(_e_){_g_(_t_,_e_)||(_n_=!1)}),_n_}):T.isFunction(_t_)?_t_:void 0},_p_=function(_t_,_e_){var _n_=function(_t_,_n_){var _r_=0;return T.each(_e_,function(_e_){var _i_,_s_,_u_,_o_,_c_;if(_i_=_e_.split(" "),_s_=_i_[0],_u_=1===_i_.length?"logical":_i_[1],"logical"===_u_)_o_=_F_(_t_[_s_]),_c_=_F_(_n_[_s_]),T.each(_o_.length<=_c_.length?_o_:_c_,function(_t_,_e_){return _o_[_e_]<_c_[_e_]?(_r_=-1,TAFFY.EXIT):_o_[_e_]>_c_[_e_]?(_r_=1,TAFFY.EXIT):void 0});else if("logicaldesc"===_u_)_o_=_F_(_t_[_s_]),_c_=_F_(_n_[_s_]),T.each(_o_.length<=_c_.length?_o_:_c_,function(_t_,_e_){return _o_[_e_]>_c_[_e_]?(_r_=-1,TAFFY.EXIT):_o_[_e_]<_c_[_e_]?(_r_=1,TAFFY.EXIT):void 0});else{if("asec"===_u_&&_t_[_s_]<_n_[_s_])return _r_=-1,T.EXIT;if("asec"===_u_&&_t_[_s_]>_n_[_s_])return _r_=1,T.EXIT;if("desc"===_u_&&_t_[_s_]>_n_[_s_])return _r_=-1,T.EXIT;if("desc"===_u_&&_t_[_s_]<_n_[_s_])return _r_=1,T.EXIT}return 0===_r_&&"logical"===_u_&&_o_.length<_c_.length?_r_=-1:0===_r_&&"logical"===_u_&&_o_.length>_c_.length?_r_=1:0===_r_&&"logicaldesc"===_u_&&_o_.length>_c_.length?_r_=-1:0===_r_&&"logicaldesc"===_u_&&_o_.length<_c_.length&&(_r_=1),0!==_r_?T.EXIT:void 0}),_r_};return _t_&&_t_.push?_t_.sort(_n_):_t_},function(){var _t_={},_e_=0;_F_=function(_n_){return _e_>_o_&&(_t_={},_e_=0),_t_["_"+_n_]||function(){var _r_,_i_,_s_,_u_=String(_n_),_o_=[],_c_="_",_a_="";for(_r_=0,_i_=_u_.length;_i_>_r_;_r_++)_s_=_u_.charCodeAt(_r_),_s_>=48&&57>=_s_||46===_s_?("n"!==_a_&&(_a_="n",_o_.push(_c_.toLowerCase()),_c_=""),_c_+=_u_.charAt(_r_)):("s"!==_a_&&(_a_="s",_o_.push(parseFloat(_c_)),_c_=""),_c_+=_u_.charAt(_r_));return _o_.push("n"===_a_?parseFloat(_c_):_c_.toLowerCase()),_o_.shift(),_t_["_"+_n_]=_o_,_e_++,_o_}()}}(),_d_=function(){this.context({results:this.getDBI().query(this.context())})},_c_.extend("filter",function(){var _t_=TAFFY.mergeObj(this.context(),{run:null}),_e_=[];return _l_(_t_.q,function(_t_){_e_.push(_t_)}),_t_.q=_e_,_l_(_x_(arguments),function(_e_){_t_.q.push(_T_(_e_)),_t_.filterRaw.push(_e_)}),this.getroot(_t_)}),_c_.extend("order",function(_t_){_t_=_t_.split(",");var _e_,_n_=[];return _l_(_t_,function(_t_){_n_.push(_t_.replace(/^\s*/,"").replace(/\s*$/,""))}),_e_=TAFFY.mergeObj(this.context(),{sort:null}),_e_.order=_n_,this.getroot(_e_)}),_c_.extend("limit",function(_t_){var _e_,_n_=TAFFY.mergeObj(this.context(),{});return _n_.limit=_t_,_n_.run&&_n_.sort&&(_e_=[],_l_(_n_.results,function(_n_,_r_){return _r_+1>_t_?TAFFY.EXIT:void _e_.push(_n_)}),_n_.results=_e_),this.getroot(_n_)}),_c_.extend("start",function(_t_){var _e_,_n_=TAFFY.mergeObj(this.context(),{});return _n_.start=_t_,_n_.run&&_n_.sort&&!_n_.limit?(_e_=[],_l_(_n_.results,function(_n_,_r_){_r_+1>_t_&&_e_.push(_n_)}),_n_.results=_e_):_n_=TAFFY.mergeObj(this.context(),{run:null,start:_t_}),this.getroot(_n_)}),_c_.extend("update",function(_t_,_e_,_n_){var _r_,_i_=!0,_s_={},_u_=_x_(arguments);return!TAFFY.isString(_t_)||2!==arguments.length&&3!==arguments.length?(_s_=_t_,2===_u_.length&&(_i_=_e_)):(_s_[_t_]=_e_,3===arguments.length&&(_i_=_n_)),_r_=this,_d_.call(this),_l_(this.context().results,function(_t_){var _e_=_s_;TAFFY.isFunction(_e_)?_e_=_e_.apply(TAFFY.mergeObj(_t_,{})):T.isFunction(_e_)&&(_e_=_e_(TAFFY.mergeObj(_t_,{}))),TAFFY.isObject(_e_)&&_r_.getDBI().update(_t_.___id,_e_,_i_)}),this.context().results.length&&this.context({run:null}),this}),_c_.extend("remove",function(_t_){var _e_=this,_n_=0;return _d_.call(this),_l_(this.context().results,function(_t_){_e_.getDBI().remove(_t_.___id),_n_++}),this.context().results.length&&(this.context({run:null}),_e_.getDBI().removeCommit(_t_)),_n_}),_c_.extend("count",function(){return _d_.call(this),this.context().results.length}),_c_.extend("callback",function(_t_,_e_){if(_t_){var _n_=this;setTimeout(function(){_d_.call(_n_),_t_.call(_n_.getroot(_n_.context()))},_e_||0)}return null}),_c_.extend("get",function(){return _d_.call(this),this.context().results}),_c_.extend("stringify",function(){return JSON.stringify(this.get())}),_c_.extend("first",function(){return _d_.call(this),this.context().results[0]||!1}),_c_.extend("last",function(){return _d_.call(this),this.context().results[this.context().results.length-1]||!1}),_c_.extend("sum",function(){var _t_=0,_e_=this;return _d_.call(_e_),_l_(_x_(arguments),function(_n_){_l_(_e_.context().results,function(_e_){_t_+=_e_[_n_]||0})}),_t_}),_c_.extend("min",function(_t_){var _e_=null;return _d_.call(this),_l_(this.context().results,function(_n_){(null===_e_||_n_[_t_]<_e_)&&(_e_=_n_[_t_])}),_e_}),function(){var _t_=function(){var _t_,_e_,_n_;return _t_=function(_t_,_e_,_n_){var _r_,_i_,_s_;switch(2===_n_.length?(_r_=_t_[_n_[0]],_s_="===",_i_=_e_[_n_[1]]):(_r_=_t_[_n_[0]],_s_=_n_[1],_i_=_e_[_n_[2]]),_s_){case"===":return _r_===_i_;case"!==":return _r_!==_i_;case"<":return _i_>_r_;case">":return _r_>_i_;case"<=":return _i_>=_r_;case">=":return _r_>=_i_;case"==":return _r_==_i_;case"!=":return _r_!=_i_;default:throw String(_s_)+" is not supported"}},_e_=function(_t_,_e_){var _n_,_r_,_i_={};for(_n_ in _t_)_t_.hasOwnProperty(_n_)&&(_i_[_n_]=_t_[_n_]);for(_n_ in _e_)_e_.hasOwnProperty(_n_)&&"___id"!==_n_&&"___s"!==_n_&&(_r_=TAFFY.isUndefined(_i_[_n_])?"":"right_",_i_[_r_+String(_n_)]=_e_[_n_]);return _i_},_n_=function(_n_){var _r_,_i_,_s_=_x_(arguments),_u_=_s_.length,_o_=[];if("function"!=typeof _n_.filter){if(!_n_.TAFFY)throw"TAFFY DB or result not supplied";_r_=_n_()}else _r_=_n_;return this.context({results:this.getDBI().query(this.context())}),TAFFY.each(this.context().results,function(_n_){_r_.each(function(_r_){var _c_,_a_=!0;t:for(_i_=1;_u_>_i_&&(_c_=_s_[_i_],_a_="function"==typeof _c_?_c_(_n_,_r_):"object"==typeof _c_&&_c_.length?_t_(_n_,_r_,_c_):!1,_a_);_i_++);_a_&&_o_.push(_e_(_n_,_r_))})}),TAFFY(_o_)()}}();_c_.extend("join",_t_)}(),_c_.extend("max",function(_t_){var _e_=null;return _d_.call(this),_l_(this.context().results,function(_n_){(null===_e_||_n_[_t_]>_e_)&&(_e_=_n_[_t_])}),_e_}),_c_.extend("select",function(){var _t_=[],_e_=_x_(arguments);return _d_.call(this),1===arguments.length?_l_(this.context().results,function(_n_){_t_.push(_n_[_e_[0]])}):_l_(this.context().results,function(_n_){var _r_=[];_l_(_e_,function(_t_){_r_.push(_n_[_t_])}),_t_.push(_r_)}),_t_}),_c_.extend("distinct",function(){var _t_=[],_e_=_x_(arguments);return _d_.call(this),1===arguments.length?_l_(this.context().results,function(_n_){var _r_=_n_[_e_[0]],_i_=!1;_l_(_t_,function(_t_){return _r_===_t_?(_i_=!0,TAFFY.EXIT):void 0}),_i_||_t_.push(_r_)}):_l_(this.context().results,function(_n_){var _r_=[],_i_=!1;_l_(_e_,function(_t_){_r_.push(_n_[_t_])}),_l_(_t_,function(_t_){var _n_=!0;return _l_(_e_,function(_e_,_i_){return _r_[_i_]!==_t_[_i_]?(_n_=!1,TAFFY.EXIT):void 0}),_n_?(_i_=!0,TAFFY.EXIT):void 0}),_i_||_t_.push(_r_)}),_t_}),_c_.extend("supplant",function(_t_,_e_){var _n_=[];return _d_.call(this),_l_(this.context().results,function(_e_){_n_.push(_t_.replace(/\{([^\{\}]*)\}/g,function(_t_,_n_){var _r_=_e_[_n_];return"string"==typeof _r_||"number"==typeof _r_?_r_:_t_}))}),_e_?_n_:_n_.join("")}),_c_.extend("each",function(_t_){return _d_.call(this),_l_(this.context().results,_t_),this}),_c_.extend("map",function(_t_){var _e_=[];return _d_.call(this),_l_(this.context().results,function(_n_){_e_.push(_t_(_n_))}),_e_}),T=function(_t_){var _e_,_n_,_r_,_i_=[],_o_={},_F_=1,_d_={template:!1,onInsert:!1,onUpdate:!1,onRemove:!1,onDBChange:!1,storageName:!1,forcePropertyCase:null,cacheSize:100,name:""},_A_=new Date,_v_=0,_m_=0,___={};return _n_=function(_t_){var _e_=[],_r_=!1;return 0===_t_.length?_i_:(_l_(_t_,function(_t_){T.isString(_t_)&&/[t][0-9]*[r][0-9]*/i.test(_t_)&&_i_[_o_[_t_]]&&(_e_.push(_i_[_o_[_t_]]),_r_=!0),T.isObject(_t_)&&_t_.___id&&_t_.___s&&_i_[_o_[_t_.___id]]&&(_e_.push(_i_[_o_[_t_.___id]]),_r_=!0),T.isArray(_t_)&&_l_(_t_,function(_t_){_l_(_n_(_t_),function(_t_){_e_.push(_t_)})})}),_r_&&_e_.length>1&&(_e_=[]),_e_)},_e_={dm:function(_t_){return _t_&&(_A_=_t_,___={},_v_=0,_m_=0),_d_.onDBChange&&setTimeout(function(){_d_.onDBChange.call(_i_)},0),_d_.storageName&&setTimeout(function(){localStorage.setItem("taffy_"+_d_.storageName,JSON.stringify(_i_))}),_A_},insert:function(_t_,_n_){var _c_=[],_h_=[],_T_=_a_(_t_);return _l_(_T_,function(_t_,_r_){var _a_,_T_;return T.isArray(_t_)&&0===_r_?(_l_(_t_,function(_t_){_c_.push("lower"===_d_.forcePropertyCase?_t_.toLowerCase():"upper"===_d_.forcePropertyCase?_t_.toUpperCase():_t_)}),!0):(T.isArray(_t_)?(_a_={},_l_(_t_,function(_t_,_e_){_a_[_c_[_e_]]=_t_}),_t_=_a_):T.isObject(_t_)&&_d_.forcePropertyCase&&(_T_={},_f_(_t_,function(_e_,_n_){_T_["lower"===_d_.forcePropertyCase?_n_.toLowerCase():"upper"===_d_.forcePropertyCase?_n_.toUpperCase():_n_]=_t_[_n_]}),_t_=_T_),_F_++,_t_.___id="T"+String(_u_+_s_).slice(-6)+"R"+String(_u_+_F_).slice(-6),_t_.___s=!0,_h_.push(_t_.___id),_d_.template&&(_t_=T.mergeObj(_d_.template,_t_)),_i_.push(_t_),_o_[_t_.___id]=_i_.length-1,_d_.onInsert&&(_n_||TAFFY.isUndefined(_n_))&&_d_.onInsert.call(_t_),void _e_.dm(new Date))}),_r_(_h_)},sort:function(_t_){return _i_=_p_(_i_,_t_.split(",")),_o_={},_l_(_i_,function(_t_,_e_){_o_[_t_.___id]=_e_}),_e_.dm(new Date),!0},update:function(_t_,_n_,_r_){var _s_,_u_,_c_,_a_,_l_={};_d_.forcePropertyCase&&(_f_(_n_,function(_t_,_e_){_l_["lower"===_d_.forcePropertyCase?_e_.toLowerCase():"upper"===_d_.forcePropertyCase?_e_.toUpperCase():_e_]=_t_}),_n_=_l_),_s_=_i_[_o_[_t_]],_u_=T.mergeObj(_s_,_n_),_c_={},_a_=!1,_f_(_u_,function(_t_,_e_){(TAFFY.isUndefined(_s_[_e_])||_s_[_e_]!==_t_)&&(_c_[_e_]=_t_,_a_=!0)}),_a_&&(_d_.onUpdate&&(_r_||TAFFY.isUndefined(_r_))&&_d_.onUpdate.call(_u_,_i_[_o_[_t_]],_c_),_i_[_o_[_t_]]=_u_,_e_.dm(new Date))},remove:function(_t_){_i_[_o_[_t_]].___s=!1},removeCommit:function(_t_){var _n_;for(_n_=_i_.length-1;_n_>-1;_n_--)_i_[_n_].___s||(_d_.onRemove&&(_t_||TAFFY.isUndefined(_t_))&&_d_.onRemove.call(_i_[_n_]),_o_[_i_[_n_].___id]=void 0,_i_.splice(_n_,1));_o_={},_l_(_i_,function(_t_,_e_){_o_[_t_.___id]=_e_}),_e_.dm(new Date)},query:function(_t_){var _r_,_s_,_u_,_o_,_c_,_a_;if(_d_.cacheSize&&(_s_="",_l_(_t_.filterRaw,function(_t_){return T.isFunction(_t_)?(_s_="nocache",TAFFY.EXIT):void 0}),""===_s_&&(_s_=_y_(T.mergeObj(_t_,{q:!1,run:!1,sort:!1})))),!_t_.results||!_t_.run||_t_.run&&_e_.dm()>_t_.run){if(_u_=[],_d_.cacheSize&&___[_s_])return ___[_s_].i=_v_++,___[_s_].results;0===_t_.q.length&&0===_t_.index.length?(_l_(_i_,function(_t_){_u_.push(_t_)}),_r_=_u_):(_o_=_n_(_t_.index),_l_(_o_,function(_e_){(0===_t_.q.length||_g_(_e_,_t_.q))&&_u_.push(_e_)}),_r_=_u_)}else _r_=_t_.results;return!(_t_.order.length>0)||_t_.run&&_t_.sort||(_r_=_p_(_r_,_t_.order)),_r_.length&&(_t_.limit&&_t_.limit<_r_.length||_t_.start)&&(_c_=[],_l_(_r_,function(_e_,_n_){if(!_t_.start||_t_.start&&_n_+1>=_t_.start)if(_t_.limit){if(_a_=_t_.start?_n_+1-_t_.start:_n_,_a_<_t_.limit)_c_.push(_e_);else if(_a_>_t_.limit)return TAFFY.EXIT}else _c_.push(_e_)}),_r_=_c_),_d_.cacheSize&&"nocache"!==_s_&&(_m_++,setTimeout(function(){var _t_,_e_;_m_>=2*_d_.cacheSize&&(_m_=0,_t_=_v_-_d_.cacheSize,_e_={},_f_(function(_n_,_r_){_n_.i>=_t_&&(_e_[_r_]=_n_)}),___=_e_)},0),___[_s_]={i:_v_++,results:_r_}),_r_}},_r_=function(){var _t_,_n_;return _t_=TAFFY.mergeObj(TAFFY.mergeObj(_c_,{insert:void 0}),{getDBI:function(){return _e_},getroot:function(_t_){return _r_.call(_t_)},context:function(_t_){return _t_&&(_n_=TAFFY.mergeObj(_n_,_t_.hasOwnProperty("results")?TAFFY.mergeObj(_t_,{run:new Date,sort:new Date}):_t_)),_n_},extend:void 0}),_n_=this&&this.q?this:{limit:!1,start:!1,q:[],filterRaw:[],index:[],order:[],results:!1,run:null,sort:null,settings:_d_},_l_(_x_(arguments),function(_t_){_h_(_t_)?_n_.index.push(_t_):_n_.q.push(_T_(_t_)),_n_.filterRaw.push(_t_)}),_t_},_s_++,_t_&&_e_.insert(_t_),_r_.insert=_e_.insert,_r_.merge=function(_t_,_n_,_i_){var _s_={},_u_=[],_o_={};return _i_=_i_||!1,_n_=_n_||"id",_l_(_t_,function(_t_){var _o_;_s_[_n_]=_t_[_n_],_u_.push(_t_[_n_]),_o_=_r_(_s_).first(),_o_?_e_.update(_o_.___id,_t_,_i_):_e_.insert(_t_,_i_)}),_o_[_n_]=_u_,_r_(_o_)},_r_.TAFFY=!0,_r_.sort=_e_.sort,_r_.settings=function(_t_){return _t_&&(_d_=TAFFY.mergeObj(_d_,_t_),_t_.template&&_r_().update(_t_.template)),_d_},_r_.store=function(_t_){var _e_,_n_=!1;return localStorage&&(_t_&&(_e_=localStorage.getItem("taffy_"+_t_),_e_&&_e_.length>0&&(_r_.insert(_e_),_n_=!0),_i_.length>0&&setTimeout(function(){localStorage.setItem("taffy_"+_d_.storageName,JSON.stringify(_i_))})),_r_.settings({storageName:_t_})),_r_},_r_},TAFFY=T,T.each=_l_,T.eachin=_f_,T.extend=_c_.extend,TAFFY.EXIT="TAFFYEXIT",TAFFY.mergeObj=function(_t_,_e_){var _n_={};return _f_(_t_,function(_e_,_r_){_n_[_r_]=_t_[_r_]}),_f_(_e_,function(_t_,_r_){_n_[_r_]=_e_[_r_]}),_n_},TAFFY.has=function(_t_,_e_){var _n_,_r_=!1;if(_t_.TAFFY)return _r_=_t_(_e_),_r_.length>0?!0:!1;switch(T.typeOf(_t_)){case"object":if(T.isObject(_e_))_f_(_e_,function(_n_,_i_){return _r_!==!0||T.isUndefined(_t_[_i_])||!_t_.hasOwnProperty(_i_)?(_r_=!1,TAFFY.EXIT):void(_r_=T.has(_t_[_i_],_e_[_i_]))});else if(T.isArray(_e_))_l_(_e_,function(_n_,_i_){return _r_=T.has(_t_,_e_[_i_]),_r_?TAFFY.EXIT:void 0});else if(T.isString(_e_))return TAFFY.isUndefined(_t_[_e_])?!1:!0;return _r_;case"array":if(T.isObject(_e_))_l_(_t_,function(_n_,_i_){return _r_=T.has(_t_[_i_],_e_),_r_===!0?TAFFY.EXIT:void 0});else if(T.isArray(_e_))_l_(_e_,function(_n_,_i_){return _l_(_t_,function(_n_,_s_){return _r_=T.has(_t_[_s_],_e_[_i_]),_r_===!0?TAFFY.EXIT:void 0}),_r_===!0?TAFFY.EXIT:void 0});else if(T.isString(_e_)||T.isNumber(_e_))for(_r_=!1,_n_=0;_n_<_t_.length;_n_++)if(_r_=T.has(_t_[_n_],_e_))return!0;return _r_;case"string":if(T.isString(_e_)&&_e_===_t_)return!0;break;default:if(T.typeOf(_t_)===T.typeOf(_e_)&&_t_===_e_)return!0}return!1},TAFFY.hasAll=function(_t_,_e_){var _n_,_r_=TAFFY;return _r_.isArray(_e_)?(_n_=!0,_l_(_e_,function(_e_){return _n_=_r_.has(_t_,_e_),_n_===!1?TAFFY.EXIT:void 0}),_n_):_r_.has(_t_,_e_)},TAFFY.typeOf=function(_t_){var _e_=typeof _t_;return"object"===_e_&&(_t_?"number"!=typeof _t_.length||_t_.propertyIsEnumerable("length")||(_e_="array"):_e_="null"),_e_},TAFFY.getObjectKeys=function(_t_){var _e_=[];return _f_(_t_,function(_t_,_n_){_e_.push(_n_)}),_e_.sort(),_e_},TAFFY.isSameArray=function(_t_,_e_){return TAFFY.isArray(_t_)&&TAFFY.isArray(_e_)&&_t_.join(",")===_e_.join(",")?!0:!1},TAFFY.isSameObject=function(_t_,_e_){var _n_=TAFFY,_r_=!0;return _n_.isObject(_t_)&&_n_.isObject(_e_)&&_n_.isSameArray(_n_.getObjectKeys(_t_),_n_.getObjectKeys(_e_))?_f_(_t_,function(_i_,_s_){return _n_.isObject(_t_[_s_])&&_n_.isObject(_e_[_s_])&&_n_.isSameObject(_t_[_s_],_e_[_s_])||_n_.isArray(_t_[_s_])&&_n_.isArray(_e_[_s_])&&_n_.isSameArray(_t_[_s_],_e_[_s_])||_t_[_s_]===_e_[_s_]?void 0:(_r_=!1,TAFFY.EXIT)}):_r_=!1,_r_},_t_=["String","Number","Object","Array","Boolean","Null","Function","Undefined"],_e_=function(_t_){return function(_e_){return TAFFY.typeOf(_e_)===_t_.toLowerCase()?!0:!1}},_n_=0;_n_<_t_.length;_n_++)_r_=_t_[_n_],TAFFY["is"+_r_]=_e_(_r_)}(),"object"==typeof exports&&(exports.taffy=TAFFY);


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