These are chat archives for FreeCodeCamp/HelpFrontEnd

14th
Nov 2017
Rodney Chism
@rodchsm
Nov 14 2017 00:10

https://codepen.io/rodchsm/pen/POmBje

Does anyone know why I cant get three images across the webpage and the text under the image to center?

Long Nguyen
@longnt80
Nov 14 2017 00:37
@leanjunio props is data from the parent component, so the component cannot change it
state is data of the component itself, so the component can change the state by using setState
dinesh
@1532j0004kg
Nov 14 2017 00:42
give <center >
@rodchsm
Christopher Brown
@ChrisBrownie55
Nov 14 2017 01:28
@ingundela you’re using block quotes wrong, when you scroll down your fixed nav goes from transparent to solid but there is no transition it’s not fluid. Trying using bullet points to separate your content into smaller more readable sections that people won’t skip past. Justified doesn’t look that good. They don’t need descriptions of what web development is, instead tell them about what you can do. “Visit Websites” should be “Visit Website”. Your icons at the bottom aren’t circles, they’re all squished on my phone. You need to include a picture of yourself and tell them more about what it is that you can do
Sorin Ruse
@sorinr
Nov 14 2017 02:34

@rodchsm this css:

.featuredimage {
    text-decoration: none;
    vertical-align: bottom;
    display: flex;
  flex-wrap: wrap;
  justify-content: space-between;

}
.featuredimage a{

  flex-basis: 33%;
 text-align: center;
}
.featuredimage a img {
    border: 1px solid #000000;
    width: 30%;
    margin-right: 1%;
    clear: right;
    border-radius: 5px;
    margin-left: 2%;
/*     float: left; */
/*     display: block; */
}

will help you have them as you want

Randy
@rdavidson3
Nov 14 2017 03:33
Hello all can I ask anyone for thoughts on my codepen?
Tom
@moT01
Nov 14 2017 03:42
@rdavidson3
ask
Tom
@moT01
Nov 14 2017 03:44
tribute page
Randy
@rdavidson3
Nov 14 2017 03:44
I am trying to keep the top text at level with the photo so that it does not move beyond the end of the photo. At the same time I am trying to make sure the page resizes depending on what is being used to view it
yes
yes
Thank you for replying. I don't really have anyone to check over my work so I'm grateful
Tom
@moT01
Nov 14 2017 03:46
it's kind of encouraged to just ask
someone may not be around to reply right away, but they might come aroun
d
Randy
@rdavidson3
Nov 14 2017 03:47
that's good to know I've been working solo for a while now. It can be maddening to not know if you're doing things right lol
Tom
@moT01
Nov 14 2017 03:47
so make sure the page resizes - meaning responsive
you're using all bootstrap which is great with that
you can see the content will display pretty good if you resize the window (make it small)
Randy
@rdavidson3
Nov 14 2017 03:48
yes. I have the img class set as responsive but I'm not sure if it is resizing correctly. I thought that would be best. Thanks :)
ah ok let me try
Tom
@moT01
Nov 14 2017 03:50
and for the first thing you mentioned
you mean the text goes below the photo (wraps around it)
Randy
@rdavidson3
Nov 14 2017 03:51
Thanks @moT01 it does seem to be working . I wasn't sure if it was just because I shurnk the window itself, But I see the image is getting re-sized
Tom
@moT01
Nov 14 2017 03:51
?
Randy
@rdavidson3
Nov 14 2017 03:51
yeah, I changed the view and it went beyond the photo itself
and I tried to add a <p> but it posted within the <th> of the table
Tom
@moT01
Nov 14 2017 03:53
i dont really see a problem there
are you meaning when it wraps around the photo? or on a small window it goes a little wider than the photo
Randy
@rdavidson3
Nov 14 2017 03:53
maybe it is my chrome. even typing here my messages kinda show up randomly. It wraps around the photo depending on the view
Tom
@moT01
Nov 14 2017 03:55
im not quite sure what bootstrap class is doing that
Randy
@rdavidson3
Nov 14 2017 03:55
in other words some of the text is at the bottom of the photo instead of stopping at the edge. Unless that's a normal thing that happens
Tom
@moT01
Nov 14 2017 03:56
well, like i said - i dont see it as a problem, but there's a way to get it how you want it
Randy
@rdavidson3
Nov 14 2017 03:56
ah, that's ok I am just gald it's mostly working as intended lol.
oh? how would I do that?
Tom
@moT01
Nov 14 2017 03:59
umm, i would add some css to do it - but that's because im not great with bootstrap
Randy
@rdavidson3
Nov 14 2017 04:00
ah, I see. Thank you very much. Playing with the window for a while I see you were right. It's just me not being use to the re-sizing thing.
I just learned bootstrap like tow days ago so I'm not use to seeing it too much in real time
two*
Tom
@moT01
Nov 14 2017 04:02
one thing you should do is properly indent your code
makes it more readable
by that i mean - every deeper element should be another tab or space over
i see you kinda started off good - then...
Tom
@moT01
Nov 14 2017 04:09
feel free to take a look at any of my projects code for some examples and to see the structure
my quote machine might be a decent example of something easy to check out
Randy
@rdavidson3
Nov 14 2017 04:11
Thanks @moT01 :) yes, I get a little confused my own code. the indenting is a good idea lol
Tom
@moT01
Nov 14 2017 04:12
you wont be the only one checking out your code - thats universal
Randy
@rdavidson3
Nov 14 2017 04:14
wow this quote machine is pretty cool. I'm still new to JS though, I can read it a little
Tom
@moT01
Nov 14 2017 04:26
@rdavidson3 keep going on the projects - that one isn't too far in front of you
i skipped the portfolio till close to the end of the front end section
Rada
@Radascript
Nov 14 2017 06:03
hey guys do you guys know why this isn't centering?
Rada
@Radascript
Nov 14 2017 06:13
RESOLVED
TJ Hardin
@AndroidNinjaX
Nov 14 2017 06:14

Hey can someone take a look at this. Trying to figure out why memory is updating. When I call function 'plus' memory should update. But then when I don't call function 'plus', it still updates. Been stumped on it for a while now. BTW this is a work in progress.

https://codepen.io/AndroidNinjaX/pen/aWGLaK?editors=0010

Deepak Manjunath
@Deepak2322
Nov 14 2017 06:40
‘producer(s)’ i get this as string from json, i have set this to uppercase in css which gives me ‘PRODUCER(S)’, but i want the last letter to be a lowercase (s), how can i achieve this.
abraham anak agung
@padunk
Nov 14 2017 06:43
@AndroidNinjaX what you mean? i click other button other than plus and number, it didn't update
@Deepak2322 you could use .replace() with regex. but i am not good with regex
TJ Hardin
@AndroidNinjaX
Nov 14 2017 06:55
@padunk Hey thanks, sorry I wasnt paying attention. We got it on the other one. Thank Though
abraham anak agung
@padunk
Nov 14 2017 06:57
@AndroidNinjaX np.
Ashwin
@ashwins93
Nov 14 2017 07:10
@Deepak2322 you may wanna do something like this
var str = "producer(s)";
str.replace(/(\w+)\((.*)\)/, function(match, p1, p2){
  return p1.toUpperCase() + "(" + p2 + ")";
});
"PRODUCER(s)"
Deepak Manjunath
@Deepak2322
Nov 14 2017 07:13
@ashwins93 i would like to capitalize these words, like i would want it as "japan Producer(s)" or "United Kingdom Producer(s)"
is there any method for capitalize
?
Ashwin
@ashwins93
Nov 14 2017 07:13
meaning the first letters of each word alone?
Deepak Manjunath
@Deepak2322
Nov 14 2017 07:13
yes
Ashwin
@ashwins93
Nov 14 2017 07:14
okay hold on a sec
var str = "japan producer(s)";

str.replace(/(?<=^|\s)(\w)(\w+)/g, function(match, p1, p2){
  return p1.toUpperCase() + p2;
});
"Japan Producer(s)"
Ashwin
@ashwins93
Nov 14 2017 07:19
or simply
var str = "japan producer(s)";
str.split(" ").map(val => val.charAt(0).toUpperCase() + val.slice(1)).join(" ");
"Japan Producer(s)"
Deepak Manjunath
@Deepak2322
Nov 14 2017 07:38
thanks a lot man @ashwins93 :-)
linkin-park
@linkin-park
Nov 14 2017 07:59
hello world!
i have not been serious about my career its time to take some work ... back onto game.
Sorin Ruse
@sorinr
Nov 14 2017 08:01
welcome back :)
SL0TR
@SL0TR
Nov 14 2017 08:01
@khaduch Thank you for all the feed back. Can you check it again and see if the time difference bug still persists? https://codepen.io/SL0TR/pen/aLjyJz
@khaduch And also here's a new thing that I've worked on, any feedback would be very appreciated. And for the responsive parts, I didn't make them mobile responsive yet as I'm barely getting time for my personal projects. :(
Sorin Ruse
@sorinr
Nov 14 2017 08:08
@SL0TR i would set for the class .time-with-icon the width: auto; instead of 10% and maybe , also add some padding-bottom like 10px
SL0TR
@SL0TR
Nov 14 2017 08:25
@sorinr Are you talking about the Weather app?
Sorin Ruse
@sorinr
Nov 14 2017 08:26
@SL0TR yep
SL0TR
@SL0TR
Nov 14 2017 08:27
@thank you, will look into it. Can you review the Wikipedia Viewer? :)
tundeiness
@tundeiness
Nov 14 2017 08:40
@candlefish okay...can we do private chats?
Tiago Correia
@tiagocorreiaalmeida
Nov 14 2017 10:46
@alpox are you around to save me of a timeout in an exercise ?:D
fpiguet
@fpiguet
Nov 14 2017 10:52

Hi guys, I am finalising my portfolio page and I am facing an issue. When I run it on my local, the responsiveness behaviour looks great, but on codepen, it just doesn't happen (not sure I am on the right channel to ask this).

Background info: I built the page using flexbox. I use a media query for screen under 500px which changes the flex-direction from row to column, collapsing everything in a nice, smart-phone friendly layout .
Expected result: When narrowing the browser window to smartphone size, the menu, my info section, and footer, should be displayed with flex-direction: column and collapse.
Actual result: When opening my page on my local, it works like a charm. However, on codepen, the collapsing doesn't happen.

Please forgive my CSS structure, it's a giant mess :grinning:
https://codepen.io/fpiguet/full/GMbjNv/

Any help would be great!

