fix code-demos todos, fix about page

Author: ALEX-ANV

apps/codelab/src/app/codelabs/about/about.component.html

@@ -138,8 +138,7 @@ <h2>We don't. We use highlight instead</h2>
 
   <div *slide>
     <h2>Find position by regex or string</h2>
-<!--    TODO(sancheez): check-->
-<!--    <code-demo-editor [(ngModel)]="code.highlights.find"></code-demo-editor>-->
+    <code-demo-editor [(ngModel)]="code.highlights.find"></code-demo-editor>
   </div>
 
   <div *slide>

apps/codelab/src/app/codelabs/about/about.component.ts

@@ -32,12 +32,13 @@ export class AboutComponent implements OnInit {
       },
     },
     highlights: {
-      // find: require('!!raw-loader!@codelab/code-demos/src/lib/code-demo-editor/utils/utils')
-      //   .default,
+      find: require('!!raw-loader!./samples/find-position.ts.file')
+        .default,
     },
   };
 
-  constructor() {}
+  constructor() {
+  }
 
   ngOnInit() {}
 }

apps/codelab/src/app/codelabs/about/about.module.ts

@@ -5,11 +5,12 @@ import { FormsModule } from '@angular/forms';
 import { CodeDemoModule } from '@codelab/code-demos';
 import { SlidesModule, SlidesRoutes } from '@codelab/slides';
 import { AboutComponent } from './about.component';
+import { TrackingModule } from '@codelab/utils';
 
 const routes = RouterModule.forChild(SlidesRoutes.get(AboutComponent));
 
 @NgModule({
   declarations: [AboutComponent],
-  imports: [CommonModule, SlidesModule, routes, CodeDemoModule, FormsModule],
+  imports: [CommonModule, SlidesModule, routes, CodeDemoModule, FormsModule, TrackingModule]
 })
 export class AboutModule {}

apps/codelab/src/app/codelabs/about/samples/find-position.ts.file

@@ -0,0 +1,23 @@
+export function findPosition(code: string, match: string | RegExp) {
+  if (match instanceof RegExp) {
+    try {
+      match = code.match(match)[0];
+    } catch (e) {
+
+      debugger;
+      match = '';
+    }
+  }
+
+  const textBeforeMatch = code.split(match as any)[0];
+  const lineStart = textBeforeMatch.split('\n').length;
+  const lineStartPosition =
+    textBeforeMatch.lastIndexOf('\n') + /*compensate for \n */ 1;
+  const indexStart = textBeforeMatch.length - lineStartPosition + 1;
+  const lastMatchNewLinePosition = match.lastIndexOf('\n') + 1;
+  const lineEnd = lineStart + match.split('\n').length - 1;
+  const indexEnd = match.includes('\n')
+    ? match.length - lastMatchNewLinePosition
+    : indexStart + match.length;
+  return { lineStart, indexStart, indexEnd, lineEnd };
+}

libs/sync/src/lib/components/sync-code-game/sync-code-game-viewer/sync-code-game-viewer.component.html

@@ -1,8 +1,7 @@
-<!--TODO(sancheez): circle deps-->
-<!--<code-demo-editor-->
-<!--  fontSize="20"-->
-<!--  [(ngModel)]="questions[0].code"-->
-<!--&gt;</code-demo-editor>-->
+<code-demo-editor
+  fontSize="20"
+  [(ngModel)]="questions[0].code"
+></code-demo-editor>
 <!--      <slides-typescript-checker-runner-->
 <!--        [code]="q.code"-->
 <!--      ></slides-typescript-checker-runner>-->

libs/utils/src/lib/index.ts

@@ -1,3 +1,5 @@
+export { TrackingDirective } from './tracking/tracking.directive';
+export { TrackingModule } from './tracking/tracking.module';
 export { SimpleTestsProgressComponent } from './test-results/simple-tests-progress/simple-tests-progress.component';
 export { SimpleTestsProgressModule } from './test-results/simple-tests-progress/simple-tests-progress.module';
 export { getMockAngularFireProviders } from './testing/mocks/angular-fire';

libs/utils/src/lib/tracking/tracking.directive.ts

@@ -19,7 +19,7 @@ export class TrackingDirective {
     private router: Router,
     private presentation: SlidesDeckComponent
   ) {
-    afAuth.auth.signInAnonymously();
+    afAuth.signInAnonymously();
     afAuth.authState.subscribe((authData) => {
       this.auth = authData;
     });