Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Activity
  • Dec 21 2018 17:11
    @MadLittleMods banned @OmarAlmaqtri
  • Jun 05 2018 23:13
    @MadLittleMods banned @LWSS
  • May 25 2018 16:50
    @MadLittleMods banned @TheRedstoneTaco
Nitin
@thenm
I am trying to implement typeahead on formly form refering this https://stackblitz.com/edit/angular-ngx-formly-ngselect-material-2bj3sf
It was working with static data.
But my code has a http call and not working anyone pls help
pushTypeaheadSearchFormatField(element: any, index: any) {
    this.formFields.push({
      'key': element[index].name,
      'wrappers': ['labelWrapper'],
      'type': 'typeahead',
      'defaultValue': element[index].defaultValue,
      'templateOptions': {
        'type': 'typeahead',
        'key': element[index].name,
        'label': element[index].displayName,
        'required': element[index].isRequired && element[index].isRegulatoryRequirement ? false : element[index].isRequired,
        'isRegulatoryRequirement': element[index].isRegulatoryRequirement,
        'dependencyRules': element[index].dependencyRules,
        'showLookupNotice': element[index].isOptionRequired,
        'optionsUrl': element[index].optionsUrl,
        'changeExpr': 'this.getData($event, field)',
        'isregularatoryProduct': this.isregularatoryProducts(element[index].name),
        'placeholder': 'Typeahead States',
        'search$': (term) => {
          if (term && term.length > 2) {
            this._http.get<any>(AppConstants.wkApiUrl.producerCode).subscribe(result => {
              const product = result.paginationData.map(key => key['name']);
              const filteredProduct = product.filter(v => v.toLowerCase().indexOf(term.toLowerCase()) > -1).slice(0, 10);
              return of(filteredProduct);
            })
          } else {
            return of([]);
          }

          // const states = this.states.map(key => key['name']);

          // if ((!term || term === '')) {
          //   return of(states);
          // }

          // return of(states.filter(v => v.toLowerCase().indexOf(term.toLowerCase()) > -1));

        },
      },
    });
  }


  filterData(result, term) {
    const product = result.paginationData.map(key => key['name']);
    const filteredProduct = product.filter(v => v.toLowerCase().indexOf(term.toLowerCase()) > -1).slice(0, 10);
    return of(filteredProduct);
  }
Rohit Yadav
@rohyadav

anyone help me about javascript with styling . here is my code snippet

https://stackblitz.com/edit/js-dirxdg?file=index.js

i want when complete the bar percentage from the html means it get the percentage from an html and apply it using js dynamically

Julian Gonggrijp
@jgonggrijp
@rohyadav I don't really understand what you're trying to achieve yet. Could you explain a bit more?
Rohit Yadav
@rohyadav

ok, if you check the code snippet UI that have a percentage bar which is completed bar in percentage based on percentage written in html or above in every line. So as of now that is working fine with css. But i am trying to achieve that using javascript .
and remove css when it's coming from javascript

.skills__html {
  width: 60%;
}
.skills__css {
  width: 70%;
}
.skills__js {
  width: 75%;
}
.skills__react {
  width: 90%;
}

@jgonggrijp

Julian Gonggrijp
@jgonggrijp
@rohyadav I see. You can just assign the CSS width as a string to anElement.style.width. For example:
const htmlBar = document.querySelector('.skills__percentage.skills__html');
htmlBar.style.width = '60%';
Rohit Yadav
@rohyadav
@jgonggrijp Yes, but also we have grab percentage from an <span class="skills__number">20%</span>
If you see the JS code in it. so means whatever inside the html grab it and update the style
Julian Gonggrijp
@jgonggrijp
@rohyadav You can obtain the content from the html with anElement.textContent.
Mahdi3989
@Mahdi3989
hey , how i can get better in js?
Julian Gonggrijp
@jgonggrijp
Hey @Mahdi3989 :wave: Mostly by doing! Otherwise, it helps to get familiar with a couple of libraries that you feel are widely useful and that you feel are well designed. Also, practice all the good habits such as version control, testing and debugging.
svimanet
@svimanet:matrix.rongepaadl.com
[m]

