CUTCODEDOWN
Minimalist Semantic Markup

Welcome Guest
Please Login or Register

If you have registered but not recieved your activation e-mail in a reasonable amount of time, or have issues with using the registration form, please use our Contact Form for assistance. Include both your username and the e-mail you tried to register with.

Author Topic: What is JS proposal  (Read 441 times)

durangod

  • Sr. Member
  • ****
  • Posts: 364
  • Karma: +5/-0
  • Weebles Wobble - but they dont fall down!
What is JS proposal
« on: 8 Aug 2023, 11:21:53 am »
Hi,

can someone explain or offer a link to a simple explaination of what JS proposal is and what this message is trying to tell me...   I get it when i am on firefox

its for a share box where one can share content with others...  ill get a pic...

Quote
You need to use a browser that supports this draft proposal

never heard of it and i find some links on google but they are all very technical.   Whats the simple simon version lol


here is the code its comming from and i was on https

Code: [Select]
"use strict";


  //presets
  var box = document.getElementById('share_checkbox');
  var sub_mit = document.getElementById('share_submit');

  if(sub_mit)
  {
   sub_mit.style="cursor: not-allowed";
  }

   function sleep(delay)
   {
      return new Promise(resolve => {
        setTimeout(resolve, delay);
      });
    }

    function checkboxChanged()
    {
     
     if(box.checked === true)
     {
         
       //free up button if they checked the box
       sub_mit.disabled=false;
       sub_mit.style="cursor: pointer";
       
      }else{
         
            //if unchecked then disabled button
            sub_mit.disabled=true;
            sub_mit.style="cursor: not-allowed";
           }
     
    }//close function checkboxChanged
   

    async function checkWebShare()
    {
       
      var m = document.getElementById('shareit');
       
      if(navigator.share === undefined)
      {
        alert('Your chosen browser does not support this feature');
        console.log('Error: Unsupported feature: navigator.share');
        m.style.display="none"; //close the modal window also
        return;
      }

      const title = document.getElementById('share_title');
      const text = document.getElementById('share_content');
      const url = document.getElementById('share_url');
     
      try{
           await navigator.share({title, text, url});
           alert('Successfully sent share');
         } catch (error) {
                          console.log('Error sharing: ' + error);
                          }
                         
    }//close async function
   
 

    function onLoad()
    {
      if(box)
      {
      box.addEventListener('click', checkboxChanged);
      }
     
      if(sub_mit)
      {
      sub_mit.addEventListener('click', checkWebShare);
      }
     

      if(navigator.share === undefined)
      {
        if(window.location.protocol === 'http:')
        {
          // the navigator.share() is only available in secure contexts.
          window.location.replace(window.location.href.replace(/^http:/, 'https:'));
        }else{
              console.log('Error: You need to use a browser that supports this draft ' + 'proposal.');
              return;
              }//close else protocol
             
       }//close navigator share
     
    }//close function onLoad

window.addEventListener('load', onLoad);
   
   

there are a few warnings in my code editor

async function checkWebShare()

async says its missing a semi colon, async not defined

try says missing semi colon and that await is not defined

 It opens a sharebox modal then it opens a share app to share the item, which in testing is a blog link.

https://photos.app.goo.gl/ZszbNKpvzxmkj3Q98



« Last Edit: 8 Aug 2023, 11:43:14 am by durangod »

coothead

  • Sr. Member
  • ****
  • Posts: 380
  • Karma: +89/-0
  • I smile benignly
    • coothead's stuff ~ an eclectic collection
Re: What is JS proposal
« Reply #1 on: 8 Aug 2023, 11:42:32 am »
Hi there durangod,

this is what I discovered...

Quote
Every programming language has a way to introduce new additions. TC39 is a committee that designs ECMAScript. This group developed a process that allows for easy and frequent releases of the specification. Each feature has to go through 5 maturity stages named as following:

  • stage 0 (strawperson)
  • stage 1 (proposal)
  • stage 2 (draft)
  • stage 3 (candidate)
  • stage 4 (finished)
   
Strawperson is the entry stage. Everyone can submit ideas and if they are not rejected immediately by the committee, they appear on the first stage.

As a new feature develops maturity, it goes through 4 more stages. Each one of them has strictly defined purposes, entrance criteria, acceptance signifies, spec quality, etc. Once a proposal gets to stage 4, the feature will be included in the nearest release of ECMAScript.

