My Assignments HTML

Graham Quince · November 7, 2016

That's right. You need to add the last example to the converters section, replacing this:

                        .map(function(assignment) {
                            return assignment.assignment;
                        })

with this:

.map(function(assignment) {
    return assignment.assignment;
}).filter(function(assignment){
    return !assignment.complete;
}).filter(function(assignment){
    return assignment.attr('subject').name==="Geography";
})

Corinne · November 7, 2016

Just tried to add in, 'if assignment is not completed' code and it is still showing all assignments - any ideas why that might be?

Corinne · November 7, 2016

34 minutes ago, Corinne said:

Just tried to add in, 'if assignment is not completed' code and it is still showing all assignments - any ideas why that might be?

I meant, if assignment is complete..

mnicholson · November 29, 2016

I have tried to code and the widget is great, although I have encountered an issue this week.

We have staff setting assignments on the weekend (they are setting the available from dates correctly (i.e. for next lesson not today's date) and when in the assignments app these assignments are not showing until that selected date. The widget is showing them however - meaning students are attempting homework without input form staff (which isn't wanted).

Want I am asking is there anyway to filter these assignment being shown (in the similar way to subject) - so that the start date/avaible from date isn't great than today's date?

hope that makes sense.

Mark

clangstaff · December 6, 2016

I've been trying to create a replica of the code below but for students rather than staff. I prefer the layout of this and find it easier to work with than the cloning table row method used in the example for students. I am however, struggling to replicate this with student data can anyone spot where I'm going wrong? @Chris.Smith @Graham Quince

Staff Code working fine:

<style>
.trs-staff-current-assignments-widget {
background-color: #ffffff;
border-radius: 5px;
overflow: hidden;
}
.trs-staff-current-assignments-widget .assignment-widget-header {
background-color: #231f20;
padding: 1em;
position: relative;
text-align: left;
}
.trs-staff-current-assignments-widget .assignment-widget-header::after {
content: "";
width: 98%;
height: 60%;
position: absolute;
top: 3%;
left: 1%;
border-radius: 5px;
}
.trs-staff-current-assignments-widget .assignment-widget-header h1 {
color: #fff;
font-size: 20px;
margin: 0;
}   
.trs-staff-current-assignments-widget .no-homework {
padding: 1em;
text-align: center;
}
.trs-staff-current-assignments-widget .assignment-list {
list-style: none;
padding: 0 1em;
}    
    
.trs-staff-current-assignments-widget .assignment-list :hover{
background-color:#ededed;
}        
    
.trs-staff-current-assignments-widget .assignment-list .assignement-link {
border-bottom: 1px solid #ddd;
padding: 10px 10px  10px 10px;
margin: 0.5em 0;
cursor: pointer;
}
    
.trs-staff-current-assignments-widget .assignment-list .assignement-link p {
margin: 0;
}
.trs-staff-current-assignments-widget .assignment-list .assignement-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;
}
.trs-staff-current-assignments-widget .assignment-list .assignement-link .assign-details {
padding: 0 1em;
float: left;
}
</style>

<div class="trs-staff-current-assignments-widget">
    <div class="assignment-widget-header">
        <h1>My Recent Homework</h1>
    </div>
    <p class="no-homework">You've not set any homework yet</p>
    <ul class="assignment-list" style="display: none;">
        
    </ul>
</div>

<script>

    var getHTMLElem = arguments[0];
    
    var assignments = FrogOS.fdp({
        url: 'assignment/getCreated',
        data: { status: 'open', limit: 5, order: 'start desc' }
    });

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

Student code attempt:

<style>
.trs-student-current-assignments-widget {
background-color: #ffffff;
border-radius: 5px;
overflow: hidden;
}
.trs-student-current-assignments-widget .assignment-widget-header {
background-color: #231f20;
padding: 1em;
position: relative;
text-align: left;
}
.trs-student-current-assignments-widget .assignment-widget-header::after {
content: "";
width: 98%;
height: 60%;
position: absolute;
top: 3%;
left: 1%;
border-radius: 5px;
}
.trs-student-current-assignments-widget .assignment-widget-header h1 {
color: #fff;
font-size: 20px;
margin: 0;
}   
.trs-student-current-assignments-widget .no-homework {
padding: 1em;
text-align: center;
}
.trs-student-current-assignments-widget .assignment-list {
list-style: none;
padding: 0 1em;
}    
    
