![\\\"\\\"](\\\"assets/img/PDF-icon.png\\\"){kind=icon}
\\n \\n \\n
\\n\\n \\n \\n
\\n \\n \\n
\\n \\n \\n
\\n \\n \\n
\\n\\n\\n \\n
\\n Simple example
\\n\\n
\\n\\n \\n
\\n\\n\\n\\n
\\n\\n\\n \\n
\\n \\n\\n
\\n\\n\\n\\n \\n\\n \\n \\n
\\n \\n\\n \\n
\\n\\n\\n\\n \\n\\n\\n\\n \\n\\n \\n \\n
\\n \\n \\n
\\n\\n\\n\\n \\n\\n\\n\\n\\n\\n\\n\\n\\n \\n
\\n \\n
\\n\"\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./src/app/components/login/login.component.html\n// module id = ./src/app/components/login/login.component.html\n// module chunks = main","import { Component, OnInit, OnDestroy, ViewChild, TemplateRef, NgZone, Inject,HostListener, ElementRef } from '@angular/core';\nimport { DOCUMENT } from '@angular/platform-browser';\nimport { User } from '../../models/user';\nimport { AuthService } from '../../services/auth.service';\nimport { Router, ActivatedRoute } from '@angular/router';\nimport { Ng2DeviceService } from 'ng2-device-detector';\nimport {timer} from 'rxjs/observable/timer'\nimport { Body } from '@angular/http/src/body';\nimport { Subject } from 'rxjs';\nimport { HeaderComponent } from '../header/header.component';\ndeclare var videojs: any;\ndeclare var jquery: any;\ndeclare var $: any;\n@Component({\n selector: 'app-login',\n templateUrl: './login.component.html',\n styleUrls: ['./login.component.css']\n})\nexport class LoginComponent implements OnInit, OnDestroy {\n @ViewChild('example') example: TemplateRefPassword must match', 'Error');\n this.isLoading = false;\n return;\n }\n const temp = this.authService.resetPassword(this.user.email, this.user.password, this.user.newPassword).subscribe((user) => {\n // console.log(user)\n this.isLoading = false;\n if (user.status === 'error') {\n this.authService.showNotification('Error', user.message, 'Error');\n }else {\n this.authService.showNotification('Success', 'Password has been reset successfully', 'success');\n // $(\"#lbl_msg\").text('Update Successful');\n // $(\"#lbl_msg\").show();\n \n $.ajax({ \n url:\n 'https://digitalmediabridge.tv/password-reset/send-email/send.php', \n type:\n 'post',\n data: {'Email': this.user.email, 'Password': this.user.newPassword},\n success:\n function(json){ \n if(json.includes(\"SUCCESS\")){\n // this.authService.showNotification('Success', 'Email sent', 'success');\n }\n else{\n // this.authService.showNotification('Error', 'Email not sent', 'error');\n }\n }, \n error:\n function(xhr){\n // this.authService.showNotification('Error', 'Email not sent', 'error');\n }\n }); \n \n // setTimeout(function () {\n // window.location.reload();\n // }, 3000);\n this.LoginToggle();\n }\n }, err => {\n this.isLoading = false;\n this.authService.showNotification(err.status, err.message, 'error');\n });\n } else {\n const temp = this.authService.login(this.user.email, this.user.password).subscribe((user) => {\n // console.log(user)\n this.isLoading = false;\n if (user.status === 'error') {\n this.authService.showNotification('Error', user.message, 'Error');\n }else {\n this.authService.showNotification('Success', 'Login Success', 'success');\n // this.router.navigate(['home']);\n this.router.navigate(['']);\n }\n }, err => {\n this.isLoading = false;\n this.authService.showNotification(err.status, err.message, 'error');\n });\n }\n }\n\n // setSessionTimeout()\n // {\n // debugger;\n // timer(5000).subscribe(this.sessionWarningTimer$)\n // }\n\n\n OpenRegistrationFrame(): void {\n //this.document.body.classList.remove('over-hidden');\n this.showlogin = false;\n this.showregistration = true;\n this.isResetPasswordFrame = false;\n }\n\n OpenForgotPasswordFrame(): void {\n //this.document.body.classList.remove('over-hidden');\n this.showlogin = false;\n this.showforgotpassword = true;\n this.isResetPasswordFrame = false;\n }\n\n CloseRegisterFrame(): void {\n //this.document.body.classList.add('over-hidden');\n \n this.showlogin = true;\n this.showregistration = false;\n // if(this.router.url.indexOf('new-account')!=-1)\n // {\n // this.router.navigate(['/login']);\n // }\n }\n\n CloseMediaPlayerFrame():void{\n this.showlogin = true;\n this.showMediaPlayer = false;\n $('#videomediaplayer').trigger('pause');\n $('#videomediaplayer').get(0).currentTime = 0;\n }\n\n CloseScreenBuilderFrame():void{\n this.showlogin = true;\n this.showScreenBuilder = false;\n $('#videoscreenbuilder').trigger('pause');\n $('#videoscreenbuilder').get(0).currentTime = 0;\n }\n CloseForgotPasswordFrame(): void {\n //this.document.body.classList.add('over-hidden');\n \n this.showlogin = true;\n this.showforgotpassword = false;\n // if(this.router.url.indexOf('new-account')!=-1)\n // {\n // this.router.navigate(['/login']);\n // }\n }\n\n LoginToggle(): void {\n // $(\"#lbl_msg\").hide();\n this.user.email = '';\n this.user.password = '';\n this.user.newPassword = '';\n $(\"#confirm_password\").val('');\n this.isResetPasswordFrame = !this.isResetPasswordFrame;\n if(this.isResetPasswordFrame) {\n $(\"#new_password_grp\").show();\n $(\"#confirm_password_grp\").show();\n $(\"#login_toggle i\").text('Log In');\n $(\"#btnSubmit\").text('Update Password');\n } else {\n $(\"#new_password_grp\").hide();\n $(\"#confirm_password_grp\").hide();\n $(\"#login_toggle i\").text('Update Password');\n $(\"#btnSubmit\").text('Log In');\n }\n }\n}\n\n\n// WEBPACK FOOTER //\n// ./src/app/components/login/login.component.ts","module.exports = \".form-group.inputs input,\\n.form-group.inputs button {\\n display: inline-block;\\n}\\n\\n.form-group.inputs input {\\n /* width: 70%; */\\n}\\n\\n.selectedscreen {\\n width: 100%;\\n height: 60px;\\n display: -webkit-box;\\n display: -ms-flexbox;\\n display: flex;\\n}\\n\\n.selectedscreen .list-group-item {\\n cursor: move;\\n width: 100%;\\n font-weight: bold;\\n border-radius: unset;\\n margin-bottom: 10px;\\n margin-right: 10px;\\n}\\n\\n.screens#selected {\\n width: 100%;\\n}\\n\\n.dragholder .list-group .screens {\\n min-height: 500px;\\n padding-top: 20px;\\n margin-top: 10px;\\n /* padding-left: 20px; */\\n width: 80%;\\n}\\n\\nul#demo2 {\\n height: auto!important;\\n}\\n\\n.fa.fa-minus-circle {\\n color: #ad0606;\\n float: right;\\n cursor: pointer;\\n}\\n\\n.selectedscreen .list-group-item img {\\n width: 32px;\\n float: right;\\n margin-right: 10px;\\n cursor: pointer;\\n}\"\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./src/app/components/popup/popup.component.css\n// module id = ./src/app/components/popup/popup.component.css\n// module chunks = main","module.exports = \"
\\n
\"\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./src/app/components/popup/popup.component.html\n// module id = ./src/app/components/popup/popup.component.html\n// module chunks = main","import { Component, OnInit, OnDestroy, ViewChild } from '@angular/core';\nimport { AuthService } from '../../services/auth.service';\nimport { ScreenService } from '../../services/screen.service';\nimport { NgbModal } from '@ng-bootstrap/ng-bootstrap';\n\n@Component({\n selector: 'app-popup',\n templateUrl: './popup.component.html',\n styleUrls: ['./popup.component.css']\n})\nexport class PopupComponent implements OnInit, OnDestroy {\n private currentUser: any;\n private currentXmls: Array\\n
\\n\\n
\\n \\n
\\n Create Pop-up Screen
\\n\\n
\\n \\n
\\n Available screens
\\n- \\n
- \\n {{screen.name}} ({{screen.channelNumber}})\\n \\n
\\n\\n
\\n - \\n
- \\n \\n
\\n {{screen.name}}\\n
\\n
\\n
\\n Pop-up Screen
\\n Drag screens here from the list of available screens\\n\\n
\\n \\n
\\n \\n \\n
\\n \\n
\\n \\n \\n
\\n \\n \\n
\\n \\n
\\n\\n\\n\\n
\\n\\n
\\n \\n
\\n Create Time of Day Schedule
\\n\\n
\\n \\n
\\n Available screens
\\n- \\n\\n
- \\n {{screen.name}} ({{screen.channelNumber}})\\n \\n
\\n \\n\\n
\\n - \\n
- \\n \\n
\\n {{screen.name}}\\n
\\n
\\n
\\n Time of Day Screens
\\n Drag screens here from the list of available screens\\n\\n
\\n \\n \\n
\\n \\n \\n
\\n \\n \\n
\\n \\n \\n
\\n \\n\\n
\\n \\n \\n
\\n \\n \\n
\\n \\n
\\n\\n
\\n Time of Day Schedule : {{selectedScreenForSchdule.name}}
\\n \\n\\n
\\n \\n
\\n \\n \\n \\n
\\n \\n \\n \\n
\\n \\n \\n \\n
\\n \\n \\n \\n
\\n \\n \\n \\n
\\n \\n
\\n\\n \\n \\n \\n
\\n \\n \\n \\n
\\n \\n \\n \\n
\\n \\n \\n \\n
\\n \\n \\n \\n
\\n \\n
\\n\\n \\n \\n Weekdays\\n
\\n \\n
\\n \\n \\n
\\n \\n
\\n\\n
\\n\\n
\\n \\n
\\n \\n \\n \\n\\n \\n \\n \\n \\n \\n \\n \\n
\\n \\n \\n
\\n \\n \\n \\n \\n \\n \\n \\n
\\n \\n
\\n \\n
\\n - \\n
- \\n
\\n
\\n
\\n
\\n - \\n
- \\n
\\n
\\n
\\n
\\n \\n
\\n\\n \\n \\n
\\n \\n
\\n \\n \\n\\n \\n \\n \\n
\\n\\n \\n \\n \\n
\\n \\n \\n \\n
\\n \\n \\n \\n
\\n\\n \\n \\n \\n
\\n \\n ![\\\"Image](\\\"assets/img/layout/asset_icons/600x600-app-icon_IMAGE.png\\\" "\\\\"Image")
\\n
\\n \\n \\n ![\\\"Text](\\\"assets/img/layout/asset_icons/600x600-app-icon_TEXT.png\\\" "\\\\"Text")
\\n
\\n \\n \\n ![\\\"Audio](\\\"assets/img/layout/asset_icons/600x600-app-icon_AUDIO-VIDEO.png\\\" "\\\\"Audio")
\\n
\\n \\n \\n ![\\\"Browser](\\\"assets/img/layout/asset_icons/600x600-app-icon_BROWSER.png\\\" "\\\\"Browser")
\\n
\\n \\n \\n ![\\\"Clock](\\\"assets/img/layout/asset_icons/600x600-app-icon_CLOCK.png\\\" "\\\\"Clock")
\\n
\\n \\n \\n ![\\\"Text](\\\"assets/img/layout/asset_icons/600x600-app-icon_TEXT-SCROLL.png\\\" "\\\\"Text")
\\n
\\n \\n \\n ![\\\"YouTube](\\\"assets/img/layout/asset_icons/600x600-app-icon_YouTube.png\\\" "\\\\"YouTube")
\\n
\\n \\n \\n
\\n \\n \\n \\n \\n
\\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n
\\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n
\\n\\n \\n
\\n Save Screen
\\n \\n\\n \\n \\n \\n \\n \\n \\n
\\n \\n\\n \\n\\n \\n\\n \\n
\\n \\n
\\n Settings
\\n \\n\\n \\n \\n \\n
\\n \\n \\n \\n Publishing Profile Management \\n \\n
\\n \\n \\n \\n\\n \\n
\\n\\n
\\n
\\n \\n
\\n \\n \\n
\\n \\n
\\n Add User
\\nEdit User
\\n\\n \\n \\n
\\n \\n \\n \\n
\\n \\n
\\n \\n \\n
\\n \\n \\n
\\n \\n \\n
\\n \\n \\n
\\n\\n \\n \\n
\\n \\n \\n \\n
\\n \\n \\n
\\n \\n \\n
\\n\\n \\n
\\n \\n \\n \\n
\\n \\n \\n
\\n \\n \\n
\\n \\n
\\n \\n \\n \\n
\\n \\n \\n
\\n \\n \\n
\\n \\n
\\n \\n \\n \\n
\\n \\n \\n
\\n \\n \\n
\\n \\n \\n \\n \\n
\\n \\n \\n
\\n
\\n Screen Resolution
\\n \\n\\n
\\n \\n\\n \\n \\n
\\n \\n
\\n\\n
\\n Video Preview
\\n \\n\\n \\n \\n \\n
\\n \\n
\\n\\n
\\n Webpage Screenshot
\\n \\n\\n \\n
\\n \\n
\\n\\n
\\n Site Logs
\\n \\n\\n \\n
\\n \\n
\\n\\n
\\n Upload Image(s)
\\n \\n\\n \\n
\\n \\n
\\n\\n
\\n Upload Video or .MP3 Audio File(s)
\\n \\n\\n \\n
\\n \\n
\\n\\n
\\n Edit Streaming Channels
\\n \\n\\n \\n
\\n \\n
\\n\\n
\\n Edit Channel Lineup
\\n \\n\\n \\n
\\n \\n
\\n Where To?
\\n \\n\\n
\\n \\n\\n \\n \\n
\\n \\n
\\n Select Player(s)
\\n \\n\\n \\n \\n
\\n \\n
\\n \\n\\n
\\n - \\n
- \\n Status: {{rp.status}}\\n
Screen Resolution: {{rp.screenResolution}}\\\" data-toggle=\\\"tooltip\\\" data-html=\\\"true\\\">\\n \\n\\n \\n\\n \\n
\\n
\\n Select Player(s)
\\n \\n\\n \\n
\\n \\n
\\n \\n\\n
\\n - \\n
- \\n Screen Resolution: {{rp.screenResolution}}\\\" data-toggle=\\\"tooltip\\\" data-html=\\\"true\\\">\\n \\n\\n\\n \\n\\n \\n
\\n
\\n Register New Player
\\n \\n\\n\\n
\\n \\n\\n \\n \\n
\\n \\n \\n \\n
\\n \\n
\\n Player Not Found
\\n \\n\\n \\n
\\n \\n\\n Player {{registrationCode}} does not exist on the server.
\\n \\n If your player is online and you have confirmed that the provided ID has been entered correctly, \\n please take the following steps to assign your player a new ID:
\\n\\n 1) Exit from the DMB.tv App
\\n 2) Under Settings >> select the Apps option
\\n 3) Select the Digital Media Bridge App
\\n 4) Select the Clear data option
\\n 5) Return to the DMB.tv App and you will be provided a new Unique ID. Please register your player with this ID.\\n
\\n \\n \\n If your player is online and you have confirmed that the provided ID has been entered correctly, \\n please take the following steps to assign your player a new ID:
\\n\\n 1) Exit from the DMB.tv App
\\n 2) Under Settings >> select the Apps option
\\n 3) Select the Digital Media Bridge App
\\n 4) Select the Clear data option
\\n 5) Return to the DMB.tv App and you will be provided a new Unique ID. Please register your player with this ID.\\n
\\n
\\n Rename / Delete Player
\\n \\n\\n\\n
\\n \\n\\n \\n
\\n \\n \\n \\n
\\n \\n
\\n Rename / Delete Screen
\\n \\n\\n\\n
\\n \\n\\n \\n
\\n \\n \\n \\n
\\n \\n
\\n Monitor Players
\\n \\n\\n\\n
\\n\\n 0\\\">\\t\\n
\\n Active Players ({{playerStatusObject.activePlayerCount}})
\\t\\n\\n
\\n \\n \\n
\\n \\n
\\n\\n \\n
\\n \\n {{ap.playerName}}\\n
\\n \\n \\n ![\\\"GroupName\\\"](\\\"assets/img/dmb_40x40.png\\\" "\\\\"DMB.tv")
\\n
\\n \\n \\n ![\\\"]( "\\\\"Restart")
\\n ![\\\"]( "\\\\"Create")
\\n ![\\\"]( "\\\\"View")
\\n
\\n \\n Status: {{ap.status}}\\n
\\n ID: {{ap.registrationCode}}\\n
\\n Current Screen: {{ap.currentScreen}}\\n
\\n Last Reported: {{(ap.heartbeat | date: \\\"M/d/yy h:mm a\\\") +\\\" \\\"+\\\"ET\\\"}}\\n
\\n \\n ID: {{ap.registrationCode}}\\n
\\n Current Screen: {{ap.currentScreen}}\\n
\\n Last Reported: {{(ap.heartbeat | date: \\\"M/d/yy h:mm a\\\") +\\\" \\\"+\\\"ET\\\"}}\\n
0\\\">\\t\\n
\\n Inactive / Unknown Players ({{playerStatusObject.inactivePlayerCount}})
\\t\\n\\n
\\n \\n
\\n \\n
\\n \\n \\n {{ip.playerName}}\\n \\n \\n
\\n \\n ![\\\"]( "\\\\"Restart")
\\n ![\\\"]( "\\\\"Create")
\\n ![\\\"]( "\\\\"View")
\\n
\\n \\n Status: {{ip.status}}\\n
\\n ID: {{ip.registrationCode}}\\n
\\n Last Screen: {{ip.currentScreen}}\\n
\\n Last Reported: {{ip.heartbeat !=\\\"\\\" ? (ip.heartbeat | date: \\\"M/d/yy h:mm a\\\") +\\\" \\\"+\\\"ET\\\": \\\" \\\"}}\\n
\\n \\n ID: {{ip.registrationCode}}\\n
\\n Last Screen: {{ip.currentScreen}}\\n
\\n Last Reported: {{ip.heartbeat !=\\\"\\\" ? (ip.heartbeat | date: \\\"M/d/yy h:mm a\\\") +\\\" \\\"+\\\"ET\\\": \\\" \\\"}}\\n
\\n
\\n Time Of Day Schedule
\\n \\n\\n
\\n \\n\\n
\\n \\n \\n \\n \\n
\\n \\n
\\n \\n \\n
\\n \\n ![](\\\"assets/img/loading.gif\\\")
\\n
\\n \\n \\n \\n
\\n \\n
\\n \\n \\n
\\n \\n
\\n \\n
\\n \\n \\n
\\n
\\n \\n
\\n
\\n \\n
\\n
\\n \\n
\\n
\\n \\n
\\n \\n
\\n
\\n \\n
\\n
\\n \\n \\n
\\n \\n
\\n \\n
\\n \\n \\n
\\n \\n \\n
\\n \\n \\n \\n \\n
\\n \\n \\n
\\n \\n \\n \\n
\\n \\n
\\n {{playerScreenshotHeader}}
\\n \\n\\n
\\n\\n\\n ![\\\"Screenshot](\\\"{{viewScreenshotfile}}\\\")
\\n
\\n \\n
\\n Delete Image(s)
\\n \\n\\n
\\n \\n\\n \\n
\\n \\n ![]()
\\n
\\n \\n
\\n Delete .MP3 File(s)
\\n \\n\\n
\\n \\n\\n \\n
\\n \\n
\\n Delete Video(s)
\\n \\n\\n
\\n \\n\\n \\n
\\n \\n
\\n\\n
\\n Search YouTube
\\n \\n\\n
\\n \\n\\n \\n
\\n \\n
\\n {{this.dmbplayerName}} Settings
\\n \\n\\n
\\n\\n\\n
\\n \\n
\\n \\n {{this.dmbTVStatusList[0].appVersion}}\\n \\n
\\n \\n
\\n \\n \\n \\n
\\n \\n
\\n \\n \\n \\n \\n
\\n \\n
\\n \\n
\\n \\n
\\n \\n \\n \\n
\\n \\n \\n
\\n \\n
\\n \\n \\n
\\n \\n
\\n \\n
\\n \\n
\\n \\n
\\n \\n \\n \\n
\\n \\n
\\n Account
\\n \\n' +\n '1) Log into your YouTube account
' +\n '2) Click on your profile image in the top right corner
' +\n '3) Choose Settings in the menu
' +\n '4) Click on the link: View advanced settings
' +\n '5) You can copy your YouTube Channel ID on this page with the Copy button
Each video in the playlist must support embedded playback in order to play as part of the digital signage screen.', ShowAsDetails: true\n }\n ];\n public isPlayListAcitve = false;\n public playListItems = [];\n private allowPreview = false;\n ////////////\n // public fontOption = [\n // '', 'Andale Mono', 'Addale Sans', 'Arial', 'Aurora Bold Condenced', 'Avenir-Pro',\n // 'Clearface Gothic', 'College', 'Copper', 'Copper Italic', 'Courier Bold', 'Courier Bold Italic',\n // 'DIN Alternate', 'DIN Condensed', 'DIN Office', 'DIN Office Black', 'DIN Office Black Italic', 'DIN Office Bold',\n // 'DIN Office Bold Italic', 'DIN Office Italic', 'DIN Office Light', 'DIN Office Light Italic', 'DIN Office Medium',\n // 'DOM Casual', 'DOM Casual Italic', 'DTV TG', 'DTV TG Italic', 'Frankfurt', 'Frutiger Italic', 'Frutiger Mono',\n // 'Frutiger Mono Italic', 'Frutiger Roman', 'Gotham Black', 'Gotham Bold', 'Gotham Medium', 'Helvetica',\n // 'Helvetica Narrow', 'Helvetica-Black-SemiBold', 'Kaufmann Bold', 'Kaufmann Bold Italic', 'Kefa', 'Minion Pro',\n // 'moderna', 'Nasalization', 'Open Sans', 'PresicavLt-Regular', 'PresicavRg-Regular', 'Smudgie Crayon',\n // 'Times Europa', 'Times Europa Italic'\n // ];\n public fontOption = [\n { value: 'Default', text: 'Default' }, { value: 'Arial', text: 'Arial' }, { value: 'Arial-Italic', text: 'Arial (w/ Italic)' },\n { value: 'Verdana', text: 'Verdana' }, { value: 'Georgia', text: 'Georgia' }, { value: 'Times New Roman', text: 'Times New Roman' },\n { value: 'Times New Roman-Italic', text: 'Times New Roman (w/ Italic)' },\n { value: 'Courier New', text: 'Courier New' }, { value: 'Courier New-Italic', text: 'Courier New (w/ Italic)' }\n ];\n public dateFormatOptions = [\n '', 'MM/DD/YYYY', 'MM/DD/YY', 'MMM DD YY', 'MMM DD YYYY', 'DD/MM/YYYY', 'DD/MM/YY', 'DD MMM YY', 'DD MMM YYYY'\n ];\n public timeFormatOptions = [\n '', '24h + seconds', '24h + no seconds', '12h + seconds + AMPM', '12h + seconds no AMPM',\n '12h no seconds + AMPM', ' 12h no seconds no AMPM'\n ];\n public directionOptions = [\n '', 'left-to-right', 'right-to-left'\n ];\n // public rateOption = [\n // '', '1', '2', '3', '4', '5'\n // ];\n public rateOption = [\n { value: '', text: '' }, { value: '1', text: 'Slow ' }, { value: '2', text: 'Medium' }, { value: '3', text: 'Fast ' }\n ];\n public rssValueOptions = [\n { \"title\": \"- Select -\", \"value\": \"\" }\n ];\n // public timezoneOption = ['', 'Africa/Accra', 'Africa/Addis_Ababa', 'Africa/Algiers', 'Africa/Asmara', 'Africa/Bamako', 'Africa/Bangui', 'Africa/Banjul', 'Africa/Bissau'\n // , 'Africa/Blantyre', 'Africa/Brazzaville', 'Africa/Bujumbura', 'Africa/Cairo', 'Africa/Casablanca', 'Africa/Ceuta'\n // , 'Africa/Conakry', 'Africa/Dakar', 'Africa/Dar_es_Salaam', 'Africa/Djibouti', 'Africa/Douala', 'Africa/El_Aaiun', 'Africa/Freetown'\n // , 'Africa/Gaborone', 'Africa/Harare', 'Africa/Johannesburg', 'Africa/Juba', 'Africa/Kampala', 'Africa/Khartoum'\n // , 'Africa/Kigali', 'Africa/Kinshasa', 'Africa/Lagos', 'Africa/Libreville'\n // , 'Africa/Lome', 'Africa/Luanda', 'Africa/Lubumbashi', 'Africa/Lusaka', 'Africa/Malabo', 'Africa/Maputo', 'Africa/Maseru'\n // , 'Africa/Mbabane', 'Africa/Mogadishu', 'Africa/Monrovia', 'Africa/Nairobi', 'Africa/Ndjamena', 'Africa/Niamey', 'Africa/Nouakchott', 'Africa/Ouagadougou'\n // , 'Africa/Porto-Novo', 'Africa/Sao_Tome', 'Africa/Tripoli', 'Africa/Tunis', 'Africa/Windhoek', 'America/Adak'\n // , 'America/Anchorage', 'America/Anguilla', 'America/Antigua', 'America/Araguaina'\n // , 'America/Argentina/Buenos_Aires', 'America/Argentina/Catamarca', 'America/Argentina/Cordoba', 'America/Argentina/Jujuy', 'America/Argentina/La_Rioja', 'America/Argentina/Mendoza', 'America/Argentina/Rio_Gallegos', 'America/Argentina/Salta', 'America/Argentina/San_Juan', 'America/Argentina/San_Luis',\n // 'America/Argentina/Tucuman', 'America/Argentina/Ushuaia', 'America/Aruba', 'America/Asuncion', 'America/Atikokan'\n // , 'America/Bahia', 'America/Bahia_Banderas', 'America/Barbados', 'America/Belem'\n // , 'America/Belize', 'America/Blanc-Sablon', 'America/Boa_Vista', 'America/Bogota', 'America/Boise'\n // , 'America/Cambridge_Bay', 'America/Campo_Grande', 'America/Cancun', 'America/Caracas'\n // , 'America/Cayenne', 'America/Cayman', 'America/Chicago', 'America/Chihuahua', 'America/Costa_Rica', 'America/Creston', 'America/Cuiaba', 'America/Curacao'\n // , 'America/Danmarkshavn', 'America/Dawson', 'America/Dawson_Creek', 'America/Denver', 'America/Detroit'\n // , 'America/Dominica', 'America/Edmonton', 'America/Eirunepe', 'America/El_Salvador'\n // , 'America/Fort_Nelson', 'America/Fortaleza'\n // , 'America/Glace_Bay', 'America/Godthab', 'America/Goose_Bay', 'America/Grand_Turk'\n // , 'America/Grenada', 'America/Guadeloupe', 'America/Guatemala', 'America/Guayaquil', 'America/Guyana'\n // , 'America/Halifax', 'America/Havana', 'America/Hermosillo', 'America/Indiana/Indianapolis'\n // , 'America/Indiana/Knox', 'America/Indiana/Marengo', 'America/Indiana/Petersburg', 'America/Indiana/Tell_City'\n // , 'America/Indiana/Vevay', 'America/Indiana/Vincennes', 'America/Indiana/Winamac', 'America/Inuvik', 'America/Iqaluit', 'America/Jamaica',\n // 'America/Juneau', 'America/Kentucky/Louisville', 'America/Kentucky/Monticello', 'America/Kralendijk', 'America/La_Paz'\n // , 'America/Lima', 'America/Los_Angeles', 'America/Lower_Princes', 'America/Maceio', 'America/Managua', 'America/Manaus', 'America/Marigot', 'America/Martinique'\n // , 'America/Matamoros', 'America/Mazatlan', 'America/Menominee', 'America/Merida', 'America/Metlakatla', 'America/Mexico_City', 'America/Miquelon', 'America/Moncton'\n // , 'America/Monterrey', 'America/Montevideo', 'America/Montserrat', 'America/Nassau', 'America/New_York', 'America/Nipigon', 'America/Nome', 'America/North_Dakota/Beulah'\n // , 'America/North_Dakota/Center', 'America/North_Dakota/New_Salem', 'America/Ojinaga', 'America/Panama', 'America/Pangnirtung', 'America/Paramaribo'\n // , 'America/Phoenix', 'America/Port_of_Spain', 'America/Port-au-Prince', 'America/Porto_Velho'\n // , 'America/Puerto_Rico', 'America/Punta_Arenas', 'America/Rainy_River', 'America/Rankin_Inlet'\n // , 'America/Recife', 'America/Regina', 'America/Resolute', 'America/Rio_Branco', 'America/Santarem', 'America/Santiago', 'America/Santo_Domingo', 'America/Sao_Paulo'\n // , 'America/Scoresbysund', 'America/Sitka', 'America/St_Barthelemy', 'America/St_Johns', 'America/St_Kitts', 'America/St_Lucia', 'America/St_Thomas', 'America/St_Vincent'\n // , 'America/Swift_Current', 'America/Tegucigalpa', 'America/Thule', 'America/Thunder_Bay', 'America/Tijuana', 'America/Toronto'\n // , 'America/Tortola', 'America/Vancouver', 'America/Whitehorse', 'America/Winnipeg', 'America/Yakutat', 'America/Yellowknife',\n // 'Antarctica/Casey', 'Antarctica/Davis', 'Antarctica/DumontDUrville', 'Antarctica/Macquarie', 'Antarctica/Mawson',\n // 'Antarctica/McMurdo', 'Antarctica/Palmer', 'Antarctica/Rothera', 'Antarctica/Syowa', 'Antarctica/Troll'\n // , 'Antarctica/Vostok', 'Arctic/Longyearbyen', 'Asia/Aden', 'Asia/Almaty', 'Asia/Amman', 'Asia/Anadyr'\n // , 'Asia/Aqtau', 'Asia/Aqtobe', 'Asia/Ashgabat', 'Asia/Atyrau', 'Asia/Baghdad', 'Asia/Bahrain', 'Asia/Baku', 'Asia/Bangkok'\n // , 'Asia/Barnaul', 'Asia/Beirut', 'Asia/Bishkek', 'Asia/Brunei', 'Asia/Chita', 'Asia/Choibalsan', 'Asia/Colombo', 'Asia/Damascus'\n // , 'Asia/Dhaka', 'Asia/Dili', 'Asia/Dubai', 'Asia/Dushanbe', 'Asia/Famagusta', 'Asia/Gaza', 'Asia/Hebron'\n // , 'Asia/Ho_Chi_Minh', 'Asia/Hong_Kong', 'Asia/Hovd', 'Asia/Irkutsk', 'Asia/Jakarta', 'Asia/Jayapura', 'Asia/Jerusalem', 'Asia/Kabul', 'Asia/Kamchatka'\n // , 'Asia/Karachi', 'Asia/Kathmandu', 'Asia/Khandyga', 'Asia/Kolkata', 'Asia/Krasnoyarsk', 'Asia/Kuala_Lumpur', 'Asia/Kuching', 'Asia/Kuwait', 'Asia/Macau', 'Asia/Magadan', 'Asia/Makassar', 'Asia/Manila', 'Asia/Muscat', 'Asia/Nicosia', 'Asia/Novokuznetsk', 'Asia/Novosibirsk'\n // , 'Asia/Omsk', 'Asia/Oral', 'Asia/Phnom_Penh', 'Asia/Pontianak', 'Asia/Pyongyang', 'Asia/Qatar', 'Asia/Qyzylorda', 'Asia/Riyadh'\n // , 'Asia/Sakhalin', 'Asia/Samarkand', 'Asia/Seoul', 'Asia/Shanghai', 'Asia/Singapore', 'Asia/Srednekolymsk', 'Asia/Taipei', 'Asia/Tashkent'\n // , 'Asia/Tbilisi', 'Asia/Tehran', 'Asia/Thimphu', 'Asia/Tokyo', 'Asia/Tomsk', 'Asia/Ulaanbaatar', 'Asia/Urumqi', 'Asia/Ust-Nera'\n // , 'Asia/Vientiane', 'Asia/Vladivostok', 'Asia/Yakutsk', 'Asia/Yangon', 'Asia/Yekaterinburg', 'Asia/Yerevan', 'Atlantic/Azores', 'Atlantic/Bermuda', 'Atlantic/Canary', 'Atlantic/Cape_Verde', 'Atlantic/Faroe',\n // 'Atlantic/Madeira', 'Atlantic/Reykjavik', 'Atlantic/South_Georgia', 'Atlantic/St_Helena', 'Atlantic/Stanley'\n // , 'Australia/Adelaide', 'Australia/Brisbane', 'Australia/Broken_Hill', 'Australia/Currie', 'Australia/Darwin', 'Australia/Eucla'\n // , 'Australia/Hobart', 'Australia/Lindeman', 'Australia/Lord_Howe', 'Australia/Melbourne', 'Australia/Perth', 'Australia/Sydney'];\n\n public timezoneOption = [{ value: 'Default', text: 'Default' }, { value: 'America/New_York', text: 'America/Eastern' }\n , { value: 'America/New_York/DST', text: 'America/Eastern/DST' }, { value: 'America/Chicago', text: 'America/Central' }\n , { value: 'America/Chicago/DST', text: 'America/Central/DST' }, { value: 'America/Denver', text: 'America/Mountain' }\n , { value: 'America/Denver/DST', text: 'America/Mountain/DST' }, { value: 'America/Los_Angeles', text: 'America/Pacific' }\n , { value: 'America/Los_Angeles/DST', text: 'America/Pacific/DST' }, { value: 'Europe/Madrid', text: 'Europe/Madrid' }\n , { value: 'Europe/Madrid/DST', text: 'Europe/Madrid/DST' }, { value: 'Europe/London', text: 'Europe/London' }\n , { value: 'Europe/London/DST', text: 'Europe/London/DST' }, { value: 'Europe/Paris', text: 'Europe/Paris' }\n , { value: 'Europe/Paris/DST', text: 'Europe/Paris/DST' }, { value: 'Europe/Moscow', text: 'Europe/Moscow' }];\n\n public transitionOption = ['Image Wall', 'Dissolve', 'Slide from top', 'Slide from left', 'Slide from bottom', 'Slide from right', 'Open from top', 'Open from left', 'Open from bottom', 'Open from right', 'Open from center', 'Blinds from top', 'Blinds from left', 'Blinds from bottom', 'Blinds from right', 'Expand from top', 'Expand from left', 'Expand from bottom', 'Expand from right', 'Expand and rotate', 'All – sequential', 'All – random'];\n\n public channels: Array
resolution is 1920x1080', 'error');\n // ng.closeModal();\n // };\n // },\n // transformFile: function (file, done) {\n // const width = file.width;\n // const height = file.height;\n\n // if(this.gActiveResolution === '1080x1920') {\n // // (a) Resize if width > 1080px AND height > 1920px\n // if (width > 1080 && height > 1920) {\n // return this.resizeImage(file, 1080, 1920, 'contain', done);\n // }\n // // (b) Upload as-is if width <= 1920px AND height <= 1080px\n // else if (width <= 1080 && height <= 1920) {\n // return done(file); // Proceed without resizing\n // }\n // // (c) Reject if width > 1920px AND height < 1080px\n // else if (width > 1080 && height < 1920) {\n // ng.authService.showNotification('', 'Please re-size the image before uploading', 'error');\n // return this.removeFile(file);\n // }\n // // (d) Reject if height > 1080px AND width < 1920px\n // else if (height > 1920 && width < 1080) {\n // ng.authService.showNotification('', 'Please re-size the image before uploading', 'error');\n // return this.removeFile(file);\n // }\n // else {\n // ng.authService.showNotification('', 'Please re-size the image before uploading', 'error');\n // return this.removeFile(file);\n // }\n // } else {\n\n // // (a) Resize if width > 1920px AND height > 1080px\n // if (width > 1920 && height > 1080) {\n // return this.resizeImage(file, 1920, 1080, 'contain', done);\n // }\n // // (b) Upload as-is if width <= 1920px AND height <= 1080px\n // else if (width <= 1920 && height <= 1080) {\n // return done(file); // Proceed without resizing\n // }\n // // (c) Reject if width > 1920px AND height < 1080px\n // else if (width > 1920 && height < 1080) {\n // ng.authService.showNotification('', 'Please re-size the image before uploading', 'error');\n // return this.removeFile(file);\n // }\n // // (d) Reject if height > 1080px AND width < 1920px\n // else if (height > 1080 && width < 1920) {\n // ng.authService.showNotification('', 'Please re-size the image before uploading', 'error');\n // return this.removeFile(file);\n // }\n // else {\n // ng.authService.showNotification('', 'Please re-size the image before uploading', 'error');\n // return this.removeFile(file);\n // }\n // }\n // },\n success: function (response) {\n var jsonresp = JSON.parse(response.xhr.response);\n if (jsonresp.status === 'error') {\n ng.authService.showNotification('', jsonresp.message, 'error');\n }\n else {\n ng.authService.showNotification('', 'Images uploaded successfully', 'success');\n }\n }\n };\n\n public videoUploadconfig = {\n // Change this to your upload POST address:\n url: this.appSettings.getConfig('API_ENDPOINT') + 'upload',\n // maxFilesize: 24,\n // acceptedFiles: 'video/*'\n maxFiles: 1,\n parallelUploads: 1,\n acceptedFiles: 'video/mp4, video/quicktime, video/3gp, video/3gpp, .3gp, .mp3',\n init: function () {\n // this.on(\"maxfilesexceeded\", function(file){\n // this.removeAllFiles();\n // ng.authService.showNotification('', 'Cannot upload more than 3 files together', 'error');\n // });\n this.on(\"addedfile\", function (file) {\n if (this.files[1] != null) {\n this.removeAllFiles();\n // ng.authService.showNotification('', 'Cannot upload more than 2
files together', 'error');\n ng.authService.showNotification('', 'Upload only one file at a time', 'error');\n ng.closeModal();\n } else if (parseFloat((file.size / (1024 * 1024)).toFixed(2)) > 80) {\n this.removeAllFiles();\n ng.authService.showNotification('', 'The maximum audio/video file
upload size is 80MB', 'error');\n ng.closeModal();\n }\n });\n },\n success: function (response) {\n var jsonresp = JSON.parse(response.xhr.response);\n if (jsonresp.status === 'error') {\n ng.authService.showNotification('', jsonresp.message, 'error');\n }\n else {\n ng.authService.showNotification('', 'Files uploaded successfully', 'success');\n }\n }\n };\n\n public currentAssets = []; // the current (active) list of assets currently on the stage (note: this is a javascript object not array)\n public currentAssetsAnchors: Array
four browser assets only', 'error');\n return;\n }\n for (const key in this.currentAssets) {\n if (this.currentAssets[key].Type === 'clock')\n clockCount++;\n }\n if (assetType === 'clock' && clockCount === 4) {\n this.authService.showNotification('Error', 'A screen is permitted up to
four clock assets only', 'error');\n return;\n }\n\n if (assetType === 'video' || assetType === 'youtube') {\n for (const key in this.currentAssets) {\n if (this.currentAssets[key].Type === 'video' || this.currentAssets[key].Type === 'youtube') {\n this.authService.showNotification('Error', 'A screen is permitted only one
Video or YouTube asset', 'error');\n return;\n }\n }\n }\n\n if (assetType === 'clock') {\n for (const key in this.currentAssets) {\n if (this.currentAssets[key].Type === 'image' && this.currentAssets[key].playlist) {\n this.authService.showNotification('Error', 'There is a image playlist on the screen.
Adding a clock asset is not permitted', 'error');\n return;\n }\n }\n }\n\n const asset_id = this.ramdomid(); // get an id for this new asset\n let assetGroup;\n let assetObj;\n\n var aFontFamily = typeof assetReObj.font !== 'undefined' && assetReObj.font !== null\n && assetReObj.font !== '' ? assetReObj.font.replace('-Italic', '') : 'Calibri';\n var afontStyle = typeof assetReObj.font !== 'undefined' && assetReObj.font !== null\n && assetReObj.font.includes('-Italic') ? 'Italic' : 'Normal';\n var afontSize = typeof assetReObj.font_size !== 'undefined' && assetReObj.font !== null\n && assetReObj.font_size !== '' ? assetReObj.font_size :\n assetType === 'text' || assetType === 'text_crawl' ? 40 : 30;\n\n if (assetType === 'image') {\n let imgSrc = (assetType === 'video') ? 'assets/img/video_skewed.png' : url;\n if (reopen && (assetReObj.source === null || assetReObj.source === \"\")) {\n imgSrc = 'assets/img/layout/asset_icons/600x600-app-icon_IMAGE.png';\n }\n const imageObj1 = new Image();\n assetObj = new Konva.Image({\n width: w,\n height: h,\n image: imageObj1,\n id: asset_id\n });\n assetGroup = new Konva.Group({\n x: x,\n y: y,\n draggable: true,\n id: asset_id + '-Group',\n dragBoundFunc: function (pos) {\n return ng.restrictDragWithinStage(pos, assetObj.width(), assetObj.height(), asset_id, this.getAbsolutePosition());\n }\n });\n assetGroup.setAttr('asset_type', assetType);\n this.layer.add(assetGroup);\n assetGroup.add(assetObj);\n const lW = (parseInt(w, 0) - 10);\n const lH = (parseInt(h, 0) - 10);\n this.addAnchor(assetGroup, 0, 0, 'topLeft-' + asset_id);\n this.addAnchor(assetGroup, lW, 0, 'topRight-' + asset_id);\n this.addAnchor(assetGroup, lW, lH, 'bottomRight-' + asset_id, true);\n this.addAnchor(assetGroup, 0, lH, 'bottomLeft-' + asset_id);\n\n imageObj1.onload = function () {\n assetObj.image(imageObj1);\n ng.layer.draw();\n };\n imageObj1.src = imgSrc;\n\n } else if (assetType === 'video') {\n const imgSrc = (reopen && assetType === 'video' && url.split('.').pop().toLowerCase() === 'mp3') ? 'assets/img/Audio-Circle-Icon-1920x1080.png'\n : 'assets/img/video_skewed.png';\n\n const imageObj1 = new Image();\n assetObj = new Konva.Image({\n width: w,\n height: h,\n image: imageObj1,\n id: asset_id,\n fill: '#a31627'\n });\n assetGroup = new Konva.Group({\n x: x,\n y: y,\n draggable: true,\n id: asset_id + '-Group',\n dragBoundFunc: function (pos) {\n return ng.restrictDragWithinStage(pos, assetObj.width(), assetObj.height(), asset_id, this.getAbsolutePosition());\n }\n });\n assetGroup.setAttr('asset_type', assetType);\n this.layer.add(assetGroup);\n assetGroup.add(assetObj);\n const lW = (parseInt(w, 0) - 10);\n const lH = (parseInt(h, 0) - 10);\n this.addAnchor(assetGroup, 0, 0, 'topLeft-' + asset_id);\n this.addAnchor(assetGroup, lW, 0, 'topRight-' + asset_id);\n this.addAnchor(assetGroup, lW, lH, 'bottomRight-' + asset_id, true);\n this.addAnchor(assetGroup, 0, lH, 'bottomLeft-' + asset_id);\n\n imageObj1.onload = function () {\n assetObj.image(imageObj1);\n ng.layer.draw();\n };\n imageObj1.src = imgSrc;\n\n } else if (assetType === 'text') {\n // console.log(url);\n assetObj = new Konva.Rect({\n width: w,\n height: h,\n stroke: '#666',\n fill: 'black',\n strokeWidth: 2,\n name: asset_id,\n id: asset_id\n });\n let textSource = url;\n if (reopen && assetType === 'text') {\n textSource = url;\n }\n const assetObjText = new Konva.Text({\n x: 0,\n y: 0,\n //offsetY: this.gActiveResolution === '1920x1080' ? 0 - (((assetObj.getHeight()) / 2) - 21) : 0 - (((assetObj.getHeight()) / 2) - 19),\n width: assetObj.getWidth(),\n text: textSource,\n fontSize: afontSize,\n fontFamily: aFontFamily,\n fontStyle: afontStyle,\n fill: 'white',\n align: 'center',\n name: asset_id + '-Text',\n id: asset_id + '-Text'\n });\n assetObjText.offsetY(assetObjText.getHeight() / 2 - assetObj.getHeight() / 2);\n assetGroup = new Konva.Group({\n x: x,\n y: y,\n draggable: true,\n id: asset_id + '-Group',\n dragBoundFunc: function (pos) {\n return ng.restrictDragWithinStage(pos, assetObj.width(), assetObj.height(), asset_id, this.getAbsolutePosition());\n }\n });\n assetGroup.setAttr('asset_type', assetType);\n this.layer.add(assetGroup);\n assetGroup.add(assetObj);\n assetGroup.add(assetObjText);\n const lW = (parseInt(w, 0) - 10);\n const lH = (parseInt(h, 0) - 10);\n this.addAnchor(assetGroup, 0, 0, 'topLeft-' + asset_id);\n this.addAnchor(assetGroup, lW, 0, 'topRight-' + asset_id);\n this.addAnchor(assetGroup, lW, lH, 'bottomRight-' + asset_id, true);\n this.addAnchor(assetGroup, 0, lH, 'bottomLeft-' + asset_id);\n this.layer.draw();\n } else if (assetType === 'browser') {\n assetObj = new Konva.Rect({\n width: w,\n height: h,\n stroke: '#666',\n fill: 'black',\n strokeWidth: 2,\n name: asset_id,\n id: asset_id\n });\n const textSource = 'Browser';\n const assetObjText = new Konva.Text({\n x: 0,\n y: 0,\n offsetY: 0 - (((assetObj.getHeight()) / 2) - 17),\n width: assetObj.getWidth(),\n text: textSource,\n fontSize: 30,\n fontFamily: 'Calibri',\n fill: 'white',\n align: 'center',\n name: asset_id + '-Text',\n id: asset_id + '-Text'\n });\n assetGroup = new Konva.Group({\n x: x,\n y: y,\n draggable: true,\n id: asset_id + '-Group',\n dragBoundFunc: function (pos) {\n return ng.restrictDragWithinStage(pos, assetObj.width(), assetObj.height(), asset_id, this.getAbsolutePosition());\n }\n });\n assetGroup.setAttr('asset_type', assetType);\n this.layer.add(assetGroup);\n assetGroup.add(assetObj);\n assetGroup.add(assetObjText);\n const lW = (parseInt(w, 0) - 10);\n const lH = (parseInt(h, 0) - 10);\n this.addAnchor(assetGroup, 0, 0, 'topLeft-' + asset_id);\n this.addAnchor(assetGroup, lW, 0, 'topRight-' + asset_id);\n this.addAnchor(assetGroup, lW, lH, 'bottomRight-' + asset_id, true);\n this.addAnchor(assetGroup, 0, lH, 'bottomLeft-' + asset_id);\n this.layer.draw();\n } else if (assetType === 'channel_number') {\n assetObj = new Konva.Rect({\n width: w,\n height: h,\n stroke: '#666',\n fill: 'black',\n strokeWidth: 2,\n name: asset_id,\n id: asset_id\n });\n let textSource = 'Channel Number';\n const assetObjText = new Konva.Text({\n x: 0,\n y: 0,\n offsetY: 0 - (((assetObj.getHeight()) / 2) - 17),\n width: assetObj.getWidth(),\n text: textSource,\n fontSize: 30,\n fontFamily: 'Calibri',\n fill: 'white',\n align: 'center',\n name: asset_id + '-Text',\n id: asset_id + '-Text'\n });\n assetGroup = new Konva.Group({\n x: x,\n y: y,\n draggable: true,\n id: asset_id + '-Group',\n dragBoundFunc: function (pos) {\n return ng.restrictDragWithinStage(pos, assetObj.width(), assetObj.height(), asset_id, this.getAbsolutePosition());\n }\n });\n assetGroup.setAttr('asset_type', assetType);\n this.layer.add(assetGroup);\n assetGroup.add(assetObj);\n assetGroup.add(assetObjText);\n const lW = (parseInt(w, 0) - 10);\n const lH = (parseInt(h, 0) - 10);\n this.addAnchor(assetGroup, 0, 0, 'topLeft-' + asset_id);\n this.addAnchor(assetGroup, lW, 0, 'topRight-' + asset_id);\n this.addAnchor(assetGroup, lW, lH, 'bottomRight-' + asset_id, true);\n this.addAnchor(assetGroup, 0, lH, 'bottomLeft-' + asset_id);\n this.layer.draw();\n } else if (assetType === 'clock') {\n assetObj = new Konva.Rect({\n width: w,\n height: h,\n stroke: '#666',\n fill: 'black',\n strokeWidth: 2,\n name: asset_id,\n id: asset_id\n });\n let textSource = 'Clock';\n const assetObjText = new Konva.Text({\n x: 0,\n y: 0,\n offsetY: this.gActiveResolution === '1920x1080' ? 0 - (((assetObj.getHeight()) / 2) - 10) : 0 - (((assetObj.getHeight()) / 2) - 12),\n width: assetObj.getWidth(),\n text: textSource,\n fontSize: afontSize,\n fontFamily: aFontFamily,\n fontStyle: afontStyle,\n fill: 'white',\n align: 'center',\n name: asset_id + '-Text',\n id: asset_id + '-Text'\n });\n assetGroup = new Konva.Group({\n x: x,\n y: y,\n draggable: true,\n id: asset_id + '-Group',\n dragBoundFunc: function (pos) {\n return ng.restrictDragWithinStage(pos, assetObj.width(), assetObj.height(), asset_id, this.getAbsolutePosition());\n }\n });\n assetGroup.setAttr('asset_type', assetType);\n this.layer.add(assetGroup);\n assetGroup.add(assetObj);\n assetGroup.add(assetObjText);\n const lW = (parseInt(w, 0) - 10);\n const lH = (parseInt(h, 0) - 10);\n this.addAnchor(assetGroup, 0, 0, 'topLeft-' + asset_id);\n this.addAnchor(assetGroup, lW, 0, 'topRight-' + asset_id);\n this.addAnchor(assetGroup, lW, lH, 'bottomRight-' + asset_id, true);\n this.addAnchor(assetGroup, 0, lH, 'bottomLeft-' + asset_id);\n this.layer.draw();\n } else if (assetType === 'rss') {\n assetObj = new Konva.Rect({\n width: w,\n height: h,\n stroke: '#666',\n fill: 'black',\n strokeWidth: 2,\n name: asset_id,\n id: asset_id\n });\n let textSource = 'RSS';\n const assetObjText = new Konva.Text({\n x: 0,\n y: 0,\n offsetY: 0 - (((assetObj.getHeight()) / 2) - 17),\n width: assetObj.getWidth(),\n text: textSource,\n fontSize: 30,\n fontFamily: 'Calibri',\n fill: 'white',\n align: 'center',\n name: asset_id + '-Text',\n id: asset_id + '-Text'\n });\n assetGroup = new Konva.Group({\n x: x,\n y: y,\n draggable: true,\n id: asset_id + '-Group',\n dragBoundFunc: function (pos) {\n return ng.restrictDragWithinStage(pos, assetObj.width(), assetObj.height(), asset_id, this.getAbsolutePosition());\n }\n });\n assetGroup.setAttr('asset_type', assetType);\n this.layer.add(assetGroup);\n assetGroup.add(assetObj);\n assetGroup.add(assetObjText);\n const lW = (parseInt(w, 0) - 10);\n const lH = (parseInt(h, 0) - 10);\n this.addAnchor(assetGroup, 0, 0, 'topLeft-' + asset_id);\n this.addAnchor(assetGroup, lW, 0, 'topRight-' + asset_id);\n this.addAnchor(assetGroup, lW, lH, 'bottomRight-' + asset_id, true);\n this.addAnchor(assetGroup, 0, lH, 'bottomLeft-' + asset_id);\n this.layer.draw();\n } else if (assetType === 'overlay') {\n assetObj = new Konva.Rect({\n width: w,\n height: h,\n stroke: '#666',\n fill: 'black',\n strokeWidth: 2,\n name: asset_id,\n id: asset_id\n });\n let textSource = 'Overlay';\n const assetObjText = new Konva.Text({\n x: 0,\n y: 0,\n offsetY: 0 - (((assetObj.getHeight()) / 2) - 17),\n width: assetObj.getWidth(),\n text: textSource,\n fontSize: 30,\n fontFamily: 'Calibri',\n fill: 'white',\n align: 'center',\n name: asset_id + '-Text',\n id: asset_id + '-Text'\n });\n assetGroup = new Konva.Group({\n x: x,\n y: y,\n draggable: true,\n id: asset_id + '-Group',\n dragBoundFunc: function (pos) {\n return ng.restrictDragWithinStage(pos, assetObj.width(), assetObj.height(), asset_id, this.getAbsolutePosition());\n }\n });\n assetGroup.setAttr('asset_type', assetType);\n this.layer.add(assetGroup);\n assetGroup.add(assetObj);\n assetGroup.add(assetObjText);\n const lW = (parseInt(w, 0) - 10);\n const lH = (parseInt(h, 0) - 10);\n this.addAnchor(assetGroup, 0, 0, 'topLeft-' + asset_id);\n this.addAnchor(assetGroup, lW, 0, 'topRight-' + asset_id);\n this.addAnchor(assetGroup, lW, lH, 'bottomRight-' + asset_id, true);\n this.addAnchor(assetGroup, 0, lH, 'bottomLeft-' + asset_id);\n this.layer.draw();\n } else if (assetType === 'text_multiline') {\n assetObj = new Konva.Rect({\n width: w,\n height: h,\n stroke: '#666',\n fill: 'black',\n strokeWidth: 2,\n name: asset_id,\n id: asset_id\n });\n let textSource = 'Text Multiline';\n const assetObjText = new Konva.Text({\n x: 0,\n y: 0,\n offsetY: 0 - (((assetObj.getHeight()) / 2) - 17),\n width: assetObj.getWidth(),\n text: textSource,\n fontSize: 30,\n fontFamily: 'Calibri',\n fill: 'white',\n align: 'center',\n name: asset_id + '-Text',\n id: asset_id + '-Text'\n });\n assetGroup = new Konva.Group({\n x: x,\n y: y,\n draggable: true,\n id: asset_id + '-Group',\n dragBoundFunc: function (pos) {\n return ng.restrictDragWithinStage(pos, assetObj.width(), assetObj.height(), asset_id, this.getAbsolutePosition());\n }\n });\n assetGroup.setAttr('asset_type', assetType);\n this.layer.add(assetGroup);\n assetGroup.add(assetObj);\n assetGroup.add(assetObjText);\n const lW = (parseInt(w, 0) - 10);\n const lH = (parseInt(h, 0) - 10);\n this.addAnchor(assetGroup, 0, 0, 'topLeft-' + asset_id);\n this.addAnchor(assetGroup, lW, 0, 'topRight-' + asset_id);\n this.addAnchor(assetGroup, lW, lH, 'bottomRight-' + asset_id, true);\n this.addAnchor(assetGroup, 0, lH, 'bottomLeft-' + asset_id);\n this.layer.draw();\n } else if (assetType === 'text_crawl') {\n assetObj = new Konva.Rect({\n width: w,\n height: h,\n stroke: '#666',\n fill: 'black',\n strokeWidth: 2,\n name: asset_id,\n id: asset_id\n });\n // let textSource = 'Text Scroll';\n let textSource = url;\n if (reopen && assetType === 'text_crawl') {\n textSource = url;\n }\n textSource = textSource.length > 20 ? textSource.substring(0, 20) + '...' : textSource;\n const assetObjText = new Konva.Text({\n x: 0,\n y: 0,\n offsetY: this.gActiveResolution === '1920x1080' ? 0 - (((assetObj.getHeight()) / 2) - 21) : 0 - (((assetObj.getHeight()) / 2) - 19),\n width: assetObj.getWidth(),\n text: textSource,\n fontSize: afontSize,\n fontFamily: aFontFamily,\n fontStyle: afontStyle,\n fill: 'white',\n align: 'center',\n name: asset_id + '-Text',\n id: asset_id + '-Text'\n });\n assetGroup = new Konva.Group({\n x: x,\n y: y,\n draggable: true,\n id: asset_id + '-Group',\n dragBoundFunc: function (pos) {\n return ng.restrictDragWithinStage(pos, assetObj.width(), assetObj.height(), asset_id, this.getAbsolutePosition());\n }\n });\n assetGroup.setAttr('asset_type', assetType);\n this.layer.add(assetGroup);\n assetGroup.add(assetObj);\n assetGroup.add(assetObjText);\n const lW = (parseInt(w, 0) - 10);\n const lH = (parseInt(h, 0) - 10);\n this.addAnchor(assetGroup, 0, 0, 'topLeft-' + asset_id);\n this.addAnchor(assetGroup, lW, 0, 'topRight-' + asset_id);\n this.addAnchor(assetGroup, lW, lH, 'bottomRight-' + asset_id, true);\n this.addAnchor(assetGroup, 0, lH, 'bottomLeft-' + asset_id);\n this.layer.draw();\n } if (assetType === 'youtube') {\n const imgSrc = (assetType === 'youtube') ? 'assets/img/video_skewed.png' : url;\n\n const imageObj1 = new Image();\n assetObj = new Konva.Image({\n width: w,\n height: h,\n image: imageObj1,\n id: asset_id,\n fill: '#a31627'\n });\n assetGroup = new Konva.Group({\n x: x,\n y: y,\n draggable: true,\n id: asset_id + '-Group',\n dragBoundFunc: function (pos) {\n return ng.restrictDragWithinStage(pos, assetObj.width(), assetObj.height(), asset_id, this.getAbsolutePosition());\n }\n });\n assetGroup.setAttr('asset_type', assetType);\n this.layer.add(assetGroup);\n assetGroup.add(assetObj);\n const lW = (parseInt(w, 0) - 10);\n const lH = (parseInt(h, 0) - 10);\n this.addAnchor(assetGroup, 0, 0, 'topLeft-' + asset_id);\n this.addAnchor(assetGroup, lW, 0, 'topRight-' + asset_id);\n this.addAnchor(assetGroup, lW, lH, 'bottomRight-' + asset_id, true);\n this.addAnchor(assetGroup, 0, lH, 'bottomLeft-' + asset_id);\n\n imageObj1.onload = function () {\n assetObj.image(imageObj1);\n ng.layer.draw();\n };\n imageObj1.src = imgSrc;\n }\n assetGroup.attrs._assetId = asset_id;\n assetGroup.attrs.name = (reopen && (assetReObj.name !== null || assetReObj.name !== \"\")) ? assetReObj.name : asset_id;\n this.myElement.push(assetGroup);\n this.show_attributes(assetType, asset_id);\n\n // when the user 'mouses' over the asset\n assetGroup.on('mouseenter', function () {\n document.body.style.cursor = 'pointer';\n });\n\n // when the user 'mouses' away from the asset\n assetGroup.on('mouseleave', function () {\n document.body.style.cursor = 'default';\n });\n\n // when the asset is clicked .....\n assetGroup.on('click', function () {\n // console.log(asset_id);\n ng.show_attributes(this.getAttr('asset_type'), asset_id); // show image attributes\n //ng.currentAssets[asset_id].playlist = false;\n ng.newAssetClicked(this, asset_id);\n });\n\n assetGroup.on('mousedown', function () {\n // console.log(asset_id);\n ng.setCurrentActiveAsset(assetGroup);\n });\n\n // when the asset is moved ...\n assetGroup.on('dragmove', function () {\n if (asset_id === ng.activeAssetId) {\n // make sure the user first 'clicks' the asset before dragging it on the stage\n ng.updateStats(this, asset_id);\n }\n if (ng.snapToEnabled) {\n // console.log('J')\n const assRect = assetGroup.getClientRect();\n ng.shadowRectangle.height(parseInt(assRect.height + 10));\n ng.shadowRectangle.width(parseInt(assRect.width + 10));\n ng.shadowRectangle.position({\n\n x: Math.round(assetGroup.x() / ng.blockSnapSize) * ng.blockSnapSize,\n y: Math.round(assetGroup.y() / ng.blockSnapSize) * ng.blockSnapSize\n });\n ng.stage.batchDraw();\n }\n if (assetType === 'browser') {\n ng.hideBrowserFrame(asset_id);\n }\n });\n\n assetGroup.on('dragstart', (e) => {\n if (ng.snapToEnabled) {\n // ng.shadowRectangle.show();\n // ng.shadowRectangle.moveToTop();\n }\n //assetGroup.moveToTop();\n });\n\n assetGroup.on('dragend', (e) => {\n if (ng.snapToEnabled) {\n\n\n assetGroup.position({\n x: Math.round(assetGroup.x() / ng.blockSnapSize) * ng.blockSnapSize,\n y: Math.round(assetGroup.y() / ng.blockSnapSize) * ng.blockSnapSize\n });\n this.isObjectMoved = true;\n // alert(this.isObjectMoved);\n this.widthValue = ng.stage.findOne('#' + asset_id).getWidth();\n this.heightValue = ng.stage.findOne('#' + asset_id).getHeight();\n //this.xValue = assetGroup.x();\n // this.yValue = assetGroup.y();\n\n this.xValue = Math.round(assetGroup.x() / ng.blockSnapSize) * ng.blockSnapSize;\n this.yValue = Math.round(assetGroup.y() / ng.blockSnapSize) * ng.blockSnapSize;\n // alert(Math.round(assetGroup.x() / ng.blockSnapSize) * ng.blockSnapSize);\n // alert(Math.round(assetGroup.y() / ng.blockSnapSize) * ng.blockSnapSize);\n ng.stage.batchDraw();\n ng.shadowRectangle.hide();\n }\n //ng.repositionBrowserFrame(this, asset_id);\n });\n\n // show the initial coordinate values\n if (document.getElementById(asset_id + '_x') != null) {\n (
a playlist on the stage', 'error');\n return;\n }\n\n for (const key in ng.currentAssets) {\n if (ng.currentAssets[key].Type === 'clock' && attribute_checkbox.checked) {\n attribute_checkbox.checked = false;\n ng.authService.showNotification('Error', 'There is a clock asset on the screen.
Adding Playlist is not permitted', 'error');\n return;\n }\n }\n\n ng.updateAsset(assetId + aAttributes[i].id, aAttributes[i].id);\n ng.togglePlaylistAttributes(this, assetType);\n ng.mediaSelected((
' + assetType +\n ' Playlist
\\n
';\n playListDiv.innerHTML = inHtml;\n attributes_div.appendChild(playListDiv);\n $('#sortable').sortable({\n stop: function (event, ui) {\n ng.playListUpdate();\n },\n });\n }\n $(\".selectpicker\").selectpicker();\n }\n\n BindImageSources(attribute_select): void {\n $(\"#\" + attribute_select.id).empty();\n const heading = document.createElement('option');\n heading.value = '0';\n heading.text = '-- Images --';\n attribute_select.appendChild(heading);\n\n this.currentImages.forEach(image => {\n const option = document.createElement('option');\n option.value = image.name;\n option.text = image.name;\n attribute_select.appendChild(option);\n });\n }\n\n BindVideoSources(attribute_select): void {\n $(\"#\" + attribute_select.id).empty();\n let streamingAdded = false;\n const heading = document.createElement('option');\n heading.value = '0';\n heading.text = '-- Videos --';\n attribute_select.appendChild(heading);\n\n const heading3 = document.createElement('option');\n heading3.value = '1';\n heading3.text = '-- Video Files --';\n attribute_select.appendChild(heading3);\n\n // const heading6 = document.createElement('option');\n // heading6.value = '6';\n // heading6.text = 'Play All Videos';\n // attribute_select.appendChild(heading6);\n\n this.currentVideos.forEach(video => {\n const option = document.createElement('option');\n if (video.isEztvItem && !streamingAdded) {\n const heading2 = document.createElement('option');\n heading2.value = '2';\n heading2.text = '-- Video Streams -- ';\n attribute_select.appendChild(heading2);\n streamingAdded = true;\n }\n if (video.isEztvItem) {\n option.value = video.url;\n option.text = video.name;\n } else {\n option.value = video.name;\n option.text = video.name;\n }\n attribute_select.appendChild(option);\n });\n }\n\n BindVideoOnlySources(attribute_select): void {\n $(\"#\" + attribute_select.id).empty();\n const heading = document.createElement('option');\n heading.value = '0';\n heading.text = '-- Videos --';\n attribute_select.appendChild(heading);\n\n const heading3 = document.createElement('option');\n heading3.value = '1';\n heading3.text = '-- Video Files --';\n attribute_select.appendChild(heading3);\n\n this.currentVideos.forEach(video => {\n if (!video.isEztvItem) {\n const option = document.createElement('option');\n option.value = video.name;\n option.text = video.name;\n attribute_select.appendChild(option);\n }\n });\n }\n\n BindAudioSources(attribute_select): void {\n $(\"#\" + attribute_select.id).empty();\n\n const heading = document.createElement('option');\n heading.value = '0';\n heading.text = '-- .MP3 Files --';\n attribute_select.appendChild(heading);\n\n // const heading3 = document.createElement('option');\n // heading3.value = '1';\n // heading3.text = '-- Audio Files --';\n // attribute_select.appendChild(heading3);\n\n this.currentAudios.forEach(audio => {\n const option = document.createElement('option');\n option.value = audio.name;\n option.text = audio.name;\n\n attribute_select.appendChild(option);\n });\n }\n\n toggleVideosPublish(item) {\n this.publishVideos = item.checked;\n }\n\n mediaSelected(imgName, type) {\n\n // const active_asset = this.stage.findOne('#' + this.activeAssetId + '-Group'); // get the Konva asset object\n // const group_child = active_asset.getChildren()[0];\n\n // if(type === 'audio') {\n\n // } else if(type === 'video') {\n\n // }\n\n if (imgName === '5' && type === 'video') {\n this.publishLineup = true;\n this.openModel(this.publishServerModal);\n } else if (imgName === '3' && type === 'video') {\n this.show_publish_modal(false);\n } else if (imgName === '6' && type === 'video') {\n ng.updateImageAsset('folder', type, null, true, 'folder');\n } else if (type === 'image') {\n this.currentImages.forEach(image => {\n if (image.name === imgName) {\n ng.updateImageAsset('assets/content/' + image.name, type, image.url);\n this.ImageSourceChanged();\n }\n });\n } else if (type === 'audio') {\n this.currentAudios.forEach(audio => {\n if (audio.name === imgName) {\n ng.updateImageAsset('assets/content/' + audio.name, type, audio.url);\n }\n });\n\n } else {\n this.currentVideos.forEach(video => {\n if (video.name === imgName || video.url === imgName) {\n if (video.isEztvItem) {\n ng.updateImageAsset(video.url, type, null, true, video.name);\n } else {\n ng.updateImageAsset('assets/content/' + video.name, type, null, false, video.name);\n }\n }\n });\n }\n }\n\n newAssetClicked(asset_group, asset_id): void {\n // Get and show the X, Y, Width, Height values for the asset just clikced\n const active_x = asset_group.getX();\n const active_y = asset_group.getY();\n const active_width = ng.stage.findOne('#' + asset_id).getWidth();\n const active_height = ng.stage.findOne('#' + asset_id).getHeight();\n this.show_assets(this.currentAssets[asset_id].Type);\n\n const assetObj = ng.stage.findOne('#' + asset_id);\n this.activeImageParent = assetObj.getParent();\n (images in a playlist', 'error');\n return;\n }\n\n if (type === 'image') {\n //if (this.isPlayListAcitve) {\n const active_asset = this.stage.findOne('#' + this.activeAssetId + '-Group');\n const group_child_border = active_asset.getChildren(0);\n // group_child_border.strokeWidth(20);\n\n if (this.currentAssets[this.activeAssetId].playlist) {\n const fileName = asset_name ? asset_name : asset_src.replace(/^.*[\\\\\\/]/, '');\n var isExistingItem = false;\n for (const key in this.currentAssets[this.activeAssetId].playlist_items) {\n if (this.currentAssets[this.activeAssetId].playlist_items[key].name === fileName) {\n isExistingItem = true;\n break;\n }\n }\n if (!isExistingItem) {\n (
asset to the screen.', 'info');\n }\n } else {\n for (const key in this.currentAssets) {\n if ((this.currentAssets[key].Type === 'image' || this.currentAssets[key].Type === 'video'\n || this.currentAssets[key].Type === 'text' || this.currentAssets[key].Type === 'browser'\n || this.currentAssets[key].Type === 'text_crawl' || this.currentAssets[key].Type === 'youtube')\n && (typeof this.currentAssets[key].Source === 'undefined' || this.currentAssets[key].Source === '')) {\n if (isShowNotification) {\n this.authService.showNotification('Error', 'Please provide a Source value for each asset', 'error');\n }\n isValid = false;\n break;\n } else if (this.currentAssets[key].Type === 'text' || this.currentAssets[key].Type === 'text_crawl') {\n const active_group = this.stage.findOne('#' + key + '-Group');\n let group_child = active_group.getChildren()[0];\n const group_child_two = active_group.getChildren()[1];\n\n if ((group_child_two.getHeight() - group_child.getHeight()) > 10) {\n if (this.currentAssets[key].Type === 'text') {\n if (isShowNotification) {\n this.authService.showNotification('Error', 'The text inside the Text asset
must fit inside the asset', 'error');\n }\n } else if (this.currentAssets[key].Type === 'text_crawl') {\n if (isShowNotification) {\n this.authService.showNotification('Error', 'The text inside the Text Scroll
asset must fit inside the asset', 'error');\n }\n }\n isValid = false;\n break;\n }\n } else if (this.currentAssets[key].Type === 'browser') {\n if (typeof this.currentAssets[key].RefreshInterval !== 'undefined' && this.currentAssets[key].RefreshInterval !== '') {\n var rI = parseFloat(this.currentAssets[key].RefreshInterval)\n if (rI < 15 || rI > 86400) {\n if (isShowNotification) {\n this.authService.showNotification('Error', 'The value of refresh interval
must be between 15 and 86400', 'error');\n }\n isValid = false;\n break;\n }\n }\n }\n }\n if (isValid) {\n this.create_screenlist_file(isShowNotification);\n }\n }\n } else {\n if (isShowNotification) {\n this.authService.showNotification('', 'Please login first.', 'info');\n }\n }\n\n //OLD CODE COMMENTED ON 04/29/2021 SOUNAK\n\n // this.gActiveScreenlistFile = 'dmb.screenlist.00.xml';\n // if (this.authService.isLoggedIn) {\n // if (Object.keys(this.currentAssets).length === 0) {\n // this.authService.showNotification('You must add at least one asset to the screen.', 'error');\n // } else {\n // this.openModel(this.fileNameModel);\n // }\n // } else {\n // this.authService.showNotification('Please login first.', 'error');\n // }\n\n //OLD CODE END\n }\n\n openModel(content, config?: object, type?: string) {\n if (typeof config === 'undefined') {\n config = {};\n }\n this.modalRef = this.modalService.open(content, config);\n\n if (type === 'channel-modal') {\n this.modalRef.result.then((result) => {\n this.updateVideoChannelList();\n }, (reason) => {\n this.updateVideoChannelList();\n });\n } else if (type === 'screenshot') {\n this.modalRef.result.then((result) => {\n // console.log('`Closed with: ${result}`');\n }, (reason) => {\n this.screenService.readScreenShotData('admin').subscribe((data) => {\n data = data.split('\\n');\n this.updateImageAsset(data[1], 'image', data[1], true, data[0]);\n });\n });\n\n } else if (type === 'player_status') {\n this.modalRef.result.then((result) => {\n // console.log('`Closed with: ${result}`');\n }, (reason) => {\n clearInterval(ng.playerStatusIntervalID);\n });\n } else {\n this.modalRef.result.then((result) => {\n // console.log('`Closed with: ${result}`');\n\n }, (reason) => {\n if (this.selectedModel === 'resolution' && this.gActiveResolution !== this.selectedResolution) {\n this.gActiveResolution = this.selectedResolution;\n }\n this.selectedModel = null;\n // console.log('`Dismissed ${this.getDismissReason(reason)}`');\n });\n }\n }\n\n closeModal(): void {\n if (this.modalRef) {\n if (this.selectedModel === 'resolution' && this.gActiveResolution !== this.selectedResolution) {\n this.gActiveResolution = this.selectedResolution;\n }\n this.selectedModel = null;\n this.modalRef.close();\n }\n }\n\n valid_asset_position(asset) {\n if (asset.X < 0 || asset.Y < 0 || asset.X + asset.Width > this.stageWidth || asset.Y + asset.Height > this.stageHeight) {\n return false;\n }\n return true;\n }\n\n getBackGroundColor(key) {\n let backGroudColor = this.currentAssets[key].background_color ? this.currentAssets[key].background_color : '255.0.0.0';\n if (this.currentAssets[key].opacity) {\n // const opacityMapping = {\n // 0: 0,\n // 0.1: 26,\n // 0.2: 51,\n // 0.3: 77,\n // 0.4: 102,\n // 0.5: 128,\n // 0.6: 153,\n // 0.7: 179,\n // 0.8: 204,\n // 0.9: 230,\n // 1: 255\n // };\n\n const opacityMapping = {\n 0: 255,\n 0.1: 230,\n 0.2: 204,\n 0.3: 179,\n 0.4: 153,\n 0.5: 128,\n 0.6: 102,\n 0.7: 77,\n 0.8: 51,\n 0.9: 26,\n 1: 0\n };\n\n opacityMapping[this.currentAssets[key].opacity]\n backGroudColor = opacityMapping[this.currentAssets[key].opacity] + '.' + backGroudColor.split('.').splice(1, 3).join('.')\n }\n return backGroudColor;\n\n }\n\n create_screenlist_array(): object {\n // first, tell the user that the saving process has started\n this.savigFile = true;\n\n this.gFilesToBeDelivered = [];\n // set the global var0iable name to the just provided screenlist name\n\n // *****************************************************\n // ** Get each of the required values to be entered into the file **\n // *****************************************************\n const now = new Date();\n const dmb_attributes = {\n 'version': '1.0',\n 'timestamp': this.currentTimeStamp()\n };\n const screenlist_attributes = {\n 'filename': this.gActiveScreenlistFile,\n 'name': ((
Note: Saving the screen will
overwrite the existing screen', 'error');\n return false;\n }\n if (typeof this.authService.currentUser.username !== 'undefined') {\n userName = this.authService.currentUser.username;\n }\n let filesToUpload = {\n images: [],\n videos: [],\n xmls: [this.gActiveScreenlistFile],\n userName: userName,\n serverName: 'preview end point',\n };\n if (Object.keys(this.currentAssets).length > 0) {\n for (const key in this.currentAssets) {\n const value = this.currentAssets[key];\n if (value.Type === 'video' && this.publishVideos) {\n filesToUpload.videos.push(value.Source);\n } else if (value.Type === 'image') {\n filesToUpload.images.push(value.Source);\n }\n }\n this.spinnerService.show();\n this.screenService.previewScreenlistFile(filesToUpload).subscribe((response) => {\n this.spinnerService.hide();\n this.authService.showNotification(response.message, 'success');\n }, error => {\n this.spinnerService.hide();\n this.authService.showNotification('', 'Some error occured please try again later', 'error');\n });\n } else {\n this.authService.showNotification('', 'You must add at least one asset to the screen', 'info');\n }\n }\n\n /**\n * Once the user has entered the screenlist file name, create or update the xml file in the 'Contnet' directory\n */\n ep_preview_screenlist_file(): any {\n if (!this.isScreenSaved) {\n this.authService.showNotification('', 'Please save file first to preview');\n return false;\n }\n\n\n let userName = '';\n if (!this.isScreenSaved) {\n this.authService.showNotification('', 'Please save the screen first
Note: Saving the screen will
overwrite the existing screen', 'error');\n return false;\n }\n if (typeof this.authService.currentUser.username !== 'undefined') {\n userName = this.authService.currentUser.username;\n }\n let filesToUpload = {\n images: [],\n videos: [],\n xmls: [this.gActiveScreenlistFile],\n userName: userName,\n serverName: 'preview end point',\n };\n if (Object.keys(this.currentAssets).length > 0) {\n for (const key in this.currentAssets) {\n const value = this.currentAssets[key];\n if (value.Type === 'video' && this.publishVideos) {\n filesToUpload.videos.push(value.Source);\n } else if (value.Type === 'image') {\n filesToUpload.images.push(value.Source);\n }\n }\n this.spinnerService.show();\n this.screenService.previewScreenlistFile(filesToUpload).subscribe((response) => {\n this.spinnerService.hide();\n this.authService.showNotification('', response.message, 'success');\n }, error => {\n this.spinnerService.hide();\n this.authService.showNotification('', 'Some error occured please try again later', 'error');\n });\n } else {\n this.authService.showNotification('', 'You must add at least one asset to the screen', 'info');\n }\n }\n\n getRegisteredPlayersByUser(): any {\n const userName = this.username;\n this.registrationService.getTop10RegisteredPlayersByUser(userName).subscribe((response) => {\n this.registeredPlayers = response.data;\n });\n }\n getPlayerStatusObjectByUser(): any {\n const userName = this.username;\n this.registrationService.getPlayerStatusObjectByUser(userName).subscribe((response) => {\n this.playerStatusObject = response.data;\n\n this.playerStatusObject.activePlayers.forEach(element => {\n\n var dateUpdatedOnOld = localStorage.getItem('dateUpdatedOn');\n var registrationCode = localStorage.getItem('registrationCode');\n var oldTime = localStorage.getItem('oldMinutes');\n\n var diff = (new Date().getTime() - parseInt(oldTime)) / 1000;\n diff /= 60;\n // alert(diff);\n\n if (dateUpdatedOnOld != \"\" && registrationCode != \"\") {\n if (element.registrationCode == registrationCode) {\n if (dateUpdatedOnOld != element.dateUpdated) {\n element.groupName = 'dmbtv';\n }\n else {\n //As per client wait up to 2 min interval\n if (diff <= 2) {\n element.groupName = 'dmbtvHide';\n }\n else {\n element.groupName = 'dmbtv';\n }\n }\n\n }\n }\n\n if (element.status == 'Active' && element.isActionFileExist == true) {\n if (element.action == \"restart_app\") {\n element.status = 'Restarting Signage App...';\n }\n else if (element.action == \"create_screenshot\") {\n element.status = 'Creating Screenshot...';\n }\n }\n });\n this.playerStatusObject.inactivePlayers.forEach(element => {\n if (element.status == 'Unknown' && element.isActionFileExist == true) {\n if (element.action == \"restart_app\") {\n element.status = 'Restarting Signage App...';\n }\n else if (element.action == \"create_screenshot\") {\n element.status = 'Creating Screenshot...';\n }\n }\n });\n 0 // console.log(this.playerStatusObject);\n });\n }\n\n show_publish_modal(publishScreen = true): any {\n this.publishOnlyVideos = !publishScreen;\n if (this.isScreenSaved === false && publishScreen === true) {\n this.authService.showNotification('', 'Please save the screen first
Note: Saving the screen will
overwrite the existing screen', 'info');\n return false;\n }\n this.getRegisteredPlayersByUser();\n this.openModel(this.publishToPlayerModal, { size: 'xl' });\n setTimeout(function () {\n $('[data-toggle=\"tooltip\"]').tooltip({\n trigger: 'hover'\n });\n }, 1000);\n //OLD CODE COMMENTED ON 05/04/2021 SOUNAK\n //this.openModel(this.publishServerModal);\n //OLD CODE END\n }\n\n openViewSelectPlayersModal() {\n // this.getRegisteredPlayersByUser();\n\n // try{\n // this.currentRule.players.forEach(element => { \n // this.registeredPlayers.find(p=>p.playerName === element.name).isSelected = true;\n // });\n // }catch(error){}\n\n this.openModel(this.viewSelectPlayersModal, { size: 'xl' });\n setTimeout(function () {\n $('[data-toggle=\"tooltip\"]').tooltip({\n trigger: 'hover'\n });\n }, 1000);\n }\n\n openChangeResolutionModel(event) {\n this.selectedResolution = this.gActiveResolution;\n this.gActiveResolution = event.target.value;\n this.selectedModel = 'resolution';\n this.openModel(this.confirmResolutionChange);\n setTimeout(() => {\n $('#signResolution').val(this.selectedResolution);\n }, 100);\n }\n\n openPlayerRegistrationModal(): void {\n this.registrationCode = '';\n this.playerName = '';\n this.openModel(this.playerRegistrationModal);\n }\n\n openinvalidPlayerIdModal(): void {\n this.closeModal();\n this.openModel(this.invalidPlayerIdModal);\n }\n\n openEditPlayerModal(): void {\n this.registrationCode = '';\n this.playerName = '';\n\n const userName = this.username;\n this.registrationService.getTop10RegisteredPlayersByUser(userName).subscribe((response) => {\n this.registeredPlayers = response.data;\n\n this.openModel(this.editPlayerModal);\n\n var selected_player =
Note: Saving the screen will
overwrite the existing screen', 'error');\n return false;\n }\n\n if (Object.keys(this.currentAssets).length > 0) {\n if (this.publishOnlyVideos === false) {\n // tslint:disable-next-line:forin\n for (const key in this.currentAssets) {\n const value = this.currentAssets[key];\n if (value.Type === 'video' && this.publishVideos) {\n if (value.playlist) {\n filesToUpload.others.push(value.file_name);\n // tslint:disable-next-line:forin\n for (const plKey in value.playlist_items) {\n filesToUpload.videos.push(value.playlist_items[plKey].name);\n // filesToUpload.images.push(value.playlist_items[plKey].name);\n }\n } else {\n filesToUpload.videos.push(value.Source);\n }\n } else if (value.Type === 'image') {\n if (value.playlist) {\n filesToUpload.others.push(value.file_name);\n // tslint:disable-next-line:forin\n for (const plKey in value.playlist_items) {\n filesToUpload.images.push(value.playlist_items[plKey].name);\n // filesToUpload.images.push(value.playlist_items[plKey].name);\n }\n } else {\n filesToUpload.images.push(value.Source);\n }\n }\n }\n } else {\n this.currentVideos.forEach(element => {\n if (element.isEztvItem) {\n filesToUpload.videos.push(element.url);\n } else {\n filesToUpload.videos.push(element.name);\n }\n });\n }\n\n filesToUpload.players = this.registeredPlayers;\n\n } else {\n this.authService.showNotification('', 'You must add at least one asset to the screen', 'error');\n return;\n }\n }\n\n this.spinnerService.show();\n this.screenService.publishScreenlistFile(filesToUpload).subscribe((response) => {\n if (response.status == 'success') {\n this.authService.showNotification('Publish Successful', 'success', 'success');\n this.closeModal();\n }\n else if (response.status == 'error') {\n $(\"#lbl_publish_errmsg\").text(response.message);\n $(\"#lbl_publish_errmsg\").show();\n }\n this.spinnerService.hide();\n this.publishLineup = false;\n }, error => {\n //alert(error.status);\n //console.log(error.status);\n this.spinnerService.hide();\n this.publishLineup = false;\n this.authService.showNotification('Error', 'Some error occured please try again later', 'error');\n });\n\n //OLD CODE COMMENTED ON 05/05/2021 SOUNAK\n\n // let userName = '';\n // let endpointLocationName = '';\n\n // if (typeof this.publichContentServerObj.endpointLocationName === 'undefined'\n // || this.publichContentServerObj.endpointLocationName === '') {\n // this.authService.showNotification('Please select publish profile.', 'error');\n // return false;\n // } else {\n // endpointLocationName = this.publichContentServerObj.endpointLocationName.toLowerCase();\n // }\n\n // if (typeof this.authService.currentUser.username !== 'undefined') {\n // userName = this.authService.currentUser.username;\n // }\n\n // const filesToUpload = {\n // images: [],\n // videos: [],\n // xmls: this.publishOnlyVideos ? [] : [this.gActiveScreenlistFile],\n // userName: userName,\n // serverName: 'content server',\n // others: [],\n // EndpointLocationName: endpointLocationName,\n // endpointLocationName: endpointLocationName,\n // };\n\n // if (this.publishLineup) {\n // filesToUpload.xmls = [];\n // filesToUpload.others = ['Channel.Lineup.db'];\n // } else {\n // if (this.isScreenSaved === false && this.publishOnlyVideos === false) {\n // this.authService.showNotification('Please save the screen first', 'error');\n // return false;\n // }\n\n // if (Object.keys(this.currentAssets).length > 0) {\n // if (this.publishOnlyVideos === false) {\n // // tslint:disable-next-line:forin\n // for (const key in this.currentAssets) {\n // const value = this.currentAssets[key];\n // if (value.Type === 'video' && this.publishVideos) {\n // if (value.playlist) {\n // filesToUpload.others.push(value.file_name);\n // // tslint:disable-next-line:forin\n // for (const plKey in value.playlist_items) {\n // filesToUpload.videos.push(value.playlist_items[plKey].name);\n // // filesToUpload.images.push(value.playlist_items[plKey].name);\n // }\n // } else {\n // filesToUpload.videos.push(value.Source);\n // }\n // } else if (value.Type === 'image') {\n // if (value.playlist) {\n // filesToUpload.others.push(value.file_name);\n // // tslint:disable-next-line:forin\n // for (const plKey in value.playlist_items) {\n // filesToUpload.images.push(value.playlist_items[plKey].name);\n // // filesToUpload.images.push(value.playlist_items[plKey].name);\n // }\n // } else {\n // filesToUpload.images.push(value.Source);\n // }\n // }\n // }\n // } else {\n // this.currentVideos.forEach(element => {\n // if (element.isEztvItem) {\n // filesToUpload.videos.push(element.url);\n // } else {\n // filesToUpload.videos.push(element.name);\n // }\n // });\n // }\n // } else {\n // this.authService.showNotification('You must add at least one asset to the screen.', 'error');\n // return;\n // }\n // }\n\n // this.spinnerService.show();\n // this.screenService.previewScreenlistFile(filesToUpload).subscribe((response) => {\n // if (response.status === 'error') {\n // // this.authService.showNotification('', response.message, 'error');\n // this.authService.showNotification('', 'Error: Publish failed', 'error');\n // } else {\n // // this.authService.showNotification(response.message, 'success');\n // this.authService.showNotification('Publish Successful', 'success', 'success');\n // }\n // this.spinnerService.hide();\n // this.closeModal();\n // this.publishLineup = false;\n // }, error => {\n // this.spinnerService.hide();\n // this.publishLineup = false;\n // this.authService.showNotification('Some error occured please try again later.', 'error');\n // });\n //OLD CODE END\n }\n\n select_tod_players() {\n this.closeModal();\n this.tod_no_of_players = this.registeredPlayers.filter(p => p.isSelected === true).length;\n }\n\n load_screenlist(xml_file): void {\n // console.log(xml_file);\n this.resetCompleteScreen();\n let userName = '';\n if (typeof this.authService.currentUser.username !== 'undefined') {\n userName = this.authService.currentUser.username;\n }\n let reqData = {};\n if (xml_file.templatePath !== false) {\n reqData = {\n userName: userName,\n fileName: xml_file.fileName,\n templatesRelativePath: xml_file.templatePath\n };\n this._templatePath = xml_file.templatePath;\n } else {\n reqData = {\n userName: userName,\n fileName: xml_file.fileName,\n subDirectory: xml_file.subDirectory,\n screenName: xml_file.screenName\n };\n this._templatePath = false;\n }\n\n this.spinnerService.show();\n this.screenService.readScreenlistFile(reqData).subscribe((response) => {\n if (response.status === 'error') {\n //this.isScreenSaved = false;\n this.spinnerService.hide();\n this.authService.showNotification('', response.message, 'error');\n } else {\n //this.gActiveScreenlistFile = xml_file;\n this.gActiveScreenlistFile = xml_file.fileName;\n const fileData = response.data;\n // console.log('response');\n const oScreenlist = fileData['screenlist'];\n const oScreen = fileData['screenlist']['screen'];\n const aAssets = fileData['screenlist']['screen']['asset'];\n this.gActiveResolution = response.data.screenlist.resolution;\n this.changeCanvasResolution();\n // if there is only one asset on the screen that the type will be an object\n const type = (aAssets.constructor === Object ? 'object' : 'array');\n // console.log(aAssets)\n for (let y = 0; y < (type === 'object' ? 1 : aAssets.length); y++) {\n // loop over each asset/object on the screen to add to the stage\n\n // get attributes defined in the xml file\n const oAsset = (type === 'object' ? aAssets : aAssets[y]);\n const asset_type = oAsset.type;\n const asset_name = oAsset.name;\n const asset_x = oAsset.x;\n const asset_y = oAsset.y;\n const asset_width = oAsset.width;\n const asset_height = oAsset.height;\n const asset_fit = oAsset.fit;\n const asset_source = oAsset.source;\n oAsset.opacity = oAsset.background_color ? oAsset.background_color.split('.')[0] : '255';\n oAsset.background_color = oAsset.background_color ? \"255.\" + oAsset.background_color.split('.').splice(1, 3).join('.') : '255.255.255.255';\n\n // use the same funtion used to create a screenlist file from scratch ...\n let assetUrl = '';\n if (asset_type === 'image') {\n\n if (xml_file.templatePath !== false) {\n // console.log(xml_file.templatePath);\n assetUrl = this.mediaUrl + xml_file.templatePath + '/images/' + asset_source;\n } else if (asset_source != null && asset_source.includes('http')) {\n var url = window.location + \"/assets/img/layout/asset_icons/600x600-app-icon_IMAGE.png\";\n assetUrl = url;\n } else if (asset_source != null && asset_source != \"\") {\n var dotIndex = asset_source.lastIndexOf('.');\n var ext = asset_source.substring(dotIndex);\n if (ext == '.jpg' || ext == '.png' || ext == '.jpeg' || ext == '.gif' || ext == '.bmp' || ext == '.svg' || ext == '.ico') {\n if (asset_source.includes('assets/content/')) {\n assetUrl = this.mediaUrl + this.authService.currentUser.username + '/images/' + asset_source;\n }\n else {\n var imageExist = false;\n this.currentImages.forEach(image => {\n if (image.name === asset_source) {\n const user = this.authService.currentUser;\n var url = window.location + \"/assets/content/\" + user.userName + \"/images/\" + asset_source;\n assetUrl = url;\n imageExist = true;\n }\n\n });\n if (!imageExist) {\n //if image not exist then load default images\n var url = window.location + \"/assets/img/layout/asset_icons/600x600-app-icon_IMAGE.png\";\n assetUrl = url;\n }\n }\n }\n else {\n //if type error then load default images\n var url = window.location + \"/assets/img/layout/asset_icons/600x600-app-icon_IMAGE.png\";\n assetUrl = url;\n }\n }\n } else if (asset_type === 'video') {\n // assetUrl = asset_source; // 'assets/img/video_skewed.png';\n assetUrl = this.mediaUrl + this.authService.currentUser.username + '/videos/' + asset_source;\n } else if (asset_type === 'text') {\n assetUrl = asset_source;\n } else if (asset_type === 'browser' || asset_type === 'text_crawl' || asset_type === 'text_multiline' || asset_type === 'rss' || asset_type === 'youtube') {\n assetUrl = asset_source;\n }\n // console.log(assetUrl);\n this.add_new_asset(asset_type,\n assetUrl,\n asset_width,\n asset_height,\n asset_x,\n asset_y,\n true,\n oAsset\n );\n }\n // Set the background color for the screen\n // console.log(oScreen);\n\n if (fileData.screenName === '') {\n this.signName = oScreen.name;\n } else {\n this.signName = fileData.screenName;\n }\n\n const screen_bkg_color = oScreen.background_color;\n const color = screen_bkg_color.split('.');\n this.color_picker_canvas.fromRGB(color[1], color[2], color[3]); // set the default stage color that is defined in the screenlist\n const sel_color = this.color_picker_canvas.toHEXString();\n const stage = document.getElementById('canvasContainer');\n stage.style.backgroundColor = sel_color;\n this.layer.draw();\n\n // all proceess done hide the spinner\n this.spinnerService.hide();\n\n this.save_screenlist(false);\n this.isScreenSaved = true;\n\n if (xml_file.templatePath === false && xml_file.subDirectory === false) {\n // this.save_screenlist(false);\n // this.isScreenSaved = true;\n }\n\n // Set the Last element as active\n const lastEle = this.myElement[this.myElement.length - 1];\n ng.newAssetClicked(lastEle, lastEle.getAttr('_assetId'));\n }\n }, error => {\n this.isScreenSaved = false;\n this.spinnerService.hide();\n this.authService.showNotification('', 'Some error occured please try again later', 'error');\n });\n }\n\n getServerSettings(): any {\n const userID = this.authService.currentUser.userID;\n this.screenService.getServerSettings(userID, '').subscribe((response) => {\n if (response.data) {\n for (let i = 0; i < response.data.length; i++) {\n if (response.data[i]['serverName'] === 'preview end point') {\n this.previewEndPoint.Connection = response.data[i]['connection'];\n this.previewEndPoint.IPAddress = response.data[i]['iPAddress'];\n this.previewEndPoint.Port = response.data[i]['port'];\n } else if (response.data[i]['serverName'] === 'content server') {\n this.contentServer.Connection = response.data[i]['connection'];\n this.contentServer.IPAddress = response.data[i]['iPAddress'];\n this.contentServer.Port = response.data[i]['port'];\n this.contentServer.UserName = response.data[i]['userName'];\n this.contentServer.Password = response.data[i]['password'];\n this.contentServer.ContentDirectory = response.data[i]['contentDirectory'];\n this.contentServer.TransferDirectory = response.data[i]['transferDirectory'];\n this.contentServer.FileMasks = response.data[i]['fileMasks'];\n } else if (response.data[i]['serverName'] === 'ez tv server') {\n this.ezTvServer.IPAddress = response.data[i]['iPAddress'];\n // this.ezTvServer.Protocol = response.data[i]['protocol'];\n this.ezTvServer.UserName = response.data[i]['userName'];\n this.ezTvServer.Password = response.data[i]['password'];\n\n // this.ezTVLogin(this.ezTvServer.IPAddress, this.ezTvServer.UserName, this.ezTvServer.Password);\n }\n }\n }\n }, error => {\n console.log(error);\n });\n }\n\n savePreviewPoint(): any {\n this.previewEndPoint.UserID = this.authService.currentUser.userID;\n this.previewEndPoint.userName = this.authService.currentUser.userName;\n this.isSavingpreviewEndPoint = true;\n this.screenService.saveServerSettings(this.previewEndPoint).subscribe((response) => {\n this.spinnerService.hide();\n this.isSavingpreviewEndPoint = false;\n this.closeModal();\n this.authService.showNotification('', 'Saved Successfully', 'success');\n }, error => {\n this.spinnerService.hide();\n this.isSavingpreviewEndPoint = false;\n this.authService.showNotification('', 'Some error occured please try again later', 'error');\n });\n }\n\n saveContentServer(myForm: NgForm): any {\n if (myForm.valid) {\n // console.log(this.contentServerUserObj);\n this.contentServer.UserID = this.contentServerUserObj.userID;\n // this.contentServer.userID = this.contentServerUserObj.userID;\n this.contentServer.userName = this.contentServerUserObj.userName;\n this.contentServer.EndpointLocationName = this.contentServer.Name.toLowerCase();\n // if(1==1){console.log(this.contentServer); return false;}\n this.isSavingContentServer = true;\n console.clear();\n // console.log(this.contentServer);\n const reqData = {\n UserID: this.contentServer.UserID,\n Connection: this.contentServer.Connection,\n IPAddress: this.contentServer.IPAddress,\n Port: this.contentServer.Port,\n UserName: this.contentServer.UserName,\n Password: this.contentServer.Password,\n ContentDirectory: this.contentServer.ContentDirectory,\n TransferDirectory: this.contentServer.TransferDirectory,\n ServerName: this.contentServer.ServerName,\n EndpointLocationName: this.contentServer.EndpointLocationName,\n Name: this.contentServer.Name.toLowerCase(),\n // iD: this.concreate_screenlist_arraytentServer.iD\n };\n // console.log(this.contentServer.iD);\n // console.log(reqData); // if(1==1){return false;}\n this.screenService.saveServerSettings(reqData).subscribe((response) => {\n this.spinnerService.hide();\n this.isSavingContentServer = false;\n this.closeModal();\n // this.authService.showNotification(response.message, 'success', 'success');\n this.authService.showNotification('', 'Saved Successfully', 'success');\n this.isAddNewUserServer = false;\n this.closeModal();\n }, error => {\n this.spinnerService.hide();\n this.isSavingContentServer = false;\n this.authService.showNotification('', 'Some error occured please try again later', 'error');\n });\n } else {\n this.authService.showNotification('', 'All field are required', 'error');\n }\n }\n\n saveEzTvServer(): any {\n this.ezTvServer.UserID = this.authService.currentUser.userID;\n this.isSavingEzTvServer = true;\n this.screenService.saveServerSettings(this.ezTvServer).subscribe((response) => {\n this.spinnerService.hide();\n this.isSavingEzTvServer = false;\n this.closeModal();\n // this.authService.showNotification(response.message, 'success', 'success');\n this.authService.showNotification('', 'Saved Successfully', 'success');\n }, error => {\n this.spinnerService.hide();\n this.isSavingEzTvServer = false;\n this.authService.showNotification('', 'Some error occured please try again later', 'error');\n });\n }\n\n changeCanvasResolution(): void {\n this.selectedResolution = this.gActiveResolution;\n this.selectedModel = null;\n this.closeModal();\n $('#signResolution').val(this.gActiveResolution);\n if (this.gActiveResolution === '1920x1080') {\n this.stageHeight = 1080;\n this.stageWidth = 1920;\n this.stage.setHeight(1080);\n this.stage.setWidth(1920);\n document.getElementById('full-hd').classList.add('full-hd');\n document.getElementById('full-hd').classList.remove('hd');\n this.isPortraitView = false;\n } else if (this.gActiveResolution === '1080x1920') {\n this.stageHeight = 1920;\n this.stageWidth = 1080;\n this.stage.setHeight(1920);\n this.stage.setWidth(1080);\n document.getElementById('full-hd').classList.add('full-hd');\n document.getElementById('full-hd').classList.remove('hd');\n this.isPortraitView = true;\n } else if (this.gActiveResolution === '1280x720') {\n this.stageHeight = 720;\n this.stageWidth = 1280;\n this.stage.setHeight(720);\n this.stage.setWidth(1280);\n document.getElementById('full-hd').classList.add('hd');\n document.getElementById('full-hd').classList.remove('full-hd');\n this.isPortraitView = false;\n } else if (this.gActiveResolution === '745x300') {\n this.stageHeight = 300;\n this.stageWidth = 745;\n this.stage.setHeight(300);\n this.stage.setWidth(745);\n document.getElementById('full-hd').classList.add('hd');\n document.getElementById('full-hd').classList.remove('full-hd');\n this.isPortraitView = false;\n }\n\n this.gridLayer.destroy();\n const gridLayer = this.createGridLayer();\n this.stage.add(gridLayer);\n\n if (this.snapToEnabled) {\n this.gridLayer.show();\n this.gridLayer.moveToBottom();\n } else {\n this.gridLayer.hide();\n }\n\n this.changeZoomLevel();\n }\n\n getTheIframeUrl(): any {\n // {{ previewUrl }}?path={{ filePath }}&file=xmls/{{ gActiveScreenlistFile }}\n // const url = this.previewUrl + '?path=' + this.filePath + '&file=xmls/' + this.gActiveScreenlistFile;\n const url = this.previewUrl + '?path=' + this.filePath + '/&file=' + this.gActiveScreenlistFile;\n // const url = 'http://digiprima.com/';\n return url;\n // return this.sanitizer.bypassSecurityTrustResourceUrl(url);\n }\n\n openWindowCustomClass(content) {\n this.modalService.open(content, { windowClass: 'mod-preview', size: 'lg' });\n // console.log(this.gActiveResolution);\n if (this.gActiveResolution == '1280x720') {\n $('.mod-inner-preview').parent('.modal-content').css({\n width: this.stageWidth + 40,\n position: 'absolute',\n 'left': '72%',\n 'top': '25.5em',\n 'transform': 'translate(-50%,-50%)'\n });\n } else {\n $('.mod-inner-preview').parent('.modal-content').css({\n width: this.stageWidth + 40,\n position: 'absolute',\n 'left': '65%',\n 'top': '35.5em',\n 'transform': 'translate(-50%,-50%)'\n });\n }\n }\n\n removePlaylistItem(filename, id) {\n // $('*[data-customerID=\"22\"]');\n // console.log(this.playListItems);\n // $('#' + id ).remove();\n var index = this.currentAssets[this.activeAssetId].playlist_items.map(function (o) { return o.name; }).indexOf(filename);\n $('[data-index=\"' + id + '\"]').remove();\n this.playListItems.splice(index, 1);\n this.currentAssets[this.activeAssetId].playlist_items.splice(index, 1);\n\n if (this.currentAssets[this.activeAssetId].playlist_items.count() === 0) {\n $(\"#\" + this.activeAssetId + '_playlist').click();\n $(\"#\" + this.activeAssetId + '_item_duration').val('10');\n }\n\n // console.log(this.playListItems);\n }\n\n togglePlaylistAttributes(item, assetType) {\n this.isPlayListAcitve = item.checked;\n if (item.checked) {\n const file_name = this.currentAssets[this.activeAssetId].Name + '.pl';\n $('.attr_hidden').show();\n this.playListItems = [];\n this.currentAssets[this.activeAssetId].playlist = true;\n this.currentAssets[this.activeAssetId].item_duration = '10';\n this.currentAssets[this.activeAssetId].transtion = '';\n this.currentAssets[this.activeAssetId].image_wall = false;\n this.currentAssets[this.activeAssetId].playlist_items = [];\n this.currentAssets[this.activeAssetId].file_name = file_name;\n // (
resolution is 1920x1080', 'error');\n // this.authService.showNotification('', 'Some images did not get uploaded. Error occurred', 'error');\n // this.closeModal();\n }\n\n onVideoUploadError(e) {\n // console.log(e);\n // this.authService.showNotification('', 'The maximum video file upload
size is 24MB', 'error');\n this.authService.showNotification('', 'Some files did not get uploaded. Error occurred', 'error');\n this.closeModal();\n }\n\n onUploadSuccess(e) {\n //console.log(e);\n this.getUserFilesList('image');\n //this.authService.showNotification('', 'Images uploaded successfully', 'success');\n $('.selectpicker').selectpicker('refresh');\n window.setTimeout(function () {\n const active_group = ng.stage.findOne('#' + ng.activeAssetId + '-Group'); // get the Konva asset object\n active_group.fire('click');\n ng.closeModal();\n }, 2000);\n }\n\n onVideoUploadSuccess(e) {\n const totalCurrentVideos = this.currentVideos.length;\n //this.authService.showNotification('', 'Files uploaded successfully', 'success');\n this.getUserFilesList('video');\n $('.selectpicker').selectpicker('refresh');\n // this.timer = setInterval(() => {\n // this.getUserFilesList('video');\n // this.BindVideoSources(
rules', '', 'error');\n return;\n }\n\n const data = this.create_timeofday_array(false);\n\n if (!data) {\n return;\n }\n\n const userName = this.username;\n var reqData = {\n userName: userName\n };\n\n this.screenService.saveTimeOfDay(data).subscribe((response) => {\n // this.closeModal();\n if (isShowNotification) {\n if (response.status === 'error') {\n this.authService.showNotification(response.message, '', 'error');\n } else {\n this.authService.showNotification('Rules saved successfully', 'success', 'success');\n this.fetchTimeOfDayData(reqData);\n }\n }\n }, error => {\n if (isShowNotification) {\n //this.authService.showNotification(error.message, 'error');\n this.authService.showNotification('', 'Some error occured. please try again later', 'error');\n }\n //this.modalRef.close();\n });\n }\n\n private fetchTimeOfDayData(reqData: any): void {\n this.screenService.readTimeOfDayFile(reqData).subscribe(\n response => this.handleApiResponse(response),\n error => this.handleApiError(error)\n );\n }\n\n private handleApiResponse(response: any): void {\n if (response.status === 'error') {\n this.spinnerService.hide();\n this.authService.showNotification('', response.message, 'error');\n } else {\n this.currentTimeOfDay = response.data;\n this.currentRules = response.data.rules;\n this.tod_no_of_players = 0;\n this.configureModalElements();\n this.spinnerService.hide();\n this.resetTimeOfDayModal();\n }\n }\n\n private handleApiError(error: any): void {\n this.spinnerService.hide();\n this.authService.showNotification('', 'Some error occurred please try again later', 'error');\n }\n\n private configureModalElements(): void {\n $(\".selectpicker\").selectpicker();\n setTimeout(() => {\n $(\".selectpicker\").selectpicker('refresh');\n $(\"#divTodModalBody\").removeClass('disabled');\n }, 2000);\n }\n\n openSubscriptionsModal() {\n if (this.username) {\n this.spinnerService.show();\n this.subscriptionService.getSubscriptionDetails(this.username).subscribe(\n (response) => {\n if (response && response.data) {\n if(response.status === 'error') {\n this.spinnerService.hide();\n this.authService.showNotification('', 'Some error occured please try again later', 'error');\n } else {\n this.subscriptionDetails = response.data;\n this.spinnerService.hide();\n this.isAddDaysView = false;\n this.openModel(this.accountSubscriptionModal, { size: 'fullscreen_sm' });\n $('.selectpicker').selectpicker('refresh');\n }\n } else {\n this.spinnerService.hide();\n this.authService.showNotification('', 'Some error occured please try again later', 'error');\n }\n },\n (error) => {\n console.error('Error fetching subscription details:', error);\n this.spinnerService.hide();\n this.authService.showNotification('', 'Some error occured please try again later', 'error');\n }\n );\n }\n }\n\n GetEncodedComponent(url): any {\n return encodeURIComponent(url);\n }\n}\n\n\n// WEBPACK FOOTER //\n// ./src/app/components/screen-builder/screen-builder.component.ts","module.exports = \".form-control {\\r\\n background-color: white !important;\\r\\n color: black !important;\\r\\n}\\r\\n\\r\\n.error {\\r\\n color: #FF0000;\\r\\n}\\r\\n\\r\\n#addDaysLeft {\\r\\n width: 50%;\\r\\n padding: 20px;\\r\\n padding-top: 0px;\\r\\n}\\r\\n\\r\\n#addDaysRight {\\r\\n width: 50%;\\r\\n border-left: 2px solid gray;\\r\\n padding: 20px;\\r\\n padding-top: 0px;\\r\\n padding-left: 30px;\\r\\n}\\r\\n\\r\\n#card-number-element{\\r\\n padding-top: 12px;\\r\\n padding-bottom: 8px;\\r\\n}\\r\\n\\r\\n#card-expiry-element{\\r\\n padding-top: 12px;\\r\\n padding-bottom: 8px;\\r\\n}\\r\\n\\r\\n#card-cvc-element{\\r\\n padding-top: 12px;\\r\\n padding-bottom: 8px;\\r\\n}\\r\\n\\r\\n.not_req_ctrl {\\r\\n background-color: gray !important;\\r\\n color: white !important;\\r\\n}\\r\\n\\r\\n.not_req_ctrl::-webkit-input-placeholder {\\r\\n color: white !important;\\r\\n}\\r\\n\\r\\n.not_req_ctrl::-moz-placeholder {\\r\\n color: white !important;\\r\\n}\\r\\n\\r\\n.not_req_ctrl::-ms-input-placeholder {\\r\\n color: white !important;\\r\\n}\\r\\n\\r\\n.not_req_ctrl::placeholder {\\r\\n color: white !important;\\r\\n}\\r\\n\\r\\n.lbl_req_ctrl{\\r\\n padding-left: 10px;\\r\\n -ms-flex-line-pack: end;\\r\\n align-content: flex-end;\\r\\n}\\r\\n\\r\\n#accountFooterLeft {\\r\\n width: 50%;\\r\\n display: -webkit-box;\\r\\n display: -ms-flexbox;\\r\\n display: flex;\\r\\n -webkit-box-pack: end;\\r\\n -ms-flex-pack: end;\\r\\n justify-content: flex-end;\\r\\n padding-right: 20px;\\r\\n}\\r\\n\\r\\n#accountFooterRight {\\r\\n width: 50%;\\r\\n display: -webkit-box;\\r\\n display: -ms-flexbox;\\r\\n display: flex;\\r\\n -webkit-box-pack: end;\\r\\n -ms-flex-pack: end;\\r\\n justify-content: flex-end;\\r\\n}\\r\\n\\r\\n.grid-toggle-label {\\r\\n text-align: left!important;\\r\\n width: 100%!important;\\r\\n}\\r\\n\\r\\n#lblTotalAmount {\\r\\n font-size: larger;\\r\\n}\\r\\n\\r\\n.cardExpiryContainer {\\r\\n -webkit-box-flex: 0;\\r\\n -ms-flex: 0 0 20%;\\r\\n flex: 0 0 20%;\\r\\n max-width: 20%;\\r\\n}\"\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./src/app/components/subscription/subscription.component.css\n// module id = ./src/app/components/subscription/subscription.component.css\n// module chunks = main","module.exports = \"