diff --git a/angular.json b/angular.json index 584772d8c2..26aec60a44 100644 --- a/angular.json +++ b/angular.json @@ -30,6 +30,11 @@ "input": "node_modules/ionicons/dist/ionicons/svg", "output": "./svg" }, + { + "glob": "**/*.*", + "input": "./node_modules/@project-sunbird/sunbird-quml-player-web-component/assets", + "output": "/assets/" + }, { "glob": "**/*", "input": "content-player", @@ -76,6 +81,7 @@ "node_modules/videojs-http-source-selector/dist/videojs-http-source-selector.css", "node_modules/datatables.net-dt/css/jquery.dataTables.css", "node_modules/@project-sunbird/sb-themes/themes/themes-df.scss", + "node_modules/@project-sunbird/sunbird-quml-player-web-component/styles.css", { "input": "src/global.scss" } @@ -90,7 +96,8 @@ "node_modules/@project-sunbird/sunbird-video-player-web-component/sunbird-video-player.js", "node_modules/videojs-contrib-quality-levels/dist/videojs-contrib-quality-levels.min.js", "node_modules/videojs-http-source-selector/dist/videojs-http-source-selector.min.js", - "node_modules/datatables.net-fixedcolumns/js/dataTables.fixedColumns.min.js" + "node_modules/datatables.net-fixedcolumns/js/dataTables.fixedColumns.min.js", + "node_modules/@project-sunbird/sunbird-quml-player-web-component/sunbird-quml-player.js" ], "preserveSymlinks": true }, diff --git a/package.json b/package.json index 24d635dab2..dd4138880d 100644 --- a/package.json +++ b/package.json @@ -77,55 +77,24 @@ "@project-sunbird/sb-svg2pdf": "6.0.2", "@project-sunbird/sunbird-epub-player-v9": "5.2.1", "@project-sunbird/sunbird-pdf-player-v9": "5.1.1", - "@project-sunbird/sunbird-quml-player-v9": "5.0.2", - "@project-sunbird/sunbird-sdk": "^7.0.15", + "@project-sunbird/sunbird-quml-player-web-component": "3.0.3", + "@project-sunbird/sunbird-sdk": "7.0.17", "@project-sunbird/sunbird-video-player-web-component": "^1.0.1", "chart.js": "^2.9.4", "chartjs-plugin-datalabels": "^0.7.0", "chartjs-plugin-stacked100": "^0.7.1", "colors": "1.4.0", - "com-sarriaroman-photoviewer": "^1.3.0", "com.jjdltc.cordova.plugin.zip": "git+https://github.com/Sunbird-Ed/jjdltc-cordova-plugin-zip.git", - "com.telerik.plugins.nativepagetransitions": "^0.7.0", - "cordova-android": "^12.0.0", - "cordova-plugin-advanced-http": "^2.5.1", - "cordova-plugin-android-permissions": "^1.1.2", - "cordova-plugin-androidx-adapter": "^1.1.3", - "cordova-plugin-appavailability": "^0.4.2", "cordova-plugin-badge": "^0.8.8", - "cordova-plugin-chooser": "^1.3.2", - "cordova-plugin-device": "^2.0.3", - "cordova-plugin-dialogs": "^2.0.2", - "cordova-plugin-document-viewer": "^0.9.13", - "cordova-plugin-file": "^8.0.0", - "cordova-plugin-file-opener2": "^2.2.1", - "cordova-plugin-filechooser": "^1.2.0", - "cordova-plugin-filepicker": "^1.1.6", - "cordova-plugin-googleplus": "^8.5.2", - "cordova-plugin-inappbrowser": "^5.0.0", - "cordova-plugin-ionic-keyboard": "^2.2.0", - "cordova-plugin-ionic-webview": "^4.2.1", - "cordova-plugin-media": "^7.0.0", - "cordova-plugin-network-information": "^2.0.2", - "cordova-plugin-printer": "^0.8.0", - "cordova-plugin-secure-storage-echo": "^5.1.1", - "cordova-plugin-statusbar": "^2.4.3", - "cordova-plugin-streaming-media": "^2.3.0", - "cordova-plugin-webview-checker": "^1.0.1", - "cordova-plugin-x-socialsharing": "^6.0.3", - "cordova-plugin-zip": "^3.1.0", - "cordova-sqlite-storage": "6.0.0", - "cordova.plugins.diagnostic": "^5.0.2", "core-js": "^3.23.3", + "crypto-browserify": "^3.12.0", "datatables.net-dt": "^1.13.4", "datatables.net-fixedcolumns": "^3.3.3", "dayjs": "1.9.8", "dom-to-image": "^2.6.0", "epubjs": "^0.3.89", - "es6-promise-plugin": "^4.2.2", "grapheme-splitter": "^1.0.4", "hammerjs": "^2.0.8", - "ionic-plugin-keyboard": "2.2.1", "ionic4-rating": "^1.0.9", "jest-preset-angular": "^12.2.6", "jspdf": "^2.0.0", @@ -147,9 +116,9 @@ "pouchdb-find": "^7.2.2", "rxjs": "^6.6.3", "sb-tag-manager": "^3.9.19", + "stream-browserify": "^3.0.0", "ts-jest": "^28.0.8", "tslib": "^2.0.0", - "uk.co.workingedge.phonegap.plugin.istablet": "^1.2.0", "util": "^0.12.5", "uuid": "^3.4.0", "video.js": "7.18.1", @@ -192,28 +161,58 @@ "@types/node": "12.11.5", "babel-polyfill": "^6.26.0", "code-push": "^3.0.1", - "cordova-android": "^11.0.0", + "com-sarriaroman-photoviewer": "^1.3.0", + "com.telerik.plugins.nativepagetransitions": "^0.7.0", + "cordova-android": "^12.0.0", + "cordova-plugin-advanced-http": "^2.5.1", "cordova-plugin-android-downloadmanager": "git+https://github.com/Sunbird-Ed/sb-cordova-plugin-downloadmanager.git", + "cordova-plugin-android-permissions": "^1.1.5", + "cordova-plugin-androidx-adapter": "^1.1.3", "cordova-plugin-app-version": "^0.1.14", + "cordova-plugin-appavailability": "^0.4.2", "cordova-plugin-awesome-shared-preferences": "git+https://github.com/adriano-di-giovanni/cordova-plugin-shared-preferences.git", "cordova-plugin-badge-fix": "^0.8.10", - "cordova-plugin-camera": "git+https://github.com/vishwanath1004/cordova-plugin-camera.git", + "cordova-plugin-camera": "git+https://github.com/shikshalokam/cordova-plugin-camera.git", + "cordova-plugin-chooser": "git+https://github.com/shikshalokam/cordova-plugin-chooser.git", "cordova-plugin-code-push": "git+https://github.com/swayangjit/cordova-plugin-code-push.git", "cordova-plugin-console": "^1.1.0", + "cordova-plugin-device": "^2.1.0", + "cordova-plugin-dialogs": "^2.0.2", + "cordova-plugin-document-viewer": "^0.9.13", "cordova-plugin-fcm-with-dependecy-updated": "git+https://github.com/Sunbird-Ed/sb-cordova-plugin-fcm.git#release-5.1.2", - "cordova-plugin-file": "^7.0.0", + "cordova-plugin-file": "^8.0.1", + "cordova-plugin-file-opener2": "^2.2.1", "cordova-plugin-file-transfer": "git+https://github.com/shikshalokam/cordova-plugin-file-transfer.git", + "cordova-plugin-filechooser": "^1.2.0", "cordova-plugin-filepath": "git+https://github.com/shikshalokam/cordova-plugin-filepath.git", + "cordova-plugin-filepicker": "^1.1.6", + "cordova-plugin-googleplus": "^8.5.2", + "cordova-plugin-inappbrowser": "^5.0.0", "cordova-plugin-inappupdatemanager": "git+https://github.com/subranil/cordova-plugin-inappupdatemanager.git#release-3.7.0", + "cordova-plugin-ionic-keyboard": "^2.2.0", + "cordova-plugin-ionic-webview": "^4.2.1", "cordova-plugin-local-notification": "git+https://github.com/fquirin/cordova-plugin-local-notifications.git", + "cordova-plugin-media": "^7.0.0", + "cordova-plugin-network-information": "^2.0.2", "cordova-plugin-openrap": "git+https://github.com/project-sunbird/cordova-plugin-openrap.git", + "cordova-plugin-printer": "^0.8.0", "cordova-plugin-proguard": "git+https://github.com/greybax/cordova-plugin-proguard.git", "cordova-plugin-qr-scanner": "git+https://github.com/project-sunbird/cordova-plugin-qr-scanner.git#release-5.0.2", - "cordova-plugin-sunbirdsplash": "git+https://github.com/project-sunbird/cordova-plugin-sunbirdsplash.git#release-6.0.0", "cordova-plugin-screen-orientation": "git+https://github.com/521dimensions/cordova-plugin-screen-orientation.git", + "cordova-plugin-secure-storage-echo": "^5.1.1", + "cordova-plugin-statusbar": "^2.4.3", + "cordova-plugin-streaming-media": "^2.3.0", + "cordova-plugin-sunbirdsplash": "git+https://github.com/project-sunbird/cordova-plugin-sunbirdsplash.git#release-6.0.0", "cordova-plugin-telerik-imagepicker": "^2.3.3", + "cordova-plugin-webview-checker": "^1.0.1", + "cordova-plugin-x-socialsharing": "^6.0.4", + "cordova-plugin-zip": "^3.1.0", + "cordova-sqlite-storage": "^6.0.0", "cordova-zip-plugin": "git+https://github.com/Sunbird-Ed/jjdltc-cordova-plugin-zip.git", + "cordova.plugins.diagnostic": "^5.0.2", + "es6-promise-plugin": "^4.2.2", "fs-extra": "^8.1.0", + "ionic-plugin-keyboard": "^2.2.1", "jest": "^28.0.3", "plist": "^3.0.2", "properties-reader": "^2.2.0", @@ -225,7 +224,8 @@ "tiny-glob": "^0.2.9", "ts-node": "^10.9.1", "tslint": "~6.1.0", - "typescript": "4.6.4" + "typescript": "4.6.4", + "uk.co.workingedge.phonegap.plugin.istablet": "^1.2.0" }, "description": "An Ionic project", "cordova": { @@ -260,9 +260,7 @@ "cordova-plugin-screen-orientation": {}, "cordova-plugin-zip": {}, "cordova-plugin-local-notification": { - "ANDROID_SUPPORT_V4_VERSION": "26.+", - "ANDROIDX_VERSION": "1.2.0", - "ANDROIDX_APPCOMPAT_VERSION": "1.3.1" + "ANDROID_SUPPORT_V4_VERSION": "26.+" }, "cordova-plugin-code-push": {}, "cordova.plugins.diagnostic": { diff --git a/src/app/app.module.ts b/src/app/app.module.ts index bb825cd32e..e702a91647 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -22,7 +22,6 @@ import { IonicModule, IonicRouteStrategy } from '@ionic/angular'; import { TranslateLoader, TranslateModule, TranslateService } from '@ngx-translate/core'; import { TranslateHttpLoader } from '@ngx-translate/http-loader'; import { CsContentType } from '@project-sunbird/client-services/services/content'; -import { QuestionCursor } from '@project-sunbird/sunbird-quml-player-v9'; // app dependencies like directive, sdk, services etc import { SunbirdSdk } from '@project-sunbird/sunbird-sdk'; import { QumlPlayerService } from '../services/quml-player/quml-player.service'; @@ -366,8 +365,8 @@ export const sunbirdSdkFactory = apiPath: '/api/content/v2', searchApiPath: '/api/content/v1', contentHeirarchyAPIPath: '/api/collection/v1', - questionSetReadApiPath: '/api/questionset/v1', - questionReadApiPath: '/api/question/v1/' + questionSetReadApiPath: '/api/questionset/v2', + questionReadApiPath: '/api/question/v2/' }, courseServiceConfig: { apiPath: '/api/course/v1' @@ -550,7 +549,7 @@ declare const sbutility; Chooser, PhotoViewer, StreamingMedia, - { provide: QuestionCursor, useClass: QumlPlayerService }, + QumlPlayerService, { provide: 'SB_NOTIFICATION_SERVICE', useClass: NotificationService }, TranslateJsonPipe ], diff --git a/src/app/player/player.page.html b/src/app/player/player.page.html index a9c10a0af2..4869cc60d8 100644 --- a/src/app/player/player.page.html +++ b/src/app/player/player.page.html @@ -11,10 +11,10 @@ -
+
@@ -27,5 +27,9 @@
+
+
+
+ diff --git a/src/app/player/player.page.ts b/src/app/player/player.page.ts index 43de6d23aa..4c116b99d8 100644 --- a/src/app/player/player.page.ts +++ b/src/app/player/player.page.ts @@ -36,6 +36,7 @@ import { ContentUtil } from '../../util/content-util'; import { PrintPdfService } from '../../services/print-pdf/print-pdf.service'; import { FormConstants } from '../form.constants'; import { File } from '@awesome-cordova-plugins/file/ngx'; +import { UtilityService } from '../../services/utility-service'; declare const cordova; @@ -62,10 +63,12 @@ export class PlayerPage implements OnInit, OnDestroy, PlayerActionHandlerDelegat nextContentToBePlayed: Content; playerType: string; isExitPopupShown = false; - + questionData: any; @ViewChild('preview', { static: false }) previewElement: ElementRef; @ViewChild('video') video: ElementRef | undefined; + @ViewChild('qumlPlayer', { static: false }) qumlPlayer: ElementRef; + constructor( @Inject('COURSE_SERVICE') private courseService: CourseService, @Inject('PROFILE_SERVICE') private profileService: ProfileService, @@ -91,6 +94,8 @@ export class PlayerPage implements OnInit, OnDestroy, PlayerActionHandlerDelegat private telemetryGeneratorService: TelemetryGeneratorService, private printPdfService: PrintPdfService, private file: File, + private utilityService: UtilityService, + ) { this.canvasPlayerService.handleAction(); @@ -131,6 +136,7 @@ export class PlayerPage implements OnInit, OnDestroy, PlayerActionHandlerDelegat this.config['config'].showDeviceOrientation = true this.config['metadata']['children'] = (await this.contentService.getQuestionSetChildren(this.config['metadata']['identifier'])) this.playerType = 'sunbird-quml-player'; + await this.playQumlContent(); } else if(["video/mp4", "video/webm"].includes(this.config['metadata']['mimeType']) && this.checkIsPlayerEnabled(this.playerConfig , 'videoPlayer').name === "videoPlayer"){ if(!this.platform.is('ios')){ await this.screenOrientation.lock(this.screenOrientation.ORIENTATIONS.LANDSCAPE); @@ -430,11 +436,12 @@ export class PlayerPage implements OnInit, OnDestroy, PlayerActionHandlerDelegat if(this.config['metadata']['mimeType'] === "application/vnd.sunbird.questionset"){ let questionSet; try{ - questionSet = await this.contentService.getQuestionSetRead(this.content.identifier, {fields:'instructions'}).toPromise(); + questionSet = await this.contentService.getQuestionSetRead(this.content.identifier, {fields:'instructions,outcomeDeclaration'}).toPromise(); } catch(e){ console.log(e); } this.config['metadata']['instructions'] = questionSet && questionSet.questionset.instructions ? questionSet.questionset.instructions : undefined; + this.config['metadata']['outcomeDeclaration'] = questionSet && questionSet.questionset.outcomeDeclaration ? questionSet.questionset.outcomeDeclaration : undefined; } const profile = await this.profileService.getActiveSessionProfile({ requiredFields: ProfileConstants.REQUIRED_FIELDS }).toPromise(); this.config['context'].userData = { @@ -683,4 +690,42 @@ export class PlayerPage implements OnInit, OnDestroy, PlayerActionHandlerDelegat }, 100); } } + + async playQumlContent() { + if (this.playerType === 'sunbird-quml-player' && this.config && this.qumlPlayer) { + const playerConfig: any = { + context: this.config.context, + config: this.config.config, + metadata: this.config.metadata + }; + playerConfig.metadata['outcomeDeclaration'] = { + "maxScore": { + "cardinality": "single", + "type": "integer", + "defaultValue": 1 + } + } + + setTimeout(() => { + const qumlElement = document.createElement('sunbird-quml-player'); + qumlElement.setAttribute('player-config', JSON.stringify(playerConfig)); + + qumlElement.addEventListener('playerEvent', (event) => { + console.log("On playerEvent", event); + }); + + qumlElement.addEventListener('telemetryEvent', (event) => { + console.log("On telemetryEvent", event); + }); + + if (this.qumlPlayer && this.qumlPlayer.nativeElement) { + this.qumlPlayer.nativeElement.append(qumlElement); + } else { + console.error("qumlPlayer or its native element is not available."); + } + }, 100); + } else { + console.error("Invalid player type or missing config."); + } + } }