Parents - List of their child's assignments

Graham Quince · December 16, 2020

So we know that the latest version of the MyFrog app no longer lists assignments for parents. We added in the assignment calendar instead within the My Child section, but if you're in MyFrog and wanting a list of the work, it's not possible. On a desktop or logging into FrogLearn on your phone makes this simple enough as you have access to the Assignment menu in the FrogBar (and My Child's Work on a desktop).

I've dug out some code from Chris Smith and adapted it for parents:

<style>
    .row-template {
        display: none;
    }
.assignment-widget-header {
background-color: #231f20;
padding: 1em;
position: relative;
text-align: left;
}
.assignment-widget-header::after {
content: "";
width: 98%;
height: 60%;
position: absolute;
top: 3%;
left: 1%;
border-radius: 5px;
}
.assignment-widget-header h1 {
color: #fff;
font-size: 20px;
margin: 0;
}   
.no-homework {
padding: 1em;
text-align: center;
}
.assignment-list {
list-style: none;
padding: 0 1em;
margin:0 0 0 0;
}    
    

    
.assignment-list :hover{
background-color:#ededed;
}        
    
.assignment-list .assignment-link {
border-bottom: 1px solid #ddd;
padding: 10px 10px  10px 10px;
margin: 0.5em 0;
cursor: pointer;
}
    
.assignment-list .assignment-link p {
margin: 0;
}
.assignment-list .assignment-link .assign-icon {
width: 32px;
height: 32px;
display: block;
float: left;
margin-top: 2px;
background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEAYABgAAD/2wBDAAMCAgMCAgMDAwMEAwMEBQgFBQQEBQoHBwYIDAoMDAsKCwsNDhIQDQ4RDgsLEBYQERMUFRUVDA8XGBYUGBIUFRT/2wBDAQMEBAUEBQkFBQkUDQsNFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBT/wAARCAAgACADASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwDtfAvgzxT8eoW8W6j4l1meW+1Gb+0JYvEE9rFp0PmSYIhSRQkKJGQPU8euNH4N/DrQPFXxs8a6Hea54t8R+GdI8PrqVkLXxBqEcs7/AGmVCy7ZgzFkQKFJwTyBzXk/w/8AAvjDXtA05NG8W6nZQ6rPLYR2dtpsTxEtcOfJMh+8CVL4bsCegr0n4D/DPx1p/wC0B4w0WD4nz+GdU0vw7E15qaaXZzKY1upB5ZDAoFUgtuGDzg9K+TwdWUsY1zN6vvbytpY8LDzlLEWu3q+//DHRLqHwyYA/8Kn/AGgf+/8Aq/8A8l1p3Z0rwp4Hi+JXgKw+JHgjVNF8Q6fYTaf4zvb1o9SguJ4opEaC4lkDJtl4YYIZa7b7Vq3/AEeFpP8A4B6NXGfHDQ/E198KW1g/HiP4kaFa67pMVzp9pp1gImc30G0NLANylSytjPOOeDX1R7p4f8L/AI1eOfAPgxtL8P8Ah3WJrK6M6C5gltiu4zSDzYA0gZHwSmcZx26EdX+zh488QaD8aPEzQfCjxB4imuPDUVnc6PHPZiVY/tUu55PNlClWJZduScg5GOaZ4D+IWj/A2zufDXjXwu6eKtFvZprNru0nG2YSyeW5KqRLbkOJFwfvD8RqfAr45eGNM+OHjLxH4p8T3FjFrXhuO0/taGynVvtJuZWYIBEdrKrKRxjp1r5XB05Rxl5Rf2v5rLXz018jwsPFrEarv30/T7j1UabonT/hiuT/AMAtC/8Aj1ct8ZPEFxpfwnfQdN/Z+1L4X6Pe69pM9zfxjTYrZZFvoMM6W8pYs21UB2nqM4FKPEnwz/6Oo+Kf/fw//INTa94h8P8AjjwHB8OPA/j3xb8WfEWteIdNu/P12GR/7Ot4LiKWV3l8iNUiCxHrklnGK+qPdP/Z) no-repeat;
}
    
.assignment-list .assignment-link .assign-details {
padding: 0 1em;
float: left;
}
    
    .list-header {
        width: 100%;
        height:50px;
        line-height:50px;
        vertical-align:top;
        padding-left: 20px;
        box-sizing: border-box;
        background-color: #0497da;
        border-top-left-radius: 6px;
        border-top-right-radius: 6px;
        border: 1px solid #cccccc;
        border-bottom-width: 0;
        color: #ffffff;
        font-size:12pt;
        
    background: #0497da; /* Old browsers */
    background: -moz-linear-gradient(top,  #0497da 0%, #0064cd 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #0497da 0%,#0064cd 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #0497da 0%,#0064cd 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0497da', endColorstr='#0064cd',GradientType=0 ); /* IE6-9 */

        
    }
    .list-body {
        background-color: white;
        border-bottom-left-radius: 6px;
        border-bottom-right-radius: 6px;
        border: 1px solid #cccccc;
        border-top-width: 0;
    }
</style>
<div class="Assignments"></div>


<script>
var getHTMLElem = this.element.find('.Assignments');
var getAssignments = function(child) {
    var assignments = FrogOS.fdp({
        url: 'assignment/getAssigned',
        data: { 
            status: 'closed', 
            limit: 15, 
            order: 'start desc',
            assigned_user: child.uuid
        }
    });

    assignments.done(function(data) {
       var assignments = data.response.assignments,
           assignment;

        for (var uuid in assignments) {
        	if (assignments.hasOwnProperty(uuid)) {
		        assignment = assignments[uuid].assignment;
                getHTMLElem.find('.assignment-list'+child.uuid).show();
            
                var assignSubject = '<p><strong>' + assignment.subject.name + '</strong></p>';
                var assignTitle = '<p>' + assignment.name + '</p>';
                var assignEnd = '<span style="color: red;"><strong>Due: ' + moment(assignment.end, 'X').format('Do MMM YYYY') + '</strong></span>';
                var assignLink = assignment.link;
                var activity = ' | Activities done: <b>'+assignments[uuid].activities.complete+' / '+assignments[uuid].activities.total+'</b>';
                
                var status = ' | Status: ';
                switch(assignments[uuid].user_info.status) {
                    case 'notdone':
                        status = status+' Not done';
                        break;
                    case 'ontime':
                        status = status+' Handed in';
                        break;
                    case 'late':
                        status = status+' Late';
                        break;
                    default:
                        break;
                }
            
                var liElem = '<li class="assignment-link clearfix" data-assignment-link="' + assignLink + '"><div class="assign-icon"></div>'+
                             '<div class="assign-details">' + assignSubject + '' + assignTitle + '' + assignEnd + activity + status +'</div></li>';
            
                getHTMLElem.find('.assignment-list'+child.uuid).append(liElem);
                
            }
        }
    });
};
    
$(getHTMLElem).on('click', '.assignment-link', function(el){
    $(this).trigger('os.app.siteviewer', {
        data: { site: el.currentTarget.dataset.assignmentLink }
    });
});

Frog.Model.api('users.getChildren').done(function(listResponse) {
        var children = listResponse.data;
        $.each(children, function(index,child) {
            getHTMLElem.append(
                '<div class="list">'+
                "<div class='list-header'>"+child.displayname+"'s recent homeworks</div>"+
                '<div class="list-body">'+
                '<ul class="assignment-list assignment-list'+child.uuid+'" style="display: none;"></ul>'+
                '</div><hr>'
            );
            getAssignments(child);
       });
});

</script>

I'll most likely turn this into a widget at some point, but in the meantime adding this to the Parent Portal will list each child and all their assignments. Change the limit from 15 if that's not enough.

ADT · December 16, 2020

6 minutes ago, Graham Quince said:

So we know that the latest version of the MyFrog app no longer lists assignments for parents. We added in the assignment calendar instead within the My Child section, but if you're in MyFrog and wanting a list of the work, it's not possible. On a desktop or logging into FrogLearn on your phone makes this simple enough as you have access to the Assignment menu in the FrogBar (and My Child's Work on a desktop).

I've dug out some code from Chris Smith and adapted it for parents:



<style>
    .row-template {
        display: none;
    }
.assignment-widget-header {
background-color: #231f20;
padding: 1em;
position: relative;
text-align: left;
}
.assignment-widget-header::after {
content: "";
width: 98%;
height: 60%;
position: absolute;
top: 3%;
left: 1%;
border-radius: 5px;
}
.assignment-widget-header h1 {
color: #fff;
font-size: 20px;
margin: 0;
}   
.no-homework {
padding: 1em;
text-align: center;
}
.assignment-list {
list-style: none;
padding: 0 1em;
margin:0 0 0 0;
}    
    

    
.assignment-list :hover{
background-color:#ededed;
}        
    
.assignment-list .assignment-link {
border-bottom: 1px solid #ddd;
padding: 10px 10px  10px 10px;
margin: 0.5em 0;
cursor: pointer;
}
    
.assignment-list .assignment-link p {
margin: 0;
}
.assignment-list .assignment-link .assign-icon {
width: 32px;
height: 32px;
display: block;
float: left;
margin-top: 2px;
background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEAYABgAAD/2wBDAAMCAgMCAgMDAwMEAwMEBQgFBQQEBQoHBwYIDAoMDAsKCwsNDhIQDQ4RDgsLEBYQERMUFRUVDA8XGBYUGBIUFRT/2wBDAQMEBAUEBQkFBQkUDQsNFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBT/wAARCAAgACADASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwDtfAvgzxT8eoW8W6j4l1meW+1Gb+0JYvEE9rFp0PmSYIhSRQkKJGQPU8euNH4N/DrQPFXxs8a6Hea54t8R+GdI8PrqVkLXxBqEcs7/AGmVCy7ZgzFkQKFJwTyBzXk/w/8AAvjDXtA05NG8W6nZQ6rPLYR2dtpsTxEtcOfJMh+8CVL4bsCegr0n4D/DPx1p/wC0B4w0WD4nz+GdU0vw7E15qaaXZzKY1upB5ZDAoFUgtuGDzg9K+TwdWUsY1zN6vvbytpY8LDzlLEWu3q+//DHRLqHwyYA/8Kn/AGgf+/8Aq/8A8l1p3Z0rwp4Hi+JXgKw+JHgjVNF8Q6fYTaf4zvb1o9SguJ4opEaC4lkDJtl4YYIZa7b7Vq3/AEeFpP8A4B6NXGfHDQ/E198KW1g/HiP4kaFa67pMVzp9pp1gImc30G0NLANylSytjPOOeDX1R7p4f8L/AI1eOfAPgxtL8P8Ah3WJrK6M6C5gltiu4zSDzYA0gZHwSmcZx26EdX+zh488QaD8aPEzQfCjxB4imuPDUVnc6PHPZiVY/tUu55PNlClWJZduScg5GOaZ4D+IWj/A2zufDXjXwu6eKtFvZprNru0nG2YSyeW5KqRLbkOJFwfvD8RqfAr45eGNM+OHjLxH4p8T3FjFrXhuO0/taGynVvtJuZWYIBEdrKrKRxjp1r5XB05Rxl5Rf2v5rLXz018jwsPFrEarv30/T7j1UabonT/hiuT/AMAtC/8Aj1ct8ZPEFxpfwnfQdN/Z+1L4X6Pe69pM9zfxjTYrZZFvoMM6W8pYs21UB2nqM4FKPEnwz/6Oo+Kf/fw//INTa94h8P8AjjwHB8OPA/j3xb8WfEWteIdNu/P12GR/7Ot4LiKWV3l8iNUiCxHrklnGK+qPdP/Z) no-repeat;
}
    
.assignment-list .assignment-link .assign-details {
padding: 0 1em;
float: left;
}
    
    .list-header {
        width: 100%;
        height:50px;
        line-height:50px;
        vertical-align:top;
        padding-left: 20px;
        box-sizing: border-box;
        background-color: #0497da;
        border-top-left-radius: 6px;
        border-top-right-radius: 6px;
        border: 1px solid #cccccc;
        border-bottom-width: 0;
        color: #ffffff;
        font-size:12pt;
        
    background: #0497da; /* Old browsers */
    background: -moz-linear-gradient(top,  #0497da 0%, #0064cd 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #0497da 0%,#0064cd 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #0497da 0%,#0064cd 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0497da', endColorstr='#0064cd',GradientType=0 ); /* IE6-9 */

        
    }
    .list-body {
        background-color: white;
        border-bottom-left-radius: 6px;
        border-bottom-right-radius: 6px;
        border: 1px solid #cccccc;
        border-top-width: 0;
    }
</style>
<div class="Assignments"></div>


<script>
var getHTMLElem = this.element.find('.Assignments');
var getAssignments = function(child) {
    var assignments = FrogOS.fdp({
        url: 'assignment/getAssigned',
        data: { 
            status: 'open', 
            limit: 15, 
            order: 'start desc',
            assigned_user: child.uuid
        }
    });

    assignments.done(function(data) {
       var assignments = data.response.assignments,
           assignment;

        for (var uuid in assignments) {
        	if (assignments.hasOwnProperty(uuid)) {
		        assignment = assignments[uuid].assignment;
                getHTMLElem.find('.assignment-list').show();
            
                var assignSubject = '<p><strong>' + assignment.subject.name + '</strong></p>';
                var assignTitle = '<p>' + assignment.name + '</p>';
                var assignEnd = '<p style="color: red;"><strong>Due: ' + moment(assignment.end, 'X').format('Do MMM YYYY') + '</strong></p>';
                var assignLink = assignment.link;
            
                var liElem = '<li class="assignment-link clearfix" data-assignment-link="' + assignLink + '"><div class="assign-icon"></div><div class="assign-details">' + assignSubject + '' + assignTitle + '' + assignEnd + '</div></li>';
            
                getHTMLElem.find('.assignment-list').append(liElem);
                
            }
        }
    });
};
    
$(getHTMLElem).on('click', '.assignment-link', function(el){
    $(this).trigger('os.app.siteviewer', {
        data: { site: el.currentTarget.dataset.assignmentLink }
    });
});

Frog.Model.api('users.getChildren').done(function(listResponse) {
        var children = listResponse.data;
        $.each(children, function(index,child) {
            getHTMLElem.append(
                '<div class="list">'+
                "<div class='list-header'>"+child.displayname+"'s recent homeworks</div>"+
                '<div class="list-body">'+
                '<ul class="assignment-list" style="display: none;"></ul>'+
                '</div><hr>'
            );
            getAssignments(child);
       });
});

</script>

I'll most likely turn this into a widget at some point, but in the meantime adding this to the Parent Portal will list each child and all their assignments. Change the limit from 15 if that's not enough.

So my first question is why did you remove it?

Graham Quince · December 16, 2020

Just now, ADT said:

So my first question is why did you remove it?

Honestly, it was unintended consequences. The My Child section loads in the separate Frog Application, My Child. This required its own child selector, so the original child selector was deprecated and no one anticipated that some parents would prefer the assignment list over the calendar.

ADT · December 16, 2020

2 minutes ago, Graham Quince said:

Honestly, it was unintended consequences. The My Child section loads in the separate Frog Application, My Child. This required its own child selector, so the original child selector was deprecated and no one anticipated that some parents would prefer the assignment list over the calendar.

See I would say the list is easier to access and also give you a quick overview compared to the calendar.... but who am i??? ?

Graham Quince · May 13

A slightly different version, this code mimics the Assignments Menu in the Frog Bar

<style>
    .row-template {
        display: none;
    }
.assignment-widget-header {
background-color: #231f20;
padding: 1em;
position: relative;
text-align: left;
}
.assignment-widget-header::after {
content: "";
width: 98%;
height: 60%;
position: absolute;
top: 3%;
left: 1%;
border-radius: 5px;
}
.assignment-widget-header h1 {
color: #fff;
font-size: 20px;
margin: 0;
}   
.no-homework {
padding: 1em;
text-align: center;
}
.assignment-list {
list-style: none;
padding: 0 1em;
margin:0 0 0 0;
}    
    

    
.assignment-list :hover{
background-color:#ededed;
}        
    
.assignment-list .assignment-link {
border-bottom: 1px solid #ddd;
padding: 10px 10px  10px 10px;
margin: 0.5em 0;
cursor: pointer;
}
    
.assignment-list .assignment-link p {
margin: 0;
}
.assignment-list .assignment-link .assign-icon {
width: 32px;
height: 32px;
display: block;
float: left;
margin-top: 2px;
background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEAYABgAAD/2wBDAAMCAgMCAgMDAwMEAwMEBQgFBQQEBQoHBwYIDAoMDAsKCwsNDhIQDQ4RDgsLEBYQERMUFRUVDA8XGBYUGBIUFRT/2wBDAQMEBAUEBQkFBQkUDQsNFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBT/wAARCAAgACADASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwDtfAvgzxT8eoW8W6j4l1meW+1Gb+0JYvEE9rFp0PmSYIhSRQkKJGQPU8euNH4N/DrQPFXxs8a6Hea54t8R+GdI8PrqVkLXxBqEcs7/AGmVCy7ZgzFkQKFJwTyBzXk/w/8AAvjDXtA05NG8W6nZQ6rPLYR2dtpsTxEtcOfJMh+8CVL4bsCegr0n4D/DPx1p/wC0B4w0WD4nz+GdU0vw7E15qaaXZzKY1upB5ZDAoFUgtuGDzg9K+TwdWUsY1zN6vvbytpY8LDzlLEWu3q+//DHRLqHwyYA/8Kn/AGgf+/8Aq/8A8l1p3Z0rwp4Hi+JXgKw+JHgjVNF8Q6fYTaf4zvb1o9SguJ4opEaC4lkDJtl4YYIZa7b7Vq3/AEeFpP8A4B6NXGfHDQ/E198KW1g/HiP4kaFa67pMVzp9pp1gImc30G0NLANylSytjPOOeDX1R7p4f8L/AI1eOfAPgxtL8P8Ah3WJrK6M6C5gltiu4zSDzYA0gZHwSmcZx26EdX+zh488QaD8aPEzQfCjxB4imuPDUVnc6PHPZiVY/tUu55PNlClWJZduScg5GOaZ4D+IWj/A2zufDXjXwu6eKtFvZprNru0nG2YSyeW5KqRLbkOJFwfvD8RqfAr45eGNM+OHjLxH4p8T3FjFrXhuO0/taGynVvtJuZWYIBEdrKrKRxjp1r5XB05Rxl5Rf2v5rLXz018jwsPFrEarv30/T7j1UabonT/hiuT/AMAtC/8Aj1ct8ZPEFxpfwnfQdN/Z+1L4X6Pe69pM9zfxjTYrZZFvoMM6W8pYs21UB2nqM4FKPEnwz/6Oo+Kf/fw//INTa94h8P8AjjwHB8OPA/j3xb8WfEWteIdNu/P12GR/7Ot4LiKWV3l8iNUiCxHrklnGK+qPdP/Z) no-repeat;
}
    
.assignment-list .assignment-link .assign-details {
padding: 0 1em;
float: left;
}
    
    .list-header {
        width: 100%;
        height:50px;
        line-height:50px;
        vertical-align:top;
        padding-left: 20px;
        box-sizing: border-box;
        background-color: #0497da;
        border-top-left-radius: 6px;
        border-top-right-radius: 6px;
        border: 1px solid #cccccc;
        border-bottom-width: 0;
        color: #ffffff;
        font-size:12pt;
        
    background: #0497da; /* Old browsers */
    background: -moz-linear-gradient(top,  #0497da 0%, #0064cd 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #0497da 0%,#0064cd 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #0497da 0%,#0064cd 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0497da', endColorstr='#0064cd',GradientType=0 ); /* IE6-9 */

        
    }
    .list-body {
        background-color: white;
        border-bottom-left-radius: 6px;
        border-bottom-right-radius: 6px;
        border: 1px solid #cccccc;
        border-top-width: 0;
    }
</style>
<div class="Assignments"></div>


<script>
var getHTMLElem = this.element.find('.Assignments');
var getAssignments = function(child) {
    var assignments = FrogOS.fdp({
        url: 'assignment/getAssigned',
        data: { 
            status: 'open',
            is_completed: false,
            limit: 15, 
            order: 'start desc',
            assigned_user: child.uuid
        }
    });

    assignments.done(function(data) {
       var assignments = data.response.assignments,
           assignment,
           user_info;

        for (var uuid in assignments) {
        	if (assignments.hasOwnProperty(uuid)) {
		        assignment = assignments[uuid].assignment;
                user_info = assignments[uuid].user_info;
                
                getHTMLElem.find('.assignment-list'+child.uuid).show();
            
                var assignSubject = '<p><strong>' + assignment.subject.name + '</strong></p>';
                var assignTitle = '<p>' + assignment.name + '</p>';
                var assignEnd = '<span style="color: red;"><strong>Due: ' + moment(assignment.end, 'X').format('Do MMM YYYY') + '</strong></span>';
                var assignLink = assignment.link;
                var activity = ' | Activities done: <b>'+assignments[uuid].activities.complete+' / '+assignments[uuid].activities.total+'</b>';
                
                var status = ' | Status: ';
                switch(assignments[uuid].user_info.status) {
                    case 'notdone':
                        status = status+' Not done';
                        break;
                    case 'ontime':
                        status = status+' Handed in';
                        break;
                    case 'late':
                        status = status+' Late';
                        break;
                    default:
                        break;
                }
            
                var liElem = '<li class="assignment-link clearfix" data-assignment-link="' + assignLink + '"><div class="assign-icon"></div>'+
                             '<div class="assign-details">' + assignSubject + '' + assignTitle + '' + assignEnd + activity + status +'</div></li>';
                

                if (user_info.completed == null) {
                    getHTMLElem.find('.assignment-list'+child.uuid).append(liElem);
                }        
                //getHTMLElem.find('.assignment-list'+child.uuid).append(liElem);
                
            }
        }
    });
};
    
$(getHTMLElem).on('click', '.assignment-link', function(el){
    $(this).trigger('os.app.siteviewer', {
        data: { site: el.currentTarget.dataset.assignmentLink }
    });
});

Frog.Model.api('users.getChildren').done(function(listResponse) {
        var children = listResponse.data;
        $.each(children, function(index,child) {
            getHTMLElem.append(
                '<div class="list">'+
                "<div class='list-header'>"+child.displayname+"'s recent homeworks</div>"+
                '<div class="list-body">'+
                '<ul class="assignment-list assignment-list'+child.uuid+'" style="display: none;"></ul>'+
                '</div><hr>'
            );
            getAssignments(child);
       });
});

</script>

ADT · May 13

12 minutes ago, Graham Quince said:

A slightly different version, this code mimics the Assignments Menu in the Frog Bar


<style>
    .row-template {
        display: none;
    }
.assignment-widget-header {
background-color: #231f20;
padding: 1em;
position: relative;
text-align: left;
}
.assignment-widget-header::after {
content: "";
width: 98%;
height: 60%;
position: absolute;
top: 3%;
left: 1%;
border-radius: 5px;
}
.assignment-widget-header h1 {
color: #fff;
font-size: 20px;
margin: 0;
}   
.no-homework {
padding: 1em;
text-align: center;
}
.assignment-list {
list-style: none;
padding: 0 1em;
margin:0 0 0 0;
}    
    

    
.assignment-list :hover{
background-color:#ededed;
}        
    
.assignment-list .assignment-link {
border-bottom: 1px solid #ddd;
padding: 10px 10px  10px 10px;
margin: 0.5em 0;
cursor: pointer;
}
    
.assignment-list .assignment-link p {
margin: 0;
}
.assignment-list .assignment-link .assign-icon {
width: 32px;
height: 32px;
display: block;
float: left;
margin-top: 2px;
background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEAYABgAAD/2wBDAAMCAgMCAgMDAwMEAwMEBQgFBQQEBQoHBwYIDAoMDAsKCwsNDhIQDQ4RDgsLEBYQERMUFRUVDA8XGBYUGBIUFRT/2wBDAQMEBAUEBQkFBQkUDQsNFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBT/wAARCAAgACADASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwDtfAvgzxT8eoW8W6j4l1meW+1Gb+0JYvEE9rFp0PmSYIhSRQkKJGQPU8euNH4N/DrQPFXxs8a6Hea54t8R+GdI8PrqVkLXxBqEcs7/AGmVCy7ZgzFkQKFJwTyBzXk/w/8AAvjDXtA05NG8W6nZQ6rPLYR2dtpsTxEtcOfJMh+8CVL4bsCegr0n4D/DPx1p/wC0B4w0WD4nz+GdU0vw7E15qaaXZzKY1upB5ZDAoFUgtuGDzg9K+TwdWUsY1zN6vvbytpY8LDzlLEWu3q+//DHRLqHwyYA/8Kn/AGgf+/8Aq/8A8l1p3Z0rwp4Hi+JXgKw+JHgjVNF8Q6fYTaf4zvb1o9SguJ4opEaC4lkDJtl4YYIZa7b7Vq3/AEeFpP8A4B6NXGfHDQ/E198KW1g/HiP4kaFa67pMVzp9pp1gImc30G0NLANylSytjPOOeDX1R7p4f8L/AI1eOfAPgxtL8P8Ah3WJrK6M6C5gltiu4zSDzYA0gZHwSmcZx26EdX+zh488QaD8aPEzQfCjxB4imuPDUVnc6PHPZiVY/tUu55PNlClWJZduScg5GOaZ4D+IWj/A2zufDXjXwu6eKtFvZprNru0nG2YSyeW5KqRLbkOJFwfvD8RqfAr45eGNM+OHjLxH4p8T3FjFrXhuO0/taGynVvtJuZWYIBEdrKrKRxjp1r5XB05Rxl5Rf2v5rLXz018jwsPFrEarv30/T7j1UabonT/hiuT/AMAtC/8Aj1ct8ZPEFxpfwnfQdN/Z+1L4X6Pe69pM9zfxjTYrZZFvoMM6W8pYs21UB2nqM4FKPEnwz/6Oo+Kf/fw//INTa94h8P8AjjwHB8OPA/j3xb8WfEWteIdNu/P12GR/7Ot4LiKWV3l8iNUiCxHrklnGK+qPdP/Z) no-repeat;
}
    
.assignment-list .assignment-link .assign-details {
padding: 0 1em;
float: left;
}
    
    .list-header {
        width: 100%;
        height:50px;
        line-height:50px;
        vertical-align:top;
        padding-left: 20px;
        box-sizing: border-box;
        background-color: #0497da;
        border-top-left-radius: 6px;
        border-top-right-radius: 6px;
        border: 1px solid #cccccc;
        border-bottom-width: 0;
        color: #ffffff;
        font-size:12pt;
        
    background: #0497da; /* Old browsers */
    background: -moz-linear-gradient(top,  #0497da 0%, #0064cd 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #0497da 0%,#0064cd 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #0497da 0%,#0064cd 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0497da', endColorstr='#0064cd',GradientType=0 ); /* IE6-9 */

        
    }
    .list-body {
        background-color: white;
        border-bottom-left-radius: 6px;
        border-bottom-right-radius: 6px;
        border: 1px solid #cccccc;
        border-top-width: 0;
    }
</style>
<div class="Assignments"></div>


<script>
var getHTMLElem = this.element.find('.Assignments');
var getAssignments = function(child) {
    var assignments = FrogOS.fdp({
        url: 'assignment/getAssigned',
        data: { 
            status: 'open',
            is_completed: false,
            limit: 15, 
            order: 'start desc',
            assigned_user: child.uuid
        }
    });

    assignments.done(function(data) {
       var assignments = data.response.assignments,
           assignment,
           user_info;

        for (var uuid in assignments) {
        	if (assignments.hasOwnProperty(uuid)) {
		        assignment = assignments[uuid].assignment;
                user_info = assignments[uuid].user_info;
                
                getHTMLElem.find('.assignment-list'+child.uuid).show();
            
                var assignSubject = '<p><strong>' + assignment.subject.name + '</strong></p>';
                var assignTitle = '<p>' + assignment.name + '</p>';
                var assignEnd = '<span style="color: red;"><strong>Due: ' + moment(assignment.end, 'X').format('Do MMM YYYY') + '</strong></span>';
                var assignLink = assignment.link;
                var activity = ' | Activities done: <b>'+assignments[uuid].activities.complete+' / '+assignments[uuid].activities.total+'</b>';
                
                var status = ' | Status: ';
                switch(assignments[uuid].user_info.status) {
                    case 'notdone':
                        status = status+' Not done';
                        break;
                    case 'ontime':
                        status = status+' Handed in';
                        break;
                    case 'late':
                        status = status+' Late';
                        break;
                    default:
                        break;
                }
            
                var liElem = '<li class="assignment-link clearfix" data-assignment-link="' + assignLink + '"><div class="assign-icon"></div>'+
                             '<div class="assign-details">' + assignSubject + '' + assignTitle + '' + assignEnd + activity + status +'</div></li>';
                

                if (user_info.completed == null) {
                    getHTMLElem.find('.assignment-list'+child.uuid).append(liElem);
                }        
                //getHTMLElem.find('.assignment-list'+child.uuid).append(liElem);
                
            }
        }
    });
};
    
$(getHTMLElem).on('click', '.assignment-link', function(el){
    $(this).trigger('os.app.siteviewer', {
        data: { site: el.currentTarget.dataset.assignmentLink }
    });
});

Frog.Model.api('users.getChildren').done(function(listResponse) {
        var children = listResponse.data;
        $.each(children, function(index,child) {
            getHTMLElem.append(
                '<div class="list">'+
                "<div class='list-header'>"+child.displayname+"'s recent homeworks</div>"+
                '<div class="list-body">'+
                '<ul class="assignment-list assignment-list'+child.uuid+'" style="display: none;"></ul>'+
                '</div><hr>'
            );
            getAssignments(child);
       });
});

</script>

I thought you were turning this into a widget..... ?

Graham Quince · May 13

1 hour ago, ADT said:

I thought you were turning this into a widget..... ?

Do you have any idea the hoops I have to jump through these days to get widget code approved ?

ADT · May 14

16 hours ago, Graham Quince said:

Do you have any idea the hoops I have to jump through these days to get widget code approved ?

Do they still not trust you? ?

Graham Quince · May 14

7 hours ago, ADT said:

Do they still not trust you? ?

If anything, they are clamping down harder on me

ADT · May 14

Just now, Graham Quince said:

If anything, they are clamping down harder on me

Rogue coder.... ?

Sign In

Parents - List of their child's assignments

Recommended Posts

Graham Quince 624

Link to post

Share on other sites

ADT 1,280

Link to post

Share on other sites

Graham Quince 624

Link to post

Share on other sites

ADT 1,280

Link to post

Share on other sites

Graham Quince 624

Link to post

Share on other sites

ADT 1,280

Link to post

Share on other sites

Graham Quince 624

Link to post

Share on other sites

ADT 1,280

Link to post

Share on other sites

Graham Quince 624

Link to post

Share on other sites

ADT 1,280

Link to post

Share on other sites

Join the conversation

Forums