Skip to content

B
business-java
Commit 217c4c52 authored by prumde's avatar prumde
Browse files
Options

Updates for Carousal, Password Encryption and Material CSS 


git-svn-id: http://15.206.35.175/svn/proteus/business-java/trunk@174363 ce508802-f39f-4f6c-b175-0d175dae99d5
parent 9b881c13
Hide whitespace changes
Inline Side-by-side
Showing with 548 additions and 282 deletions
ecm/Angular/ProteusECM/trunk/src/app/app.module.ts
View file @ 217c4c52
......@@ -9,6 +9,9 @@ import { RouterModule, Routes } from '@angular/router';
import {CATEGORY,SUBCATEGORY,ITEM} from './ecm-store/ecm-store';
import {StoreModule} from '@ngrx/store';
import { MaterialModule } from '@angular/material';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { AppComponent } from './app.component';
import { NgbCarouselModule } from './ecm-carousel/carousel.module';
import { ECMHeaderComponent } from './ecm-header/ecm-header.component';
......@@ -29,7 +32,6 @@ import { ScrollService } from './scroll.service';
import { EcmImageComponent } from './ecm-image/ecm-image.component';
import { EcmSigninComponent } from './ecm-signin/ecm-signin.component';
import { EcmUserOptionComponent } from './ecm-user-option/ecm-user-option.component';
import { EcmInputComponent } from './ecm-input/ecm-input.component';
import { EcmSearchResultComponent } from './ecm-search/ecm-search-result/ecm-search-result.component';
import { SearchService } from './ecm-search/ecm-search-result/search.service';
import { EcmBreadcrumbsComponent } from './ecm-breadcrumbs/ecm-breadcrumbs.component';
......@@ -63,7 +65,6 @@ const appRoutes: Routes = [
EcmImageComponent,
EcmSigninComponent,
EcmUserOptionComponent,
EcmInputComponent,
EcmSearchResultComponent,
EcmBreadcrumbsComponent
],
......@@ -74,7 +75,9 @@ const appRoutes: Routes = [
RouterModule.forRoot(appRoutes),
NgbCarouselModule.forRoot(),
ReactiveFormsModule,
StoreModule.provideStore({CATEGORY,SUBCATEGORY,ITEM})
StoreModule.provideStore({CATEGORY,SUBCATEGORY,ITEM}),
MaterialModule,
BrowserAnimationsModule
],
providers: [
{provide: LocationStrategy, useClass: HashLocationStrategy},
......
ecm/Angular/ProteusECM/trunk/src/app/ecm-card/ecm-card.component.html
View file @ 217c4c52
......@@ -6,12 +6,8 @@
<span class="ecm-card-info-title">{{card.info_title}}</span>
<span class="ecm-card-info-subhead">{{card.info_subhead}}</span>
</div>
<!-- Currently Default Actions will be View and Share
<a class="ecm-card-action" routerLink="/view" routerLinkActive="active">View</a>
<a class="ecm-card-action top share" routerLink="/share" routerLinkActive="active"></a>
-->
<a *ngIf="card.info_link" class="ecm-card-action"[routerLink]="['link', card.info_title]">Open</a>
<a *ngIf="!card.info_link" class="ecm-card-action">Open</a>
<a md-raised-button *ngIf="!card.info_link" class="ecm-card-action">Open</a>
<a *ngIf="!card.info_link" class="ecm-card-action top share"></a>
</div>
</div>
......@@ -20,18 +16,13 @@
<!-- <img class="ecm-card-img"src="{{category.resourceUrl}}{{category.catCode}}.png"alt="Category image"> -->
<ecm-image [refId]='category.catCode' [refSer]="'ECMCAT'" [object]="'ECM_CATEGORY'" [attachType]="'Image'"></ecm-image>
<div class="ecm-card-footer">
<!-- <img class="ecm-card-info-img"src="{{category.resourceUrl}}{{category.catCode}}_icon.png"alt="Category icon" /> -->
<ecm-image [refId]='category.catCode' [refSer]="'ECMCAT'" [object]="'ECM_CATEGORY'" [attachType]="'Icon'"></ecm-image>
<div class="ecm-card-info">
<span class="ecm-card-info-title">{{category.shDescr}}</span>
<span class="ecm-card-info-subhead">{{category.descr}}</span>
</div>
<!-- Currently Default Actions will be View and Share
<a class="ecm-card-action" routerLink="/view" routerLinkActive="active">View</a>
<a class="ecm-card-action top share" routerLink="/share" routerLinkActive="active"></a>
-->
<a *ngIf="category.catLink" class="ecm-card-action" [routerLink]="['link', category.shDescr]">Open</a>
<a *ngIf="!category.catLink" class="ecm-card-action" (click)="storeCategory()">View</a>
<a md-raised-button *ngIf="!category.catLink" class="ecm-card-action" (click)="storeCategory()">View</a>
<a *ngIf="!category.catLink" class="ecm-card-action top share" [routerLink]="[ '/share','SUB_CATEGORY',category.catCode]"></a>
</div>
</div>
......@@ -40,18 +31,13 @@
<!-- <img class="ecm-card-img"src="{{subcategory.resourceUrl}}{{subcategory.scatCode}}.png"alt="Category image">-->
<ecm-image [refId]="subcategory.scatCode + ':' + subcategory.catCode" [refSer]="'ECMCAT'" [object]="'ECM_CATEGORY'" [attachType]="'Image'"></ecm-image>
<div class="ecm-card-footer">
<!-- <img class="ecm-card-info-img"src="{{subcategory.resourceUrl}}{{subcategory.catCode}}_icon.png"alt="Category icon" /> -->
<ecm-image [refId]='subcategory.catCode' [refSer]="'ECMCAT'" [object]="'ECM_CATEGORY'" [attachType]="'Icon'"></ecm-image>
<div class="ecm-card-info">
<span class="ecm-card-info-title">{{subcategory.shDescr}}</span>
<span class="ecm-card-info-subhead">{{subcategory.descr}}</span>
</div>
<!-- Currently Default Actions will be View and Share
<a class="ecm-card-action" routerLink="/view" routerLinkActive="active">View</a>
<a class="ecm-card-action top share" routerLink="/share" routerLinkActive="active"></a>
-->
<a *ngIf="subcategory.catLink" class="ecm-card-action" [routerLink]="['link', subcategory.shDescr]">Open</a>
<a *ngIf="!subcategory.catLink" class="ecm-card-action" (click)="storeSubCategory()">View</a>
<a md-raised-button *ngIf="!subcategory.catLink" class="ecm-card-action" (click)="storeSubCategory()">View</a>
<a *ngIf="!subcategory.catLink" class="ecm-card-action top share" [routerLink]="[ '/share','ITEMS',subcategory.scatCode]"></a>
</div>
</div>
......@@ -62,7 +48,7 @@
<div class="ecm-card-info" id="ecm-item-info">
<span id="ecm-item-info-title" class="ecm-card-info-title">{{itemData.descr}}</span>
<span *ngIf="itemData.cat_sh_descr && itemData.scat_sh_descr" class="ecm-card-info-subhead" id="ecm-item-info-subhead">{{itemData.cat_sh_descr}} - {{itemData.scat_sh_descr}}</span>
<span *ngIf="!itemData.cat_sh_descr && !itemData.scat_sh_descr" class="ecm-card-info-subhead" id="ecm-item-info-subhead">{{extraParam.catShDesc}} - {{extraParam.scatDesc}}</span>
<span *ngIf="extraParam && !itemData.cat_sh_descr && !itemData.scat_sh_descr" class="ecm-card-info-subhead" id="ecm-item-info-subhead">{{extraParam.catShDesc}} - {{extraParam.scatDesc}}</span>
<span class="ecm-ratings">
<span *ngFor="let a of createRatings(itemData.rating);">&#x2605;</span>
</span>
......
ecm/Angular/ProteusECM/trunk/src/app/ecm-category/ecm-breadcrumb.component.ts 0 → 100755
View file @ 217c4c52
import { Component, OnInit } from "@angular/core";
import { Router, ActivatedRoute, NavigationEnd, Params, PRIMARY_OUTLET } from "@angular/router";
import "rxjs/add/operator/filter";
interface IBreadcrumb {
label: string;
params: Params;
url: string;
}
@Component({
selector: "breadcrumb",
template: `
<style>
.breadcrumbs li:not(:last-child)::after {
color: #cacaca;
content: "/";
margin: 0 0.75rem;
position: relative;
top: 1px;
opacity: 1;
}
</style>
<ul class="breadcrumbs">
<li *ngFor="let breadcrumb of breadcrumbs">
<a [routerLink]="[breadcrumb.url, breadcrumb.params]">{{breadcrumb.label}}</a>
</li>
</ul>
`
})
export class ECMBreadcrumbComponent implements OnInit {
public breadcrumbs: IBreadcrumb[];
/**
* @class DetailComponent
* @constructor
*/
constructor(
private activatedRoute: ActivatedRoute,
private router: Router
) {
this.breadcrumbs = [];
}
/**
* Let's go!
*
* @class DetailComponent
* @method ngOnInit
*/
ngOnInit() {
const ROUTE_DATA_BREADCRUMB: string = "breadcrumb";
//subscribe to the NavigationEnd event
this.router.events.filter(event => event instanceof NavigationEnd).subscribe(event => {
//set breadcrumbs
console.log( "ECMBreadcrumbComponent > this.activatedRoute> " + this.activatedRoute );
this.breadcrumbs = this.getBreadcrumbs(this.activatedRoute);
console.log( "ECMBreadcrumbComponent > breadcrumbs> " + this.breadcrumbs );
});
}
/**
* Returns array of IBreadcrumb objects that represent the breadcrumb
*
* @class DetailComponent
* @method getBreadcrumbs
* @param {ActivateRoute} route
* @param {string} url
* @param {IBreadcrumb[]} breadcrumbs
*/
private getBreadcrumbs(route: ActivatedRoute): IBreadcrumb[] {
const ROUTE_DATA_BREADCRUMB: string = "breadcrumb";
let breadcrumbs: IBreadcrumb[] = [];
console.log( "ECMBreadcrumbComponent > route> " + route );
//iterate over each children
do
{
console.log( "ECMBreadcrumbComponent route.parent >>>"+route.parent+">>route>" + route);
//get the route's URL segment
let routeURL: string = route.snapshot.url.map(segment => segment.path).join("/");
//add breadcrumb
let breadcrumb: IBreadcrumb = {
label: route.snapshot.data[ROUTE_DATA_BREADCRUMB],
params: route.snapshot.params,
url: routeURL
};
console.log( "ECMBreadcrumbComponent >breadcrumb> " + breadcrumb );
breadcrumbs.push(breadcrumb);
route = route.parent;
}while ( route.parent );
return breadcrumbs;
}
}
\ No newline at end of file
ecm/Angular/ProteusECM/trunk/src/app/ecm-footer/ecm-footer.component.html
View file @ 217c4c52
<section class="footer-section ">
<div class="footer-subscribe ">
<form action="#" method="post" class="subscribe-form"id="subscribe-form">
<form action="#" method="post" class="subscribe-form" id="subscribe-form" #subscribeForm>
<div class="row">
<div class="small-8 column">
<input type="text" class="subscribe-email" name="subscribe-email"placeholder="Enter Your Email ID" #subscribeEmail />
</div>
<div class="small-4 column">
<input type="submit" class="subscribe-submit"name="subscribe-submit" id="subscribe-submit" value="Subscribe" />
<button md-raised-button type="submit" class="subscribe-submit" (click)="subscribeForm.submit();">Subscribe</button>
</div>
</div>
</form>
......
ecm/Angular/ProteusECM/trunk/src/app/ecm-header/ecm-header.component.css
View file @ 217c4c52
......@@ -163,6 +163,30 @@
/*Right Slide Panel*/
.ecm-bgGlass {
background-color: gray;
opacity: 0.5;
z-index: 4;
position: fixed;
left: 0px;
top: 0px;
display: none;
width: 100%;
height: 100%;
}
.overlayPanel {
width: 400px;
height: 509px;
position: fixed;
top: calc( 50% - 500px / 2 );
left: calc( 50% - 375px / 2 );
box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.2), inset 0 0 0 1px rgba(0, 0, 0, 0.2);
z-index: 4;
display: none;
border-radius: 2px;
background: #fff;
}
.rightSlidePanel {
width: 400px;
height: calc( 100% - 60px );
......@@ -176,6 +200,16 @@
background: #fff;
}
@media screen and (max-width:30em)
{
.overlayPanel
{
width: 100%;
height: 100%;
top: 0;
left: 0;
}
}
.button {
width: 90px;
......@@ -202,10 +236,11 @@
/* Toggle button */
.hide-button {
top: 0;
right: 0;
position: absolute;
display: inline-block;
width: 20px;
height: 20px;
width: 24px;
height: 24px;
margin: 15px;
background-color: transparent;
border: none;
......
ecm/Angular/ProteusECM/trunk/src/app/ecm-header/ecm-header.component.html
View file @ 217c4c52
<ecm-nav-menu class="fixed-header-nav"> </ecm-nav-menu>
<!-- Overlay Start -->
<div #bgGlass class="ecm-bgGlass"></div>
<div #overlayPanel class="overlayPanel" >
<span (click)="hideOverlayPanel();" class="hide-button"></span>
<ecm-user-option *ngIf="sideOption=='USER_OPT'" (closePanel)="hideOverlayPanel(); createUserData();" ></ecm-user-option>
<div *ngIf="sideOption=='CART_OPT'" style="margin: 5rem;" >
Show Cart option will be display here
<button md-raised-button class="button medium-btn">Checkout</button>
</div>
</div>
<!-- Overlay End -->
<!-- SlidePanel Start -->
<div #rightSlidePanel class="rightSlidePanel" >
<span (click)="hideSidePanel();" class="hide-button"></span>
<ecm-user-option *ngIf="sideOption=='USER_OPT'" ></ecm-user-option>
<ecm-user-option *ngIf="sideOption=='USER_OPT'" (closePanel)="hideSidePanel(); createUserData();" ></ecm-user-option>
<div *ngIf="sideOption=='CART_OPT'" style="margin: 5rem;" >
Show Cart option will be display here
<button class="button medium-btn">Checkout</button>
<button md-raised-button class="button medium-btn">Checkout</button>
</div>
</div>
<!-- SlidePanel End -->
<section *ngIf="isFixedHeader" class="header-section visible">
<div class="input-container-bg" [@fadeState]="headerFadeState"></div>
<div class="input-container">
<img *ngIf="userData" (click)="showSidePanel('USER_OPT');" class="user-adj user-image-128" title="{{userData.name}}" src="/ibase/resource/images/users/{{userData.jti}}.png" onerror=" this.onerror=null; this.src = '/ibase/resource/images/users/default_128_128.png'; " [@userState]="headerFadeState" />
<img *ngIf="!userData" (click)="showSidePanel('USER_OPT');" class="img-user user-adj" [@userState]="headerFadeState" />
<img *ngIf="!userData" (click)="showOverlayPanel('USER_OPT');" class="img-user user-adj" [@userState]="headerFadeState" />
<div class="row">
<div class="small-12 medium-10 large-10 medium-centered column">
<img class="img-logo logo-adj" [@l2dLogoTrans]="headerFadeState" />
......@@ -29,7 +43,7 @@
<span class="siteHeading">{{siteHeading}}</span>
<span [ngClass]="{'user-span': sideOption=='USER_OPT'}">
<img *ngIf="userData" (click)="showSidePanel('USER_OPT');" class="fixed-header-user" title="{{userData.name}}" src="/ibase/resource/images/users/{{userData.jti}}.png" onerror=" this.onerror=null; this.src = '/ibase/resource/images/users/default_32_32.png'; " />
<img *ngIf="!userData" (click)="showSidePanel('USER_OPT');" class="fixed-header-user img-user-32" />
<img *ngIf="!userData" (click)="showOverlayPanel('USER_OPT');" class="fixed-header-user img-user-32" style="top: 16px;"/>
</span>
<span [ngClass]="{'cart-span': sideOption=='CART_OPT'}" >
<span *ngIf="cartItems > 0" (click)="showSidePanel('CART_OPT');" class="fixed-header-badge">{{cartItems}}</span>
......@@ -47,7 +61,7 @@
<span class="siteHeading">{{siteHeading}}</span>
<span [ngClass]="{'user-span': sideOption=='USER_OPT'}">
<img *ngIf="userData" (click)="showSidePanel('USER_OPT');" class="fixed-header-user" title="{{userData.name}}" src="/ibase/resource/images/users/{{userData.jti}}.png" onerror=" this.onerror=null; this.src = '/ibase/resource/images/users/default_32_32.png'; " />
<img *ngIf="!userData" (click)="showSidePanel('USER_OPT');" class="fixed-header-user img-user-32" />
<img *ngIf="!userData" (click)="showOverlayPanel('USER_OPT');" class="fixed-header-user img-user-32" style="top: 16px;" />
</span>
<span [ngClass]="{'cart-span': sideOption=='CART_OPT'}" >
<span *ngIf="cartItems > 0" (click)="showSidePanel('CART_OPT');" class="fixed-header-badge">{{cartItems}}</span>
......
ecm/Angular/ProteusECM/trunk/src/app/ecm-header/ecm-header.component.ts
View file @ 217c4c52
......@@ -73,6 +73,8 @@ declare var initSearch: any;
export class ECMHeaderComponent implements OnInit, OnDestroy {
@ViewChild('rightSlidePanel') rightSlidePanel : ElementRef;
@ViewChild('overlayPanel') overlayPanel : ElementRef;
@ViewChild('bgGlass') bgGlass : ElementRef;
@Input() siteHeading : any = 'Local2do';
@Input() isFixedHeader:boolean=true;
@Input() headerFadeState = 'false';
......@@ -95,10 +97,14 @@ export class ECMHeaderComponent implements OnInit, OnDestroy {
createUserData(){
var userInfo = localStorage.getItem('userInfo');
console.log('ECMHeaderComponent getUserInfo ::' + userInfo );
if( userInfo !== 'undefined' && userInfo !== null && userInfo !== 'null' ) {
this.userData = JSON.parse(userInfo);
}
else
{
this.userData = null;
}
console.log('ECMHeaderComponent getUserInfo ::' + userInfo + ' \n this.userData :: ' + this.userData);
}
@HostListener('window:scroll', ['$event.target'])
......@@ -155,6 +161,20 @@ export class ECMHeaderComponent implements OnInit, OnDestroy {
this.rightSlidePanel.nativeElement.style.display = "none";
this.sideOption = null;
}
showOverlayPanel( opt: any ) {
this.overlayPanel.nativeElement.style.display = "block";
this.bgGlass.nativeElement.style.display = "block";
document.body.style.overflow = "hidden";
this.sideOption = opt;
}
hideOverlayPanel() {
this.overlayPanel.nativeElement.style.display = "none";
this.bgGlass.nativeElement.style.display = "none";
document.body.style.overflow = "visible";
this.sideOption = null;
}
backClicked() {
this._location.back();
......
ecm/Angular/ProteusECM/trunk/src/app/ecm-image/ecm-image.component.ts
View file @ 217c4c52
......@@ -100,8 +100,9 @@ export class EcmImageComponent implements OnInit, AfterViewChecked {
if (this.targetImg && this.imageUrl)
{
console.log("this.targetImg ngAfterViewChecked... " + this.targetImg);
console.log("this.targetImg ngAfterViewChecked... " + this.targetImg.nativeElement);
this.targetImg.nativeElement.src = "/ibase/rest/E12ExtService/getAttachDocument" + this.imageUrl;
this.targetImg.nativeElement.onerror ="this.src = '/ecm/assets/images/svg/img_not_found.svg'; this.onerror = null;";
this.imageUrl = null;
}
}
......
ecm/Angular/ProteusECM/trunk/src/app/ecm-input/ecm-input.component.css deleted 100755 → 0
View file @ 9b881c13
h2 {
text-align: center;
margin-bottom: 50px;
}
h2 small {
font-weight: normal;
color: #888;
display: block;
}
.footer {
text-align: center;
}
.footer a {
color: #53B2C8;
}
/* form starting stylings ------------------------------- */
.group {
position: relative;
margin-bottom: 45px;
margin-top: 35px;
}
input {
font-size: 18px;
/* padding: 2px 10px 10px 5px; */
padding :2px 10px 0 5px;
display: block;
/* width: 300px; */
border: none;
border-bottom: 1px solid #757575;
box-shadow: none;
margin: 0;
}
input:focus {
outline: none;
border: none;
box-shadow: none;
}
/* LABEL ======================================= */
label {
color: #999;
font-size: 18px;
font-weight: normal;
position: absolute;
pointer-events: none;
left: 5px;
top: 10px;
transition: 0.2s ease all;
-moz-transition: 0.2s ease all;
-webkit-transition: 0.2s ease all;
}
/* active state */
input:focus ~ label, input:valid ~ label {
top: -20px;
font-size: 14px;
/* color: #5264AE; */
color: mediumvioletred;
}
/* BOTTOM BARS ================================= */
.bar {
position: relative;
display: block;
/* width: 300px; */
}
.bar:before, .bar:after {
content: '';
height: 2px;
width: 0;
bottom: 1px;
position: absolute;
/* background: #5264AE; */
background: mediumvioletred;
transition: 0.2s ease all;
-moz-transition: 0.2s ease all;
-webkit-transition: 0.2s ease all;
}
.bar:before {
left: 50%;
}
.bar:after {
right: 50%;
}
/* active state */
input:focus ~ .bar:before, input:focus ~ .bar:after {
width: 50%;
}
/* HIGHLIGHTER ================================== */
.highlight {
position: absolute;
height: 60%;
width: 100px;
top: 25%;
left: 0;
pointer-events: none;
opacity: 0.5;
}
/* active state */
input:focus ~ .highlight {
-webkit-animation: inputHighlighter 0.3s ease;
-moz-animation: inputHighlighter 0.3s ease;
animation: inputHighlighter 0.3s ease;
}
/* ANIMATIONS ================ */
@-webkit-keyframes inputHighlighter {
from { background:#5264AE; }
to { width: 0; background: transparent; }
}
@-moz-keyframes inputHighlighter {
from { background:#5264AE; }
to { width: 0; background: transparent; }
}
@keyframes inputHighlighter {
from { background:#5264AE; }
to { width: 0; background: transparent; }
}
\ No newline at end of file
ecm/Angular/ProteusECM/trunk/src/app/ecm-input/ecm-input.component.html deleted 100755 → 0
View file @ 9b881c13
<div class="group" *ngIf="ecmType && ecmLabel">
<input [type]="ecmType" required />
<span class="highlight"></span>
<span class="bar"></span>
<label>{{ecmLabel}}</label>
</div>
ecm/Angular/ProteusECM/trunk/src/app/ecm-input/ecm-input.component.ts deleted 100755 → 0
View file @ 9b881c13
import { Component, OnInit, Input } from '@angular/core';
@Component({
selector: 'ecm-input',
templateUrl: './ecm-input.component.html',
styleUrls: ['./ecm-input.component.css']
})
export class EcmInputComponent implements OnInit {
@Input() ecmType : any;
@Input() ecmLabel : any;
constructor() { }
ngOnInit() { }
}
ecm/Angular/ProteusECM/trunk/src/app/ecm-search/ecm-search.component.html
View file @ 217c4c52
<form *ngIf="headerState === 'relative'" action="#" method="post"id="search-form" [@searchInputTrans]="compFadeState">
<form *ngIf="headerState === 'relative'" action="#" method="post" id="search-form" [@searchInputTrans]="compFadeState">
<span class="search-page-border">
<input #myInput type="text"placeholder="Search Food, Tour, Events and More..."class="search-terms" name="search-terms" />
<input #myInput type="text" placeholder="Search Food, Tour, Events and More..." class="search-terms" name="search-terms" />
<span class="search-which-border">
<div #locateMeButton class="locate-me">Locate Me</div>
<div class="locate-handle" (click)="getAddress();" ></div>
<img class="img-locate"title="Locate Me" />
<img class="img-locate" title="Locate Me" />
<select name="search-which" class="search-which">
<option value="members">Mumbai</option>
<option value="groups">Pune</option>
......@@ -13,7 +13,8 @@
</select>
</span>
</span>
<input type="submit" name="search-submit" class="search-submit" value="Search" (click)="search(myInput.value)"/>
<!-- <input type="submit" name="search-submit" class="search-submit" value="Search" (click)="search(myInput.value)"/> -->
<button md-raised-button class="search-submit" (click)="search(myInput.value)">Search</button>
</form>
<div *ngIf="headerState === 'fixed'" id="sb-search" class="sb-search">
<form>
......
ecm/Angular/ProteusECM/trunk/src/app/ecm-signin/ecm-signin.component.css
View file @ 217c4c52
.img-logo {
h4
{
text-align: center;
/* padding-bottom: 67px; */
padding-bottom: 5px;
font-size: 26px;
font-weight: normal;
}
h6
{
color: mediumvioletred;
}
.img-logo
{
content: url(../../assets/images/logo.png);
min-width: 200px;
}
.logo-adj {
.logo-adj
{
position: relative;
left: calc( ( 100% / 2 ) - 100px );
padding: 0;
padding-top: 50px;
padding: 50px;
padding-top: 75px;
margin: 0;
padding-bottom: 1px;
}
.signin-form,
.signin-form-ext {
/*position: relative;
left: calc( ( 100% / 2 ) - 142px );
padding: 0;
margin: 0 */
.signin-form
{
position: relative;
left: calc( ( 100% / 2 ) - 200px );
margin: 0;
width: 400px;
padding: 25px;
padding: 20px 40px 0 40px;
color: rgb(199, 21, 133);
/* top: -110px; */
}
.signin-form-adj
{
width: 50%;
float: none;
margin-left: auto;
margin-right: auto;
}
.signin-form-ext {
border-radius: 5px;
border: 1px solid lightgray;
@media screen and (max-width:30em) {
.signin-form {
/*
bottom: 0px;
top:0px;
*/
position: absolute;
bottom: 5%;
}
.logo-adj {
padding-top: 100px;
}
.signin-button,
.register-button {
font-size: 15px;
line-height: 15px;
}
.example-full-width {
font-size: 18px;
line-height: 18px;
margin: 18px 0 0 0;
}
}
.button {
width: 90px;
height: 35px;
.signin-button,
.register-button
{
width: 320px;
height: 50px;
font-size: 15px;
line-height: 15px;
text-align: center;
border: 1px solid mediumvioletred;
background: transparent;
border-radius: 2px;
position: relative;
color: #333;
padding: 0;
margin: 0;
left: 260px;
margin: 5px 0 5px 0;
}
.button:hover {
background-color: mediumvioletred;
.signin-button
{
background: mediumvioletred;
color: #fff;
}
\ No newline at end of file
}
.signin-button:hover,
.register-button:hover
{
background: mediumvioletred;
color: #fff;
}
.forgot-password{
top: 0;
right: 0;
display: inline-block;
font-weight: normal;
font-size: 15px;
cursor: pointer;
color: mediumvioletred;
}
.username-input,
.password-input {
width: 320px;
font-size: 15px;
line-height: 15px;
margin: 0 0 10px 0;
padding: 0;
}
.signin-progress-bar {
}
ecm/Angular/ProteusECM/trunk/src/app/ecm-signin/ecm-signin.component.html
View file @ 217c4c52
<div class="row">
<div class="small-12 medium-5 large-4 medium-centered column">
<div class="small-12 medium-5 large-4 medium-centered column signin-form-adj" >
<img class="img-logo logo-adj" />
</div>
<div class="small-12 medium-5 large-4 medium-centered column">
<div [ngClass]="{'signin-form-ext': parent=='_BLANK', 'signin-form': parent=='_POPUP' }">
<h4>Sign in</h4>
<h6>to continue to Local2do</h6>
<form action="">
<ecm-input [ecmType]="'text'" [ecmLabel]="'User Name'"></ecm-input>
<ecm-input [ecmType]="'password'" [ecmLabel]="'Password'"></ecm-input>
<button class="button"> Signin </button>
</form>
</div>
</div>
</div>
<h4>Login to continue</h4>
<div class="small-12 medium-5 large-4 medium-centered column">
<div class="signin-form">
<form #signin="ngForm" (ngSubmit)="login();" novalidate autocomplete="off">
<md-input-container class="username-input" [hideRequiredMarker] = "true">
<input mdInput [style.height]="'20px'" placeholder="User Name" required name="username" [(ngModel)]="_username" #username="ngModel"/>
<md-error *ngIf="username.errors && username.dirty" class="">User Name required</md-error>
</md-input-container>
<md-input-container class="password-input" [hideRequiredMarker] = "true">
<input mdInput [style.height]="'20px'" placeholder="Password" required name="password" [(ngModel)]="_password" #password="ngModel"
[type]="showPass ? 'text' : 'password'" />
<a mdSuffix class="forgot-password" (click)="forgot();">Forgot</a>
<md-error *ngIf="password.errors && password.dirty" class="">Password required</md-error>
<!--
<button md-icon-button mdSuffix (click)= "showPass= !showPass;" >
<md-icon class="material-icons">mode_edit</md-icon>
</button>
-->
</md-input-container>
<button type="submit" md-button class="signin-button" [disabled]="!signin.form.valid">Login</button>
<button md-button class="register-button" (click)="register();">Register</button>
<!--
<md-progress-spinner
class="example-margin"
[color]="color"
[mode]="mode"
[value]="value">
</md-progress-spinner>
-->
<md-progress-bar *ngIf="loginPending"
class="signin-progress-bar"
[color]="primary"
[mode]="mode"
[value]="value"
[bufferValue]="bufferValue">
</md-progress-bar>
</form>
</div>
</div>
</div>
ecm/Angular/ProteusECM/trunk/src/app/ecm-signin/ecm-signin.component.ts
View file @ 217c4c52
import { Component, OnInit, Input } from '@angular/core';
import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
import { FormGroupDirective, NgControl, NgForm } from '@angular/forms';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/map';
@Component({
selector: 'ecm-signin',
templateUrl: './ecm-signin.component.html',
styleUrls: ['./ecm-signin.component.css']
import { ECMSigninService } from './ecm-signin.service';
declare var encPwd: any;
@Component( {
selector: 'ecm-signin',
templateUrl: './ecm-signin.component.html',
styleUrls: ['./ecm-signin.component.css'],
providers: [ECMSigninService]
})
export class EcmSigninComponent implements OnInit {
@Input() parent : any = '_BLANK' ;
constructor() { }
userData : any;
showPass : boolean = false;
_username : string;
_password : string;
loginPending: boolean = false;
@Output() parent = new EventEmitter();
constructor(public signinService: ECMSigninService) { }
ngOnInit() {
}
ngOnInit() {
}
register() {
alert( "register" );
}
forgot() {
alert( "forgot" );
}
login() {
this.loginPending = true;
console.log( "login [" + this._username + "][" + this._password + "]");
this.convertIntoSHA256();
console.log( "login [" + this._username + "][" + this._password + "]");
this.sendLogin();
}
convertIntoSHA256() {
let pwdVal = this._password;
if( pwdVal && pwdVal.length > 0 )
{
pwdVal = encPwd( pwdVal );
console.log( "convertIntoSHA256 [" + pwdVal + "]");
this._password = pwdVal;
}
}
sendLogin() {
this.signinService.sendLogin( this._username, this._password ).subscribe(
result => {
console.log( 'comp results[' + result.Response.results + ']status[' + result.Response.status + ']' );
console.log( 'comp result.results.indexOf [' + result.Response.results.indexOf('{') + ']' );
this.loginPending = false;
if( result.Response.status == 'success' )
{
if( result.Response.results && result.Response.results.indexOf('{') != -1 )
{
this.userData = JSON.parse( result.Response.results );
this.userData.jti = this._username;
console.log( 'comp Object.keys(this.userData) [' + Object.keys(this.userData) + ']' );
localStorage.setItem('userInfo', JSON.stringify( this.userData ) );
}
this.parent.emit();
}
else if( result.Response.status == 'error' )
{
localStorage.removeItem('userInfo');
}
},
error => {
let errorMessage = <any>error;
console.log( 'comp errorMessage[' + errorMessage + ']' );
}
);
}
}
ecm/Angular/ProteusECM/trunk/src/app/ecm-signin/ecm-signin.service.ts 0 → 100755
View file @ 217c4c52
import { Injectable } from '@angular/core';
import { Http, Response, Headers, RequestOptions, URLSearchParams } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/map';
import {Store} from '@ngrx/store';
@Injectable()
export class ECMSigninService {
constructor (private http: Http,) {}
sendLogin(_username: string, _password: string): Observable<any> {
let authUrl = '/ecm/service/sys/auth/login'; // URL to web service
let _urlParams = new URLSearchParams();
_urlParams.append('username', _username);
_urlParams.append('password', _password);
console.log( "sendLogin 1...." + _urlParams.toString() );
let headers = new Headers({ 'Content-Type': 'application/json' });
let options = new RequestOptions({ headers: headers });
authUrl = authUrl + '?' + _urlParams.toString();
console.log( "sendLogin 2...." + authUrl);
return this.http.get( authUrl, options )
.map(this.extractData)
.catch(this.handleError);
}
sendLogout(_username: string, _tokenid: string): Observable<any> {
let authUrl = '/ecm/service/sys/auth/logout'; // URL to web service
let _urlParams = new URLSearchParams();
_urlParams.append('username', _username);
_urlParams.append('tokenid', _tokenid);
console.log( "sendLogin 1...." + _urlParams.toString() );
let headers = new Headers({ 'Content-Type': 'application/json' });
let options = new RequestOptions({ headers: headers });
authUrl = authUrl + '?' + _urlParams.toString();
console.log( "sendLogin 2...." + authUrl);
return this.http.get( authUrl, options )
.map(this.extractData)
.catch(this.handleError);
}
private extractData(res: Response) {
let body = res.json();
console.log('extractData[' + JSON.stringify(body) + ']');
return body || { };
}
private handleError (error: Response | any) {
// In a real world app, we might use a remote logging infrastructure
let errMsg: string;
if (error instanceof Response) {
const body = error.json() || '';
const err = body.error || JSON.stringify(body);
errMsg = `${error.status} - ${error.statusText || ''} ${err}`;
} else {
errMsg = error.message ? error.message : error.toString();
}
console.error('Service handleError:' + errMsg);
return Observable.throw(errMsg);
}
}
ecm/Angular/ProteusECM/trunk/src/app/ecm-store/ecm-store.model.ts
View file @ 217c4c52
import { Category, SubCategory, Item } from './ecm-category/category-model';
import { Category, SubCategory, Item } from '../ecm-category/category-model';
export class EcmStoreModel {
category: Category;
subCategory: SubCategory;
item: Item;
CATEGORY: Category;
SUBCATEGORY: SubCategory;
ITEM: Item;
};
ecm/Angular/ProteusECM/trunk/src/app/ecm-store/ecm-store.ts
View file @ 217c4c52
export const CATEGORY = (state: any = null, {type, payload}) => {
export function CATEGORY (state: any = null, {type, payload}) {
switch (type) {
case 'CATEGORY':
return payload;
......@@ -11,7 +11,7 @@ export const CATEGORY = (state: any = null, {type, payload}) => {
}
};
export const SUBCATEGORY = (state: any = null, {type, payload}) => {
export function SUBCATEGORY (state: any = null, {type, payload}) {
switch (type) {
case 'SUB_CATEGORY':
return payload;
......@@ -24,7 +24,7 @@ export const SUBCATEGORY = (state: any = null, {type, payload}) => {
}
};
export const ITEM = (state: any = null, {type, payload}) => {
export function ITEM (state: any = null, {type, payload}) {
switch (type) {
case 'ITEM':
return payload;
......
ecm/Angular/ProteusECM/trunk/src/app/ecm-user-option/ecm-user-option.component.css
View file @ 217c4c52
.content {
margin: 10 rem;
border: 6px;
height: 100%;
width: 100%;
position: absolute;
padding: 0;
margin: 0;
}
.button {
width: 90px;
height: 35px;
.button-panel{
top: 10rem;
left: 2.5rem;
bottom: 0;
position: relative;
}
.logout-button
{
width: 320px;
height: 50px;
font-size: 15px;
line-height: 15px;
text-align: center;
border: 1px solid mediumvioletred;
background: mediumvioletred;
border-radius: 2px;
float: right;
position: relative;
top: 15px;
color: #333;
right: 10px;
padding: .85em 1em;
margin:10rem;
font-size: .9rem;
}
.button:hover {
background-color: mediumvioletred;
padding: 0;
margin: 5px 0 5px 0;
color: #fff;
}
}
\ No newline at end of file
ecm/Angular/ProteusECM/trunk/src/app/ecm-user-option/ecm-user-option.component.html
View file @ 217c4c52
<div>
<ecm-signin *ngIf="!userData" [parent]="'_POPUP'"></ecm-signin>
<!--
<button *ngIf="!userData" [routerLink]="['/signin']" class="button medium-btn">Signin</button>
<button *ngIf="userData" class="button medium-btn">Logout</button>
-->
<ecm-signin *ngIf="!userData" (parent)="closePanel.emit();" ></ecm-signin>
<div *ngIf="userData" class="content">
<button class="button">Logout</button>
<div class="button-panel">
<button md-button class="logout-button" (click)="logout(); closePanel.emit();">Logout</button>
</div>
</div>
</div>
ecm/Angular/ProteusECM/trunk/src/app/ecm-user-option/ecm-user-option.component.ts
View file @ 217c4c52
import { Component, OnInit } from '@angular/core';
import { Component, OnInit, Output, EventEmitter } from '@angular/core';
import { ECMSigninService } from '../ecm-signin/ecm-signin.service';
@Component({
selector: 'ecm-user-option',
templateUrl: './ecm-user-option.component.html',
styleUrls: ['./ecm-user-option.component.css']
styleUrls: ['./ecm-user-option.component.css'],
providers: [ECMSigninService]
})
export class EcmUserOptionComponent implements OnInit {
constructor() { }
@Output() closePanel = new EventEmitter();
constructor(public signinService: ECMSigninService) { }
userData : any;
ngOnInit() {
var userInfo = localStorage.getItem('userInfo');
console.log('EcmUserOptionComponent getUserInfo ::' + userInfo );
if( userInfo !== 'undefined' && userInfo !== null && userInfo !== 'null' ) {
this.userData = JSON.parse(userInfo);
}
}
logout() {
console.log('Logging Out');
this.userData = null;
localStorage.removeItem('userInfo');
this.signinService.sendLogout(this.userData.jti, this.userData.TOKEN_ID).subscribe(
result => {
console.log( 'comp result.results.indexOf [' + result.Response.results.indexOf('{') + ']' );
if( result.Response.status == 'success' )
{
console.log('Logging Out');
this.userData = null;
localStorage.removeItem('userInfo');
}
else if( result.Response.status == 'error' )
{
this.userData = null;
}
},
error => {
let errorMessage = <any>error;
console.log( 'comp errorMessage[' + errorMessage + ']' );
}
);
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment