Posts

Showing posts with the label javascript

AngularJS compare two (scope) arrays and only POST the 'non-same' result (2018)

Image
Clash Royale CLAN TAG #URR8PPP AngularJS compare two (scope) arrays and only POST the 'non-same' result (2018) I have two arrays that i like to compare on the ID, if the ID from one array does not exist in the other i will add it with the Http Post. This is the build up: $scope.Games = [{id:1,Name:"BatMan"}, {id:2,Name:"SpiderMan"}, {id:2,Name:"Hulk"}]; $scope.NewGames = [{id:1,Name:"BatMan"}, {id:2,Name:"SpiderMan"}, {id:3,Name:"Hulk"}, {id:4,Name:"DeadPool"}, {id:5,Name:"IronMan"}, , {id:6,Name:"DrStrange"}]; so i load all the Games and NewGames with a GET in the two $scopes Now i would like to compare the two on the id_game, so i was thinking of something like this but can't get it to work, the http section works find however without the indexOf, it will add...

Mapped color transformation on cors tainted image

Image
Clash Royale CLAN TAG #URR8PPP Mapped color transformation on cors tainted image I need to transform colors in an image obtained from an s3 server which disallows crossOrigin. This is the functionality I need: const img = new Image(); img.src = src; ctx.drawImage(img, 0, 0); const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height); const colors = [25,50,100,255]; const data = imageData.data; for (let i = 0; i < data.length; i += 4) { if(data[i] == 1){data[i] = colors[1]} if(data[i] == 2){data[i] = colors[2]} if(data[i] == 3){data[i] = colors[3]} } but got tainted by crossOrigin error: I know I can not use getImageData in this case. I don't want to read the image data. getImageData But maybe complete my task through some other webGL / canvas operation? Rendering on a server or proxying is not possible. Possible duplicate of How to fix getImageData() error The canvas has been tainted by cross-origin data? ...

How to enable alert in iOS Safari?

Image
Clash Royale CLAN TAG #URR8PPP How to enable alert in iOS Safari? I have some alert dialog using Javascript. I found when using Safari browser under iOS, it was disabled. I am wondering if this is the standard behavior of Safari and how to enable the alert? which version of ios, safari. Give more details. Whats your code like, is it compiled to js or is it raw js ? – WilomGfx 8 mins ago JavaScript and Java are different my dude. Check your tags – Jacob B. 7 mins ago By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privac...

How to upload assets to AWS presignedurl from ClientSide javascrript

Image
Clash Royale CLAN TAG #URR8PPP How to upload assets to AWS presignedurl from ClientSide javascrript I am approching presignedUrl method to upload a large file . I call an API from my angular code to server side which gives me presignedUrl , then I need to upload an URL . I have some question on this 1) Is there need to AWS SDK on my Angular side ? I assume I dont need it , I just sent PUT request to unsigned URL and file uploadfileAWSS3old(e,f){ const formData = new FormData(); formData.append("data",JSON.stringify({name:"testname"})); formData.append("file", f.files[0]); let contentType = f.files["0"].type; const headers = new HttpHeaders( { 'Content-Type': contentType }); const req = new HttpRequest('PUT',this.URL,formData, { headers: headers, reportProgress: true, //This is required for track upload process }); console.log(req) this.http.r...

console.log(this) in global scope returns undefined

Image
Clash Royale CLAN TAG #URR8PPP console.log(this) in global scope returns undefined I have created a script which logs the this variable to the console in the global scope. If I launch the script in the browser it returns undefined. eg. console.log(this); //returns undefined However if I enter the same command directly in the browser console it returns the window object. Which is what I was expecting. eg. console.log(this); //returns Window {postMessage: ƒ, blur: ƒ, focus: ƒ, close: ƒ, frames: Window, …} console.log(this); //returns Window {postMessage: ƒ, blur: ƒ, focus: ƒ, close: ƒ, frames: Window, …} Why is the behavior/output of logging 'this' to the console different in the browser console and different while expecting the output from a script? By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued...

How can you increment a number on scroll without having the scrollbar(actually scrolling)?