P. Silva
@psilva00
Nov 14 2017 10:55
G'Morning guys and gals. I need a little help with the Twitch project. Namely, with the filtering aspect of it. Everything seems to work well the first time I filter but then it won't do anything anymore. Also, don't mind the 'design' because I'm pretty terrible at it. Here's the link: https://codepen.io/anon/pen/RjgvzR
fpiguet
@fpiguet
Nov 14 2017 10:56
Screenshot 2017-11-14 11.45.15.png
Screenshot 2017-11-14 11.55.39.png
Expected result on codepend
P. Silva
@psilva00
Nov 14 2017 10:56
Oops, my bad. This is the correct link: https://codepen.io/psilva00/full/RjgvzR/
Bogdan
@oblanao
Nov 14 2017 11:16
Hello! Did anyone encounter "optimization issues" while working on The Game of Life? Although my setInterval is set at 100ms, Board Component's state updates slower than that and this results in "lagging". This is true for a board of 40x30.
checked my method that returns new board, and execution time never exceeds 60-70ms
Dušan Todorović
@krckyboy
Nov 14 2017 11:29

For JavaScript, what is there to learn?

Arrays, functions, objects, methods?

If, while, for loops? Switch?

What else should I learn?

Ashwin
@ashwins93
Nov 14 2017 11:38
@krckyboy design patterns
this
Object prototypes
Closures
The list keeps going
Long Nguyen
@longnt80
Nov 14 2017 11:48
@krckyboy read the book You Don't Know JS
Alvaro
@minutazos
Nov 14 2017 11:53
Hi, anyone can help me with some jquery? I'm doing a masonry grid with css (using relative and absolute, with column counts) and as i have the problem that the parent div has less height than the child (who has an img), I've tried to fix it with some jquery:
$(window).load(function() {
$('.item').css('height', $('.item img').css('height'))
});
pero el problema es que todos los items tienen la altura de la primera imagen, y me gustaria que cada item tenga la altura de su correspondiente imagen, como se podria hacer'
*but the problem is that all items have the same height than the first item (or first image), how can i do to apply this for each img, and not apply the height of the first image?
alpox
@alpox
Nov 14 2017 12:27
@tiagocorreiaalmeida Heyho, i'm around now :D sry i was giving private tutorate on python
primuscovenant
@primuscovenant
Nov 14 2017 12:29
@heroiczero tx
Tiago Correia
@tiagocorreiaalmeida
Nov 14 2017 12:29
got it solved by now :p but I run into alot of this issues in some advanced algorthms where there's a big data to handle in this case was an exercise where the lst 2 cases where arrays with a size of 5k :D
"advanced" :D
alpox
@alpox
Nov 14 2017 12:31
@tiagocorreiaalmeida Hmm thats not soo many yet :P
What advanced algos? On codewars?
MarionUy
@MarionUy
Nov 14 2017 13:05
Hello, I really need your help. I have a problem in loading my web page in my browser. It seems that my images and css won't read
help
Tiago Correia
@tiagocorreiaalmeida
Nov 14 2017 13:33
@alpox nah was on codefights just to pass the time there's a thing called train for interviews
alpox
@alpox
Nov 14 2017 13:42
@tiagocorreiaalmeida ah ok :) are you going to look for a job soon?
Jake
@JakeDVirus
Nov 14 2017 13:42
is there anything wrong in this statement $headerComponent.delay(300).removeClass("unscrolled");??
The delay method is not executing and the class unscrolled is getting removed instantly.
The given statement is from below snippet
    var $headerComponent = $(".header-wrapper");
    $(window).on("scroll", function(){
        var displacementFromTop = window.pageYOffset || document.documentElement.scrollTop;
        if (displacementFromTop > 0) {
            $headerComponent.delay(300).removeClass("unscrolled");
        } else {
            $headerComponent.addClass("unscrolled");
        } 
    });
