169 algorithm to random collect youtube video (#171)

* dryrun is working * rendering working; but basic random search page not quite right * fix bug that initiating the default value for advanced search * fix bug * random search should not sort by anything other than relevance * changelog
ncsa · Jun 25, 2024 · 40de1df · 40de1df
1 parent dda8380
commit 40de1df
Show file tree

Hide file tree

Showing 8 changed files with 158 additions and 44 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -4,6 +4,9 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [Unreleased]
+### Added
+- Randomly collect youtube video [#169](https://github.com/ncsa/standalone-smm-smile/issues/169)
 
 ## [0.4.0] - 2024-06-13
 ### Added

diff --git a/www/public/bootstrap/js/customized/query_auth.js b/www/public/bootstrap/js/customized/query_auth.js
@@ -22,6 +22,7 @@ function authorize(platform){
     }
     else if (platform === 'youtube') {
         $("#social-media option[value='queryYoutube']").removeAttr('disabled');
+        $("#social-media option[value='youtubeRandomVideos']").removeAttr('disabled');
         $("#social-media option[value='queryYoutubeChannel']").removeAttr('disabled');
         $("#social-media option[value='queryYoutubePlaylist']").removeAttr('disabled');
         $("#social-media option[value='youtubeMostPopular']").removeAttr('disabled');

diff --git a/www/public/bootstrap/js/customized/query_formValid.js b/www/public/bootstrap/js/customized/query_formValid.js
@@ -37,7 +37,8 @@ function formValid(searchID){
 		$("#alert").modal('show');
 		$("#social-media").focus();
 		return false;
-	} else if ($("#social-media option:selected").val() !== 'youtubeMostPopular' &&
+	} else if ($("#social-media option:selected").val() !== 'youtubeMostPopular'
+		&& $("#social-media option:selected").val() !== 'youtubeRandomVideos' &&
 		(!regx.test($("#searchbox").val()) || $("#searchbox").val().length >= 500)) {
 		$("#modal-message").append(`<h4>Please type in search keyword in the form of <i>English words, number, operators, 
                                 and/or combinations</i> of them!<br><b>Length shouldn't exceed 500 characters!</b></h4>`);
@@ -175,6 +176,7 @@ function formValid(searchID){
 				return false
 			}
 		}else if ($("#social-media option:selected").val() === 'queryYoutube'
+			|| $("#social-media option:selected").val() === 'youtubeRandomVideos'
 			|| $("#social-media option:selected").val() === 'queryYoutubePlaylist'
 			|| $("#social-media option:selected").val() === 'queryYoutubeChannel'
 			|| $("#social-media option:selected").val() === 'youtubeCreatorVideos'

diff --git a/www/public/bootstrap/js/customized/query_pb.js b/www/public/bootstrap/js/customized/query_pb.js
diff --git a/www/public/bootstrap/js/customized/query_submit.js b/www/public/bootstrap/js/customized/query_submit.js
@@ -42,6 +42,16 @@ function submitQuery(textareaID, filenameID, dryrun = false) {
         prefix = 'youtube-Search';
         params = parameters.youtubeSearch;
         pages = parseInt($("#youtube-count").val()) / 50;
+    } else if (queryTerm === 'youtubeRandomVideos') {
+        prefix = 'youtube-Random-Videos';
+        params = parameters.youtubeRandomVideos;
+        if (dryrun){
+            // deep copy so that the original parameters are not modified
+            var copiedParameters = structuredClone(parameters);
+            copiedParameters.youtubeRandomVideos["maxTotalResults:"] = 12;
+            queryString = `{\n\n${updateString(queryTerm, copiedParameters)}\n\n}`;
+        }
+        pages = -999;
     } else if (queryTerm === 'queryYoutubeChannel') {
         prefix = 'youtube-Search-Channel';
         params = parameters.youtubeSearchChannel;
@@ -66,7 +76,7 @@ function submitQuery(textareaID, filenameID, dryrun = false) {
         $("#rendering").hide();
 
         $.ajax({
-            url: 'query-dryrun',
+            url: "query-dryrun",
             type: "post",
             data: {
                 "query": queryString,
@@ -94,9 +104,10 @@ function submitQuery(textareaID, filenameID, dryrun = false) {
                 $("#warning").modal('show');
             }
         });
-    } else {
+    }
+    else {
         $.ajax({
-            url: 'query',
+            url: "query",
             type: "post",
             data: {
                 "query": queryString,
@@ -456,7 +467,8 @@ function submitSearchbox(searchboxID, filenameID, dryrun = false) {
         prefix = 'reddit-Comment';
         pages = -999;
         params = parameters.rdComment;
-    } else if (queryTerm === 'pushshiftComment') {
+    }
+    else if (queryTerm === 'pushshiftComment') {
         queryString = `{
 							  reddit {
 								pushshiftComment(q: "${keyword}"){
@@ -478,6 +490,51 @@ function submitSearchbox(searchboxID, filenameID, dryrun = false) {
         prefix = 'reddit-Historical-Comment';
         pages = -999;
         params = parameters.psComment;
+    }
+    else if (queryTerm === 'youtubeRandomVideos') {
+        var maxTotalResults = 100
+        if (dryrun) maxTotalResults = 12;
+        queryString = `{
+		  youtube {
+			randomSearch(type:"video", maxTotalResults: ${maxTotalResults}) {
+			  kind
+			  etag
+			  id{
+				kind
+				videoId
+				channelId
+				playlistId
+			  }
+			  snippet{
+				publishedAt
+				channelId
+				title
+				description
+				default_thumbnails_url
+				default_thumbnails_width
+				default_thumbnails_height
+				medium_thumbnails_url
+				medium_thumbnails_width
+				medium_thumbnails_height
+				high_thumbnails_url
+				high_thumbnails_width
+				high_thumbnails_height
+				standard_thumbnails_url
+				standard_thumbnails_width
+				standard_thumbnails_height
+				maxres_thumbnails_url
+				maxres_thumbnails_width
+				high_thumbnails_height
+				channelTitle
+				liveBroadcastContent
+			  }
+			}
+		  }
+		}
+		`;
+        prefix = 'youtube-Random-Videos';
+        pages = -999;
+        params = parameters.youtubeRandomVideos;
     } else if (queryTerm === 'queryYoutube') {
         pages = 2; // TODO change me to 10 later
         if (dryrun) pages = 1;
@@ -612,7 +669,7 @@ function submitSearchbox(searchboxID, filenameID, dryrun = false) {
         if (dryrun) pages = 1;
 
         var segmentString = `videos(chart: "mostPopular", regionCode: "${keyword}") {`;
-        if (keyword === ""){
+        if (keyword === "") {
             segmentString = `videos(chart: "mostPopular") {`
         }
         queryString = `{
@@ -708,8 +765,7 @@ function submitSearchbox(searchboxID, filenameID, dryrun = false) {
         `;
         prefix = 'youtube-Most-Popular';
         params = parameters.youtubeMostPopular;
-    }
-    else if (queryTerm === 'youtubeCreatorVideos') {
+    } else if (queryTerm === 'youtubeCreatorVideos') {
         pages = 2; // TODO change me to 10 later
         if (dryrun) pages = 1;
         queryString = `{
@@ -1003,7 +1059,10 @@ function renderPreview(rendering, prefix) {
 				</div>`);
 
         });
-    } else if (prefix === 'youtube-Search' || prefix === 'youtube-Most-Popular' || prefix === 'youtube-Creator-Videos') {
+    } else if (prefix === 'youtube-Search'
+        || prefix === 'youtube-Most-Popular'
+        || prefix === 'youtube-Creator-Videos'
+        || prefix === 'youtube-Random-Videos') {
         $.each(rendering, function (i, val) {
             var img_url = val && val.snippet && val.snippet.medium_thumbnails_url ? val.snippet.medium_thumbnails_url : "";
             let imgElement = img_url ? `<img src="${img_url}" alt="video-img" style="width:100%;"/>` : "";

diff --git a/www/routes/businessLogic/render.js b/www/routes/businessLogic/render.js
@@ -116,6 +116,7 @@ router.post('/list', checkIfLoggedIn, function (req, res, next) {
     promise_array.push(s3.list_folders(req.user.email + '/GraphQL/youtube-Search-Playlist/'));
     promise_array.push(s3.list_folders(req.user.email + '/GraphQL/youtube-Most-Popular/'));
     promise_array.push(s3.list_folders(req.user.email + '/GraphQL/youtube-Creator-Videos/'));
+    promise_array.push(s3.list_folders(req.user.email + '/GraphQL/youtube-Random-Videos/'));
     promise_array.push(s3.list_folders(req.user.email + '/GraphQL/userspec-Others/'));
     Promise.all(promise_array).then(values => {
         directory['twitter-Tweet'] = values[0];
@@ -131,7 +132,8 @@ router.post('/list', checkIfLoggedIn, function (req, res, next) {
         directory['youtube-Search-Playlist'] = values[10];
         directory['youtube-Most-Popular'] = values[11];
         directory['youtube-Creator-Videos'] = values[12];
-        directory['userspec-Others'] = values[13];
+        directory['youtube-Random-Videos'] = values[13];
+        directory['userspec-Others'] = values[14];
         res.send(directory);
     }).catch(err => {
         res.send({ERROR: err});
@@ -154,6 +156,7 @@ router.post('/list-all', checkIfLoggedIn, function (req, res, next) {
     promise_array.push(s3.list_folders(req.user.email + '/GraphQL/youtube-Search-Playlist/'));
     promise_array.push(s3.list_folders(req.user.email + '/GraphQL/youtube-Most-Popular/'));
     promise_array.push(s3.list_folders(req.user.email + '/GraphQL/youtube-Creator-Videos/'));
+    promise_array.push(s3.list_folders(req.user.email + '/GraphQL/youtube-Random-Videos/'));
     promise_array.push(s3.list_folders(req.user.email + '/GraphQL/userspec-Others/'));
     var graphqlLength = promise_array.length;
 
@@ -193,7 +196,8 @@ router.post('/list-all', checkIfLoggedIn, function (req, res, next) {
         directory['GraphQL']['youtube-Search-Playlist'] = values[10];
         directory['GraphQL']['youtube-Most-Popular'] = values[11];
         directory['GraphQL']['youtube-Creator-Videos'] = values[12];
-        directory['GraphQL']['userspec-Others'] = values[13];
+        directory['GraphQL']['youtube-Random-Videos'] = values[13];
+        directory['GraphQL']['userspec-Others'] = values[14];
         for (i = 0; i < order.length; i++) {
             var parent = order[i]['parent'];
             var child = order[i]['child'];

diff --git a/www/views/search/query.pug b/www/views/search/query.pug
@@ -92,6 +92,7 @@ html
                             option(data-icon="far fa-comment" value="redditComment" disabled) Comments in Subreddit
                         optgroup(label="Search YouTube")
                             option(data-icon="fab fa-youtube" value="queryYoutube" disabled) Search for Videos
+                            option(data-icon="fas fa-random" value="youtubeRandomVideos" disabled) Random Videos
                             option(data-icon="fas fa-users" value="queryYoutubeChannel" disabled) Search for Channels
                             option(data-icon="fas fa-list" value="queryYoutubePlaylist" disabled) Search for Playlists
                             option(data-icon="fab fa-hotjar" value="youtubeMostPopular" disabled) Most Popular Videos

diff --git a/www/views/search/youtube/keyword-searchbox.pug b/www/views/search/youtube/keyword-searchbox.pug
@@ -1,11 +1,13 @@
 //Youtube
-div(class="youtube-search youtube-search-channel youtube-search-playlist youtube-creator-videos")
+div(class="youtube-search youtube-random-videos youtube-search-channel youtube-search-playlist youtube-creator-videos")
 	div(class="form-group")
 		label(class="label-control warning") Maximum number of search results
 			span(class="warningText") Careful! The default quota allocation is 10,000 units per day. Every 50 counts as 100 units.
 		div(class="range range-node")
 			input(type="range" min="50" max="5000" value="100" step="50" id="youtube-count" onchange="ytrangeNode.value=value")
 			output(id="ytrangeNode") 100
+
+div(class="youtube-search youtube-search-channel youtube-search-playlist youtube-creator-videos")
 	div(class="form-group")
 		label(class="label-control" style="display:block;") Order
 		label(class="radio-inline")
@@ -26,6 +28,8 @@ div(class="youtube-search youtube-search-channel youtube-search-playlist youtube
 		label(class="radio-inline")
 			input(type="radio", name="ytOrder", value="viewCount")
 			| viewCount
+
+div(class="youtube-search youtube-random-videos youtube-search-channel youtube-search-playlist youtube-creator-videos")
 	div(class="form-group")
 		label(class="label-control" style="display:block;") Video Duration
 		label(class="radio-inline")
@@ -52,7 +56,8 @@ div(class="youtube-search youtube-search-channel youtube-search-playlist youtube
 		div(class="col-md-6", style="display:inline-block;")
 			label Published Before
 			input(class="form-control", type="date", id="publishedBefore")
-div(class="youtube-search youtube-creator-videos")
+
+div(class="youtube-search youtube-random-videos youtube-creator-videos")
 	div(class="form-group")
 		label(class="")
 			i(class="fas fa-map-marker-alt")
@@ -67,7 +72,8 @@ div(class="youtube-search youtube-creator-videos")
 			input(class="form-control", id="ytLocationRadius", placeholder="e.g. 1500m, 5km, 10000ft, 0.75mi")
 		div(class="col-md-12")
 			iframe(id="openLayerMap" src="openLayerMap/geolocation.html")
-div(class="youtube-search youtube-search-channel youtube-search-playlist")
+
+div(class="youtube-search youtube-random-videos youtube-search-channel youtube-search-playlist")
 	div(class="form-group")
 		label(class="")
 			i(class="fas fa-filter")