.trs-student-current-assignments-widget .assignment-list :hover{
background-color:#ededed;
}        
    
.trs-student-current-assignments-widget .assignment-list .assignement-link {
border-bottom: 1px solid #ddd;
padding: 10px 10px  10px 10px;
margin: 0.5em 0;
cursor: pointer;
}
    
.trs-student-current-assignments-widget .assignment-list .assignement-link p {
margin: 0;
}
.trs-student-current-assignments-widget .assignment-list .assignement-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;
}
.trs-student-current-assignments-widget .assignment-list .assignement-link .assign-details {
padding: 0 1em;
float: left;
}
</style>

<div class="trs-student-current-assignments-widget">
    <div class="assignment-widget-header">
        <h1>My Recent Homework</h1>
    </div>
    <p class="no-homework">You've not been set any homework yet</p>
    <ul class="assignment-list" style="display: none;">
        
    </ul>
</div>

<script>

    var getHTMLElem = arguments[0];
    
    var assignments = FrogOS.fdp({
        url: 'assignment/getAssigned',
        data: { status: 'open', limit: 5, order: 'start desc' }
    });

    assignments.done(function(data) {
        var assignments = data.response.assignments;
        for (var uuid in assignments) {
            if (assignments.hasOwnProperty(uuid)) {
                
                getHTMLElem.find('.assignment-list').show();
                getHTMLElem.find('.trs-student-current-assignments-widget .no-homework').hide();
            
                var assignSubject = '<p><strong>' + assignments[uuid].subject.name + '</strong></p>';
                var assignTitle = '<p>' + assignments[uuid].name + '</p>';
                var assignEnd = '<p style="color: red;"><strong>Due: ' + moment(assignments[uuid].end, 'X').format('Do MMM YYYY') + '</strong></p>';
                var assignLink = assignments[uuid].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('.trs-student-current-assignments-widget .assignment-list').append(liElem);
                
            }
        }
    });
    
    $(getHTMLElem).on('click', '.assignment-link', function(el){
        $(this).trigger('os.app.siteviewer', {
            data: { site: el.currentTarget.dataset.assignmentLink }
        });
    });
    </script>

Chris.Smith · December 6, 2016

On 07/11/2016 at 16:27, Corinne said:

I meant, if assignment is complete..

Hi Corinne,

Sorry for the delay in getting to you; its been full steam ahead here at Frog Towers recently. The completed attribute is present in one of the response objects we filtered out earlier; Whoops. Here is an example data structure - Hopefully this looks familiar

{
    "assignments": { 
        "EC17261D200034DE79F32F10EA83CE0469E09D9CA1235592": { "has_feedback": 0 },
        "EC157C3320003748A5E0DFFDF4C73908258D99FC1028A058": { "has_feedback": 0 },
        "EC1649BA20003437A9827F2363E912060B3CFE6C71F0AB70": { "has_feedback": 0 },
        "EC1788C52000355DDC814F9C192B3603FF9B18FC15015FD9": { "has_feedback": 0 },
        "EC17261D200034DE79F32F10EA83CE0469E09D9CA1235592": { "has_feedback": 0 },
        "EC173C4220032A07A20DDF3FFF98E106AC26534C1C45D3F6": {
            "activities": { "total": "1", "complete": 1 },
            "assignment": { "uuid": "EC17261D200034DE79F32F10EA83CE0469E09D9CA1235592", "name": "Script Generated Assignment 49" },
            "user_info": {
                "comments": "0",
                "creator": { "uuid": "EBDD2A0E20005F222E730F4EF076FD08ED03276CE5A4B047", "username": "admin1" },
                "has_feedback": 0,
                "user_info": {
                    "closed": null,
                    "comment": null,
                    "completed": 1481043676,
                    "mark": null,
                    "returned": null,
                    "self_assessment_comment": null,
                    "self_assessment_score": "1",
                    "uuid": "EC173C4220032A07A20DDF3FFF98E106AC26534C1C45D3F6",
                }
            }
        }
    },
    "total_count": 4
}

