Example #1
0
function displayForm($msg)
{
    global $userID, $userName, $media;
    $users = new users();
    $classes = $users->getClassesUserBelongsTo($userID);
    foreach ($classes as $key => $row) {
        $id[$key] = $row['ID'];
        $name[$key] = $row['name'];
    }
    array_multisort($name, SORT_ASC, $id, SORT_DESC, $classes);
    if (isset($_GET['cid'])) {
        $CID = $_GET['cid'];
    } else {
        $CID = $classes[0]['ID'];
    }
    //print "CID: $CID<br/>
    $groupsByCourse = $users->getMyGroups($userID, $CID);
    if (isset($_GET['gid'])) {
        $GID = $_GET['gid'];
    } else {
        $groupIDs = array_keys($groupsByCourse);
        $GID = $groupIDs[0];
    }
    if (isset($_GET['anchor'])) {
        $anchor = $_GET['anchor'];
    }
    ?>









<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Video &amp; User Management</title>






<script type="text/javascript" src="kaltura-html5player-widget/jquery-1.4.2.min.js"></script>

<script type="text/javascript" src="http://gdata.youtube.com/feeds/api/videos/<?php 
    echo $description;
    ?>
?v=2&alt=jsonc&callback=youtubeFeedCallback&prettyprint=true"></script>

<!-- 
	<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script>
-->
<script type="text/javascript">

var points = [];

function youtubeFeedCallback(json){
        $duration = json["data"]["duration"];
        return $duration;
    }



function confirmDelete(videoID) {
    if (confirm("Are you sure you want to delete the video?")) {
         $.ajax({
            type: "POST",
            url: "ajax/delete_video.php",
            data: {video_id: videoID},
            dataType: "html",
            success: function(msg) { 
				console.log("success deleting video" + msg);                
            },
            error: function (request, status, error) {
				console.log("failure deleting video" + error);                
            },
            async: false
        });
      	// reload page
     	location.href = "video_management.php?cid=<?php 
    echo "{$CID}&gid={$GID}";
    ?>
&anchor=unassigned";
    }
}



function confirmAdd(videoID) {
   // alert("The title is: "+$title);
   // alert("The video duration is: " + $duration);
   //   alert("Calling the function to add a video!");
   //   alert("The point one is: " + points[1]);
   //   alert("The point two is: " + points[2]);
   //   alert("The point three is: " + points[3]);
    if (confirm("You are adding the YouTube video(s) to CLAS ...")) {
         $.ajax({
            type: "POST",
            url: "ajax/add_video.php",
            data: {video_id: videoID, title: $title, description: $summary, point_one: points[1], point_two: points[2], point_three: points[3]},
            dataType: "html",
            success: function(msg) {
                                console.log("success adding the video(s)" + msg);
            },
            error: function (request, status, error) {
                                console.log("failure adding the video(s)" + error);
            },
            async: false
        });
        // reload page
        location.href = "video_management.php?cid=<?php 
    echo "{$CID}&gid={$GID}";
    ?>
&anchor=unassigned";
    }
}






// Fade out the instruction box from yellow to white when there is a notice
function highlightInstructions() {
    $('#instructions').css('background-color', '#ff9');
    $('#instructions').animate({backgroundColor: '#fff'}, 3000);
}

function jumpBox(list) {
    location.href = list.options[list.selectedIndex].value
}

function generateCopyrightForm(fileCount) {
	var CopyrightForm = "<div class=\"copyright-form form\" id=\"copyright_form_fileCount" + fileCount +"\">";

	// term text (segment 0)
	CopyrightForm += "<div id=\"segment0_fileCount" + fileCount + "\" class=\"custom-statement\">" +
			// "<hr>" + // "thematic break" or horizontal rule, doesn't look as nice on our layout




			"<div>" + 
			"" + 
			"</div>" +
			"<div>" + 
			"</div>" +
			"<div id=\"privacy_content_fileCount" + fileCount + "\" class=\"hidden-content\">" + 
			"Lecturers and TAs are required to input the key points based on the content of the lecture video. " + 
			"</div>" + 
			"<div></div>" + 
			"<div id=\"copyright_content_fileCount" + fileCount + "\" class=\"hidden-content\">"  +
				"For evaluation purposes, students are required to answer \"Yes\" or \"No\" to the points addressed based on the video content. " + 
				"<br/><br/>**Note that if hold the opinon that Yes or No does not apply to the point, please leave as it is and raise the issue to the lecturers through the comments section.</div>" + 
			"<div></div>" + 
			"</div>";

	// term type 1
	CopyrightForm += "<div>" + 
		"<label for=\"Customdata-WithThePermissionOfTheCopyrightHolders\" class=\"required\">" + 
			"</label>" + 
			"</div>";

	// term text continued (segment 1)
	CopyrightForm += "";

	// term type 2
	CopyrightForm += "<div>" + 
		"<label for=\"Customdata-FairDealingException\" class=\"required\">" + 
		"</label>" + 
		"</div>";

	// term type 3
	CopyrightForm += "<div>" + 
	"<label for=\"Customdata-PublicDomain\" class=\"required\">" + 
	"</label>" + 
		"</div>";
	
		
	CopyrightForm += "</div>";

			
	//return CopyrightForm;
}

function expandCollapse(target, fileCount){
	var button = document.getElementById(target+"_button"+"_fileCount" + fileCount);

	if(button == null) return;

	var content = document.getElementById(target+"_content"+"_fileCount" + fileCount);

	if(content.style.display=='block'){
		content.style.display = 'none';
		button.innerHTML = "EXPAND +";
	}else{
		content.style.display = "block";
		button.innerHTML = "COLLAPSE -";
	}
} 

fileCount = 0;
$(document).ready(function() {

<?php 
    if (isset($anchor)) {
        ?>
		anchor = '<?php 
        echo "{$anchor}";
        ?>
';
		try {
			$(document).scrollTop ( $("#" + anchor).offset().top + 300 );
		} catch (e) {
			// ignore if error
		}
<?php 
    }
    ?>

	
	$('#first-file-fields').append(generateCopyrightForm(1));
    fileCount = 2;

    if ($('#message').hasClass('upload-complete')) {
		console.log('hasClass');    
        highlightInstructions();
    }

    $('#update-conversion-status').click(function() {
        //alert('Handler for .click() called.');
        window.location.reload();
    });

    $("#upload-form").submit(function(e) {
        formComplete = true;


       // alert("YouTube Video Title is: " );
       // alert("YouTube Video Summary is: " + "<?php 
    echo $_POST['url'];
    ?>
");



        detailsMissing = false;
		validationMessage = "";




       $("textarea").each(function(i,item) {
            var url = item.value;
            var length = $("textarea").length;
            if (i == 0)
           {
            var n = url.indexOf("watch?v=");          
             $description = url.substring(n+8, n+19);
             //alert("YouTube video ID is: " + $description);
           }
           else
           {
             $summary = url
             //alert("YouTube summary is: " + $summary);
           }

       });


       $(":text").each(function(i,item) {
         points[i] = item.value; 
         //alert("The value is: " + points[i]);

       });






        
        $("input").each(function(i, item) {
              $title = item.value;
            //  alert("YouTube video title is: " + item.value);
           // alert("index" + i + " item:" + item.value);
            // console.log("index" + i + " item:" + item.value);

            // check if the file info part of the each file in the form is complete
            if ("" == $.trim(item.value)) {
                // if any of the input fields are empty disable form submission
                detailsMissing = true;
                formComplete = false;
            }
               return false;      
        });

		if (detailsMissing) {
			validationMessage += "Some details are missing!\n\nEach upload entry requires a TITLE, DESCRIPTION, and a chosen FILE.\n\n";
		}
        
        for(var i = 1; i < fileCount;i++) {
			// check if the copyright part of each file in the form is complete
			// make sure at least one copyright field is selected as Yes
			if($("#Customdata-WithThePermissionOfTheCopyrightHolders_fileCount" + i).val() != "Yes" && 
					$("#Customdata-FairDealingException_fileCount" + i).val() != "Yes" && 
					$("#Customdata-PublicDomain_fileCount" + i).val() != "Yes" && 
					$("#Customdata-Other_fileCount" + i).val() != "Yes"){
				fileChosen = $("input[name='upload" + i + "']").val();
				fileChosen = (fileChosen == null || fileChosen == "") ? "\"No file chosen yet\"" : "\"" + fileChosen.replace(/^.*[\\\/]/, '') + "\"";  

				if (fileChosen != "\"No file chosen yet\"") {
					validationMessage +=  "In file " + i + " " + fileChosen + ": \n\n" +
							"At least one of the copyright authorization options must be selected as \"Yes\"" +
							"\n\n";
					formComplete = false;
				}
			}
        }

        if (formComplete) {
            $('#spinner').show();
            $('#message').text("Embed in progress... Please do not close the browser or press the back button until the embed is complete.");
            highlightInstructions();
            //use ajax method to insert a record into the media table.
           // alert("Are you sure that you want to embed the video(s)?");
           // alert("The value of description is: " + $description);
            confirmAdd($description);

            
        } else {
			alert(validationMessage);
			e.preventDefault();
			return false;
        }
    });

    $('input:radio[id="Yes"]').click(function() {
        
        // add form fields for another file upload
        var fields = '<br />' + 
        	"<fieldset class=\"form rounded-box file-upload-box\" id=\"first-file-fields\">" +
        	"<h4>Points for the video " + "</h4>" +
        	"<fieldset style=\"border:none\">" +
	            "<div style=\"float:left;width:300px\">" +
			          '<label>Point 1:' +
			          '<input type="text" id="point1" name="point1" size="100"/>' +
			          '</label>' +
			          "<br/>" +
			          '<label>' +



                                 '<label>Point 2:' + 
                              '<input type="text" id="point2" name="point2" size="100">' +
                             '</label>' +


			          '' +
			          '</label>' + 
			          '<label>Point 3:' +
	          		  '<input type="text" id="point3" name="point3" size="100">' +
	          		  '</label>' +
	          	'</div>' +
			"</fieldset>" +
          
           
          "</fieldset>";

          $('#additional-form-fields').append(fields)
          fileCount++;
    });

   // $('#add-point').click(function() {
   //   alert("Add point function clicked!");
     
       

   //    var fields =  "<div style=\"float:left\">" +
   //                               '<label>Here is the place to add the points.<br />' +
   //                               '<textarea name="description' + fileCount + '" id="description" cols="43" rows="5"></textarea>' +
   //                               '</label>' + '</div>';
   //    $('#additional-form-fields').append(fields); 









 
       

   // var x;
   // var person = prompt("Please enter your points","Point 1 is about: ....");
   // if (person != null) {
   //     document.getElementById("demo").innerHTML =
   //     "Hello " + person + "! How are you today?";   
   // }



   // });
    

    $('.groups').change(function() {
        alert("I have entered the group change function!");
        selected    = $(this).val();
        parts       = selected.split(",");

        // video ID and group ID are passed as option value, separated with a comma
        videoID     = parts[0];
        groupID     = parts[1];

        if ("no_group_selected" == groupID) {
            $.ajax({
                type: "GET",
                url: "ajax/remove_video_group.php",
                data: {video_id: videoID, group_id: groupID},
                dataType: "html",
                success: function(msg) {
                    console.log("removed group access" + msg);
                },
                error: function (request, status, error) {
                    console.log("failure removing group access");
                },
                async: false
            });
        } else {
            console.log("setting group:" + groupID);            
            $.ajax({
                type: "GET",
                url: "ajax/set_video_group.php",
                data: {video_id: videoID, group_id: groupID},
                dataType: "html",
                success: function(msg) {
					console.log("success setting group:" + groupID);            
                },
                error: function (request, status, error) {
					console.log("failure setting group:" + groupID);            
                },
                async: false
            });
        }

        // reload page because the displaying list have changed
        location.href = "video_management.php?cid=<?php 
    echo "{$CID}&gid={$GID}";
    ?>
";
        alert("Video group changed!\n\nYou can update the display by refreshing the page or continue working.");
    });
});
</script>

    <link rel="stylesheet" type="text/css" href="style.css" />
    <link rel="stylesheet" type="text/css" href="admin-page.css" />
</head>

<body>
<div id="wrapper">
<?php 
    printAdminBar(false, $userName, $CID, $GID);
    ?>
<div style="clear:both"></div>
<!-- http://blog.oio.de/2010/11/08/how-to-create-a-loading-animation-spinner-using-jquery/ -->
<div class="form">
    <h3>embed video
    <span id="add-file">
    <!-- <span style="text-decoration:none">[+] </span> -->
    <!-- <span style="text-decoration:underline">embed another video</span>  -->
    </span>
    </h3>
    
    <div id="instructions">
        <img id="spinner" src="icons/spinning-wheel.gif" width="60" height="60" style="display:none;float:left;padding-right:1em;" alt="file uploading" />
        <?php 
    echo "{$msg}";
    ?>
        <div style="clear:both"></div>
    </div>
    
    
    
    <form action="" method="post" enctype="multipart/form-data" name="upload-form" id="upload-form">
    	<fieldset class="form rounded-box file-upload-box" id="first-file-fields">
    	  <h4>Details of the YouTube Video</h4>
	      <fieldset style="border:none">
	      	  <div style="float:left;width:300px;">
			      <label>Video Title<br />
			      <input type="text" name="title" size="40" id="title" />
			      </label>


                                <label>YouTube Video URL<br />
                              <textarea name="url" id="url" cols="32" rows="2"></textarea>
                              </label>

			      <br/>
			      <br/>
			      <label>
			      </label>
		      </div>
		      <div style="float:right">
			      <label>Video Summary<br />
			      <textarea name="description" id="description" cols="43" rows="5"></textarea>
		      	  </label>
		      </div>
                       
                      <div style="float:left">
                      <span id="add-point">
                      <span style="text-decoration:underline">Do you want to add the points to your video?</span>
                      </span>
                      <input type="radio" name="choice" id="Yes">Yes</input>
                      <input type="radio" name="choice" id="No">No</input>
                      </div>
                       
		  </fieldset>
      	</fieldset>

      <span id="additional-form-fields">
      </span>

      <label>
      <br />  
      <input type="submit" name="submit" id="submit" value="embed" />
      </label>	
    </form>
</div>
<br />
<br />
<?php 
    // CHECKING ALL VIDEOS FOR CONVERSION STATUS
    global $DEPLOYMENT_NAME;
    // ------------ Check upload complete -------------
    $videosToCheckCompletion = $media->getVideosOwnedBy($userID);
    $videos = $videosToCheckCompletion;
    if (!is_null($videos)) {
        // estimate (in seconds) of the maximum amount of time it takes to convert a video on Kaltura
        $estimatedBestVideoProcessingTime = 60 * 15;
        $estimatedTypicalVideoProcessingTime = 60 * 30;
        if ($DEPLOYMENT_NAME === "dev") {
            $estimatedMaxVideoProcessingTime = 60 * 5;
        } else {
            $estimatedMaxVideoProcessingTime = 60 * 60;
        }
        areConversionsComplete($videos, $estimatedBestVideoProcessingTime, false);
        areConversionsComplete($videos, $estimatedTypicalVideoProcessingTime, false);
        areConversionsComplete($videos, $estimatedMaxVideoProcessingTime, true);
        // re-fetch media table as status' may have changed
        $videos = $media->getVideosOwnedBy($userID);
    }
    $videosWithNoGroup = $media->getVideosWithNoGroup($userID);
    if (!empty($videosWithNoGroup)) {
        ?>
<!-- UNASSIGNED TABLE STARTS! -->
<a id="unassigned"></a> 
<table width="1000px" border="1" style="margin-bottom:35px;float:left;font-family:'Lucida Sans Unicode';">
      <thead style="font-size:14px">
          <tr>
            <th colspan="7" style="text-align:center">Videos Unassigned to Groups</th>
          </tr>
      </thead>
      <thead style="font-size:14px">
          <tr>
            <th scope="col">thumbnail</th>
            <th scope="col" width="15%">title</th>
            <th scope="col" width="15%">description</th>
            <th scope="col" width="10%">duration</th>
            <th scope="col">video status</th>
            <th scope="col">
                 <div>grant access to group</div>
                 <div style="font-weight:normal;font-style:italic;font-size:12px;">
            		<input type="checkbox" name="show_individual_users" id="show_individual_users1">show individual users</input>
            	</div>
            </th>
            <th scope="col">date uploaded</th>
          </tr>
      </thead>
      <tbody style="font-size:12px">
<?php 
        global $DEPLOYMENT_NAME;
        $groups = $users->getGroupsByOwner($userID);
        $videos = $videosWithNoGroup;
        if (!is_null($videos)) {
            foreach ($videos as $video) {
                $thumbnail = $video['thumbnail_url'];
                $videoID = $video['video_id'];
                if ($videoID && $videoID != "") {
                    ?>
           <tr>
            <td style="text-align:center;">
            	<!-- force thumbnail height and width to make the table uniform -->
            	<img src="<?php 
                    echo $thumbnail;
                    ?>
" alt="" style="height:64px;width:101px;margin-top:1px;margin-bottom:1px;"/>
            </td>
            <td><?php 
                    echo $video['title'];
                    ?>
</td>
            <td style="font-size:80%"><?php 
                    echo $video['description'];
                    ?>
</td>
            <td><?php 
                    echo $video['duration'];
                    ?>
 seconds</td>
            <td><?php 
                    echo displayConversionStatus($video['conversion_complete'], $videoID);
                    ?>
</td>
            <td>
<?php 
                    if (!empty($groups)) {
                        print '<select name="groups[]" size="1" class="groups">';
                        print "<option value=\"{$videoID},no_group_selected\">--- no group selected ---</option>";
                        $selectedGroup = $media->getVideoGroup($videoID);
                        print "selectedGroup: {$selectedGroup}";
                        foreach ($groups as $id => $name) {
                            $selectedGroup == $name ? $selected = "selected=\"selected\"" : ($selected = "");
                            print "<option value=\"{$videoID},{$id}\" {$selected}>{$name}</option>";
                        }
                        print '</select>';
                    }
                    empty($groups) ? $label = "create groups" : ($label = "manage groups");
                    ?>
                
                <br />
                <div style="cursor:pointer;color:blue;"><a href="manage_groups.php?cid=<?php 
                    echo "{$CID}&gid={$GID}";
                    ?>
"--------><?php 
                    echo "{$label}";
                    ?>
</a></div>
            </td>
            <td><?php 
                    echo $video['creation_date'];
                    ?>
</td>
          </tr>
<?php 
                }
            }
        }
        ?>
    
      </tbody>
    </table>
<br />
<?php 
    }
    ?>
<!-- UNASSIGNED TABLE ENDS! -->

<a id="filter_controls"></a>
<fieldset style="width:770px;background-color:#dae2e9;padding:0px 0px 0px 0px;
    				border:1px solid gray;border-radius:6px;
    				 background-image:url('images/clas_bottom.jpg');
    				 background-position:right bottom;background-repeat:no-repeat;
    				 /* -moz-box-shadow:    -1px 1px 2px 1px #bbb;
  					 -webkit-box-shadow: -1px 1px 2px 1px #bbb;
 					 box-shadow:         -1px 1px 2px 1px #bbb; */
 					 font-family:'Lucida Sans Unicode';
 					 font-size:14px">
		<span style="font-weight:bold;margin-left:20px;margin-top:10px;margin-bottom:20px;float:left;">Filter videos by:&nbsp;&nbsp;</br></br></br></br></span></br></br>
		<form id="class" name="class" method="post" action="" style="margin-left:-145px;margin-top:10px;margin-bottom:10px;float:left;">

            &nbsp;&nbsp;&nbsp;Course:&nbsp;
            <?php 
    $noCourses = 0 == count($classes) ? "disabled" : "";
    ?>
            <select name="classJumpMenu" id="classJumpMenu" <?php 
    echo $noCourses;
    ?>
 onchange="jumpBox(this.form.elements[0])" style="width:18em;" >
            <?php 
    if (0 == count($classes)) {
        print "<option>-- NO COURSES</option>";
    } else {
        for ($i = 0; $i < count($classes); $i++) {
            ?>
                <?php 
            $ID = $classes[$i]['ID'];
            $name = $classes[$i]['name'];
            $CID == $ID ? $selected = "selected=\"selected\"" : ($selected = "");
            ?>
                	<option value="video_management.php?cid=<?php 
            echo "{$ID}";
            ?>
&anchor=filter_controls"<?php 
            echo " {$style} {$selected}>{$name}";
            ?>
</option>
			<?php 
        }
    }
    ?>
            </select>
        </form>
        <form id="group" name="group" method="post" action="" style="margin-left:5px;margin-top:10px;margin-bottom:10px;float:left;">
            &nbsp;&nbsp;&nbsp;Group:&nbsp;
            <?php 
    $noGroups = 0 == count($groupsByCourse) ? "disabled" : "";
    ?>
            <select name="groupJumpMenu" id="groupJumpMenu" <?php 
    echo $noGroups;
    ?>
 onchange="jumpBox(this.form.elements[0])" style="width:19em;" >
            <?php 
    if (0 == count($groupsByCourse)) {
        print "<option>-- NO GROUPS</option>";
    } else {
        foreach ($groupsByCourse as $ID => $name) {
            ?>
                <?php 
            $GID == $ID ? $selected = "selected=\"selected\"" : ($selected = "");
            ?>
                	<option value="video_management.php?cid=<?php 
            echo "{$CID}&gid={$ID}";
            ?>
&anchor=filter_controls"<?php 
            echo " {$style} {$selected}>{$name}";
            ?>
</option>
            <?php 
        }
    }
    ?>
            </select>
        </form>
</fieldset>
<br />
<?php 
    $videosByCurrentCourseAndGroup = $media->getVideosByGroupID($userID, $GID);
    ?>
	<a id="assigned"></a>
    <table width="1000px" border="1" style="float:left;font-family:'Lucida Sans Unicode';">
      
<?php 
    if (empty($videosByCurrentCourseAndGroup)) {
        ?>
	  <thead style="font-size:14px">
          <tr>
            <th colspan="7" style="text-align:center">No Videos in this Course and Group</th>
          </tr>
      </thead>
<?php 
    } else {
        ?>
	  <thead style="font-size:14px">
		 <tr>
            <th colspan="7" style="text-align:center">Videos by Course and Group</th>
          </tr>
      </thead>
      <thead style="font-size:14px">
          <tr>
            <th scope="col">thumbnail</th>
            <th scope="col" width="15%">title</th>
            <th scope="col" width="15%">description</th>
            <th scope="col" width="10%">duration</th>
            <th scope="col">video status</th>
            <th scope="col">grant access to group</th>
            <th scope="col">date uploaded</th>
          </tr>
      </thead>
      <tbody style="font-size:12px">
<?php 
        global $DEPLOYMENT_NAME;
        $groups = $users->getGroupsByOwner($userID);
        $videos = $videosByCurrentCourseAndGroup;
        if (!is_null($videos)) {
            foreach ($videos as $video) {
                $thumbnail = $video['thumbnail_url'];
                $videoID = $video['video_id'];
                if ($videoID && $videoID != "") {
                    ?>
           <tr>
            <td style="text-align:center;">
            	<!-- force thumbnail height and width to make the table uniform -->
            	<img src="<?php 
                    echo "{$thumbnail}";
                    ?>
" alt="" style="height:64px;width:101px;margin-top:1px;margin-bottom:1px;"/>
            </td>
            <td><?php 
                    echo $video['title'];
                    ?>
</td>
            <td style="font-size:80%"><?php 
                    echo $video['description'];
                    ?>
</td>
            <td><?php 
                    echo $video['duration'];
                    ?>
 seconds</td>
            <td><?php 
                    echo displayConversionStatus($video['conversion_complete'], $videoID);
                    ?>
</td>
            <td>
<?php 
                    if (empty($groups)) {
                        print '<select name="groups[]" size="1" class="groups">';
                        print "<option value=\"{$videoID},no_group_selected\">--- no group selected ---</option>";
                        $selectedGroup = $media->getVideoGroup($videoID);
                        //print "selectedGroup: $selectedGroup";
                        foreach ($groups as $id => $name) {
                            $selectedGroup == $id ? $selected = "selected=\"selected\"" : ($selected = "");
                            print "<option value=\"{$videoID},{$id}\" {$selected}>{$name}</option>";
                        }
                        print '</select>';
                    }
                    !empty($groups) ? $label = "create groups" : ($label = "manage groups");
                    ?>
                
                <br />
                <div style="cursor:pointer;color:blue;"><a href="manage_groups.php?cid=<?php 
                    echo "{$CID}&gid={$GID}";
                    ?>
"><?php 
                    echo "{$label}";
                    ?>
</a></div>
            </td>
            <td><?php 
                    echo $video['creation_date'];
                    ?>
</td>
          </tr>
<?php 
                }
            }
        }
        ?>
    
      </tbody>
<?php 
    }
    ?>
    </table>
    <div id="update-conversion-status" style="cursor:pointer;padding-top:20px;float:left;"><a href="">Update Conversion Status</a></div>
<div style="clear:both"></div>
</div> <!-- wrapper for centering -->
<!-- <div id="univbranding"><img src="icons/LearnngTchngUnt_12_01.png"></img></div>  -->



</body>
<script type="text/javascript"> 
/*window.onbeforeunload = function (e) {
	
};*/
</script>
</html>
<?php 
}
Example #2
0
function displayForm()
{
    global $userID, $userName, $videoID, $authorizedUsers, $classes, $classID;
    ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>User Interface Configuration</title>
<script type="text/javascript" src="kaltura-html5player-widget/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
function jumpBoxClass(list) {
    var url = "configure_ui.php?class_id=" + $('#class').val();
//alert(list.options[list.selectedIndex].value);
console.log("jumpBoxClass " + url);
    location.href = url;
}
$(document).ready(function() {
    $('#update-conversion-status').click(function() {
        //alert('Handler for .click() called.');
        window.location.reload()
    });
});
function updateN(id) {
    var trendlineID = '#' + id + '_trendline_visibility';
console.log("target " + trendlineID);    
console.log( $(trendlineID).val());

    var numberID = '#' + id + '_number';
    if ("by-default" == $(trendlineID).val()) {
        // if option value is BY_DEFAULT then set text input to zero and readonly
console.log("target match");    
        $(numberID).attr('readonly', 'readonly');
        $(numberID).attr('value', 0);
    } else {
        $(numberID).attr('readonly', '');
    }
}
</script>
    <link rel="stylesheet" type="text/css" href="style.css" />
    <link rel="stylesheet" type="text/css" href="admin-page.css" />
</head>
<body>
<div id="wrapper">
<?php 
    printAdminBar(false, $userName);
    ?>
    <div style="clear:both"></div>
    <strong>User Interface Configuration</strong>
    <br />
    <br />
    <label style="font-size:100%">select class
    <select name="class" id="class" onchange="jumpBoxClass()">
<?php 
    //print "classID: $classID";
    foreach ($classes as $class) {
        //print_r($class);
        $ID = $class['ID'];
        $name = $class['name'];
        $classID == $ID ? $selected = "selected=\"selected\"" : ($selected = "");
        print "\t<option value=\"{$ID}\" {$selected}>{$name}</option>\n";
    }
    ?>
    </select>
    </label>

    <form id="form1" name="form1" method="post" action="" >
        <table style="width:800px;height:auto;">
            <thead>
                <tr style="border-bottom:1px solid black">
                    <th>user name</th>
                    <th>annotation mode</th>
                    <th>annotations enabled</th>
                    <th>group annotations visible</th>
                    <th>N days</th>
                </tr>                
            </thead>
            <tbody>
<?php 
    $users = getClassList($classID);
    //print_r($users);
    foreach ($users as $user) {
        //print_r($user);
        // if the userName is not initialized
        " " == $user['name'] ? $userName = "******" : ($userName = $user['name']);
        $userID = $user['ID'];
        //        $email      = $user['Email'];
        $userUI = getUI($userID);
        print '<div style="width:900px;"></div>';
        //print_r($userUI); print "<br />";
        //        (in_array($userID, $authorizedUsers)) ? $selected="selected=\"selected\"" : $selected="";
        $annotationMode = array("annotation", "PSYC");
        $annotationsEnabled = array("yes", "no");
        $trendlineVisSettings = array("by-default", "after-n-days");
        ?>
        
            <tr style="border-bottom:1px solid black">
                <td><?php 
        echo "{$userName}";
        ?>
</td>
                <td>
                    <select name="<?php 
        echo $userID;
        ?>
_annotation_mode" size="1" id="<?php 
        echo $userID;
        ?>
_annotation_mode">
<?php 
        foreach ($annotationMode as $mode) {
            //print "mode: {$userUI['annotation_mode']}<br />";
            $mode == $userUI['annotation_mode'] ? $selected = " selected " : ($selected = "");
            ?>
                        <option value="<?php 
            echo $mode;
            ?>
"<?php 
            echo $selected;
            ?>
><?php 
            echo $mode;
            ?>
</option>
<?php 
        }
        ?>
                    </select>
                </td>
                <td>
                    <select name="<?php 
        echo $userID;
        ?>
_annotations_enabled" size="1" id="<?php 
        echo $userID;
        ?>
_annotations_enabled">
<?php 
        foreach ($annotationsEnabled as $enabled) {
            //print "enabled: {$userUI['annotations_enabled']}<br />";
            $enabled == $userUI['annotations_enabled'] ? $selected = " selected " : ($selected = "");
            ?>
                        <option value="<?php 
            echo $enabled;
            ?>
"<?php 
            echo $selected;
            ?>
><?php 
            echo $enabled;
            ?>
</option>
<?php 
        }
        ?>
                    </select>
                </td>
                <td>
                    <select name="<?php 
        echo $userID;
        ?>
_trendline_visibility" size="1" id="<?php 
        echo $userID;
        ?>
_trendline_visibility" onChange="updateN(<?php 
        echo $userID;
        ?>
)" >
<?php 
        foreach ($trendlineVisSettings as $setting) {
            $setting == $userUI['trendline_visibility'] ? $selected = " selected " : ($selected = "");
            BY_DEFAULT == $userUI['trendline_visibility'] ? $readonly = "readonly" : ($readonly = "");
            ?>
                        <option value="<?php 
            echo $setting;
            ?>
"<?php 
            echo $selected;
            ?>
><?php 
            echo $setting;
            ?>
</option>
<?php 
        }
        ?>
                    </select>
                </td>
                <td>
                    <input name="<?php 
        echo $userID;
        ?>
_number" type="text" id="<?php 
        echo $userID;
        ?>
_number" value="<?php 
        echo $userUI['n'];
        ?>
" size="2" <?php 
        echo $readonly;
        ?>
 />
                </td>
            </tr>
<?php 
    }
    ?>
                
        <br />  
        </tbody>
        </table>
        <input type="submit" name="submit" id="submit" style="margin-left:720px;margin-top:10px;" value="update" />
    </form>
</div> <!-- wrapper for centering -->
<div id="univbranding"><img src="icons/UBClogodarkgrey.jpg"></img></div>
</body>
</html>
<?php 
}
Example #3
0
function displayAnalytics()
{
    global $users, $userID, $userName, $videoID, $authorizedUsers, $classes, $classID;
    ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Video Usage Analytics</title>
<script type="text/javascript" src="kaltura-html5player-widget/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $('#date-heatmap .day').mouseover(function(event) {
        // the date and number of views (delineated by an underscore) are stored in the class tag
        var classTag  = $(this).attr('class');
        underscorePos = classTag.indexOf("_");
        viewDate      = classTag.substring(0, underscorePos);
        viewCount     = classTag.substring(underscorePos+1, classTag.indexOf(" "));
        if ("" == viewCount) viewCount = 0;

        $('<div id="date" style="border:1px solid gray;background-color:#fff;padding:2px 4px 2px 4px;width:auto;z-index:100;">' + viewDate + ' (' + viewCount + ' views)<br style="margin-bottom:10px;"/></div>').appendTo('body');

        showDate(event);
    });

    function showDate(event) {
        var tPosX = event.pageX + 15 + 'px';
        var tPosY = event.pageY + 15 + 'px';
        $('#date').css({'position': 'absolute', 'top': tPosY, 'left': tPosX});
    }

    $('#date-heatmap .day').mouseout(function(event) {
        $('#date').remove();
    });

});
</script>
    <link rel="stylesheet" type="text/css" href="style.css" />
    <link rel="stylesheet" type="text/css" href="admin-page.css" />