:point_up: Edit: Hi, having a bit of a conundrum.
Material-UI/pickers.datepicker has been deprecated (mui-org/material-ui-pickers#2157), and I'm currently at work with a task to do some style changes to and existing picker based on this datepicker. But the style changes would require me to migrate to the new version for a specific override feature (for popover dynamic styling based on props).

Now the question is, should I migrate to @mui/lab and mui v5 in the future, or just avoid mui altogheter and include a vanilla js datepicker (https://github.com/qodesmith/datepicker) to customize. I have to rewrite the component regardless.

What are your toughts on MUI in general? Is it worth the hassle when we have to customize with company styles anyway? I've been on the fence for a while, but am considering to drop it altoghether

Edit: concluded with fuck MUI

svimanet
@svimanet:matrix.rongepaadl.com
[m]

:point_up: Edit: Hi, having a bit of a conundrum.
Material-UI/pickers.datepicker has been deprecated (mui-org/material-ui-pickers#2157), and I'm currently at work with a task to do some style changes to and existing picker based on this datepicker. But the style changes would require me to migrate to the new version for a specific override feature (for popover dynamic styling based on props).

Now the question is, should I migrate to @mui/lab and mui v5 in the future, or just avoid mui altogheter and include a vanilla js datepicker (https://github.com/qodesmith/datepicker) to customize. I have to rewrite the component regardless.

What are your toughts on MUI in general? Is it worth the hassle when we have to customize with company styles anyway? I've been on the fence for a while, but am considering to drop it altoghether

Edit: concluded with fuck MUI
Edit 2: when with this one if anyone cares; https://github.com/wwilsman/Datepicker.js

:point_up: Edit: Hi, having a bit of a conundrum.
Material-UI/pickers.datepicker has been deprecated (mui-org/material-ui-pickers#2157), and I'm currently at work with a task to do some style changes to and existing picker based on this datepicker. But the style changes would require me to migrate to the new version for a specific override feature (for popover dynamic styling based on props).

Now the question is, should I migrate to @mui/lab and mui v5 in the future, or just avoid mui altogheter and include a vanilla js datepicker (https://github.com/qodesmith/datepicker) to customize. I have to rewrite the component regardless.

What are your toughts on MUI in general? Is it worth the hassle when we have to customize with company styles anyway? I've been on the fence for a while, but am considering to drop it altoghether

Edit: concluded with fuck MUI
Edit 2: wentwith this one if anyone cares; https://github.com/wwilsman/Datepicker.js

Roger Luedecke
@Shadowolf7
Why does [...new Set(numbers)] return a clean array with the spread operator, while removing it returns Set(x) { }?
Julian Gonggrijp
@jgonggrijp
@Shadowolf7 What does "it" refer to? And what do you mean by Set(x) { } as a return value?
Roger Luedecke
@Shadowolf7
@jgonggrijp I figured it out. I was trying to understand the different outputs I got when using a spread operator or not as it related to a new Set object.
Marco Colia
@justoverclockl
guys, need a little help from you expert

 extend(DiscussionHero.prototype, 'oninit', function () {

    const GameApi = fetch('https://api.rawg.io/api/games/call-of-duty-modern-warfare?page_size=1&page=1&key=myapi')
      .then(response => response.json())
      .then(data => {
        this.gameDet = data;
        console.log(data)
        console.log(this.gameDet.name)
        console.log(this.gameDet.description_raw)
        console.log(this.gameDet.metacritic)
      })
  })
  extend(DiscussionHero.prototype, 'items', function (items) {
    items.add(
      'aaaa',
      <div className="myclass">
              <div class="myclass">
              // <------------------------------------------------ I WANT TO DISPLAY this.gameDet.name HERE
              </div>
      </div>
    );
  });
3 replies
but i can't access the json from there, console.log shows details correctly
Chris
@Valadone
Hey, someone using knexJS here ?
I can't find how I can retrieve my data from my DB
How I can retrieve everything from my database first
  knexClient.schema.createTable("events", (table) => {
    table.increments();
    table.dateTime("starts_at").notNullable();
    table.dateTime("ends_at").notNullable();
    table.enum("kind", ["appointment", "opening"]).notNullable();
    table.boolean("weekly_recurring");
  });
Marco Colia
@justoverclockl

guys, i have no experience with this, so i need help from an expert developer. i'm currently fetching an api, that return a string. i have this string into a div like:


<p class="card-text" id="google_translate_element">{this.gameDet.description_raw}</p>

there's a way to auto translate this string into navitator.language of the user?

1 reply
Dominic Watson
@intellix
iOS14 - scrollTo(0, 1) keeps Safari Browser UI collapsed
iOS15 - scrollTo(0, 1) causes Safari Browser UI to expand (URL bar etc)
anyone found a way around the new behaviour in iOS15?
cyberquarks
@cyberquarks

Hi I have a quick question

Given this code:

de = () => {
           ce(),
           r.ipcMain.handle("someIPCFunction", (async () => !!oe().someValue))
         }

How can I make it so I can window.alert the value returned by the r.ipcMain.handle("someIPCFunction", (async () => !!oe().someValue))

As such I can see the value returned by r.ipcMain.handle... as it is getting applied.

Just to know what's the response data of the IPC function
Julian Gonggrijp
@jgonggrijp
@cyberquarks if you mean you want to see what's inside oe().someValue, put the alert inside the same callback.
cyberquarks
@cyberquarks
Hi @jgonggrijp I figured it out,
de = () => {
           ce(),
             () => { 
                  let value = r.ipcMain.handle("someIPCFunction", (async () => !!oe().someValue)); 
                  window.alert('something');
                  return value; 
             }
         }
cyberquarks
@cyberquarks
Julian Gonggrijp
@jgonggrijp
@cyberquarks Not on my own, but I've used plyr which worked quite well.
Anurag Vohra
@anuragvohraec
Hi do any one know how to "setTimeout to break an "for await ...of" loop, if loop do not complete within a given time?"
https://stackoverflow.com/questions/69541047/javascript-settimeout-to-break-an-for-await-of-loop-if-loop-do-not-comple
Marco Colia
@justoverclockl
guys anyone know why i can't access my json data into the div?

 extend(CommentPost.prototype, 'oncreate', function () {

    let AmILoggedIn = app.session.user;
    if (AmILoggedIn) {

      const ipApi = fetch('https://ipinfo.io/json?token=MYAPIKEY')
        .then((response) => response.json())
        .then((data) => {
          this.ipData = data;
          console.log(data)
        })
        .catch((error) => console.log('Something went wrong...'));
    }
  })
  extend(CommentPost.prototype, 'headerItems', function (items) {
    items.add(
      "ipinfo",
      <div className="ipinfo" id="countryCode">{ipData.country}</div>
    )
  })
ipData is not defined
Julian Gonggrijp
@jgonggrijp
@justoverclockl Probably because headerInfo is being invoked before the response arrives. Bit difficult to be sure, though, because I'm not familiar with this coding style. Is this some flavor of React?
Marco Colia
@justoverclockl
@jgonggrijp is a forum platform based on extenders.
Marco Colia
@justoverclockl
and what about this? i cant display json output into the div

 extend(CommentPost.prototype, 'headerItems', function (items) {
    const giveMeInfo = fetch("https://ipinfo.io/json?token=mykey")
      .then((response) => response.json())
      .then((data) => {
        this.ipInfo = data;
        console.log(this.ipInfo.country)
        const flagImage = 'http://purecatamphetamine.github.io/country-flag-icons/3x2/' + data.country.toUpperCase() + '.svg';
      },
    items.add(
      "ipinfo",
      <div className="ipinfo" id="countryCode"></div>
    ))
  })
});
<div className="ipinfo" id="countryCode">{this.ipInfo.country}</div> not work
Julian Gonggrijp
@jgonggrijp
@justoverclockl Now you're passing the items.add expression as the second argument to the final then, which is almost certainly not what you want. You can try this instead:
extend(CommentPost.prototype, 'headerItems', function (items) {
  const giveMeInfo = fetch("https://ipinfo.io/json?token=mykey")
    .then((response) => response.json())
    .then((data) => {
      this.ipInfo = data;
      console.log(this.ipInfo.country)
      const flagImage = 'http://purecatamphetamine.github.io/country-flag-icons/3x2/' + data.country.toUpperCase() + '.svg';
      items.add(
        "ipinfo",
        <div className="ipinfo" id="countryCode">{this.ipInfo.country}</div>
      );
    });
});
Anurag Vohra
@anuragvohraec
Stephen James
@sjames1958gm
Interesting proposal. Running a spell check on it would be a good idea. Thinking maybe () rather than [] might be an option
Mayank Aggarwal
@Mayank0255_twitter
https://twitter.com/Mayank0255
Soon will start sharing some dev related stuff🎉
Metheny80
@Metheny80
Is there any way to manipulate dates/times (add, subtract days to dates etc.) without having to deal with timezones? I know about UTC, but it seems wrong as what I really need is the local time only without the timezone. Is that possible?
Julian Gonggrijp
@jgonggrijp
@Metheny80 Sure. If you mean you're looking for a library that can do it, consider Moment.js or one of the alternatives mentioned on its status page.
Pedro Ávila
@aviladev
@Metheny80 personally I like date-fns beacause of their functional approach.
Metheny80
@Metheny80
@jgonggrijp I know about moment.js, but the date always contains the timezone. For example, let's say I want to get the current local date without the timezone. How do I do it?
Julian Gonggrijp
@jgonggrijp
@Metheny80 what exactly do you mean by a date without a time zone? What problem are you trying to solve?
Metheny80
@Metheny80
@jgonggrijp the front end needs to load the date and display it the same, wherever in the world the page is loaded. If a person in the US chooses July 7th at 1 AM and saves it (in the DB), and another person views the page in Europe, I still want it to be displayed as July 7th at 1 AM (the location doesn't matter)
I think when loading a Date object, it always tries to figure out the local time according to the device's timezone, but I don't want that