The problem lies here:

.map(function(assignment) {
    return assignment.assignment; // <-- Here be the start of ye problams, arrh
}).filter(function(assignment){
    return !assignment.complete;
})

Here we are taking that top level aggregation, and grabbing the assignment object. So we need to access some of the data from the "user_info" object. Usually I would say rewrite the widget to accommodate the structure returned from the FDP however in your case, we can do the following as we don't require access to the information after this point.

.filter(function(assignment){
    return !assignment.user_info.complete;
}).map(function(assignment) {
    return assignment.assignment;
})

Hope this helps,

Chris

Chris.Smith · December 6, 2016

On 29/11/2016 at 13:19, mnicholson said:

I have tried to code and the widget is great, although I have encountered an issue this week.

We have staff setting assignments on the weekend (they are setting the available from dates correctly (i.e. for next lesson not today's date) and when in the assignments app these assignments are not showing until that selected date. The widget is showing them however - meaning students are attempting homework without input form staff (which isn't wanted).

Want I am asking is there anyway to filter these assignment being shown (in the similar way to subject) - so that the start date/avaible from date isn't great than today's date?

hope that makes sense.

Mark

Hi Mark,

I have had a quick look at the FDP documentation and it confused me... There are two filters, "start_from" and "start_to". They are intended to help you limit the range of start dates. Here is an exert from the Docs...

Quote

Optional: start_from Int
A timestamp used to limit the number of returned assignments. For example, to only get assignments created between the dates of 01/01/2016 and 07/01/2016, you would use 1451606400(01/01/2016) in the 'start_from' parameter, and 1452124800(07/01/2016) in the 'start_to' parameter below.

Optional: start_to Int
See 'start_from' description.

After some consideration I figured out (rather ashamed of how long it took me) that if you set "start_from" to say, the beginning of time (or one year in the past maybe) and then "start_to" to the beginning of the current day, only the assignments you want will appear. I haven't tried it, but I have a sneaking suspicion that you might be able to get away without specifying "start_from".

To get the "start_to" try the following:

moment().startOf('day').format('X')

Hope this helps,

Chris

Chris.Smith · December 6, 2016

2 hours ago, clangstaff said:

I've been trying to create a replica of the code below but for students rather than staff. I prefer the layout of this and find it easier to work with than the cloning table row method used in the example for students. I am however, struggling to replicate this with student data can anyone spot where I'm going wrong? @Chris.Smith @Graham Quince

Staff Code working fine:


<style>
.trs-staff-current-assignments-widget {
background-color: #ffffff;
border-radius: 5px;
overflow: hidden;
}
.trs-staff-current-assignments-widget .assignment-widget-header {
background-color: #231f20;
padding: 1em;
position: relative;
text-align: left;
}
.trs-staff-current-assignments-widget .assignment-widget-header::after {
content: "";
width: 98%;
height: 60%;
position: absolute;
top: 3%;
left: 1%;
border-radius: 5px;
}
.trs-staff-current-assignments-widget .assignment-widget-header h1 {
color: #fff;
font-size: 20px;
margin: 0;
}   
.trs-staff-current-assignments-widget .no-homework {
padding: 1em;
text-align: center;
}
.trs-staff-current-assignments-widget .assignment-list {
list-style: none;
padding: 0 1em;
}    
    
.trs-staff-current-assignments-widget .assignment-list :hover{
background-color:#ededed;
}        
    
.trs-staff-current-assignments-widget .assignment-list .assignement-link {
border-bottom: 1px solid #ddd;
padding: 10px 10px  10px 10px;
margin: 0.5em 0;
cursor: pointer;
}
    
.trs-staff-current-assignments-widget .assignment-list .assignement-link p {
margin: 0;
}
.trs-staff-current-assignments-widget .assignment-list .assignement-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;
}
.trs-staff-current-assignments-widget .assignment-list .assignement-link .assign-details {
padding: 0 1em;
float: left;
}
</style>