</head>
<body>
<?php 
    printAdminBar(false, $userName);
    ?>
    <div style="clear:both"></div>
    <strong>Video Usage Analytics</strong>
    <br />
    <br /> 
    <label align="left">select course <select name="class" id="class" onchange="jumpBoxClass()">
<?php 
    //print "classID: $classID";
    foreach ($classes as $class) {
        //print_r($class);
        $ID = $class['ID'];
        $name = $class['name'];
        $classID == $ID ? $selected = "selected=\"selected\"" : ($selected = "");
        print "\t<option value=\"{$ID}\" {$selected}>{$name}</option>\n";
    }
    ?>
    </select>
    </label>


<label style="font-size:100%">select video
    <select>
    <option>All</option>


  
    <?php 
    mysql_connect('localhost', 'root', 'Adelaide160');
    mysql_select_db('prod_annotation_tool');
    // $query="select title from media where video_id IN (SELECT video_id FROM videoGroup)";
    // $query="SELECT m.title FROM videoGroup v, media m WHERE v.group_id=$groupID AND m.video_id LIKE v.video_id ORDER BY m.title";
    $media = new media();
    print_r($groupIDs);
    //for ($i=0; $i<count($groupIDs); $i++):
    //$videoIDs = array_keys($media->getVideosByGroupID($userID,$groupIDs[$i]));
    //print_r($videoIDs);print "<br />";
    $result = mysql_query($query);
    while ($row = mysql_fetch_array($result)) {
        echo "<option>";
        echo $row['title'];
        echo "</option>";
    }
    ?>