Image
Clash Royale CLAN TAG #URR8PPP How can you increment a number on scroll without having the scrollbar(actually scrolling)? So, imagine 2 sections/divs (both with width: 100% and height: 100% ). I only see the first section, the second section is to the right side of the screen, unable to be seen(overflow: hidden; on the body). width: 100% height: 100% Now, when I scroll, I want that second section to appear gradually, with each pixel I'm "scrolling". But, the problem here is, I can't actually scroll, thus properties such as this: window.pageYOffset , element.getBoundingClientRect() do not work. Basically, I want to increment a number each time I do a scrolling gesture, so I can assign that number to the second section( to modify its left property so it can come in the viewport ). And I don't know how to increment the number. window.pageYOffset element.getBoundingClientRect() This is a recreation of what I'm trying to accomplish: var secondSection = document.g...

Bootstrap 4 Modal - Menu

Image
Clash Royale CLAN TAG #URR8PPP Bootstrap 4 Modal - Menu a { color: inherit; text-decoration: inherit; } a:hover { color: inherit; text-decoration: inherit; } body { font-family: 'Roboto Condensed', sans-serif; } /* ---------------------------------------------------- */ /* navigation */ .navbar-toggler:focus, .navbar-toggler:active { outline: none; border: none; box-shadow: none; } .menu { padding-left: 10px; } .fa-bars, .menu { color: #006699 !important; } .navbar-text { color: gray; } .mainlink { font-size: 1.75em; line-height: 1.25em; font-weight: 400; } .sublink { font-size: 1em; line-height: 1.15em; } .navbar-toggle { margin-left: 15px; margin-right: 0; } .modal-nav-content { /* width: 100%; */ height: auto; } .modal-nav-body { margin-top: 10em; } .modal-nav-body p { color: white; margin: 0; padding: 0; padding-top: 6px; padding-bottom: 6px; /* width: 100%; */ } .modal-nav-body h5 { color: white; line-...

How I can change structure of multiple arrays to array objects Node.js?

Image
Clash Royale CLAN TAG #URR8PPP How I can change structure of multiple arrays to array objects Node.js? community. (Variable file contains array of URL .json files). I get common file get.json who contains all files from subdirectories in structure (yeap, I know it's not a valid JSON): [ {name: "John"} ] [ {name: "Sergei"} ] One file contains only [ {name: "John"} ] And I want get this file in this structure: [ {name: "John"}, {name: "Sergei"} ] My code recursive(`${dirPath}`, ['delete.json', 'put.json'], function (err, file) { const write = fs.createWriteStream(`${dirPath}/get.json`); file.forEach(item => { fs.createReadStream(item).pipe(write); }) write.on('finish', () => { fs.createReadStream(`${dirPath}/get.json`).pipe(res); }) }); [ {name: "John"}] [ {name: "Sergei"}] is not valid JSON. Is your sample data wrong, or are you asking ho...

How to correctly map a set of data onto a table using React

Image
Clash Royale CLAN TAG #URR8PPP How to correctly map a set of data onto a table using React I am trying to map data to the correct columns using react and am struggling to get everything to display in the correct column. Here is my data structure which consists of an array of data - in this original array each object has a norm_data and and feature_data key - which again consists of an array of data with the same keys. [ { "norm_data": [ { "avg": 0, "panelist": 0, "feature": "Headline", "exists": false }, { "avg": 0, "panelist": 0, "feature": "Small Print", "exists": false }, { "avg": 0, "panelist": 0, "feature": "Call to Action", "exists": false }, { "avg": 0, ...

jQuery creating a multidimensional array on the fly

Image
Clash Royale CLAN TAG #URR8PPP jQuery creating a multidimensional array on the fly I'm trying to use jQuery to create the below sample array I want to output: [["foo0","foo1"],["foo2","foo3","foo4"],["foo5"]] Code I'm trying to use: var counter = 0; var arr = ; $('.unknown-number-of-elements').each(function(){ var keyNumber = $(this).val(); var valToPush = "foo"+counter; if(keyNumber in arr){ arr[keyNumber].push(["'"+ valToPush +"'"]); }else{ arr[keyNumber] = valToPush; } counter++; }); console.log(arr); The code above is giving the following error: Uncaught TypeError: arr[keyNumber].push is not a function Basically if the array key already exists I would like to create a sub array and add values to that sub array. Check this, there is no in operator in javascript – Durga ...

TypeError: Cannot read property 'map' of undefined ReactJS API calls