You can use unreleased features today by using transpiling tools like babel. All you have to do is to include a plugin for the corresponding proposal. You have to be careful though, remember that proposals might not make it to core specification or the API might change during the process.

The complete list of proposals is available to everyone on the TC39 website.

Source

JavaScript proposals you need to know

I don't know if that will help.

coothead
~ the original bald headed old fart ~

durangod

  • Sr. Member
  • ****
  • Posts: 364
  • Karma: +5/-0
  • Weebles Wobble - but they dont fall down!
Re: What is JS proposal
« Reply #2 on: 8 Aug 2023, 11:44:08 am »
Its more than i found...... thanks man.....  again.... good stuff....

Ok so its basically  W3C for js....  and standards..... cool

interesting reading.....  i cant find this proposal so maybe it did not make it.....  its still handy though if it works. I dont have twitter so cant test it..... 
« Last Edit: 8 Aug 2023, 12:00:48 pm by durangod »

coothead

  • Sr. Member
  • ****
  • Posts: 380
  • Karma: +89/-0
  • I smile benignly
    • coothead's stuff ~ an eclectic collection
Re: What is JS proposal
« Reply #3 on: 8 Aug 2023, 12:20:31 pm »
... I get it when i am on firefox

That may be the cause of your woes.

Source
web share api

Have you tried a test in another browser?

coothead
~ the original bald headed old fart ~

coothead

  • Sr. Member
  • ****
  • Posts: 380
  • Karma: +89/-0
  • I smile benignly
    • coothead's stuff ~ an eclectic collection
Re: What is JS proposal
« Reply #4 on: 8 Aug 2023, 01:52:26 pm »
Hi there durangod,

I did a rough test with Chrome - ( did not have HTML to play with ) -
and actually managed to produce this result...



I hope that it will  mean something  positive to you.

coothead
~ the original bald headed old fart ~

durangod

  • Sr. Member
  • ****
  • Posts: 364
  • Karma: +5/-0
  • Weebles Wobble - but they dont fall down!
Re: What is JS proposal
« Reply #5 on: 8 Aug 2023, 08:01:11 pm »
yep you are correct my version of firefox not supported.... Why does it seem all the good stuff we find is not supported anymore lol 

I just forgot the html, sorry.... here it is its a modal     you find the coolest sites,  great info thanks...  Ya know i totally forgot where i got that code from.... thanks for finding it again.....  :)

Just fyi the submit is disabled, i enable it with js as long as js is enabled. It forced them to enable js.

Code: [Select]
<div id="shareit" class="modal modalMenu">
<!-- <a href="" class="modalClose" hidden aria-hidden="true"></a> -->
<div> <!-- start no name -->
  <nav>
<h2>Web Share &nbsp; <span class="moveright"><a href="" onClick="close();"><span class="smalltxt"><?= htmlspecialchars(getLangValue('GENERAL_CLOSE_TEXT')); ?> <i class="far fa-times-circle"></i></span></a></span></h2>
<div  class="scroll_it">
<div> <!-- noname two start -->
  <ul>
   <li>
         <form name="shareit_form" id="shareit_form">
              <section>
                 <label for="share_title">Title: (read only)</label>
                 <br>
                 <input type="text" name="share_title" id="share_title" value="" size="40" readonly>
                 <br>
                 <label for="share_url">URL: (read only)</label>
                 <br>
                 <input type="url" name="share_url" id="share_url" value="" size="50" readonly>
                 <br>
                 <label for="share_content">Optional Message: Max <?= TEXTAREA_CHAR_LIMIT; ?>  chars</label>
                 <br>
                 <textarea class="mceNoEditor"  name="share_content" id="share_content" maxlength="<?= TEXTAREA_CHAR_LIMIT; ?>" placeholder="Optional Share Content - Reminder never share personal data!" onKeydown="return noEditor_charsLeft('share_content');"  onBlur="this.value = text_clean(this.value);"></textarea>
                 <br>
                 <div id="share_content_counter"></div>
                 
                 <div class="auth_share">
                   <label for="share_checkbox">Authorize:</label>
                   <br>
                   <input type="checkbox" name="share_checkbox" id="share_checkbox" value="" required>
                   <span class="share_cb">Check this box to authorize this share. Button disabled until box is checked.</span>
                 </div> <!-- auth_share -->
                 
                 <?php
                 
                   