<div class="trs-staff-current-assignments-widget">
    <div class="assignment-widget-header">
        <h1>My Recent Homework</h1>
    </div>
    <p class="no-homework">You've not set any homework yet</p>
    <ul class="assignment-list" style="display: none;">
        
    </ul>
</div>

<script>

    var getHTMLElem = arguments[0];
    
    var assignments = FrogOS.fdp({
        url: 'assignment/getCreated',
        data: { status: 'open', limit: 5, order: 'start desc' }
    });

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

Student code attempt:


<style>
.trs-student-current-assignments-widget {
background-color: #ffffff;
border-radius: 5px;
overflow: hidden;
}
.trs-student-current-assignments-widget .assignment-widget-header {
background-color: #231f20;
padding: 1em;
position: relative;
text-align: left;
}
.trs-student-current-assignments-widget .assignment-widget-header::after {
content: "";
width: 98%;
height: 60%;
position: absolute;
top: 3%;
left: 1%;
border-radius: 5px;
}
.trs-student-current-assignments-widget .assignment-widget-header h1 {
color: #fff;
font-size: 20px;
margin: 0;
}   
.trs-student-current-assignments-widget .no-homework {
padding: 1em;
text-align: center;
}
.trs-student-current-assignments-widget .assignment-list {
list-style: none;
padding: 0 1em;
}    
    
.trs-student-current-assignments-widget .assignment-list :hover{
background-color:#ededed;
}        
    
.trs-student-current-assignments-widget .assignment-list .assignement-link {
border-bottom: 1px solid #ddd;
padding: 10px 10px  10px 10px;
margin: 0.5em 0;
cursor: pointer;
}
    
.trs-student-current-assignments-widget .assignment-list .assignement-link p {
margin: 0;
}
.trs-student-current-assignments-widget .assignment-list .assignement-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;
}
.trs-student-current-assignments-widget .assignment-list .assignement-link .assign-details {
padding: 0 1em;
float: left;
}
</style>

<div class="trs-student-current-assignments-widget">
    <div class="assignment-widget-header">
        <h1>My Recent Homework</h1>
    </div>
    <p class="no-homework">You've not been set any homework yet</p>
    <ul class="assignment-list" style="display: none;">
        
    </ul>
</div>

<script>

    var getHTMLElem = arguments[0];
    
    var assignments = FrogOS.fdp({
        url: 'assignment/getAssigned',
        data: { status: 'open', limit: 5, order: 'start desc' }
    });

    assignments.done(function(data) {
        var assignments = data.response.assignments;
        for (var uuid in assignments) {
            if (assignments.hasOwnProperty(uuid)) {
                
                getHTMLElem.find('.assignment-list').show();
                getHTMLElem.find('.trs-student-current-assignments-widget .no-homework').hide();
            
                var assignSubject = '<p><strong>' + assignments[uuid].subject.name + '</strong></p>';
                var assignTitle = '<p>' + assignments[uuid].name + '</p>';
                var assignEnd = '<p style="color: red;"><strong>Due: ' + moment(assignments[uuid].end, 'X').format('Do MMM YYYY') + '</strong></p>';
                var assignLink = assignments[uuid].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('.trs-student-current-assignments-widget .assignment-list').append(liElem);
                
            }
        }
    });
    
    $(getHTMLElem).on('click', '.assignment-link', function(el){
        $(this).trigger('os.app.siteviewer', {
            data: { site: el.currentTarget.dataset.assignmentLink }
        });
    });
    </script>

Hi @clangstaff

This is due to the nested data structure. You are one level lower than you need to be...