Tiago Correia
@tiagocorreiaalmeida
Nov 14 2017 13:45
I would say january next year, there's a few things I wanna get done before applying to anywhere, and since I had a bit of time started on codefights things just to get an idea of what I might be asked to perform :P
alpox
@alpox
Nov 14 2017 13:48
@tiagocorreiaalmeida alright, thats a good thing :D but be prepared for also theoretical examples and maybe have to show examples of some things - particularly what they like to ask are things about how the event loop works, how scoping/context works, what an eventemitter is and how its built etc.
Tiago Correia
@tiagocorreiaalmeida
Nov 14 2017 13:53
Im thinking about learn something as react or other aswell but im afraid I start to leave behind things like im doing at backend and forget some so im not sure for now :D the good part of the backend is that you atually handle both, frontend and backend while building the projects
Stephen James
@sjames1958gm
Nov 14 2017 13:59
@NeelDVirus removeClass is not affected by delay - https://stackoverflow.com/questions/30585825/using-delay-with-removeclass
alpox
@alpox
Nov 14 2017 14:01
@tiagocorreiaalmeida hmm react is almost a must nowadays. At least one bigger frontend framework
P. Silva
@psilva00
Nov 14 2017 14:36
Anyone around to help me with some Angular on the Twitch exercise? Can't seem to get the filters working properly. Anyway, here's the link just in case someone can take a look and eventually point me in the right direction: https://codepen.io/psilva00/full/RjgvzR/
I'm pretty sure it's because MainController will only run once but I've tried creating 'helper' functions to no avail.
Kaz Baig
@kbaig
Nov 14 2017 14:52
@oblanao I only had issues with bigger grids (something like 100x100)
Sorin Ruse
@sorinr
Nov 14 2017 14:52
D
alpox
@alpox
Nov 14 2017 14:55
@psilva00 Your filter works fine from what i can tell. Your problem is more that you do direct DOM manipulations in the javascript which you really shouldn't do when working with templating engines like the one from angular or react.
@psilva00 You should not do that because the template rerenders (redraws) itself on change of any data (Like the filter) and when that happens, your direct DOM changes can be lost. Also, those templating engines don't track what changes you do directly to the DOM.
P. Silva
@psilva00
Nov 14 2017 14:57
@alpox, What should my approach be, then?
Ops, sorry. Didn't read your last line.
alpox
@alpox
Nov 14 2017 14:57
@psilva00 Use the templating engine of angular to do all the stuff you now did by direct DOM manipulation.
@psilva00 You can get a reference to the data you get from your request through adding the data from the response(s) to the $scope
You may want to read some angular tutorials about that
Kaz Baig
@kbaig
Nov 14 2017 14:59
Is there still a point to learning AngularJS? Asking for my own knowledge here, not to criticize.
alpox
@alpox
Nov 14 2017 14:59
@psilva00 Things like document.querySelectorAll should vanish from your javascript
P. Silva
@psilva00
Nov 14 2017 15:00
I'm familiar with exposing data to the view through $scope, I'm just puzzled about how do it all from Angular.
alpox
@alpox
Nov 14 2017 15:00
@kbaig Only if you want to work in some older companies which keep around big angularjs apps. Noone would start an AngularJS app now
P. Silva
@psilva00
Nov 14 2017 15:01
So, is Angular going defunct, then?
Kaz Baig
@kbaig
Nov 14 2017 15:01
@alpox I had a call with a tech consultant at PwC Boston last night. Their team builds apps for their clients in AngularJS
alpox
@alpox
Nov 14 2017 15:01
@psilva00 It pretty much is already
@psilva00 Well not angular - AngularJS
P. Silva
@psilva00
Nov 14 2017 15:01
Yeah, that.
Kaz Baig
@kbaig
Nov 14 2017 15:01
AngularJS diff from Angular
alpox
@alpox
Nov 14 2017 15:01
@psilva00 If you now talk about Angular one means Angular 2/4. What you are using is AngularJS
Kaz Baig
@kbaig
Nov 14 2017 15:01
We at Angular 5 already now damn
alpox
@alpox
Nov 14 2017 15:01
Angular 2/4 is still fine
@kbaig Well there's not much of a difference in those numbers
Kaz Baig
@kbaig
Nov 14 2017 15:02
yeah ik
alpox
@alpox
Nov 14 2017 15:02
@psilva00 Be aware that Angular and AngularJS are 2 totally different things
Even though they are made by (mostly) the same devs
Kaz Baig
@kbaig
Nov 14 2017 15:03
Complete rewrite
P. Silva
@psilva00
Nov 14 2017 15:03
Yeah, that I know.
I have yet to wrap my head around the ES 6 way of doing things though, to be honest.
Marius Nicolae
@bytao7mao
Nov 14 2017 15:04
Hello guys, how should i avoid concatenation in append(jquery) when i click a button ?
Kaz Baig
@kbaig
Nov 14 2017 15:04
@psilva00 In what sense
P. Silva
@psilva00
Nov 14 2017 15:04
@kbaig, syntax and whatnot.
Kaz Baig
@kbaig
Nov 14 2017 15:04
@bytao7mao append is to add to the html of an element. What are you trying to do?
alpox
@alpox
Nov 14 2017 15:04
@bytao7mao Append pretty much means concat :D
Marius Nicolae
@bytao7mao
Nov 14 2017 15:05
im using some code to get json text
when i click the button which is getting that text, it's concatenating
what should i use to avoid this
alpox
@alpox
Nov 14 2017 15:06
@bytao7mao Another method than .append
Marius Nicolae
@bytao7mao
Nov 14 2017 15:06
ok, which one
:)))
alpox
@alpox
Nov 14 2017 15:06
@bytao7mao Depends on what you want to do exactly
Kaz Baig
@kbaig
Nov 14 2017 15:06
@bytao7mao could you provide a code example? Not sure what you want to do instead
Marius Nicolae
@bytao7mao
Nov 14 2017 15:06
sure
alpox
@alpox
Nov 14 2017 15:07
Marius Nicolae
@bytao7mao
Nov 14 2017 15:07
i want to return only once, and same result, not concatenating the same result
Kaz Baig
@kbaig
Nov 14 2017 15:09
So then you would want to build your html in the loop, and use the html method outside of the loop
alpox
@alpox
Nov 14 2017 15:10
@bytao7mao For the country as example:
<div class = "col-xs-12 alert message2">
        Your country: <span class="country"></span>
   </div>