Image
Clash Royale CLAN TAG #URR8PPP TypeError: Cannot read property 'map' of undefined ReactJS API calls I have recently been trying to play with APIs in React.js, I believed the below code would have worked, based on a tutorial from https://reactjs.org/docs/faq-ajax.html, However when I run this code I keep getting TypeError: Cannot read property 'map' of undefined Below is my code, this is a component called DOTA and is exported to my App.js import React from 'react'; const API_KEY ="some-api-key"; const DEFAULT_QUERY = 'redux'; class DOTA extends React.Component { constructor(props) { super(props); this.state = { error: null, isLoaded: false, info: , }; } componentDidMount() { fetch(API_KEY + DEFAULT_QUERY) .then(response => response.json(console.log(response))) .then((result) => { console.log(result) this.setState({ isLoaded: true, info: result.i...

Query firebase to return if value more then number

Image
Clash Royale CLAN TAG #URR8PPP Query firebase to return if value more then number I want to get data from Firebase. This is more or less my db structure: "Reports" : { "N06Jrz5hx6Q9bcVDBBUrF3GKSTp2" : 2, "eLLfNlWLkTcImTRqrYnU0nWuu9P2" : 2 }, "Users":{ "N06Jrz5hx6Q9bcVDBBUrF3GKSTp2" : { "completedWorks" : { ... }, "reports" : { "-LHs0yxUXn-TQC7z_MJM" : { "category" : "Niewyraźne zdjęcie", "creatorID" : "z8DxcXyehgMhRyMqmf6q8LpCYfs1", "reportedID" : "N06Jrz5hx6Q9bcVDBBUrF3GKSTp2", "resolved" : false, "text" : "heh", "workID" : "-LHs-aZJkAhEf1RHVasg" }, "-LHs1hzlL4roUJfMlvyA" : { "category"...

Fill Selectize optgroup columns with AJAX in Laravel

Image
Clash Royale CLAN TAG #URR8PPP Fill Selectize optgroup columns with AJAX in Laravel I'm trying to assign attributes to product at client-side using Selectize . In Laravel , against Ajax request, I'm returning a JSON object from Controller as shown below: Selectize Laravel Ajax JSON $attribs = AttributeClass::find($request->id)->attributes; $attributes = array(); foreach($attribs as $attrib){ $options = array(); foreach($attrib->options as $opt){ $options = array( 'id' => $opt->id, 'name' => $opt->name ); } $attributes = array( 'id' => $attrib->id, 'name' => $attrib->name, 'options' => $options ); } return response()->json([ 'attributes' => $attributes ]); The JSON output looks something like this: JSON "{"attributes...

How to openRow (leftSwipe) dynamically in react native

Image
Clash Royale CLAN TAG #URR8PPP How to openRow (leftSwipe) dynamically in react native I am using react-native-base to swipable list. As per the code below, Every row will have "md-remove-circle" icon and I want to open row (leftSwipe) by clicking on the "md-remove-circle" icon. It is possible to openRow dynamically by function call ? <List dataSource={this.ds.cloneWithRows(this.state.listViewData)} renderRow={ (data, secId, rowId, rowMap) => <ListItem style={{borderBottomWidth: 1,marginLeft: 0, backgroundColor : data.rowBg}}> <Left> { this.state.rmvCircle && <Icon onPress={()=>this.openCurrenRow()} style={{color:'red'}} name="md-remove-circle" /> } <TouchableOpacity onPress={()=>this.redir(data)}> <Text> {data.text} </Te...

switch-case with many conditions

Image
Clash Royale CLAN TAG #URR8PPP switch-case with many conditions I'm using switch construction instead of if statement because I have more than one repeated statements where if statement doesn't wrong. But it couldn't be calculated properly. Where am I wrong? The switch construction is not working. I used the console and the function sumUpNewCar worked right. therefore, I would like to execute all the sums in the box switch if statement if statement switch function sumUpNewCar function sprSelection() { var sprCompleted = document.getElementById("sprCompleted"); var sprDoesntCompleted = document.getElementById("sprDoesntCompleted"); if(sprCompleted.checked) { sprDoesntCompleted.disabled = true; } else if(sprDoesntCompleted.checked) { sprCompleted.disabled = true; } else { sprDoesntCompleted.disabled = false; ...