{
    "assignments": { 
        "EC17261D200034DE79F32F10EA83CE0469E09D9CA1235592": { "has_feedback": 0 },
        "EC157C3320003748A5E0DFFDF4C73908258D99FC1028A058": { "has_feedback": 0 },
        "EC1649BA20003437A9827F2363E912060B3CFE6C71F0AB70": { "has_feedback": 0 },
        "EC1788C52000355DDC814F9C192B3603FF9B18FC15015FD9": { "has_feedback": 0 },
        "EC17261D200034DE79F32F10EA83CE0469E09D9CA1235592": { "has_feedback": 0 },
        "EC173C4220032A07A20DDF3FFF98E106AC26534C1C45D3F6": { // <-- You are here!!
            "activities": { "total": "1", "complete": 1 },
            "assignment": { "uuid": "EC17261D200034DE79F32F10EA83CE0469E09D9CA1235592", "name": "Script Generated Assignment 49" }, // <-- You need to be here
            "user_info": {
                "comments": "0",
                "creator": { "uuid": "EBDD2A0E20005F222E730F4EF076FD08ED03276CE5A4B047", "username": "admin1" },
                "has_feedback": 0,
                "user_info": {
                    "closed": null,
                    "comment": null,
                    "completed": 1481043676,
                    "mark": null,
                    "returned": null,
                    "self_assessment_comment": null,
                    "self_assessment_score": "1",
                    "uuid": "EC173C4220032A07A20DDF3FFF98E106AC26534C1C45D3F6",
                }
            }
        }
    },
    "total_count": 4
}

Let me know if you need any further help on this, all the code you need is in the tutorial and previous posts. This code snippet may help:

var assignments = data.response.assignments,
    assignment;

for (var uuid in assignments) {
	if (assignments.hasOwnProperty(uuid)) {
		assignment = assignments[uuid].assignment;
      
      	var assignSubject = '<p><strong>' + assignment.subject.name + '</strong></p>';
      	// etc, etc, etc
    }
}

Hope this helps,

Chris

clangstaff · December 7, 2016

@Chris.Smith Thanks for your help - I wasn't too far off in the end.

Updated code for anyone who wants it. Also see attached our first attempt at a 'Homework portal' Each page will be embedded within the staff and student dashboards. After christmas all homework will begin to be driven through Frog.

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

    
.trs-student-current-assignments-widget .assignment-list :hover{
background-color:#ededed;
}        
    
.trs-student-current-assignments-widget .assignment-list .assignment-link {
border-bottom: 1px solid #ddd;
padding: 10px 10px  10px 10px;
margin: 0.5em 0;
cursor: pointer;
}
    
.trs-student-current-assignments-widget .assignment-list .assignment-link p {
margin: 0;
}
.trs-student-current-assignments-widget .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;
}
    
.trs-student-current-assignments-widget .assignment-list .assignment-link .assign-details {
padding: 0 1em;
float: left;
}
</style>

<div class="trs-student-current-assignments-widget">
    <div class="assignment-widget-header">
        <h1>My Recent Homework</h1>
    </div>
    <p class="no-homework">You've not been set any homework yet</p>
    <ul class="assignment-list" style="display: none;">
        
    </ul>
</div>

<script>

    var getHTMLElem = arguments[0];
    
    var assignments = FrogOS.fdp({
        url: 'assignment/getAssigned',
        data: { status: 'open', limit: 5, order: 'start desc' }
    });

    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();
                getHTMLElem.find('.trs-student-current-assignments-widget .no-homework').hide();
            
                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('.trs-student-current-assignments-widget .assignment-list').append(liElem);
                
            }
        }
    });
    
    $(getHTMLElem).on('click', '.assignment-link', function(el){
        $(this).trigger('os.app.siteviewer', {
            data: { site: el.currentTarget.dataset.assignmentLink }
        });
    });
    </script>

Graham Quince · December 7, 2016

Loving this discussion and how you're all using it.

@Chris.Smith - i know i could walk down the room, but seems to make more sense to ask on here. For teachers, can the code open Assignment Manager (ideally to the assignment), rather than the student view of the assignment?

clangstaff · December 7, 2016

@Graham Quince @Chris.Smith Even better could we have a couple of links to the right of each assignment - Quick view to view as student and another to open within Assignment Manager.

In the future I'll be looking to build a similar homework page for parents so if anyone has anything created already - please let me know!

Thanks,

clangstaff · December 7, 2016

Don't seem to have the option to edit my previous post to add this. One thing that would quickly and drastically improve the assignments facility is if when an assignment is created through assignment manager it is added to a mobile friendly theme - surely this has to be a relatively quick fix?