#country { font-weight: bold; }
$("#country").text(json.countries[11]['name']);
@bytao7mao And what @kbaig tells you :-)
Actually, i wonder what you want to achieve with the loop
Kaz Baig
@kbaig
Nov 14 2017 15:11
Ultimately he's using the loop to build his html
Probably more performant also to just concat the html string in the loop and call jQuery once after the loop
alpox
@alpox
Nov 14 2017 15:12
@kbaig I see that, but still, does he want to add all countries? Or just one random one? One cannot be sure when he says he doesn't want to append
Naaman Saif
@Naaman-Saif
Nov 14 2017 15:12
I have made the barebones for the pomodoro Clock can somebody help me with the Script? How do I get the Timer?
Kaz Baig
@kbaig
Nov 14 2017 15:12
@alpox I think he wants to add all countries but if he clicks again, the same thing doesn't get added to the preexisting para
Try clicking the button more than once
alpox
@alpox
Nov 14 2017 15:12
@Forlenza setInterval - or setTimeout
@kbaig Ah may be
So then he would need an accumulator or do a .empty before the loop and then use .append @bytao7mao
Kaz Baig
@kbaig
Nov 14 2017 15:15

@alpox yeah then he could just do

$('.message').empty();
$('.message2').empty();

as his first 2 lines in the getJSON callback

alpox
@alpox
Nov 14 2017 15:15
jup
Kaz Baig
@kbaig
Nov 14 2017 15:15
That's the quickest but pretty imperative way
Marius Nicolae
@bytao7mao
Nov 14 2017 15:16
empty() when ?
after append ?
alpox
@alpox
Nov 14 2017 15:17
@bytao7mao before the for loop
Kaz Baig
@kbaig
Nov 14 2017 15:17
first 2 lines of the callback
@bytao7mao The best solution to be honest though would be to just have a boolean that your click callback checks for before making the getJSON call
That way, you don't have to keep making a new request every time the user clicks, just the first time
Marius Nicolae
@bytao7mao
Nov 14 2017 15:20
The empty method seems allright, the other method , to keep just a statement and get rid of Loop ?
Kaz Baig
@kbaig
Nov 14 2017 15:21
what
Marius Nicolae
@bytao7mao
Nov 14 2017 15:22
oh, keep loop and make the boolean statement outside ?
Kaz Baig
@kbaig
Nov 14 2017 15:23
let hasNotClicked = true;
$('.clickButton').click(function() {
  if (hasNotClicked) {
    hasNotClicked = false;
    // everything else you were doing
  }
});
@bytao7mao does that make sense
Marius Nicolae
@bytao7mao
Nov 14 2017 15:38
yeah
Marius Nicolae
@bytao7mao
Nov 14 2017 15:46
so, with what i replace that code now ?
homebrainbox
@homebrainbox
Nov 14 2017 16:21

Hey, when I collapse my navbar and click on the "hamburger icon" or icon bars there's no dropdown menu appearing. Any advice?

<div class="container-fluid">
    <nav class="navbar navbar-default navbar-fixed-top">
        <div class="container-fluid">
            <div class="navbar-header">
             <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#myNavbar">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span> 
             </button>    
                <a class="navbar-brand" href="#">BRAND</a>
            </div>
          <div class="collapse navbar-collapse" id="myNavbar">
            <ul class="nav navbar-nav navbar-right">
                <li><a href="#">about</a></li>
                <li><a href="#">portfolio</a></li>
                <li><a href="#">contact</a></li>
            </ul>
          </div>      
        </div>
    </nav>
</div>
<div>

</div>

Link: https://codepen.io/homebrainbox/pen/aVwmoJ

