($INBOX_DIR/description missing)
 help / color / mirror / Atom feed
From: Marlon Rodriguez Garcia <marlon.rodriguez-garcia@savoirfairelinux.com>
To: bitbake-devel@lists.openembedded.org, toaster@lists.yoctoproject.org
Cc: Marlon Rodriguez Garcia <marlon.rodriguez-garcia@savoirfairelinux.com>
Subject: [toaster][PATCHv2 2/2] toaster: Update feat to import eventlogs
Date: Thu, 30 Nov 2023 16:42:35 -0500	[thread overview]
Message-ID: <20231130214235.20330-3-marlon.rodriguez-garcia@savoirfairelinux.com> (raw)
In-Reply-To: <20231130214235.20330-1-marlon.rodriguez-garcia@savoirfairelinux.com>

Follow up to feature to import eventlogs
Updated UI using jquery and ajax to block screen and redirect to build page when import eventlogs is trigger
Changed title for eventlogs folder in template
Added a new button on landing page linked to import build page, and set min-height of buttons in landing page for uniformity

Signed-off-by: Marlon Rodriguez Garcia <marlon.rodriguez-garcia@savoirfairelinux.com>
---
 lib/toaster/toastergui/static/css/default.css | 28 ++++++++++++++++
 .../templates/command_line_builds.html        | 33 ++++++++++++++++---
 lib/toaster/toastergui/templates/landing.html | 10 ++++--
 lib/toaster/toastergui/views.py               | 17 ++++++++++
 4 files changed, 82 insertions(+), 6 deletions(-)

diff --git a/lib/toaster/toastergui/static/css/default.css b/lib/toaster/toastergui/static/css/default.css
index 5cd7e211..284355e7 100644
--- a/lib/toaster/toastergui/static/css/default.css
+++ b/lib/toaster/toastergui/static/css/default.css
@@ -367,3 +367,31 @@ h2.panel-title { font-size: 30px; }
   }
 }
 /* End copied in from newer version of Font-Awesome 4.3.0 */
+
+
+#overlay {
+  display: flex;
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-color: rgba(0, 0, 0, 0.7);
+  align-items: center;
+  justify-content: center;
+  z-index: 999;
+}
+
+.spinner {
+  border: 6px solid rgba(255, 255, 255, 0.3);
+  border-radius: 50%;
+  border-top: 6px solid #3498db;
+  width: 50px;
+  height: 50px;
+  animation: spin 1s linear infinite;
+}
+
+@keyframes spin {
+  0% { transform: rotate(0deg); }
+  100% { transform: rotate(360deg); }
+}
diff --git a/lib/toaster/toastergui/templates/command_line_builds.html b/lib/toaster/toastergui/templates/command_line_builds.html
index 5b085e33..3145f535 100644
--- a/lib/toaster/toastergui/templates/command_line_builds.html
+++ b/lib/toaster/toastergui/templates/command_line_builds.html
@@ -7,6 +7,12 @@
 {% block pagecontent %}
 
 <div class="container-fluid">
+    <div id="overlay" class="hide">
+        <div class="spinner">
+            <div class="fa-spin">
+            </div>
+        </div>
+    </div>
     <div class="row">
         <div class="col-md-12">
             <div class="page-header">
@@ -32,7 +38,7 @@
             {% endif %}
             <div class="row">
                 <h4 style="margin-left: 15px;"><strong>Import eventlog file</strong></h4>
-                <form method="POST" enctype="multipart/form-data" action="{% url 'cmdlines' %}"> 
+                <form method="POST" enctype="multipart/form-data" action="{% url 'cmdlines' %}" id="form_file"> 
                     {% csrf_token %} 
                     <div class="col-md-6" style="padding-left: 20px;">
                         <div class="row">
@@ -52,7 +58,7 @@
 
             <div class="row" style="padding-top: 20px;">
                 <div class="col-md-6 ">
-                    <h4><strong>Import eventlog files from directory</strong>
+                    <h4><strong>Eventlogs from existing build directory: </strong>
                         <a href="#" data-toggle="tooltip" title="{{dir}}">
                             <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-info-circle" viewBox="0 0 16 16" data-toggle="tooltip">
                                 <path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14m0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16"/>
@@ -78,7 +84,11 @@
                                     <td class="col-md-6 align-middle" style="vertical-align: middle;">
                                         {% if file.imported == True and file.build_id is not None %}
                                             <a href="{% url 'builddashboard' file.build_id %}">Build Details</a>
-                                        {%else %}
+                                        {% elif request.session.file == file.name or request.session.all_builds %}
+                                            <a data-toggle="tooltip" title="Build in progress">
+                                                <span class="glyphicon glyphicon-upload" style="font-size: 18px; color:grey"></span>
+                                            </a>
+                                        {%else%}
                                             <a onclick="_ajax_update('{{file.name}}', false, '{{dir}}')" data-toggle="tooltip" title="Import File">
                                                 <span class="glyphicon glyphicon-upload" style="font-size: 18px;"></span>
                                             </a>
