provide the leaner with information regarding exposed ports

app/assets/javascripts/editor.js

@@ -600,7 +600,18 @@ $(function() {
   };
 
   var storeContainerInformation = function(event) {
-    $('#stop').data('container', JSON.parse(event.data));
+    var container_information = JSON.parse(event.data);
+    $('#stop').data('container', container_information);
+
+    if (_.size(container_information.port_bindings) > 0) {
+      $.flash.info({
+        icon: ['fa', 'fa-exchange'],
+        text: _.map(container_information.port_bindings, function(key, value) {
+          var url = window.location.protocol + '//' + window.location.hostname + ':' + key;
+          return $('#run').data('message-network').replace('%{port}', value).replace(/%{address}/g, url);
+        }).join('\n')
+      });
+    }
   };
 
   var storeTab = function(event) {

app/views/exercises/_editor.html.slim

@@ -8,7 +8,7 @@
       = render('editor_button', data: {:'data-message-success' => t('submissions.create.success'), :'data-placement' => 'top', :'data-tooltip' => true}, icon: 'fa fa-save', id: 'save', label: t('exercises.editor.save'), title: t('.tooltips.save'))
       .btn-group
         = render('editor_button', icon: 'fa fa-desktop', id: 'render', label: t('exercises.editor.render'))
-        = render('editor_button', data: {:'data-message-failure' => t('exercises.editor.run_failure'), :'data-message-success' => t('exercises.editor.run_success'), :'data-placement' => 'top', :'data-tooltip' => true}, icon: 'fa fa-play', id: 'run', label: t('exercises.editor.run'), title: t('shared.tooltips.shortcut', shortcut: 'ALT + r'))
+        = render('editor_button', data: {:'data-message-failure' => t('exercises.editor.run_failure'), :'data-message-network' => t('exercises.editor.network'), :'data-message-success' => t('exercises.editor.run_success'), :'data-placement' => 'top', :'data-tooltip' => true}, icon: 'fa fa-play', id: 'run', label: t('exercises.editor.run'), title: t('shared.tooltips.shortcut', shortcut: 'ALT + r'))
         = render('editor_button', data: {:'data-placement' => 'top', :'data-tooltip' => true}, icon: 'fa fa-stop', id: 'stop', label: t('exercises.editor.stop'), title: t('shared.tooltips.shortcut', shortcut: 'ALT + r'))
         = render('editor_button', data: {:'data-placement' => 'top', :'data-tooltip' => true}, icon: 'fa fa-rocket', id: 'test', label: t('exercises.editor.test'), title: t('shared.tooltips.shortcut', shortcut: 'ALT + t'))
         button.btn.btn-primary.dropdown-toggle data-toggle='dropdown' type='button'

config/locales/de.yml

@@ -168,6 +168,7 @@ de:
       create_file: Neue Datei
       destroy_file: Datei löschen
       download: Herunterladen
+      network: 'Während Ihr Code läuft, ist Port %{port} unter folgender Adresse erreichbar: <a href="%{address}" target="_blank">%{address}</a>.'
       render: Anzeigen
       run: Ausführen
       run_failure: Bei der Ausführung Ihres Codes sind Fehler aufgetreten.

config/locales/en.yml

@@ -168,6 +168,7 @@ en:
       create_file: New File
       destroy_file: Delete File
       download: Download
+      network: 'While your code is running, port %{port} is accessible using the following address: <a href="%{address}" target="_blank">%{address}</a>.'
       render: Render
       run: Run
       run_failure: Your code ran with errors.