Stephen James
@sjames1958gm
Nov 14 2017 16:29
@homebrainbox I think you need jquery along with bootstrap js
See console error Uncaught Error: Bootstrap's JavaScript requires jQuery
Sorin Ruse
@sorinr
Nov 14 2017 17:46
@homebrainbox do u have loaded also bootstrap.js?
@homebrainbox and as @sjames1958gm pointed out jquery
Matt
@DaftlyPunkish
Nov 14 2017 18:42
Hi guys. Can anyone here help me with the tic tac toe came?
Tom
@moT01
Nov 14 2017 18:42
whats the problem? @DaftlyPunkish
Matt
@DaftlyPunkish
Nov 14 2017 18:43
I'm having trouble with my random selction function
function compPicker() {
var compChoice = options(Math.floor(Math.random() * 9));
console.log(compChoice);
}
options is an array variable
Tom
@moT01
Nov 14 2017 18:44
use brackets to grab something from an array
Nazar
@IsaakNazar
Nov 14 2017 18:44
help ease-in-out doesnt work properly, works only ease-in but not out
https://codepen.io/NazarIsaak/pen/rYwEjg
Tom
@moT01
Nov 14 2017 18:44
options[0] = first spot
so try option[Math.random....
Matt
@DaftlyPunkish
Nov 14 2017 18:44
Ah!
Thank you!
Nazar
@IsaakNazar
Nov 14 2017 18:45
.links:hover {
  transition: background  .3s ease-in-out;
  background: rgba(0, 0, 0, 0.8);
}
Matt
@DaftlyPunkish
Nov 14 2017 18:46
Now I'm getting "compChoice" is not a function
Here's my pen
Tom
@moT01
Nov 14 2017 18:46
ease in-out means the transition will start slow and end slow @IsaakNazar
you didnt put it in brackets
Nazar
@IsaakNazar
Nov 14 2017 18:47
@moT01 there is on the code works only ease in
Matt
@DaftlyPunkish
Nov 14 2017 18:47
Oops, forgot to save iut
it*
Refresh it
@DaftlyPunkish
you need to return from the function
return compChoice
so when you call compPicker()
it will give you compChoice
or whatever you return from that function
making any sense?
Matt
@DaftlyPunkish
Nov 14 2017 18:52
It does
I'm just trying to figure out how to apply that to my function
Tom
@moT01
Nov 14 2017 18:53
@IsaakNazar ease-in-out does not mean the transition will fade in, then also fade out - it means that the speed of the transtion will start slow (ease-in) and end slow (ease-out)
Matt
@DaftlyPunkish
Nov 14 2017 18:53
I'm still getting an error
function compPicker() {
var compChoice = options[Math.floor(Math.random() * 9)];
return compChoice();
}
Tom
@moT01
Nov 14 2017 18:54
compChoice is a variable, not a function
Harut
@harut-g
Nov 14 2017 18:55
Who is familiar with mongoose?
Matt
@DaftlyPunkish
Nov 14 2017 18:55
Oh!
function compPicker() {
var compChoice = options[Math.floor(Math.random() * 9)];
console.log(compChoice);
}
Thank you!
Tom
@moT01
Nov 14 2017 18:56
you could shorten it to return options[Math.floor.....9]
the dots not meaning dots -but the rest of what you had
@harut-g somewhat
Matt
@DaftlyPunkish
Nov 14 2017 18:57
How would I apply that to the compchoice var?
Tom
@moT01
Nov 14 2017 18:57
dont need it anymore
Harut
@harut-g
Nov 14 2017 18:57
@moT01 have you experience with it?
Tom
@moT01
Nov 14 2017 18:57
function compPicker() {
return options[Math.floor(Math.random() * 9)];
}
then if you console.log(compPicker()) elsewhere - you will get your random things
@harut-g somewhat
Matt
@DaftlyPunkish
Nov 14 2017 18:59
I'm starting to think my logic is going to require way too much code and be ridiculously messy. I'm going to have to write an if/else statement for each choice and for each result the compPicker returns
Harut
@harut-g
Nov 14 2017 18:59
@moT01 I have two create method on model, which saves the data. And I need to send some data when two methods is done, can you help me with it?
Tom
@moT01
Nov 14 2017 19:00
@IsaakNazar move the transtion to the .links
and it will work both ways
Matt
@DaftlyPunkish
Nov 14 2017 19:00
Plus all the if statements for all the win variables
Tom
@moT01
Nov 14 2017 19:02
@harut-g do you have the code somewhere?
Harut
@harut-g
Nov 14 2017 19:02
This message was deleted
                Facility.create(filesJson['facilities'], (err, result) => {
                   if (err) throw err;
                });

                People.create(filesJson['people'], (err, result) => {
                    if (err) throw err;
                });
@moT01 I need to send response when these two methods are done
Tom
@moT01
Nov 14 2017 19:05
node?
express
Harut
@harut-g
Nov 14 2017 19:06
@moT01 yes
Tom
@moT01
Nov 14 2017 19:09
here's some code i've used
newBook.save().then(() => {
             books.find().then(r => {
res.send([r,message]);
i dunno, that's an area i need improvement on
so yours might look like...
facility.create(files.....).then((err,result) => {
    stuff
   people.create().then( => {
     res.send
  }

})
Tom
@moT01
Nov 14 2017 19:14
probly not the best way to go, i think that stops the code - when ideally you probly want both of those to start together then send a response when the last one is done
someone posted a link to here about this - i didnt read it, but it might help http://www.datchley.name/es6-promises/
Chris Rutherford
@cjrutherford
Nov 14 2017 19:17
anyone good with troubleshooting seed issues?
anyone here to answer questions?
Tom
@moT01
Nov 14 2017 19:17
i cant try
Chris Rutherford
@cjrutherford
Nov 14 2017 19:20

thanks @moT01 , I'm trying to see my database, and have two models that I have the seed data for in a JSON file. Both seed scripts are nearly identical. The only difference is the JSON file that gets imported, and the variable name that represents the seed data after import. The first imports fine, and the second files with an error like this:

== 20171030160224-outsider: migrating =======
Seed file failed with error: Cannot read property 'autoIncrement' of undefined TypeError: Cannot read property 'autoIncr
ement' of undefined
    at C:\Users\rutherfordc.AA\Documents\GitHub\ccs-express\node_modules\sequelize\lib\dialects\mssql\query-generator.js
:264:48
    at C:\Users\rutherfordc.AA\Documents\GitHub\ccs-express\node_modules\lodash\lodash.js:4389:15
    at baseForOwn (C:\Users\rutherfordc.AA\Documents\GitHub\ccs-express\node_modules\lodash\lodash.js:2652:24)
    at Function.forOwn (C:\Users\rutherfordc.AA\Documents\GitHub\ccs-express\node_modules\lodash\lodash.js:12254:24)
    at C:\Users\rutherfordc.AA\Documents\GitHub\ccs-express\node_modules\sequelize\lib\dialects\mssql\query-generator.js
:258:15
    at arrayEach (C:\Users\rutherfordc.AA\Documents\GitHub\ccs-express\node_modules\lodash\lodash.js:473:11)
    at Function.forEach (C:\Users\rutherfordc.AA\Documents\GitHub\ccs-express\node_modules\lodash\lodash.js:8561:14)
    at Object.bulkInsertQuery (C:\Users\rutherfordc.AA\Documents\GitHub\ccs-express\node_modules\sequelize\lib\dialects\
mssql\query-generator.js:248:13)
    at QueryInterface.bulkInsert (C:\Users\rutherfordc.AA\Documents\GitHub\ccs-express\node_modules\sequelize\lib\query-
interface.js:568:33)
    at Object.up (C:\Users\rutherfordc.AA\Documents\GitHub\ccs-express\server\seeders\20171030160224-outsider.js:7:27)
    at Migration._callee$ (C:\Users\rutherfordc.AA\AppData\Roaming\npm\node_modules\sequelize-cli\node_modules\umzug\lib
\migration.js:178:35)
    at tryCatch (C:\Users\rutherfordc.AA\AppData\Roaming\npm\node_modules\sequelize-cli\node_modules\regenerator-runtime
\runtime.js:65:40)
    at Generator.invoke [as _invoke] (C:\Users\rutherfordc.AA\AppData\Roaming\npm\node_modules\sequelize-cli\node_module
s\regenerator-runtime\runtime.js:299:22)
    at Generator.prototype.(anonymous function) [as next] (C:\Users\rutherfordc.AA\AppData\Roaming\npm\node_modules\sequ
elize-cli\node_modules\regenerator-runtime\runtime.js:117:21)
    at step (C:\Users\rutherfordc.AA\AppData\Roaming\npm\node_modules\sequelize-cli\node_modules\babel-runtime\helpers\a
syncToGenerator.js:17:30)
    at C:\Users\rutherfordc.AA\AppData\Roaming\npm\node_modules\sequelize-cli\node_modules\babel-runtime\helpers\asyncTo
Generator.js:28:13
    at <anonymous>
    at process._tickCallback (internal/process/next_tick.js:188:7)

The seed script is as follows:

'use strict';
const cjson = require('cjson');
var outsiderData = cjson.load('server/seeders/Outsider.json');

module.exports = {
  up: (queryInterface, Sequelize) => {
    return queryInterface.bulkInsert('Outsiders', outsiderData);
  },

  down: (queryInterface, Sequelize) => {
    return queryInterface.bulkDelete('Outsiders', null, {});
  }
};
Tom
@moT01
Nov 14 2017 19:22
whats next
wheres the auto increment
Chris Rutherford
@cjrutherford
Nov 14 2017 19:23
The auto increment is in the migration file, and is on the Id field that is provided by Sequelize when generating the Migration.
I assume the Next is something in the pipeline for Sequelize.
oh sorry this is the wrong chat.....
Thanks anyway Tom
Tom
@moT01
Nov 14 2017 19:24
what
you can chat wherever you want
Chris Rutherford
@cjrutherford
Nov 14 2017 19:25
lol, I was looking for the Sequelize chat. though.... lol all good
Tom
@moT01
Nov 14 2017 19:26
well, i wanted to see where you were setting the autoIncrement - or where - or the code you were using to grab that info
it says undefined there, i think thats an async issue
or sync
whatever
Matt
@DaftlyPunkish
Nov 14 2017 19:29
How do you send a script instead of just copy-pasting?
Chris Rutherford
@cjrutherford
Nov 14 2017 19:30

Yes, the code for the Auto Increment is here:

'use strict';
module.exports = {
  up: (queryInterface, Sequelize) => {
    return queryInterface.createTable('Outsiders', {
      id: {
        allowNull: false,
        autoIncrement: true,
        primaryKey: true,
        type: Sequelize.INTEGER
      },
      firstName: {
        type: Sequelize.STRING,
        allowNull: false
      },........

this is supposed to handle the auto increment of table keys on it's own, but I guess it's borked.

I'll link you my repo so you can take a look.
Tom
@moT01
Nov 14 2017 19:40
@cjrutherford yea, im not sure
if the first one works
try the second again
look for typos
is the file the right structure
im sure you did all that
Chris Rutherford
@cjrutherford
Nov 14 2017 19:41
yeah, it's a quagmire, I'm going to look up another tutorial and start from scratch. they're really no help over there.
Kaz Baig
@kbaig
Nov 14 2017 21:20
@alpox do you do sass
alpox
@alpox
Nov 14 2017 21:28
@kbaig I did do some
Long not anymore
Marius Nicolae
@bytao7mao
Nov 14 2017 21:43
@bytao7mao
hi guys, i have a little issue, im trying to link in my JSON some objects
does someone here have some experience?
Harut
@harut-g
Nov 14 2017 21:46
@bytao7mao can you provide some details or code example?
Marius Nicolae
@bytao7mao
Nov 14 2017 21:55
Before i provide the code i want to give some info
of what i want to do
i want to link my winner or looser ID with ID of Country
Marius Nicolae
@bytao7mao
Nov 14 2017 22:00
the logic is: if points of x.inv is > than x.def (see var x) then link the ID with countries ID (var y)
i get this now but it is not ok :)) because i getting only the index 1 from all
"85 > 37 Winner is: Brazil"
Hammad
@newnewb
Nov 14 2017 22:09
Guys, i'm trying the simon challenge, but i'm having an issue with playing my audio queue
but the problem is, my sound is waiting for the previous sound to finish so that it could play
Aleksander Gębicki
@Takumar
Nov 14 2017 22:45
Hello campers,
this weekend (17-19 November) CodeSchool is offering free learning for everybody.
There is a lot of interesting content to study, so tell your mothers and girls that you are absent ;-)

CodeSchool - free weekend

Tom
@moT01
Nov 14 2017 22:51
@bytao7mao get it figured out?
@newnewb have any code? so the audio goes into a queue?
Marius Nicolae
@bytao7mao
Nov 14 2017 23:18
@moT01 i'm struggling
can i show the code ?
Tom
@moT01
Nov 14 2017 23:20
isnt the code there in the codepen?
yeah is in codepen
Tom
@moT01
Nov 14 2017 23:23
so where are you stuck
are you able to get the ids of the winner and loser
Marius Nicolae
@bytao7mao
Nov 14 2017 23:24
yes i'm getting the ids, but now i have to implement the condition that the ID of COuntry to be equal to the ID of the Winner / loser
i made a while statement but it doesnt work
Hammad
@newnewb
Nov 14 2017 23:25
@bytao7mao It's already solved, someone on frontend help saw it through with me!
help*
Marius Nicolae
@bytao7mao
Nov 14 2017 23:26
what O_o
Hammad
@newnewb
Nov 14 2017 23:26
oh sorry i meant tom
Tom
@moT01
Nov 14 2017 23:27
countries is an object and the id is used as the key it looks like
so if you found the winner id, and it's 171
you should be able to do something like...
var winningCountry = c[winningID].name
no looping needed
Marius Nicolae
@bytao7mao
Nov 14 2017 23:31
but i have so many countries ID's how should i not make it without loops
Hammad
@newnewb
Nov 14 2017 23:31
Looping means looking through, from what i understand to pick a winner... you just need to pick one out
Marius Nicolae
@bytao7mao
Nov 14 2017 23:31
yeah
Tom
@moT01
Nov 14 2017 23:32
cause you have the id(key) you can just pick out the one you need
Marius Nicolae
@bytao7mao
Nov 14 2017 23:33
so here "var winningCountry = c[winningID].name" where i should state this and why in winning ID i have to loop through
Hammad
@newnewb
Nov 14 2017 23:34
you don't have to loop
Tom
@moT01
Nov 14 2017 23:35
i dont know how you're getting the ids - i didn't look through that so i dont know where you need it
put it where you want
whereever you need to get the name of the country
Hammad
@newnewb
Nov 14 2017 23:35
okay, @bytao7mao explain your train of thoughts? what are you trying to do exactly? and why do you think you have to loop?
Marius Nicolae
@bytao7mao
Nov 14 2017 23:36
i have a big chunk of JSON with Battles and countries objects
inside battles i have defenders(def) and attackers(inv)
with ID's and Points
for each
for countries i have only NAmes and ID's which it corespond to Defenders and Attackers
and i want to compare Points and decide the Winner Country by ID if the ID of the Winner or Loser is EQual to that country
Tom
@moT01
Nov 14 2017 23:39
so i think you want to loop through the battle is what you're getting at
Hammad
@newnewb
Nov 14 2017 23:40
so, you have a lot of battles? and you want to compare who will win in that battle?
Marius Nicolae
@bytao7mao
Nov 14 2017 23:40
yeah, loop through the battles, decide which one has higher ammount of points and return ID of it + country ID
@newnewb yep
and return the ID coresponding to country
Hammad
@newnewb
Nov 14 2017 23:46
so first issue is that your loop is set to end at 2? I might wanna set it to be? i < x.length?
Marius Nicolae
@bytao7mao
Nov 14 2017 23:46
hmm yeah, i should set it to battles.length right ?
i've set to 2 because i wanted to test only
Hammad
@newnewb
Nov 14 2017 23:47
what else are you facing problems with?
I really don't understand this json well, any kind of documentation to it?
Marius Nicolae
@bytao7mao
Nov 14 2017 23:51
im testing now the country ID to get it by Object.key but it show me always undefined
i dont know why
i solved it
Hammad
@newnewb
Nov 14 2017 23:53
@bytao7mao try sharing the code
oh.. that was fast
Marius Nicolae
@bytao7mao
Nov 14 2017 23:54
i solved with the country ID
:|
ok, w8 a moment
var ourRequest = new XMLHttpRequest();
ourRequest.open('GET', "https://www.erepublik.com/en/military/campaigns-new");
ourRequest.onload = function() {
  var x = Object.values(JSON.parse(ourRequest.responseText).battles);

  var c = Object.values(JSON.parse(ourRequest.responseText).countries);

  var c2 = Object.keys(JSON.parse(ourRequest.responseText).countries);


  for (var i = 0; i < 2 ; i++) {
        if (x[i].inv.points > x[i].def.points) {         
       console.log( "winnerID: " + x[i].inv.id  +"Country Winner is: " + c[i]['name'] + " Country KEY id is: " + c[i]['id'] + " Loser ID is:  " + x[i].def.id);

      } else if (x[i].inv.points === x[i].def.points) {
            console.log(" EQUAL" );
      } else {
           console.log("DEF WINS");
       }
  };



};
ourRequest.send();
this return me the following :
winnerID: 79Country Winner is: Romania Country KEY id is: 1 Loser ID is:  167
as you see, the winner id is different from country ID
i need only to make an equality statement and return it
&& c[i]['id'] == x[i].inv.points if i nest this in the if statement it only returns "DEF WINS"
Hammad
@newnewb
Nov 14 2017 23:58
aren't you looking for point s vs points? why is your statement id vs points?
Marius Nicolae
@bytao7mao
Nov 14 2017 23:59
yeah i should state == x[i].inv.id
but i'm sure it will not work