some changes on the example app

ramiz4 · Dec 21, 2019 · 0c1c9e6 · 0c1c9e6
1 parent bf486bb
commit 0c1c9e6
Show file tree

Hide file tree

Showing 6 changed files with 28 additions and 18 deletions.
diff --git a/apps/multi-level-push-menu-example/src/app/app.component.html b/apps/multi-level-push-menu-example/src/app/app.component.html
@@ -1,10 +1,9 @@
 <ramiz4-multi-level-push-menu [options]="options">
 
+  <h1>{{title}}</h1>
   <button (click)="collapseMenu()">collapse menu</button>
   <button (click)="expandMenu()">expand menu</button>
 
   <router-outlet></router-outlet>
 
 </ramiz4-multi-level-push-menu>
-
-<!-- <button (click)="addTodo()">Add Todo</button> -->
diff --git a/apps/multi-level-push-menu-example/src/app/app.component.spec.ts b/apps/multi-level-push-menu-example/src/app/app.component.spec.ts
@@ -2,10 +2,15 @@ import { TestBed, async } from '@angular/core/testing';
 import { AppComponent } from './app.component';
 import { RouterTestingModule } from '@angular/router/testing';
 
+import { NgxMultiLevelPushMenuModule } from "@ramiz4/ngx-multi-level-push-menu";
+
 describe('AppComponent', () => {
   beforeEach(async(() => {
     TestBed.configureTestingModule({
-      imports: [RouterTestingModule],
+      imports: [
+        RouterTestingModule,
+        NgxMultiLevelPushMenuModule.forRoot()
+      ],
       declarations: [AppComponent]
     }).compileComponents();
   }));
@@ -22,12 +27,12 @@ describe('AppComponent', () => {
     expect(app.title).toEqual('multi-level-push-menu-example');
   });
 
-  it('should render title', () => {
-    const fixture = TestBed.createComponent(AppComponent);
-    fixture.detectChanges();
-    const compiled = fixture.debugElement.nativeElement;
-    expect(compiled.querySelector('h1').textContent).toContain(
-      'Welcome to multi-level-push-menu-example!'
-    );
-  });
+   it('should render title', () => {
+     const fixture = TestBed.createComponent(AppComponent);
+     fixture.detectChanges();
+     const compiled = fixture.debugElement.nativeElement;
+     expect(compiled.querySelector('h1').textContent).toContain(
+       'Welcome to multi-level-push-menu-example!'
+     );
+   });
 });
diff --git a/apps/multi-level-push-menu-example/src/app/app.component.ts b/apps/multi-level-push-menu-example/src/app/app.component.ts
@@ -8,6 +8,8 @@ import { MultiLevelPushMenuService, MultiLevelPushMenuOptions } from '@ramiz4/ng
 })
 export class AppComponent implements OnInit {
 
+  title = 'multi-level-push-menu-example';
+
   options = new MultiLevelPushMenuOptions();
 
   constructor(private multiLevelPushMenuService: MultiLevelPushMenuService) { }

diff --git a/libs/ngx-multi-level-push-menu/package.json b/libs/ngx-multi-level-push-menu/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ramiz4/ngx-multi-level-push-menu",
-  "version": "2.0.5",
+  "version": "2.0.6",
   "description": "a package manager for JavaScript",
   "homepage": "https://github.com/ramiz4/ngx-multi-level-push-menu#readme",
   "author": "Ramiz Loki <me@ramizloki.com> (https://ramizloki.com)",

diff --git a/...gx-multi-level-push-menu/src/lib/multi-level-push-menu/multi-level-push-menu.component.ts b/...gx-multi-level-push-menu/src/lib/multi-level-push-menu/multi-level-push-menu.component.ts
@@ -1,10 +1,12 @@
-import { Component, OnDestroy, Input, ViewChild, OnInit, ElementRef } from '@angular/core';
+import { Component, OnDestroy, Input, ViewChild, OnInit, ElementRef, Renderer2 } from '@angular/core';
 import { Router } from '@angular/router';
 import { Subscription } from 'rxjs';
 
 import { MultiLevelPushMenuService } from './multi-level-push-menu.service';
 import { MultiLevelPushMenuOptions } from './multi-level-push-menu.model';
 
+// todo: add jquery plugin typings for multilevelpushmenu
+// import * as $ from 'jquery';
 declare var $: any;
 
 @Component({
@@ -35,7 +37,9 @@ export class MultiLevelPushMenuComponent implements OnInit, OnDestroy {
   collapseSubscription: Subscription;
   expandSubscription: Subscription;
 
-  constructor(private router: Router, private multiLevelPushMenuService: MultiLevelPushMenuService) {
+  constructor(private renderer: Renderer2,
+              private router: Router, 
+              private multiLevelPushMenuService: MultiLevelPushMenuService) {
     this.menu = new ElementRef({});
     this.content = new ElementRef({});
 
@@ -57,9 +61,9 @@ export class MultiLevelPushMenuComponent implements OnInit, OnDestroy {
     if (!options.menuWidth) {
       options.menuWidth = '300px';
     }
-    const offsetLeft = 'calc(' + options.menuWidth + ' + 20px)';
-    $(this.content.nativeElement).css('left', offsetLeft);
-    $(this.content.nativeElement).css('width', 'calc(100% - (' + options.menuWidth + ' + 20px))');
+
+    this.renderer.setStyle(this.content.nativeElement, 'left', 'calc(' + options.menuWidth + ' + 20px)');
+    this.renderer.setStyle(this.content.nativeElement, 'width', 'calc(100% - (' + options.menuWidth + ' + 20px))');
 
     const router = this.router;
 

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ramiz4",
-  "version": "2.0.5",
+  "version": "2.0.6",
   "license": "MIT",
   "repository": {
     "type": "git",