Below is how the student homework portal looks on an android phone - it's clear and easy to follow but is let down when clicking in to an assignment as the content does not auto adjust to the screen.

Graham Thorpe · December 9, 2016

Fair point Chris.

I think we can do something quickly on this and see if we can squeeze it into the Dickens release early next year - but then have a think about letting you chaps set your own theme for Quick Assign.

Chris.Smith · December 9, 2016

On 07/12/2016 at 10:22, clangstaff said:

@Graham Quince @Chris.Smith Even better could we have a couple of links to the right of each assignment - Quick view to view as student and another to open within Assignment Manager.

In the future I'll be looking to build a similar homework page for parents so if anyone has anything created already - please let me know!

Thanks,

@Graham Quince Yes, you need to added the assignment uuid to the command that opens Assignment (Manager|Monitor|My Childs Work).

@clangstaff This is a modified version of the code from "My Child's Work".

var params = {
  site: '',
  editable: false,
  assignment_uuid: assignment.attr('assignment_uuid'),
  mode: 'readonly',
  viewAs: student // <-- Must be a Lib.Models.User model
};

Sites.Models.Assign.findOne({
  uuid: assignment.attr('assignment_uuid')
}).done(
  function(site) {
    params.site = site.attr('link');

    FrogOS.openSite(params);
  }.bind(this)
);

It may need modifying as the data it requires is from an "opinionated" API.

Hope this helps,

~ Chris

clangstaff · December 9, 2016

@Graham Thorpe if we could get this in for Dickens we'll be very happy - we are launching assignments including the 'Homework Portal' soon after Christmas.

@Chris.Smith Thanks for that I'll take a look when i get some time.

I've been trying to work out how we can reorder our list of assignments to show the ones with the closest deadlines rather than the assignments with the furthest away deadlines - is this possible? I can't find any other 'order' commands listed anywhere.

    var assignments = FrogOS.fdp({
        url: 'assignment/getAssigned',
        data: { status: 'open', limit: 5, order: 'start desc' }
    });

Chris.Smith · December 9, 2016

3 hours ago, clangstaff said:
@Graham Thorpe if we could get this in for Dickens we'll be very happy - we are launching assignments including the 'Homework Portal' soon after Christmas.

@Chris.Smith Thanks for that I'll take a look when i get some time.

I've been trying to work out how we can reorder our list of assignments to show the ones with the closest deadlines rather than the assignments with the furthest away deadlines - is this possible? I can't find any other 'order' commands listed anywhere.
    var assignments = FrogOS.fdp({
        url: 'assignment/getAssigned',
        data: { status: 'open', limit: 5, order: 'start desc' }
    });

@clangstaff If the order attribute in the data object is not working as intended then that's something we should probably look at... Have you reported this to the Service team?

/cc @Graham Quince @Matt

clangstaff · December 12, 2016

@Chris.Smith I've not reported this as I was unsure what order you'd have expected the assignments to be listed in. Can you confirm should they be listed with the closest deadline at the top of the list?

Chris.Smith · December 12, 2016

28 minutes ago, clangstaff said:

@Chris.Smith I've not reported this as I was unsure what order you'd have expected the assignments to be listed in. Can you confirm should they be listed with the closest deadline at the top of the list?

@clangstaff I would expect the greatest value to be first.

clangstaff · December 13, 2016

@Chris.Smith Apologies but not entirely sure what you'd expect the greatest value to be in terms of time - would this be the most distant deadline?

Chris.Smith · December 13, 2016

33 minutes ago, clangstaff said:

@Chris.Smith Apologies but not entirely sure what you'd expect the greatest value to be in terms of time - would this be the most distant deadline?

Our time comes back in the form of EPOC (a timestamp). Therefore the greater the value, the further in the future the date. So for example, 1481621745 is my current timestamp.... and 1481708175 is now plus one day; in a descending order I would expect tomorrow to come first, then today. Here's a larger example:

var time_range = [
	{
		alias: 'now',
		timestamp: moment().format('X') // 1481621745
	},
	{
		alias: 'yesterday',
		timestamp: moment().subtract(1, 'day').format('X') // 1481708175
	},
	{
		alias: 'first_sept',
		timestamp: moment('01/09/16').format('X') // 1452297600
	},
	{
		alias: 'fourth_nov',
		timestamp: moment('04/10/16').format('X') // 1460242800
	},
  	{
		alias: 'first_jan',
		timestamp: moment('01/01/17').format('X') // 1483228800
	}
];

function sort(direction, a, b) {
	switch(direction) {
		case 'asc':
			return a.timestamp < b.timestamp;
		case 'desc':
			return a.timestamp > b.timestamp;
        default:
              throw new Error('Unknown direction: '+direction);
	}
}

time_range.sort(sort.bind(time_range, 'desc')); // [{first_jan}, {now}, {yesterday}, {fourth_nov}, {first_sept}]
time_range.sort(sort.bind(time_range, 'asc')); // [{first_sept}, {fourth_nov}, {yesterday}, {now}, {first_jan}]

Hope that clears things up

Chris

clangstaff · December 13, 2016

9 minutes ago, Chris.Smith said:

Our time comes back in the form of EPOC (a timestamp). Therefore the greater the value, the further in the future the date. So for example, 1481621745 is my current timestamp.... and 1481708175 is now plus one day; in a descending order I would expect tomorrow to come first, then today. Here's a larger example:


var time_range = [
	{
		alias: 'now',
		timestamp: moment().format('X') // 1481621745
	},
	{
		alias: 'yesterday',
		timestamp: moment().subtract(1, 'day').format('X') // 1481708175
	},
	{
		alias: 'first_sept',
		timestamp: moment('01/09/16').format('X') // 1452297600
	},
	{
		alias: 'fourth_nov',
		timestamp: moment('04/10/16').format('X') // 1460242800
	}
];

function sort(direction, a, b) {
	switch(direction) {
		case 'asc':
			return a.timestamp < b.timestamp;
		case 'desc':
			return a.timestamp > b.timestamp;
        default:
              throw new Error('Unknown direction: '+direction);
	}
}

time_range.sort(sort.bind(time_range, 'desc')); // [{now}, {yesterday}, {fourth_nov}, {first_sept}]
time_range.sort(sort.bind(time_range, 'asc')); // [{first_sept}, {fourth_nov}, {yesterday}, {now}]

Hope that clears things up

Chris

Thank you for your help here - that is useful. I have changed my code to the following for students to display the assignments in order of the nearest deadline at the top of the list.

    var getHTMLElem = arguments[0];
    
    var assignments = FrogOS.fdp({
        url: 'assignment/getAssigned',
        data: { status: 'open', limit: 5, order: 'end asc' }
    });

clangstaff · May 15, 2017

@Chris.Smith @Graham Quince We have come across a bug or issue with the 'my assignments' code in this forum.

Basically when a user opens an assignment using the 'assignments list' code and completes a Frog quiz on that assignment no other students marks will be received when they complete the assignment too. Any subsequent students can complete the quiz and also click 'Complete assignment' however their quiz results are not submitted to the teacher.

Anyone have any idea why?

Chris.Smith · May 16, 2017

On 2017-5-15 at 08:40, clangstaff said:

@Chris.Smith @Graham Quince We have come across a bug or issue with the 'my assignments' code in this forum.

Basically when a user opens an assignment using the 'assignments list' code and completes a Frog quiz on that assignment no other students marks will be received when they complete the assignment too. Any subsequent students can complete the quiz and also click 'Complete assignment' however their quiz results are not submitted to the teacher.

Anyone have any idea why?

@clangstaff can you provide your code for me to try and replicate the issue. Either:

Copy and paste into the reply
Copy into jsbin and add a link here
Message your code to me on here

I'm busy working on a top-secret project at the moment, so I might be worth considering the first two options and hope that some one in the community has some ideas.

~ Chris

clangstaff · May 16, 2017

20 minutes ago, Chris.Smith said:

@clangstaff can you provide your code for me to try and replicate the issue. Either:

Copy and paste into the reply

Copy into jsbin and add a link here

Message your code to me on here

I'm busy working on a top-secret project at the moment, so I might be worth considering the first two options and hope that some one in the community has some ideas.

