“user validation failed: passsword: Path `passsword` is required.”

Here is my Mongoose model:

    const mongoose=require('mongoose')

const userSchema=new mongoose.Schema({
    firstName:{
        type:String,
        required:true
    },
    middleName:{
        type:String,
    },
  
    lastName:{
        type:String,
        required:true,
    },
    passsword:{
        type: String,
        required: true,
    },
    email:{
        type:String,
        unique:true,
        sparse:true
    },
    phoneNumber:{
        type:Number
    },
    address:{
        permanentAddress:String,
        temporaryAddress:[String]
    },
    gender:{
        type:String,
        enum:['male','female','others']
    },
    dob:{
        type:Date
    },
    country:{
        type:String,
        default:'Nepal'
    },
    image:{
        type:[String]
    },
    role:{
        type:Number,
        default:2
    },
    isArchived:{
        type:Boolean,
        default:false
    },
    status:{
        type:String,
        enum:['active','inactive','frequent'],
        default:'active'
    },
    passwordResetTOken:String,
    passwordResetTokenExpiry:String
})


const userModel=mongoose.model('user',userSchema)
module.exports=userModel

The controller is:

    function insert(data){
    return new Promise(function(resolve,reject){
        const newUser=new userModel
        newUser.password = passwordHash.generate(data.password)
        newUser.firstName=data.firstName
        newUser.lastName=data.lastName
        newUser.dob=data.dob
        console.log("new user is",newUser.password)
        console.log("mapped user is",newUser)
        newUser.save(function(err,done){
             if(err){
                 return reject(err)
             }
             console.log("user is",done)
             resolve(done)
         }) 
    })

}

I am getting error:


                    "name": "ValidatorError",
                "message": "Path `passsword` is required.",

But req.body has:

     {
  firstName: 'rajiv',
  lastName: 'dahal',
  password: 'admin',
  dob: '2021/03/03'
}

What is my mistake?

Shoutcast artwork image

I am trying to create a custom artwork image using shoutcast server information and api services, that updates itself automatically about the title and artwork of the current streaming audio/artwork.

I would like to put the artwork on my website in circle 150x150px with blue border of 7px and with small cube 50x50px into cube png/jpg image for radio channel.

I would like visitors to see the current streaming audio information: singer name – song title and artwork from singer.

Shoutcast does have an API but in some case i was using already some php codes and plugins but most of them didn’t recronize the artwork image only some players like luna player recronize all images but in my case i dont need player. I searched around internet and most of the answes for the shoutcast code etc i found on this site.

Also i try to find does anyone asking for the same solution like mine on this site but i didnt found any solution and thats why im asking for help/solution and how can i make that.

I know there are some PHP solution, but since I do not know the language I could not find out their solution how to do that.

Most of the people which i try to get help from other sites like freel**cer they first time listen for shoutcast server, most of them ask me does shoutcast has php asp or zlib extentions, most of them think that shoutcast is some php server.
Thats why i registered here and i hope guys you can help me.

Could please provide some examples or hints about how to get the current track title, artwork, even possibly the artwork image from some api service, and if artimage was not found to be shown by default radio logo?

Im showing example how I would like to make it.

Thanks in advance.

Uncaught TypeError: Cannot read properties of undefined (reading ‘items’)

I’m testing the call but I keep getting the error uncaught type Error. it says the error is when i call data.tracks.items.

