Graham Quince

Rather than try to fix Simon's widget, I've retired it and added in these features to the Page Headlines/Menu widget. It should do the same job.

You can create accounts for new staff in the regular way using the Users app and the new user button. When the new academic year starts, there is an option in the Action Cog to reassign the MIS link to the account you created earlier. Once the new academic year starts, find the newly created account for the staff member, the new one will have a tick in the MIS column: And in the Action Cog, look for Reassign MIS Link. This pop-up will open: Frog will do its best to identify the appropriate account to switch to, but you can also search for the user in the Assign to search box. Once completed, you can archive the now un-needed account. Automatic importing is also possible (with a few steps) if SIMS The SIMS extractor does include an option for pre-admissions for staff, students and parents. However, Frog creates these accounts as Inactive. To use effectively, you need to follow these steps: Check the box for pre-admission in the extractor Once an import has run, uncheck the box - if the checkbox remains checked, the accounts will become Inactive at next import. Export all users (or just parents....) via the Users app and amend the CSV to make the accounts Active. Import this CSV

Before you return in September. It's currently undergoing last of the testing - and we really wanted it ready before the break, but it's looking too tight to make that end of term deadline.

While the widget will display the information for you, you can use this code to retrieve it for yourself: <div class="my_data"></div> <script> var myDataDiv = arguments[0].find('.my_data'); var user = FrogOS ? FrogOS.getUser() : self.getUser(); var formUUID = 'FORM_UUID'; Frog.Model.api('dataviewer.gettable', { content_uuid: formUUID, current_user_only: 'false', form_uuid: formUUID, limit: 1, module: 'form', offset: '0', sort_dir: 'DESC', sort_field: 'date' }).done(function(response) { var personalData = response.data; $.each(personalData, function(index, entry) { var data = entry.fields[1].responses[0].response; data = JSON.parse(data); $.each(data, function(index, datum) { if (datum) { myDataDiv.append( index+ ' : '+ datum ) } }) // end of data $.each }); // end of personalData $.each }); // end of API response </script>

I've been working on this widget for some time and I think it solves a big issue for everyone. If your experience working in school was anything like mine, at some point, you will have wanted to display personal data back to the logged in user that did not originate from the MIS. Things like: Login credentials for 3rd Party systems Account balances for cashless catering Appointment times Times of music lessons Short term grades Personal revision links Tutor details Reward points After School clubs Exam timetables (?) I've come up with widget which allows you to add a spreadsheet into a Form. You do have to set the form up first (although the widget contains instructions on what you need to do). Once the information is in, you can use Access Control to set privacy settings. You can download the widget from this link: https://schools.frogeducation.com/community/frogcode/frogcode-showcase/data2form For those of you looking for a way to replicate Frog3 custom fields, this widget should help you achieve that.

I think there's a few more too, but to be honest, I'd be reluctant to publish a list as it probably wouldn't get updated when different teams add SSO. Here's a list I've been able to find. There are two styles of integrations AppWrapper (old integration - limited support) / SAML (current way that Frog integrates with all 3rd parties) AppWrapper Integrations ClickView (integration via Discover) Encyclopedia Britannica (Advanced, Intermediate, Foundation, Image Quest) Espresso GCSEPod Planet eStream PurpleMash SAML Integrations ClickView MintClass Room Booking System The Day Times Tables Rock Stars U-Explore And of course, any system which uses ADFS. iSAMS is currently being developed

I'm not aware of Provision Map. There's been discussions about CPOMS but currently we don't have anything for that.

Just to update on this, the API has been updated and UUIDs will be included in the response in that update.

I thought I'd share this snippet more for reference than for a specific need, but it saves you have to work it out later. It uses an FDP API (fixed so they will not be changed, unlike the internal APIs) This is example, it was needed to change the site's background and banner to match a student's house colours. I know I could have set the CSS in Javascript, but pages load on demand and by rendering out the CSS, it is easy to adapt for all sites, or all pages etc... <div class="styling"></div> <script> var siteUUID = 'SITE_UUID', user = FrogOS ? FrogOS.getUser() : this.getUser(), styling = arguments[0].find('.styling'); houseColours = { 'House1': { background: 'rgba(0,255,0,1)', banner: 'file/resource/7E4864D720030D3DB0338F5280C6A104F3BB61EC80ADD2A4' }, 'House2': { background: 'rgba(255,0,0,1)', banner: 'file/resource/7E4864D720030D3DB0338F5280C6A104F3BB61EC80ADD2A4' }, 'House3': { background: 'rgba(255,255,0,1)', banner: 'file/resource/7E4864D720030D3DB0338F5280C6A104F3BB61EC80ADD2A4' }, 'House4': { background: 'rgba(0,0,255,1)', banner: 'file/resource/7E4864D720030D3DB0338F5280C6A104F3BB61EC80ADD2A4' } }; if (user.profile.type == 'admin' || user.profile.type == 'superuser') { user.uuid = 'STUDENT_UUID'; } FrogOS.fdp({ url: 'group/memberships', path: '/api/fdp/2/', data: { uuid: user.uuid } }).done(function(response) { var house = 'House1'; var groups = response.response; $.each(groups, function(index,group) { if (group.type == 'house') { house = group.name; } }); var background = houseColours[house].background, banner = houseColours[house].banner; styling.html( '<style>'+ 'div[data-site-uuid="'+siteUUID+'"] .ui-theme-mobilesmallbanner-bodyline {'+ 'background: '+background+' !important;'+ 'background: linear-gradient(180deg, '+background+' 0%, rgba(255,255,255,1) 20%) !important;'+ '}'+ 'div[data-site-uuid="'+siteUUID+'"] .ui-theme-mobilesmallbanner-container {'+ 'background-image: url('+banner+') !important;'+ '}'+ '</style>' ) }).fail(function(e) { // Report Error console.log("failed"); }); </script>

To celebrate my new tutorial for on how to build your own Random Name Selector we’re running a competition for the best widget (or application) you can build over the summer. Submit your widget by 14th September (National Coding Week) and the winning entry will receive a Frog hoodie. We’ll proudly host all widgets on the community for everyone to enjoy. How to submit: Reply to this thread with the name of your Widget and screenshots / videos of your action in action. You can either submit your own variation on the Random Name Selector or your own brand new widget. Use the Coding forum if you have any questions.

Hopefully this is will be a fun project for a spare afternoon during the summer break. 14th to 20th September is National Coding Week, it would be great to show off some of your widgets then. Let's make it official and turn this into a competition. Submit your widget and a video showing it in action by 14th September 2021 and the best widget will win a Frog hoodie!

Before you start, you’ll need access to the FrogCode Editor. Contact the Service Desk to have this enabled for you account. You’ll also need to download the files for the Basic Random Name Selector. The download contains the existing widget (TGZ) and all the files required to create the widget – most of which FrogCode will generate “empty” versions for you. Now that you have the files: open FrogCode Editor click on the Action Cog And choose New. Select Widget and set the name of your widget to be “Random Name – Basic” FrogCode Editor will then create an empty template for you, containing all the files needed to make a widget. Crucially, this widget has its own unique UUID, which is reflected in the code. Make a note of this UUID In the Editor’s file browser, expand assets, then styles. In the corresponding downloaded files, copy the contents of main.css to the Editor version. Note the name in the main.css is ‘Widget.RandomName-Basic’. If the Editor’s main.css had a slightly different name, you’ll need to alter the pasted code to match this. In the Editor’s file browser, new expand views and replace the contents of main.ejs with the downloaded version. And repeat these steps for lang.manifest.json, widget.ejs and widget.js In widget.ejs, the UUID occurs for both the icon (line 2) and the widget title (line 3). Replace these with the UUID you made a note of earlier. (If you have lost this UUID, you can find it widget.manifest.json) In widget.js, replace the UUID on lines 2, 3, 4 and 46 Once you’ve made all these changes, you can save all the files and use the play ▶ button to preview the widget. Things to note: Widget.js is the code for the widget, EJS files are the layout. Manifest files, such as lang.manifest.json contain data which is loaded into the widget. The code in widget.js is commented throughout. Ask questions here if you need help. Main.ejs is the widget displayed live, i.e. when the site is viewed, not in editing mode. It is loaded in on line 64, using this.view(‘main.ejs’); Widget.ejs displays the widget in editing mode (line 152). There is a reference application on your platform, called FrogCode APIs, which contains information about widget preferences etc… When you’re finished with your alterations and you’ve replace the widget icon (download the PSD here), right-click on the widget and choose Deploy. This will send the widget to Package Manager and you can publish it. If you make amendments to the widget, you’ll need to update widget.manifest.json on line 19, adding a new version number. When deploying, Frog will check this number for updates. Once you’re happy with your new random name selector, please post some screenshots to the forum and let us know if you’d like to share the final widget. We can copy it from your platform and post it to the community.

Using Frog with MS Teams View the full article

I've had a couple of schools who have expressed a preference for the assignment wizard to list all the sections one after the other, instead of in tabs. This is possible by adding the following CSS to an HTML widget on the staff dashboard: <style> .frogui_components_wizard, .enforce-order { display: none !important; } .frogui_modules_assignment_wizard_panels_details, .frogui_modules_assignment_wizard_panels_activities, .frogui_modules_assignment_wizard_panels_resources, .frogui_modules_assignment_wizard_panels_assessment { position: relative !important; border-bottom: 5px solid #CCCCCC !important; left: 0px !important; min-height: 550px !important; height: auto !important; } .frogui_modules_assignment_wizard_panels .wrapper { overflow-y: auto !important; overflow-x: hidden !important; } .frogui_assignment_wizard .modal-footer .btn-primary, .frogui_assignment_wizard .modal-footer .btn-default { display: none !important; } </style> After hiding the tab buttons, the CSS forces each section to have a minimum height and stack under each other. They can still expand as you add more activities and resources.

The Leaderboards in FrogPlay are a really simple way to drive engagement, but are often overlooked. Here's a guide about what they show: https://www.frogeducation.com/community/training-play/mini-guides-1/play-leaderboards And yes, you can share the leaderboards in your school. You'll need to contact the service desk for the school code, but when you do, you'll be provided with a web address similar to this: https://www.frogplay.net/leaderboards?id=concept This page initially displays a list of all the commands you can send to the leaderboard. Schools running fixed time competitions can use the from and to dates to control the scores displayed.