//no token or hpot used as it is all done by js
                   
                  
?>

                 
               
                 <input type="submit" id="share_submit" name="share_submit" value="Submit" disabled>
                 <br>
                 <br>
                 <div id="share_disclaimer">
                 <p>Disclaimer: This feature is intended to allow you to share topics and other information you feel others
                 might also enjoy or get value from. It is not intended to share any kind of personal information which could put you or others
                 in danger.  Please never share any kind of personal identifiable or sensitive information using this feature. You hold harmless
                 <?= SITE_NAME; ?>, its employees and all associates from any damage, harm, or event(s) which may occur as a result of this topic post.</p>
                 
                 <p> The data currently used in this feature only contains a title and a url. Both are read only fields and require
                 no input from you. The text message part of this feature is optional and you are not required to enter anything into the message field.</p>   
                 </div>
               </section>
          </form>
    </li> 
   </ul>
      </div> <!-- noname two end -->
    </div> <!-- scroll it -->
  </nav>
    </div> <!-- end no name -->
</div> <!-- sharit.modal.menu -->


« Last Edit: 8 Aug 2023, 08:09:37 pm by durangod »

durangod

  • Sr. Member
  • ****
  • Posts: 364
  • Karma: +5/-0
  • Weebles Wobble - but they dont fall down!
Re: What is JS proposal
« Reply #6 on: 8 Aug 2023, 08:18:28 pm »
I also found this but i dont support safari..

https://webkit.org/blog/13708/allowing-web-share-on-third-party-sites/

I am reading that w3c page to find out why it says object on the header of the box.

there is a codepen also
https://codepen.io/ayoisaiah/pen/YbNazJ

« Last Edit: 8 Aug 2023, 08:24:26 pm by durangod »

Jason Knight

  • Administrator
  • Hero Member
  • *****
  • Posts: 1029
  • Karma: +188/-1
    • CutCodeDown -- Minimalist Semantic Markup
Re: What is JS proposal
« Reply #7 on: 8 Aug 2023, 08:31:38 pm »
The word proposal by itself should have said a lot. It's been PROPOSED which means it's not adopted officially.

A second word in the message also should have told you something. DRAFT. As in a rough sketch, as in it's not official nor is its design/use locked in.

Thus it is NOT something you should even use in production code. If you're dicking around learning, FINE. But anything labelled "proposal" or "draft" you should be avoiding using in any REAL code.

That said that JavaScript is ... problematic in that it bleeds scope, dicks around with element.style which is something to be avoided when possible, uses bizarro-land indentation (pet peeve), promises for F*** knows what, functions for nothing, accessing what seems to be a scripting only button from the markup (meaning it has no business IN the markup), etc, etm.

Also navigator.share is dumbass and likely to be blocked as fast as it's implemented, given it's a security nightmare. Yeah, let's allow websites to pass URI's to other applications, what could go wrong?!? HURR-DURRZ!!!

Kind of like the derp of doing a http to https redirect in the JavaScript instead of on the server before the page even loads where it belongs. Or resorting to onload for scripting that doesn't even warrant it if you just move the <script> to right before </body>
We are all, we are all, we are all FRIENDS! For today we're all brothers, tonight we're all friends. Our moment of peace in a war that never ends.

durangod

  • Sr. Member
  • ****
  • Posts: 364
  • Karma: +5/-0
  • Weebles Wobble - but they dont fall down!
Re: What is JS proposal
« Reply #8 on: 8 Aug 2023, 09:15:31 pm »
I thought proposal was some kind of new js function and draft was a js slang term for js code.  I did not take them at their spoken meaning, but now i will.      Sort of like method and function in php are the same thing basically.  One is code inside a class and one is just code by itself but they are both rapped in function. 

Lesson learned....    I will remove the feature, but i need to find something on the social stack to use.  By social stack i mean there are stacks and stacks of features that basic social software offer, and the stacks are growing, i cant just hit the market with nothing and say oh hi im a naked social script, any takers. 

I have to have something other than forum, blogs, gallery, chat, video, messages, email, profile, and search.  I have to have something that shares topics outside the site somehow... is there another option, even an open source or something affordable that has a commercial license, something ya know... 

Jason Knight

  • Administrator
  • Hero Member
  • *****
  • Posts: 1029
  • Karma: +188/-1
    • CutCodeDown -- Minimalist Semantic Markup
