File

src/app/campaigns/campaign-manager.ts

Extends

Compbaser

Metadata

selector campaign-manager
styles button { width: 160px; } /*.selectedItem {*/ /*background-color: green !important*/ /*}*/ /*a.list-group-item:focus, button.list-group-item:focus {*/ /*background-color: pink !important;*/ /*}*/
templateUrl ./campaign-manager.html

Outputs

slideToCampaignEditor $event type: EventEmitter<any>
slideToCampaignName $event type: EventEmitter<any>

Constructor

constructor(el: ElementRef, yp: YellowPepperService, redPepperService: RedPepperService, router: Router, wizardService: WizardService)

Methods

onRoute1
onRoute1()
Returns : void
onRoute2
onRoute2()
Returns : void
onRoute3
onRoute3()
Returns : void
onRoute4
onRoute4()
Returns : void
onRoute5
onRoute5()
Returns : void
onRoute6
onRoute6()
Returns : void
_onCampaignSelected
_onCampaignSelected(i_uiState: IUiState)
Returns : void
_createCampaign
_createCampaign()
Returns : void
_onWizard
_onWizard()
Returns : void
destroy
destroy()
Returns : void

Properties

Static campaigns$
campaigns$: Observable<List<CampaignsModelExt>>
cars
cars: any
Static timelineSelected$
timelineSelected$: Observable<number>
import {ChangeDetectionStrategy, Component, ElementRef, EventEmitter, HostListener, Output} from "@angular/core";
import {Observable} from "rxjs";
import {List} from "immutable";
import {Compbaser} from "ng-mslib";
import {Router} from "@angular/router";
import {UserModel} from "../../models/UserModel";
import {RedPepperService} from "../../services/redpepper.service";
import {CampaignsModelExt} from "../../store/model/msdb-models-extended";
import {ACTION_UISTATE_UPDATE, SideProps} from "../../store/actions/appdb.actions";
import {IUiState} from "../../store/store.data";
import {YellowPepperService} from "../../services/yellowpepper.service";
import {MainAppShowStateEnum} from "../app-component";
import {WizardService} from "../../services/wizard-service";

@Component({
    // changeDetection: ChangeDetectionStrategy.OnPush,
    selector: 'campaign-manager',
    styles: [`
        button {
            width: 160px;
        }
        /*.selectedItem {*/
        /*background-color: green !important*/
        /*}*/
        /*a.list-group-item:focus,  button.list-group-item:focus  {*/
        /*background-color: pink !important;*/
        /*}*/

    `],
    templateUrl: './campaign-manager.html'
})
export class CampaignManager extends Compbaser {

    // public userModel$: Observable<UserModel>;

    public campaigns$: Observable<List<CampaignsModelExt>>;
    public timelineSelected$: Observable<number>;
    cars;

    constructor(private el: ElementRef, private yp: YellowPepperService, private redPepperService: RedPepperService, private router: Router, private wizardService:WizardService) {
        super();
        this.preventRedirect(true);
        this.timelineSelected$ = this.yp.ngrxStore.select(store => store.appDb.uiState.campaign.timelineSelected).map(v => v);

        // this.userModel$ = this.yp.ngrxStore.select(store => store.appDb.userModel);

        this.campaigns$ = this.yp.ngrxStore.select(store => store.msDatabase.sdk.table_campaigns).map((list: List<CampaignsModelExt>) => {
            this.cars = list;//.toArray();
            return list.filter((campaignModel: CampaignsModelExt) => {
                if (campaignModel.getCampaignName().indexOf('bla_bla') > -1)
                    return false
                return true;
            })
        });
        // this.yp.ngrxStore.select(store => store.msDatabase.sdk.table_resources).subscribe((resourceModels: List<ResourcesModel>) => {
        //     // console.log(resourceModels.first().getResourceName());
        //     // console.log(resourceModels.first().getResourceBytesTotal());
        // })
    }

    // @once(6000)
    // private testListen() {
    //     return this.yp.ngrxStore.select(store => store.appDb.uiState.uiSideProps).map((v) => {
    //         console.log(v);
    //     }).subscribe((e) => {
    //         console.log(e);
    //     });
    // }

    @Output()
    slideToCampaignEditor: EventEmitter<any> = new EventEmitter<any>();

    @Output()
    slideToCampaignName: EventEmitter<any> = new EventEmitter<any>();

    // m_selectedCampaign: CampaignsModelExt;

    // _onCampaignSelected(event: MouseEvent, campaign: CampaignsModelExt) {
    //     let uiState: IUiState;
    //     if (jQuery(event.target).hasClass('props')) {
    //         uiState = {
    //             uiSideProps: SideProps.campaignProps,
    //             campaign: {
    //                 campaignSelected: campaign.getCampaignId()
    //             }
    //         }
    //         this.yp.ngrxStore.dispatch(({type: ACTION_UISTATE_UPDATE, payload: uiState}))
    //     } else {
    //         uiState = {
    //             uiSideProps: SideProps.campaignEditor,
    //             campaign: {
    //                 campaignSelected: campaign.getCampaignId()
    //             }
    //         }
    //         this.slideToCampaignEditor.emit();
    //         this.yp.ngrxStore.dispatch(({type: ACTION_UISTATE_UPDATE, payload: uiState}))
    //     }
    //     this.m_selectedCampaign = campaign;
    // }

