Skip to content

Commit

Permalink
Merge pull request #4 from oslabs-beta/Emin
Browse files Browse the repository at this point in the history 
Emin
  • Loading branch information
@SamuelTr13
SamuelTr13 authored Oct 12, 2022
2 parents c2785e1 + b5e6763 commit 5c39744
Show file tree
Hide file tree
Showing 3 changed files with 298 additions and 322 deletions.
20 changes: 10 additions & 10 deletions src/backend/helpers.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,9 +24,9 @@ export const throttle = (callback: Function, ms: number): Function => {
let isOnCooldown = false;
let isCallQueued = false;

// Wrap the passed-in function, f, in a callback function that "throttles"
// (puts a limit on) the number of calls that can be made to function, f
// in a given period of time (ms), t
// Wrap the passed-in function callback in a callback function that "throttles"
// (puts a limit on) the number of calls that can be made to function
// in a given period of time (ms)
const throttledFunc = (): any => {
// CASE 1: In cooldown mode and we already have a function waiting to be executed,
// so do nothing
Expand All @@ -40,7 +40,7 @@ export const throttle = (callback: Function, ms: number): Function => {
}

// CASE 3: If we are ready to "fire":
// Execute the function, f, immediately
// Execute the function callback immediately
callback();
// Initiate a new cooldown period and reset the "call queue"
isOnCooldown = true;
Expand All @@ -51,7 +51,7 @@ export const throttle = (callback: Function, ms: number): Function => {
const runAfterTimeout = (): any => {
if (isCallQueued) {
isCallQueued = false;
isOnCooldown = true; // not needed I think
isOnCooldown = true;
callback();
setTimeout(runAfterTimeout, ms);
return;
Expand All @@ -68,7 +68,7 @@ export const throttle = (callback: Function, ms: number): Function => {
// Helper function to grab the getters/setters from `elementType`
/**
* @method getHooksNames
* @param elementType The fiber `type`, A stringified function of the component the Fiber whose hooks we want corresponds to
* @param elementType The fiber `type`, A stringified function of the component, the Fiber whose hooks we want corresponds to
* @returns An array of strings
*/
export const getHooksNames = (elementType: string): Array<string> => {
Expand All @@ -95,11 +95,11 @@ export const getHooksNames = (elementType: string): Array<string> => {
* Iterate through AST of every function declaration
* Check within each function declaration if there are hook declarations */
ast.forEach(functionDec => {
let body: any;
if (functionDec.expression && functionDec.expression.body) body = functionDec.expression.body.body;
else body = functionDec.body ? functionDec.body.body : [];
let declarationBody: any;
if (functionDec.expression && functionDec.expression.body) declarationBody = functionDec.expression.body.body; // check if functionDec.expression.body exists, then set declarationBody to functionDec's body
else declarationBody = functionDec.body ? functionDec.body.body : [];
// Traverse through the function's funcDecs and Expression Statements
body.forEach((elem: any) => {
declarationBody.forEach((elem: any) => {
// Hooks will always be contained in a variable declaration
if (elem.type === 'VariableDeclaration') {
elem.declarations.forEach((hook: any) => {
Expand Down
49 changes: 9 additions & 40 deletions src/backend/index.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,12 +7,12 @@
* 'reactime' module has a single export
* @function linkFiber
*/

// regenerator runtime supports async functionality
import 'regenerator-runtime/runtime';
import linkFiberStart from './linkFiber';
import timeJumpStart from './timeJump';
import {
Snapshot, Mode, SnapshotNode, MsgData,
Snapshot, Mode, MsgData,
} from './types/backendTypes';

// * State snapshot object initialized here
Expand All @@ -26,57 +26,26 @@ const mode: Mode = {
paused: false,
};

// linkFiber is now assigned the default function exported from the file linkFiber.ts
const linkFiber = linkFiberStart(snapShot, mode);
// timeJump is now assigned the default function exported from the file timeJump.ts
const timeJump = timeJumpStart(snapShot, mode);

// * Event listener for time-travel actions
window.addEventListener('message', ({ data: { action, payload } }: MsgData) => {
switch (action) {
case 'jumpToSnap':
timeJump(payload, true); // * This sets state with given payload
// Get the pathname from payload and add new entry to browser history
// MORE: https://developer.mozilla.org/en-US/docs/Web/API/History/pushState
// try to modify workInProgress tree from here
// window.history.pushState('', '', getRouteURL(payload));
timeJump(payload, true); // * This sets state with given payloa
break;

case 'setPause':
mode.paused = payload;
break;
// maybe this isn't work react cohort 45
// case 'onHover':
// if (Array.isArray(payload)) {
// for (let i = 0; i < payload.length; i + 1) {
// const element = document.getElementById(payload[i]);
// if (element !== null) {
// element.style.backgroundColor = '#C0D9D9';
// }
// }
// } else {
// const element: HTMLElement = document.querySelector(`.${payload}`);
// if (element !== null) {
// element.style.backgroundColor = '#C0D9D9';
// }
// }
// break;
// // maybe this isn't work react cohort 45
// case 'onHoverExit':
// if (Array.isArray(payload)) {
// for (let i = 0; i < payload.length; i++) {
// const element: HTMLElement = document.querySelector(`.${payload}`);
// if (element !== null) {
// element.style.backgroundColor = '';
// }
// }
// } else {
// const element: HTMLElement = document.querySelector(`.${payload}`);
// if (element !== null) {
// element.style.backgroundColor = '';
// }
// }
// break;

default:
break;
}
});
// connect to dev tools and new fiber
// connect to dev tools and new fiber,
// invokes anonymous function from linkFiber.ts set to linkFiber on line 30
linkFiber();
Loading

0 comments on commit 5c39744

Please sign in to comment.