var roles_display_table = ""; // roles table in html form var role_name = []; // displayed names of roles var role_color = []; // colors assigned to roles function memorizeRoles(roles_display){ var i, j, k; roles_display_table = '<table border="1" style="font-size: 11px">'; for (i = 0; i < roles_display.length; i++) { roles_display_table += '<tr>'; for (j = 0; j < roles_display[i].length; j++) { roles_display_table += '<td rowspan="'; roles_display_table += roles_display[i][j].rowspan; roles_display_table += '" colspan="'; roles_display_table += roles_display[i][j].colspan; roles_display_table += '">'; if (roles_display[i][j].caption != "None") { roles_display_table += "<b>" roles_display_table += roles_display[i][j].caption; roles_display_table += "</b>" } for (k = 0; k < roles_display[i][j].roles.length; k++) { roles_display_table += '<div style='; if (roles_display[i][j].roles[k].color != 'None') { roles_display_table += '"background-color: rgb(' + roles_display[i][j].roles[k].color + ')'; } else { roles_display_table += '"background: linear-gradient(to ' + roles_display[i][j].roles[k].gradient + ', rgba(100,100,100,0.1), rgba(100,100,100,1))'; } roles_display_table += '"><input type="checkbox" name="roles" value="'; roles_display_table += roles_display[i][j].roles[k].id; roles_display_table += '"><label>'; roles_display_table += roles_display[i][j].roles[k].rolename; roles_display_table += '</label></div>'; role_name[roles_display[i][j].roles[k].id] = roles_display[i][j].roles[k].rolename; role_color[roles_display[i][j].roles[k].id] = {"color": roles_display[i][j].roles[k].color, "gradient": roles_display[i][j].roles[k].gradient}; } roles_display_table += '</td>'; } roles_display_table += '</tr>'; } roles_display_table += '</table>'; } function getStyle(frame_id, complement_num) { style_type = ""; style_color = ""; style_value = "" roles = frame_content[parseInt(frame_id)].display.roles[complement_num].argument; var i; for (i = 0; i < roles.length; i++) { var color = role_color[roles[i]]; if (color.gradient != "None") { style_type = "linear-gradient(to " + color.gradient + ", "; } else { style_color = color.color } } if (style_type == "") { style_type = "background-color"; style_value = "rgb(" + style_color + ")"; } else { style_value = style_type + "rgba(" + style_color + ",0.1), rgba(" + style_color + ",1))"; style_type = "background"; } return {"type": style_type, "value": style_value}; }