Re: What is JS proposal
« Reply #9 on: 8 Aug 2023, 09:24:53 pm »
Social media sites usually have their own API (usually abusing GETdata) for submitting to their pages. Is that what you're talking about because if so, the most you REALLY need is a bunch of anchors, maybe enhanced with JS to do things like window.open (though I frown on that)

I spent a couple moments to try and rewrite that mess so it made sense.

Code: [Select]
/*

NOTES

Set the submit to disabled in the markup,
Then  do this in the stylesheet:

#share_submit[disabled] { cursor:not-allowed; }

Perform our abort conditions FIRST!
1) Does navigator.share exist
2) Is it blocked?
3) are we in HTTPS?
4) do all our required elements exist, store them if so.

*/

if (!navigator.share) {

alert(
"The 'Web Share API' is unsupported in your browser.\r\nPlease revisit this page in a supported browser.\r\n\r\nWhich as of 2023 is to say Chrome and Jack freaking else as this is an experimental feature not even out of draft!"
);
throw new Error("Unsupported feature: Web Share API");

} else if (!navigator.canShare) {

alert(
"The 'Web Share API' is blocked in your browser settings. Please revisit this site after enabling this experimental feature."
);
throw new Error("'Web Share API' access is blocked");

} else if (window.location.protocol !== 'https:') {

/*
There are other protocols besides http, we WANT https
so check for that specifically!
*/
alert(
"This page should be using the HTTPS protocol but it is not. This indicates server-side misconfiguration."
);
throw new Error("Unable to use 'Web Share API' in non HTTPS protocol page");

} else {

const

/*
helper function so we can throw an error if any of
our required elements do not exist in the document.
*/
getOrWarn = (id) => {
let result = document.getElementById(id);
if (!result) throw new Error("#" + id + " not found, halting script");
return result;
},

/*
I like to get any elements I can up-front so they're
not executing the "slow" getElement events on the fly.

As ALL of these elements appear to be scripting only
behavior, I would in fact have none of them in the markup
and instead would generate them here.
*/
share = {
checkbox : getOrWarn('share_checkbox'),
"submit" : getOrWarn('share_submit'),
it       : getOrWarn('shareit'),
title    : getOrWarn('share_title'),
text     : getOrWarn('share_content'),
url      : getOrWarn('share_url')
};

/*
There was NO reason for these to be independent
functions polluting the global or even local scope!
*/

shareCheckbox.addEventListener("change", (e) => {
share.submit.disabled = !e.currentTarget.checked;
} ); // shareCheckBox.change

shareSubmit.addEventListener("click", async (e) => {

/*
Remember onclick can still fire on a disabled input
or button. All disabled does is prevent said button
from submitting the form! (if any)
*/
if (e.currentTarget.disabled) return;

/*
I'm assuming these ID's were for input, which is why
the code as presented should not have worked even in
supported browsers!

document.getElementById returns type Element, when
navigator.share expects type string!
*/
try {
await navigator.share( {
title : share.title.value,
text : share.text.value,
url : share.url.value
} );
alert('Successfully sent share');
} catch (error) {
console.log('Error sharing: ' + error);
}

} ); // shareSubmit.onclick

}

I think my more verbose error messages and removing around 500 bytes of dead code better explains what's going on there. Mind you, untested. Might have a couple typos.

It's funny how differently I look at implementing certain code.
« Last Edit: 12 Aug 2023, 02:55:52 am by Jason Knight »
We are all, we are all, we are all FRIENDS! For today we're all brothers, tonight we're all friends. Our moment of peace in a war that never ends.

durangod

  • Sr. Member
  • ****
  • Posts: 364
  • Karma: +5/-0
  • Weebles Wobble - but they dont fall down!
Re: What is JS proposal
« Reply #10 on: 8 Aug 2023, 09:53:05 pm »
Thanks DS,  beggers can't be choosers, it looks awesome i am sure anything wrong is minor at best.  I really deeply appreciate it.  What you can do in a few min would take me days of research to do, and even then i would get it wrong.  So what you did means so much to me....  :)

I coded my own forum with the help of all of you with the js and ajax calls and some pdo stuff, but a basic forum is easy peasy, its just moving data around and i can do that.  But userside is different to me, i can do basics but i dont think i could ever code my own share code.   I dont know enough about social media since i am not part of that crowd and don't intend to be.  I just depend on those that know it to be kind enough to toss out a bone once in a while with snippits.