It says the error is at Object.success, at i, at Object.fireWith, at z, at XMLHttpRequest

  console.log('hello world');

  $('form').submit(function(event) {
    event.preventDefault();
    
    let query = $('input').val();
    let context = $('input[name="context"]:checked').val();
    
    $.get('/search?' + $.param({context: context, query: query}), function(data) {
      $('#results').empty();
      $('input[type="text"]').val('');
      $('input').focus();
      
      data.tracks.items.forEach(function(track, index) {
        let trackSearch = "https://open.spotify.com/track/";
        let newElement = $('<a onClick="getFeatures(&apos;' + track.id + '&apos;)" target="_blank"></a><br>').text(track.name + '   |   ' + track.artists[0].name).attr('href', trackSearch + track.id);
        $('#results').append(newElement);
      });
    });
  });
}); ```

How to display text when hover over videos/images

My image and videos are blurred whenever they are hovered over. Now, I also want them to both blur and display text whenever I hover over. I have tried to use hover for both but only the blur part is applicable so far. I also want the text to be able to resize accordingly with the video box so that when scaling down, it will resize accordingly. Thank you very much !

Code so far:

html{
    margin:0;
    padding: 0;
    font-size:62.5%;
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: grayscale;
}

*{
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

.header{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding: 1rem;
    z-index: 100;
}

.wrapper1{
    display:flex;
    flex-direction: row;
    justify-content: flex-start | center | flex-end;
    margin: 0;
    height: 100%;
    width:100%;
}

h4{
    display:block;
    font-size: 1.5em;
    margin-block-start: 0.83em;
    margin-block-end: 0.83em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-family: 'Roboto Mono', monospace;
    z-index:50;
}

.type2{
    text-align: left;
    margin-left: 10rem;
    margin-right: 10rem;
    animation: fadein 2s;
    -moz-animation: fadein 2s; /* Firefox */
    -webkit-animation: fadein 2s; /* Safari and Chrome */
    -o-animation: fadein 2s; /* Opera */
}

@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

body{
    margin:0;
    padding: 0;
    width: 100%;
}

.main{
    padding:0;
    margin:0;
}

.wrapper{
    overflow-y:hidden;
    overflow-x:auto;
    margin: 0;
    height: 100%;
    width:100%;
}









@media only screen and (max-width: 1000px){
    .type2{
       display: none;
    }

    .type1{
        font-size: 24px;
    }
}


video{
    display: block;
    margin-bottom: 1em;
    object-fit: contain;
}

.main-section{
    display:flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    padding: 0;
    margin: 0;
    top: 25%;

}

.main-section div{
    flex:1;
}



.vid_vertical{
    position: absolute;
    height: auto;
    width: 20%;
}

.vid_1{
    position: absolute;
    left: 25.5%;

    z-index: 1;

}

.vid_1:hover {
    filter:blur(10px);
}

.type_ins: hover{
    display: block;
}



.type_ins{
    font-size: 0.7vw;
    position: absolute;
    left: 30%;
    z-index: 50 !important;
    text-align: center;
    display: none;    
}
.vid_2{
    positon: absolute;
    left: 50% ;
    z-index:2;
}

.vid_3{
    positon: absolute;
    left: 148%  ;
    z-index:3;

}

.vid_4{
    positon: absolute;
    left: 74%  ;
    z-index:3;

}

.vid_5{
    positon: absolute;
    left: 98%  ;
    z-index:3;

}

.vid_6{
    positon: absolute;
    left: 122.5%  ;
    z-index:3;

}


.img1{
    position: absolute;
    height: auto;
    width: 20%;
    left: 0;
    z-index:0;
}
<html>
    <head>
        <meta name="viewport" content="user-scalable=no,initial-scale=1,maximum-scale=1,minimum-scale=1,width=device-width">        
        <meta charset="utf-8">
        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <meta charset="utf-8">
        <link rel="stylesheet" href="Interactive story.css">
        <title>Interactive Storytelling</title>
       
    </head>

    <body>
      
        <div class="main">
            <div class="header">
                <div class="wrapper1">
                    <div class="type1">
                        <h4>2019</h4>
                    </div>
                    <div class="type2">
                         <h4>I came to Toronto in August 2018 so we (me and my friend)
                            adopted Hershey when we were still in our first year. <br>
                            Before adopting Hershey, we nearly got scammed by buying a dog with a cheaper price so we decided to adopt rather than buying.<br>
                            She was actually our second choice, the first one having a lot of medical issues so we had to move on.<br>
                            I think she chose us actually because of all the people who wanted her, we were the only one whom she didn't hiss at. </h4>


                    </div>
                </div>
            </div>


        <section>
            <div class="wrapper">
                
                <div class="main-section">
          
                   
                  
                    <video class="vid_vertical vid_1" autoplay loop muted preload playsinline>
                        <source src="IMG_1362.mp4" type="video/mp4">    
                    </video>

             

                
                    <video class="vid_vertical vid_2"  autoplay loop muted preload playsinline>
                        <source src="IMG_1364.mp4" type="video/mp4">
                    </video>

                    <video class="vid_vertical vid_3"  autoplay loop muted preload playsinline>
                        <source src="IMG_1832.mp4" type="video/mp4">
                    </video>
                    
                    <video class="vid_vertical vid_4"  autoplay loop muted preload playsinline>
                        <source src="1080p.mp4" type="video/mp4">
                    </video>

                    <video class="vid_vertical vid_5"  autoplay loop muted preload playsinline>
                        <source src="IMG_1381.mp4" type="video/mp4">
                    </video>

                    <video class="vid_vertical vid_6"  autoplay loop muted preload playsinline>
                        <source src="IMG_1391.mp4" type="video/mp4">
                    </video>






                    <img src="IMG_1275_2.jpg" class="img1">

                </div>
            </div>

        </section>
        
        </div>  

       
              

        <script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
        <script src="Interactive story.js"></script>

        <!-- <section>
            <div class="wrapper">
                <div class="vid">
                    <iframe id="vid_vertical" class="vid_2" autoplay loop muted preload playsinline>
                        <source src="IMG_1363.MOV" type="video/mp4">
                    </iframe>
                </div>
            </div>
        </section> -->


    </body>

Pushing items into array not working inside of jquery POST [duplicate]

my post was just deleted and they linked AJAX asynchronosity which didn’t help at all and is completely unrelated to my problem.

My problem is that I cannot push ITEMS, into my array using .push when it’s inside of a POST and not ajax…

CODE:

var rolearray = [];
$.post(
  "https://URL/getRoleData", 
  JSON.stringify({ businessid: $(this).data('businessid') }), 
  function(roles){
    $(roles).each(function(e) {
      rolearray.push({label: roles[e].role, value: roles[e].role})
    })
  }
)

This time please don’t just dismiss it. Cause the thread linked didn’t help.

Also yes the post is returning data.. For each is working as intended but it won’t push my values after it’s returned the result.

Timestamp field from firestore showing an invalid date if the field does not exist

These are my codes. selectedDate is a timestamp field:

<ListItemText
                          primary={
                            new Date(
                              user.items?.selectedDate?.seconds * 1000
                            ).toDateString() +
                            " at " +
                            new Date(
                              user.items?.selectedDate?.seconds * 1000
                            ).toLocaleTimeString()
                          }
                    />

It does show the data correctly. However, if the selectedDate does exist, it will show:

Invalid date at Invalid date

How can I fix this?

Is there a way to find only unused JSDoc type definitions?

For example:

/**
 * A number, or a string containing a number.
 * @typedef {(number|string)} NumberLike
 *
 * Dummy type
 * @typedef {(string|null)} StringLike
 */

/**
 * Set the magic number.
 * @param {NumberLike} x - The magic number.
 */
function setMagicNumber(x) {
}

As you can see NumberLike is used, but the StringLike type is not used and I’d like to find all such unused type definitions on our project. It’s a Nodejs project with typescript installed.

Here’s our tsconfig.json file:

{
  "compilerOptions": {
    "baseUrl": ".",
    "jsx": "react",
    "allowJs": true,
    "checkJs": true,
    "target": "ESNext",
    "noEmit": true,
    "moduleResolution": "node",
    "isolatedModules": true,
    "esModuleInterop": true,
    "resolveJsonModule": true,
    "strictNullChecks": true,
  },
}

How can I filter these JSON data where it check if category 1 and 2 is true and that the selectedDate exist?

I have this sample JSON data:

[
  {
    category: {
      selectedDate: { seconds: 1639903368, nanoseconds: 392000000 },
      category1: true,
      category2: true
    },
    name: "Sample 1"
  }
];

There are some cases where category1 and category2 are true, but the selectedDate is not present there. So how can I filter these where category 1 and category 2 are true and that the selectedDate exist?

These are my codes, however, this would not filter correctly.

 const filter = users.filter(
    (f) =>
      f.choices.category1 == true &&
      f.choices?.category2 == true &&
      f.choices?.selectedDate !== null
  );

  console.log(booster);

In Adobe Illustrator, How to change white color of Edittext to transparent with javascript when it is active

enter image description here

I want to change white color to transparent when the edittext is active.
Please help me.

w.alignChildren = ["fill","fill"];
w.preferredSize = [150, 250];
w.inputBox = w.add('panel', undefined, "Input Box");

w.inputBox.add('statictext{text: "Height: "}');

var heightInput = w.inputBox.add('edittext {characters: 12, active: true}');

w.inputBox.add('statictext{text: "Width: "}');

var widthInput = w.inputBox.add('edittext {characters: 12, active: false}');

w.inputBox.add('statictext{text: "Spine: "}');

var spineInput = w.inputBox.add('edittext {characters: 12, active: false}');

w.inputBox.add('statictext{text: "Joint: "}');

var jointInput = w.inputBox.add('edittext {characters: 12, active: false}');

var okBtn = w.add("button", undefined, "Draw");

How to add more objects to an array of objects continuing the numbering but not start over?

I have this minor issue but I’m so close.

I have a Array of Objects with 100 OBJECTS in it. [0-99]

I want to add another 100 or more objects to the end of the current object 99.

What I’m getting is [0-99], 100: [0-99]

Let me show you the code:

addEntry = (newEntry) => {

    let newSortedData = [];

    // Parse any JSON previously stored in allEntries
    let existingEntries = JSON.parse(sessionStorage.getItem("magic1")).data;
    if (existingEntries === null) {
        existingEntries;
    }
    sessionStorage.setItem("magic1", JSON.stringify(newEntry));
    // Save allEntries back to local storage
    existingEntries.push(newEntry[0].data);

    console.log("existing entries with push for new ones: ", existingEntries);

    table.clear().draw();
    newSortedData.push(existingEntries);
    table.rows.add(_.sortBy(newSortedData, "title")); // Add new data
    table.columns.adjust().draw(); // Redraw the DataTable

    console.log("Existing and new ones sorted: ", newSortedData[0].data);

    sessionStorage.setItem("magic1", JSON.stringify(newSortedData[0].data));

};

What I’m getting is this:

magic1 starts out with 100 OBJECTS in the array. Where I’m getting the data from, there are 7000 items/products. I’m using a PHP to pull the data from the source. They only come in pages 1 – 70 with 100 objects in each page. hence, 7000 objects. It’s a BIZARRE way of me having to do this but I have to PING the server going past 100, 201, 301, 401, 501, 601, and so on, through all 70 hits to the server, 100 items at a time. They just can’t give me a getRowcount() as rowcount from the SQL. I have to continually ping or hit the server until I get a number of items LESS than 100 meaning, I’ve hit the last page of less than 100.

Here’s what the end of one array looks like and the beginning of the new one.

All I want to do is to KEEP appending the additional pages to continue the count with 100, 101, 102, all the way to 199. Then 200, 201, 201 – 299 and so on. Apparently obj.push(newObj) does what you see in the pic.

enter image description here

How to call external function in chain function?

This is a case about React and Dapp.

I call web3j to sendTransaction and wait callback by chian fucntion.
While error occur , I can’t call the function inside App.

I descibe the situations below codes around error block.

Is it possible to call function handleError?

//My code
class App extends Component {
    constructor(props) {
        super(props);
            this.state = {
            status: ''
            };
    };
    
    startTrade(){
        web3.eth.sendTransaction({
            from: "0x123....",
            to: "0x456....", 
            value: web3.utils.toWei("2", "ether"),
        }).on('error', (error)=>{
            
            //If write this line,the browser shows directly:
            //Failed to compile
            //srcApp.js
            //Line 62:7:  'handleFail' is not defined  no-undef     
            
            //handleError(); 
            
            //If add this. when error occurs,the console shows:
            //App.js:62 Uncaught TypeError: Cannot read properties of undefined (reading 'handleFail')
            
            //this.handleFail();

            //If I call otherHandle,It's work.
            //However I don't have the instance of App to change something...
            //otherHandle();
        }); 
    }
    handleError(){
       console.log("Do something..");
    }
    render(){ return();
    }
}
function otherHandle(){
    console.log("Do something..");
}

JavaScriptt React Issues with passing prop from a function in a child array to a function in the parent

I’m dealing with a problem passing a prop to a parent component from it’s child.

The idea of the code that I’m trying to make work is a set of buttons in a header component that when clicked, load new component pages for other parts of the website. I’m dealing with a couple of smaller bugs that I can fix at another time but the primary issue is when I try to pass the results of the function for handling the switch and the values showing as ‘undefined’ once they get to the App component. I doubt I’m explaining it well so allow me to show the code.

Parent Component (App)

import React from "react";
import Header from "./Components/Header/Header";
import Footer from "./Components/Footer/Footer";
import Pane from "./Components/Pane/Pane";
import MainPane from "./Components/Pane/MainPane";
import BookViewPane from "./Components/Pane/BookViewPane";
import AddBookPane from "./Components/Pane/AddBookPane";
import SignInPane from  "./Components/Pane/SignInPane";
import "./App.css";

const App = ()=>{

    function LoadPaneHandler(props){
        var NewPaneName=props.paneName;

        // const NewPaneName={
        //  name: props.paneName
        // };
        
        // const NewPaneName=String(props);

        console.log(NewPaneName);
        switch(NewPaneName){
            case 'MainPane':
                return <MainPane />
            case 'AddBookPane':
                return <AddBookPane />
            case 'BookViewPane':
                return <BookViewPane />
            case 'SignInPane':
                return <SignInPane />
            default:
                return <Pane />
        }
    }

    return(
        <React.Fragment>
            <Header switchPane={LoadPaneHandler} />
            <main>
                <LoadPaneHandler paneName="MainPane" />
            </main>
            <Footer />
        </React.Fragment>
    );
}

export default App;

Child Component (Header)

import React from "react";
import "./Header.css";

const Header=(props)=>{
    var paneName="";

    const switchPaneHandler=event=>{
        event.preventDefault();
        console.log(paneName);
        props.switchPane(paneName);
    }

    return(
        <header id="header">
            <div id="header-title">
                <h1>Library</h1>
            </div>
            <div id="header-buttons">
                <button onClick={paneName="BookViewPane",switchPaneHandler}> View Books</button>
                <button onClick={paneName="AddBookPane",switchPaneHandler}> Add Books </button>
                <button onClick={paneName="SignInPane",switchPaneHandler}> Login</button>
            </div>
        </header>
    );
}

export default Header;

I’ve included the commented out code of other approaches I’ve used to get the data I need for the function to work properly so that you can have an Idea of what I’ve already tried.

The code works fine so long as I only pass values to the function from within the App component. Whenever I click on one of the buttons in the header though, it shows the ‘paneName’ correctly in the ‘switchPaneHandler’ function but then in ‘LoadPaneHandler’ it prints as ‘undefined’.

I’m still quite new to React so it’s likely a very obvious mistake that I’ve made but any help is appreciated all the same. Thanks!