Suggestions for App.svelte and other components

[Emmanuel SV1BTL]

I suggest no more then 1 upload a month for the github, better maybe if needed after a week.

But uploading to many updates all the time will give problems for people that use their own code.
They have to adapt all the time....if they update.

It does not take much time to adapt the updates, if you use your own template (like me). My "template" is almost >90% of this in the repository and the parts of code that I don't use (because I prefer mine) are commended with <!-- -->
The architecture of the layout used, is also different, so my editing/updates are focused only to the newer part of the total code, or the changed ones.

Maybe it will be better Phil to indicate the code(s) changed, referring to the code lines of the updated files. This will make the editing faster for those using their own template. For all others, using the community template, a simple download and compile is enough. The use of these "keywords" written in site_information.json is probably the most clever idea of the setup.

[Bas ON5HB]

Manolis, we are in the game al the time, not all do.

As such a major update by Phil every month is a better idea.

I told you before, some of you go way to fast, resulting in updates in hours, often not properly tested

As such I'm against it. Slow down....I said this before.

[Emmanuel SV1BTL]

Well Bas, Phil has asked for ideas AND codes (if someone has a skill for this), so to test it again (after the creator has already done) and IF HE thinks that a particular idea (and code) is useful, THEN HE will be the person to upload it to the community via repository. There are some members, who had wonderful ideas, most of them have implemented by Phil, some others have created or modified parts of the code, and the life is going on. No one has forced Phil to upload/update NOW, without testing, or without an approvement of how useful an new code will be for the community.

If a member wishes to apply a non "official" update using a "copy-paste" process, he is free to do this, since the code is uploaded to the forum. He will not be a kind of a beta-tester this way, and if the member finds that there is a bug to the newer part of code, returning to the previous status is also easy.

I am not "in a hurry" so to "slow down" and I do have also a profession very far away from coding, working several hours everyday, so I can very easily understand the lack of the time. But I cannot really understand why an idea or a ready and tested code has to be uploaded "once per month" as you've mentioned, although it is maybe ready and functional to be uploaded whenever Phil has the time to do it.

Have a nice weekend!

[Phil - NY4Q]

Take your time, make sure it works.

Test it a few days before uploading.

That's what I plan to do. I have it installed on my test machine and will be playing around with it.

[Phil - NY4Q]

And again, all the things we were asking for I believe we have in place. You may wish to move things around on the page or disable certain sections and that is always going to be - I believe it is time to pause and wait for Steven's updates.

[magicint1337]

Im working hard on my frontend update

[Phil - NY4Q]

Latest files (App.svelte, waterfall.js, and audio.js) have been sent to Github.

I added names to the new bands entered in the this.bands array in waterfall.js and did not modify the code that ignored no-name bands. The ITU has designations for those spectrum. We can just use those names as we add more bands (if we do).

I checked all as best I could, but please report any bugs.

Phil

[Emmanuel SV1BTL]

audio.js

The added full date/time in the name of the recorded files, works very well!

[Emmanuel SV1BTL]

Suggestion for the Collapsible Window

As you've maybe noticed, the right part of the collapsible window is "empty". You can add more information to this area, without making the whole window bigger. The solution is to divide this window to 2 "subwindows" and to resize both of them according to your needs. You can check my server for the result.

If you Phil find this useful, you can include it in a future update.

The edited code is this, including the already existing code (lines 1781 - 1814 in App.svelte - github):

Code Select Expand

<!-- Collapsible Content -->
               <div id="collapsible-menu" class="hidden mt-3 bg-gray-700 p-3 rounded">
                <div class="columns">
                  <div class="first-column">
                     <ul style="font-size: 0.91rem; text-align: left;">
                    <b>Setup &amp; Configuration:</b>
                    <br />
    <span style="/*text-decoration: line-through*/"><b>Hardware:</b> {siteHardware}</span>
                    <br /> <br />
    <span style="/*text-decoration: line-through*/"><b>Software:</b> {siteSoftware}</span>
                    <br /><br />