Does that make me a bad developer or just an uninformed one.   Its hard to fake interest at things i have less than zero interest in like twitter, FB and the rest.  I just provide their API is all.   

I am not doing this project to serve the masses, i am doing it to serve the forgotten ones (500 or so users) abandoned by another software, if it grows from there great, if not then i have done a good deed which is the better reason anyway.
« Last Edit: 8 Aug 2023, 10:15:44 pm by durangod »

durangod

  • Sr. Member
  • ****
  • Posts: 364
  • Karma: +5/-0
  • Weebles Wobble - but they dont fall down!
Re: What is JS proposal
« Reply #11 on: 11 Aug 2023, 10:18:11 pm »
Followup,  wow that is one super duper fine job for just a few min.... amazing.

As you said there were just a few small typos.  " rather than '  and  one missing close i think, anyway it was one missing } or { i dont remember or it could have been a ) or (  lol i was tired as heck at the time. 

my editor shows it still has a missing  (   at     

Code: [Select]
share_submit.addEventListener("click", async (e) =>  {
and it says expecting identifier and instead saw if (a reserved word) expected ) to match { and instead saw ( missing semicolon,  118 is the line above and this if code is this

Code: [Select]
               
                if (e.currentTarget.disabled) return;

i went over this 3 or 4 times and i dont see anything missing, so i think its just my editor being stupid. 
plus no errors in console so i am not worried about it.

Amazing job for just slapping it together.  :)

it works great and thanks so much...  :)


Jason Knight

  • Administrator
  • Hero Member
  • *****
  • Posts: 1029
  • Karma: +188/-1
    • CutCodeDown -- Minimalist Semantic Markup
Re: What is JS proposal
« Reply #12 on: 12 Aug 2023, 03:01:33 am »
I modified my post for a version without the typos. Happens to me a good deal when I'm trying to code on my laptop where I just can't use those rinky piece of junk keyboards.

On desktop right now I'm trying out Kailh bronze switches. Freaking awesome. I'd rank them better than a model M. They've got speed silver's 1mm of actuation, the full 4mm of travel available making me not have to bottom out to feel like they're working... and they're tactile so you can feel and hear the the keypress register.

And yeah, a lot of editors will choke on the code I write with their built in "tools" that are -- to be brutally frank -- as flawed as that "linter" idiocy.

There's a reason I have code comments like this:

Code: [Select]
switch (media) {
case "all":
warn(
`%{routine}: "all" media type not recommended ${extra}`
);
// yes, drop-through! FYDL
case "screen":
case "print":
return media;
}

or

Code: [Select]
// yes, single equals, test on assignment, FYDL
if (dss = dss.slice(allMatch.length)) {

FYDL == F*** your damned linter.
We are all, we are all, we are all FRIENDS! For today we're all brothers, tonight we're all friends. Our moment of peace in a war that never ends.

durangod

  • Sr. Member
  • ****
  • Posts: 364
  • Karma: +5/-0
  • Weebles Wobble - but they dont fall down!
Re: What is JS proposal
« Reply #13 on: 12 Aug 2023, 05:24:43 am »
Thanks man, much appreciated :)  you didnt have to so i really appreciate what you did... :)


I will look up those switches... are they mechanical...   i use a corsair k70 lux and i really like it.  The only thing i dont like is that for such an expensive keyboard for its time the key letters still wear off like a cheap one lol

But i love the clickyness and feel of it, and the keys are molded well for the fingers.   I even have replacement gaming keys for WASD so when gaming i change out the keys and my fingers can feel those keys much better and the way they are shaped it helps hold my fingers in place. 

I wish i would have gotten a RGB but all i got was Red  :(

durangod

  • Sr. Member
  • ****
  • Posts: 364
  • Karma: +5/-0
  • Weebles Wobble - but they dont fall down!
Re: What is JS proposal
« Reply #14 on: 12 Aug 2023, 07:47:24 pm »
hi,   i was curious about something, why is submit in double quotes and nothing else is?   At first i thought it was a number vrs char value but some other others items are char as well.   I was just curious why, is it just because its a submit ?

Code: [Select]
share = {
checkbox : getOrWarn('share_checkbox'),
"submit" : getOrWarn('share_submit'),
it       : getOrWarn('shareit'),
title    : getOrWarn('share_title'),
text     : getOrWarn('share_content'),
url      : getOrWarn('share_url')
};


 

SMF spam blocked by CleanTalk

Advertisement