</select>
   

    </select>
    </label>


    <form id="form1" name="form1" method="post" action="" >
        <table style="width:800px;height:auto;">
            <thead>
                <tr style="border-bottom:1px solid black">
                    <th>Video(s)</th>
                    <th>Unique Users</th>
                    <th>% of class</th>
                    <th>Total of Annotations</th>
                    <th>Total of Summaries</th>
                </tr>                
            </thead>
            <tbody>
<?php 
    $groupIDs = array_keys($users->getGroupsByClassID($classID));
    //print_r($groupIDs);print "<br />";
    $userInfo = null;
    $media = new media();
    for ($i = 0; $i < count($groupIDs); $i++) {
        // fetch videos for given group
        $videoIDs = array_keys($media->getVideosByGroupID($userID, $groupIDs[$i]));
        //print_r($videoIDs);print "<br />";
        for ($j = 0; $j < count($videoIDs); $j++) {
            $groupMembers = $users->getGroupMembers($groupIDs[$i]);
            // TODO: cache this info
            $userInfo = $users->getUserInfo($groupMembers);
            //print_r($groupMembers);print "<br />";
            //print "userInfo: "; print_r($userInfo);print "<br />";
            $thumbnail = $media->getProperty($videoIDs[$j], 'thumbnail_url');
            $title = $media->getProperty($videoIDs[$j], 'title');
            ?>
            <div style="width:900px;"></div>
<?php 
            for ($k = 0; $k < count($groupMembers); $k++) {
                //array_push($viewerStats, $media->getViewerStatistics($userInfo[$k]['User_ID'], $videoIDs[$j]));
                //$viewerStats[$k] = $media->getViewerStatistics($userInfo[$k]['User_ID'], $videoIDs[$j]);
                $playStatus[$k] = $media->getPlayStatistics($videoIDs[$j]);
                //print_r($viewerStats[$k]);
            }
            // find first timestamp and last time stamp
            $dates = getDateRange($viewerStats);
            // calculate range and convert it to days
            $range = intval((strtotime($dates['last_view']) - strtotime($dates['first_view'])) / (60 * 60 * 24)) + 1;
            $maxDailyViews;
            $dailyViews = getDailyViews($viewerStats, $maxDailyViews);
            for ($k = 0; $k < count($groupMembers); $k++) {
                //print "\$groupMembers[$k]: "; print_r($groupMembers);
                //print_r($viewerStats); print "<br />";
                ?>
            <tr style="border-bottom:1px solid black">
<?php 
                if (0 == $k) {
                    print "<td style=\"border-right:1px solid black;background-color:#eee;\" rowspan=\"" . count($groupMembers) . "\"><img src=\"{$thumbnail}\" alt=\"video thumbnail\" /><br />{$title}<br /></td>";
                    echo "<td>";
                    echo $media->getUniqueUsers($videoIDs[$j]);
                    echo "</td>";
                    echo "<td>";
                    echo round($media->getUniqueUsers($videoIDs[$j]) / $media->getNumAnnotations($videoIDs[$j]) * 100 / 2, 2);
                    echo "</td>";
                    echo "<td>" . $media->getNumAnnotations($videoIDs[$j]) . "</td>";
                    echo "<td>" . $media->getNumSummaries($videoIDs[$j]) . "</td>";
                }
                ?>
               
<?php 
            }
        }
    }
    $media->close();
    ?>
    

            </tr>

    
                               
        <br />  
        </tbody>
        </table>
    </form>
</body>
</html>
<?php 
}