<span style="/*text-decoration: line-through*/"><b>Note:</b>
                    <br />
    {siteNote}
                    <br />                   
                    <br />
                             
                   <div style="font-weight: bold;">Current band propagation for Europe and statistics:</div>
                   <div style="display: flex; align-items: center; margin-top: 10px;">
                      <img src="https://images.lightningmaps.org/blitzortung/europe/index.php?map=5&amp;t=5092072" alt="Lightning Map" style="margin-right: 10px;" />
                      <a href="https://www.hamqsl.com/solar.html" title="Click for more information">
                      <img alt="Solar propagation" src="https://www.hamqsl.com/solar101vhf.php" /> </a><br />
                    </div>
                 </div>
                   
                 <div class="second-column">
                 <!--- Any other information -->
                  </div>   
               </div>
            </div>
          </div>
        </div>
       
     <style>
      .hidden {
          display: none;
        }

      /* Setting the container width to 100% enabling overflow auto to clear the float */
      .columns {
          width: 100%;
          overflow: auto; /* To clear the float */}

      /* Styling for the left column */.first-column {
          float: left; /* Float left to place it on the left side */    width: 50%; /* Taking 50% of the container width */}

      /* Styling for the right column */.second-column {
          float: right; /* Float right to place it on the right side */    width: 50%; /* Taking 50% of the container width */}
      </style>
               
      <!--End of Titel Box -->


[Phil - NY4Q]

I checked all as best I could, but please report any bugs.

Phil

Well now I am seeing NO decodes on FT8 at my site, so the FT8 decode is NOT WORKING.

[Phil - NY4Q]

Well now I am seeing NO decodes on FT8 at my site, so the FT8 decode is NOT WORKING.

My mistake - I had not reset my audio sample rate back down to 12000. All GOOD.

[Phil - NY4Q]

Over the course of us all getting here, I have been working on a 'less cluttered' interface and have uploaded that to the git - it is entitled App-Mobile-Devices.svelte and you can see it on the Lumpkin site as of now. Basically, I have just hidden a lot of real estate behind popup screens.

http://websdr.lumpkinschools.com/

You will need to add the following for mobile device detection :

Code Select Expand

npm i svelte-device-info


[Emmanuel SV1BTL]

Very good Phil. But please explain to us, how we'll use it.
Shall we upload to our server the "App-Mobile-Devices.svelte" file and a mobile user will be redirected to this, or something else, e.g. replace the code of the App-Mobile-Devices.svelte with this of the App.svelte?

[Phil - NY4Q]

Very good Phil. But please explain to us, how we'll use it.
Shall we upload to our server the "App-Mobile-Devices.svelte" file and a mobile user will be redirected to this, or something else, e.g. replace the code of the App-Mobile-Devices.svelte with this of the App.svelte?

Is is just there if you want to simplify the interface a bit. The only 'mobile' feature on now is the fine tuning buttons are printed in a different sequence on a desktop vs a mobile device. And most of the other buttons are behind popup menus, so you don't have to scroll up and down so much to find things.

You could use both Svelte apps if you wanted to tinker with the setup a bit, but that'd take some time.

So I uploaded that version is anyone wants to use it. You just rename it and compile.

Phil

[Phil - NY4Q]

Code Select Expand

<!-- Collapsible Content -->
               <div id="collapsible-menu" class="hidden mt-3 bg-gray-700 p-3 rounded">
                <div class="columns">
                  <div class="first-column">
                     <ul style="font-size: 0.91rem; text-align: left;">
                    <b>Setup &amp; Configuration:</b>
                    <br />
    <span style="/*text-decoration: line-through*/"><b>Hardware:</b> {siteHardware}</span>
                    <br /> <br />
    <span style="/*text-decoration: line-through*/"><b>Software:</b> {siteSoftware}</span>
                    <br /><br />
<span style="/*text-decoration: line-through*/"><b>Note:</b>
                    <br />
    {siteNote}
                    <br />                   
                    <br />
                             
                   <div style="font-weight: bold;">Current band propagation for Europe and statistics:</div>
                   <div style="display: flex; align-items: center; margin-top: 10px;">
                      <img src="https://images.lightningmaps.org/blitzortung/europe/index.php?map=5&amp;t=5092072" alt="Lightning Map" style="margin-right: 10px;" />
                      <a href="https://www.hamqsl.com/solar.html" title="Click for more information">
                      <img alt="Solar propagation" src="https://www.hamqsl.com/solar101vhf.php" /> </a><br />
                    </div>
                 </div>
                   
                 <div class="second-column">
                 <!--- Any other information -->
                  </div>   
               </div>
            </div>
          </div>
        </div>
       
     <style>
      .hidden {
          display: none;
        }

      /* Setting the container width to 100% enabling overflow auto to clear the float */
      .columns {
          width: 100%;
          overflow: auto; /* To clear the float */}

      /* Styling for the left column */.first-column {
          float: left; /* Float left to place it on the left side */    width: 50%; /* Taking 50% of the container width */}

      /* Styling for the right column */.second-column {
          float: right; /* Float right to place it on the right side */    width: 50%; /* Taking 50% of the container width */}
      </style>
               
      <!--End of Titel Box -->


I will add this at my next edit / test time I have. Thanks.

Phil