    onRoute1() {
        this.router.navigate(['/App1/Campaigns'])
    }

    onRoute2() {
        this.router.navigate(['/App1/Fasterq'])
    }

    onRoute3() {
        this.router.navigate(['/App1/Resources'])
    }

    onRoute4() {
        this.router.navigate(['/App1/Settings'])
    }

    onRoute5() {
        this.router.navigate(['/App1/Stations'])
    }

    onRoute6() {
        this.router.navigate(['/App1/StudioPro'])
    }

    // save() {
    //     let uiState: IUiState = {mainAppState: MainAppShowStateEnum.SAVE}
    //     this.yp.ngrxStore.dispatch(({type: ACTION_UISTATE_UPDATE, payload: uiState}))
    // }

    _onCampaignSelected(i_uiState: IUiState) {
        this.yp.ngrxStore.dispatch(({type: ACTION_UISTATE_UPDATE, payload: i_uiState}))
    }

    _createCampaign() {
        var uiState: IUiState = {uiSideProps: SideProps.miniDashboard}
        this.yp.ngrxStore.dispatch(({type: ACTION_UISTATE_UPDATE, payload: uiState}))
        this.slideToCampaignName.emit();
    }

    _onWizard(){
        this.wizardService.start();
    }

    destroy() {
        // var uiState: IUiState = {uiSideProps: SideProps.none}
        // this.yp.ngrxStore.dispatch(({type: ACTION_UISTATE_UPDATE, payload: uiState}))
    }
}


// let uiState: IUiState = {
//     campaign: {
//         campaignSelected: 123
//     }
// };
// uiState.campaign.campaignSelected = _.random(1,1999);
// this.yp.ngrxStore.dispatch(({type: ACTION_UISTATE_UPDATE, payload: uiState}))

// var b: IUiState = {
//     uiSideProps: _.random(1,1222)
// }
// this.yp.ngrxStore.dispatch(({type: ACTION_UISTATE_UPDATE, payload: b}))

<small class="debug" style="padding-left: 30px">{{me}}</small>

<div style="padding-bottom: 10px">
    <span i18n style="font-size: 1.8em;" i18n>campaign selection</span>
</div>
<div>
    <div class="btn-group">
        <button id="newCampaign" (click)="_createCampaign()" type="button" class="btn btn-default">
            <i style="font-size: 1em" class="fa fa-rocket"></i>
            <span i18n>new campaign</span>
        </button>
        <!--<button disabled="true" type="button" class="btn btn-danger">-->
        <button (click)="_onWizard()" type="button" class="btn btn-danger">
            <i class="fa fa-magic"></i>
            <span i18n>Get Wizard help</span>
        </button>
        <!--<button (click)="save()" type="button" class="btn btn-primary">-->
            <!--<i class="fa fa-plane"></i>-->
            <!--<span i18n>save</span>-->
        <!--</button>-->
    </div>
</div>
<!--<button (click)="onRoute1()">camp</button>-->
<!--<button (click)="onRoute2()">fq</button>-->
<!--<button (click)="onRoute3()">res</button>-->
<!--<button (click)="onRoute4()">sett</button>-->
<!--<button (click)="onRoute5()">stations</button>-->
<!--<button (click)="onRoute6()">pro</button>-->

<!--<h4>user name: {{(userModel$ | async)?.getUser() }}</h4>-->
<!--<h4>account type: {{(userModel$ | async)?.getAccountType()}}</h4>-->

<!-- move scroller to proper offset -->
<div class="responsive-pad-right">
    <div matchBodyHeight="350" style="overflow: scroll">
        <campaign-list (onCampaignSelected)="_onCampaignSelected($event)"
                       (slideToCampaignName)="slideToCampaignName.emit($event)"
                       (slideToCampaignEditor)="slideToCampaignEditor.emit($event)"
                       [campaigns]="campaigns$ | async">
        </campaign-list>
        <hr/>
        <!--<h2>sample code for testing only</h2>-->
        <!--<h4>ng-bootstrap dropdown</h4>-->
        <!--<div class="btn-group" dropdown>-->
            <!--<button id="single-button" type="button" class="btn btn-primary" dropdownToggle>-->
                <!--Button dropdown <span class="caret"></span>-->
            <!--</button>-->
            <!--<ul dropdownMenu role="menu" aria-labelledby="single-button">-->
                <!--<li role="menuitem"><a class="dropdown-item" href="#">Action</a></li>-->
                <!--<li role="menuitem"><a class="dropdown-item" href="#">Another action</a></li>-->
                <!--<li role="menuitem"><a class="dropdown-item" href="#">Something else here</a></li>-->
                <!--<li class="divider dropdown-divider"></li>-->
                <!--<li role="menuitem"><a class="dropdown-item" href="#">Separated link</a></li>-->
            <!--</ul>-->
        <!--</div>-->
        <!--<p-orderList [responsive]="true" [value]="campaigns$ | async | ListToArrayPipe">-->
            <!--<ng-template let-car pTemplate="item">-->
                <!--<div class="ui-helper-clearfix">-->
                    <!--<div style="font-size:14px;float:left;margin:15px 5px 0 0">{{car.getCampaignName()}}</div>-->
                <!--</div>-->
            <!--</ng-template>-->
        <!--</p-orderList>-->
    </div>
</div>
Legend
Html element
Component
Html element with directive

results matching ""

    No results matching ""