@@ -160,12 +170,27 @@ $(function () {
 
 
 $("#id_eventlog_file").change(function(){
-    console.log($('#file_import'))
     $('#file_import').prop("disabled", false);
     $('#file_import').addClass('btn-primary')
     $('#file_import').removeClass('btn-default')
 })
 
+$(document).ajaxStart(function(){
+    $('#overlay').removeClass('hide');
+    window.setTimeout(  
+        function() {  
+            window.location = '/toastergui/builds/'
+        }, 10000)
+});
+
+$( "#form_file").on( "submit", function( event ) {
+    $('#overlay').removeClass('hide');
+    window.setTimeout(  
+        function() {  
+            window.location = '/toastergui/builds/'
+        }, 10000)
+});
+
 </script>
 
 {% endblock %}
diff --git a/lib/toaster/toastergui/templates/landing.html b/lib/toaster/toastergui/templates/landing.html
index 22bbed69..589ee226 100644
--- a/lib/toaster/toastergui/templates/landing.html
+++ b/lib/toaster/toastergui/templates/landing.html
@@ -15,7 +15,7 @@
               <p>A web interface to <a href="https://www.openembedded.org">OpenEmbedded</a> and <a href="https://docs.yoctoproject.org/bitbake.html">BitBake</a>, the <a href="https://www.yoctoproject.org">Yocto Project</a> build system.</p>
 
 		          <p class="top-air">
-		            <a class="btn btn-info btn-lg" href="http://docs.yoctoproject.org/toaster-manual/setup-and-use.html#setting-up-and-using-toaster">
+		            <a class="btn btn-info btn-lg" href="http://docs.yoctoproject.org/toaster-manual/setup-and-use.html#setting-up-and-using-toaster" style="min-width: 460px;">
 			            Toaster is ready to capture your command line builds
 		            </a>
 		          </p>
@@ -23,7 +23,7 @@
 		          {% if lvs_nos %}
                     {% if project_enable %}
 		            <p class="top-air">
-		              <a class="btn btn-primary btn-lg" href="{% url 'newproject' %}">
+		              <a class="btn btn-primary btn-lg" href="{% url 'newproject' %}" style="min-width: 460px;">
 			              Create your first Toaster project to run manage builds
 		              </a>
 		            </p>
@@ -42,6 +42,12 @@
                 </div>
               {% endif %}
 
+              <p class="top-air">
+		            <a class="btn btn-info btn-lg" href="{% url 'cmdlines' %}" style="min-width: 460px;">
+			            Import command line event logs from build directory
+		            </a>
+		          </p>
+
               <ul class="list-unstyled lead">
                 <li>
                   <a href="http://docs.yoctoproject.org/toaster-manual/index.html#toaster-user-manual">
diff --git a/lib/toaster/toastergui/views.py b/lib/toaster/toastergui/views.py
index a75fba47..2e34c8a2 100644
--- a/lib/toaster/toastergui/views.py
+++ b/lib/toaster/toastergui/views.py
@@ -2061,6 +2061,10 @@ class CommandLineBuilds(TemplateView):
         else:
             context['files'] = []
             context['dir'] = ''
+        
+        # enable session variable
+        if not self.request.session.get('file'):
+            self.request.session['file'] = ""
 
         context['form'] = LoadFileForm()
         context['project_enable'] = project_enable
@@ -2073,6 +2077,12 @@ class CommandLineBuilds(TemplateView):
         imported_files = EventLogsImports.objects.all()
         try:
             if all_files == 'true':
+
+                # use of session variable to deactivate icon for builds in progress
+                request.session['all_builds'] = True
+                request.session.modified = True
+                request.session.save()
+
                 files = ast.literal_eval(request.POST.get('file'))
                 for file in files:
                     if imported_files.filter(name=file.get('name')).exists():
@@ -2095,6 +2105,12 @@ class CommandLineBuilds(TemplateView):
                 else:
                     file = request.POST.get('file')
 
+                # use of session variable to deactivate icon for build in progress 
+                request.session['file'] = file
+                request.session['all_builds'] = False
+                request.session.modified = True
+                request.session.save()
+
                 if imported_files.filter(name=file).exists():
                     imported_files.filter(name=file)[0].imported = True
                 else: 
@@ -2116,6 +2132,7 @@ class CommandLineBuilds(TemplateView):
                     event_log_import = EventLogsImports.objects.create(name=file, imported=True)
                     event_log_import.build_id = Build.objects.last().id
                     event_log_import.save()
+                    request.session['file'] = ""
         except json.decoder.JSONDecodeError:
             messages.add_message(
                 self.request,
-- 
2.34.1



      parent reply	other threads:[~2023-11-30 21:42 UTC|newest]

Thread overview: 3+ messages / expand[flat|nested]  mbox.gz  Atom feed  top
2023-11-30 21:42 [toaster][PATCHv2 0/2] New Feature to import eventlogs in toaster Marlon Rodriguez Garcia
2023-11-30 21:42 ` [toaster][PATCHv2 1/2] toaster: Added feat to import eventlogs files as builds " Marlon Rodriguez Garcia
2023-11-30 21:42 ` Marlon Rodriguez Garcia [this message]

Reply instructions:

You may reply publicly to this message via plain-text email
using any one of the following methods:

* Save the following mbox file, import it into your mail client,
  and reply-to-all from there: mbox

  Avoid top-posting and favor interleaved quoting:
  https://en.wikipedia.org/wiki/Posting_style#Interleaved_style

* Reply using the --to, --cc, and --in-reply-to
  switches of git-send-email(1):

  git send-email \
    --in-reply-to=20231130214235.20330-3-marlon.rodriguez-garcia@savoirfairelinux.com \
    --to=marlon.rodriguez-garcia@savoirfairelinux.com \
    --cc=bitbake-devel@lists.openembedded.org \
    --cc=toaster@lists.yoctoproject.org \
    /path/to/YOUR_REPLY

  https://kernel.org/pub/software/scm/git/docs/git-send-email.html

* If your mail client supports setting the In-Reply-To header
  via mailto: links, try the mailto: link
Be sure your reply has a Subject: header at the top and a blank line before the message body.
This is a public inbox, see mirroring instructions
for how to clone and mirror all data and code used for this inbox;
as well as URLs for read-only IMAP folder(s) and NNTP newsgroup(s).