~ Chris

<style>
.trs-student-current-assignments-widget {
background-color: #ffffff;
border-radius: 5px;
overflow: hidden;
}
.trs-student-current-assignments-widget .assignment-widget-header {
background-color: #3f274e;
padding: 1em;
position: relative;
text-align: left;
}
.trs-student-current-assignments-widget .assignment-widget-header::after {
content: "";
width: 98%;
height: 60%;
position: absolute;
top: 3%;
left: 1%;
border-radius: 5px;
}
.trs-student-current-assignments-widget .assignment-widget-header h1 {
color: #fff;
font-size: 19px;
margin: 0;
line-height:35px;
}   
.trs-student-current-assignments-widget .no-homework {
padding: 1em;
text-align: center;
}
.trs-student-current-assignments-widget .assignment-list {
list-style: none;
padding: 0 1em;
margin:0 0 0 0;
}    
    

    
.trs-student-current-assignments-widget .assignment-list :hover{
background-color:#ededed;
}        
    
.trs-student-current-assignments-widget .assignment-list .assignment-link {
border-bottom: 1px solid #ddd;
padding: 10px 10px  10px 10px;
margin: 0.5em 0;
cursor: pointer;
}
    
.trs-student-current-assignments-widget .assignment-list .assignment-link p {
margin: 0;
}
.trs-student-current-assignments-widget .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;
}
    
.trs-student-current-assignments-widget .assignment-list .assignment-link .assign-details {
padding: 0 1em;
float: left;
}
</style>

<div class="trs-student-current-assignments-widget">
    <div class="assignment-widget-header">
        <h1>My Upcoming Homework</h1>
    </div>
    <p class="no-homework">You've not been set any homework yet</p>
    <ul class="assignment-list" style="display: none;">
        
    </ul>
</div>

<script>

    var getHTMLElem = arguments[0];
    
    var assignments = FrogOS.fdp({
        url: 'assignment/getAssigned',
        data: { status: 'open', limit: 7, order: 'end asc' }
    });

    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();
                getHTMLElem.find('.trs-student-current-assignments-widget .no-homework').hide();
            
                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('.trs-student-current-assignments-widget .assignment-list').append(liElem);
                
            }
        }
    });
    
    $(getHTMLElem).on('click', '.assignment-link', function(el){
        $(this).trigger('os.app.siteviewer', {
            data: { site: el.currentTarget.dataset.assignmentLink }
        });
    });
    </script>

Code posted above - the 'Exam mode' in quizzes is also ignored when accessed via the code above.

Chris.Smith · May 16, 2017

@clangstaff,

This is because you are telling the Sites application to open 'a site', not 'an assignment'. The difference is subtle, but important. This is from the Assignments Application:

var self = this,
    params = {
        site: '',
        assignment_uuid: this.options.assignment.attr('assignment_uuid')
    };

ev.stopPropagation();
if (this.options.status === "closed") {
    params.mode = 'readonly'
}

Sites.Models.Assign.findOne({
    uuid: this.options.assignment.attr('assignment_uuid')
}).done(function(site) {
    params.site = site.attr('link');

    self.trigger('os.app.siteviewer', params);
});

Now this will need some modification, as you don't have access to several elements of this code.

Based on a previous example, lets trim it to something like:

var $assignment = $(el.currentTarget);

FrogOS.openSite({
  site: $assignment.data('assignment-link'),
  assignment_uuid: $assignment.data('assignment-uuid')
});

Super important that you have that assignment uuid. This is what will help link the data.

~ Chris

Optional: start_from	Int	A timestamp used to limit the number of returned assignments. For example, to only get assignments created between the dates of 01/01/2016 and 07/01/2016, you would use 1451606400(01/01/2016) in the 'start_from' parameter, and 1452124800(07/01/2016) in the 'start_to' parameter below.
Optional: start_to	Int	See 'start_from' description.

Sign In

My Assignments HTML

Recommended Posts

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Popular Days

Popular Posts

clangstaff

Graham Thorpe

Graham Quince

Posted Images

Create an account or sign in to comment

Create an account

Sign in