last day (16 days later) » 

5:16 AM
Hi!
 
First off, thank you so much for helping me. I've been struggling all day
 
No worries
 
really appreciate your time
 
I love solving svg problems
 
5:17 AM
Awesome!
Glad to hear
I'll set up a JS bin
 
that's the website layout so far
and the text will replace the "HOMAGE" text
so the expanding horizontal bars of the letters "O", "U", and "E" respond to the wrapper's width.
 
I guess HO is supposed to be on the left and GE on the right?
 
actually
here let me change it
meanwhile this is the text behavior: i58.tinypic.com/2ivjtra.png
 
For HO, O should be flexible; for GE, E should be flexible and how about MA?
 
5:29 AM
thats the modified version
so I made it so that each row contains a responsive svg letter.
would it be better if i send you a svg of the letters?
 
that woud be great
 
awesome. I'll upload them into a dropbox. can you give me a few minutes?
 
would it be better if each letter be a separate svg or should I send you one svg?
**one svg that contains all letters
 
seperate would be better
 
5:38 AM
gotcha
here are a few
so basically the red areas's width is set to 100% width, and the black left part is set to float: left or left: 0, and the right part is set to float: right or right: 0
thats how I'm envisioning it'll work, but I'm wondering if you have a better solution
 
6:01 AM
The dropbox has been updated
 
okay so which ones do you want me to use?
I started with R, E and U already
 
oh really?
how easy is it to work on it?
because ideally I would like to do them all, but if it's easy to do I can work on it simotaniously with you
But if you can do O, B, D, and I that would be great!
 
cool I'll change them
 
thank you :)
how is it so far?
is it easy?
 
you're welcome
well, currently I'm trying to get the heights same as the normal text
 
6:09 AM
AL I SEE
*ah I see
 
6:22 AM
okay so the letters are up http://jsfiddle.net/6vcaaa1y/4/embedded/result/
Now the main part
So initially the width of the red part should be 0, right?
 
yeah
but since the user will most likely view the website in their laptops, they'll actually start with 100%
and as the person scales down the window, the 100% adjusts with the width of the page
 
so thats why I put the text in their own wrapper
 
but I'm gnna use JavaScript to set the width of the red part according to the width of the window
so it will set the width automatically
 
ohhhh! clever!
just to clarify, heres an example:
the light blue is that row's wrapper
but I'm guessing the responsive type will be inside its own wrapper
so like,
<div row01-wrap>
Z <div U-wrap>U</div> Z
</div>
 
6:35 AM
yea it will be in a wrapper
I'm using <span> for the middle letter
 
right, so that it maintains horizontally aligned
good idea!
is there anything I can help with so far? or do you have a solid idea of how this can work?
 
could you edit the svg file for B, set the red part's width to 0 and upload it again?
 
oh so no red parts?
oh wait
yup I got it, let me upload again
I have updated it
should I do that for the rest of the SVGs?
 
6:51 AM
I did for the rest
 
gotcha
please let me know if there is anything else I can do for you for your convenience
 
nevermind I did it
 
oh lol
holy crap you're fast.
 
lmao
I was like slowly walks away backwards
 
6:54 AM
lol
 
...holy crap it says on your profile that you've aquired 3,860 reputation? how long have you been coding for?
 
3 months
 
...... noway
are you serious?
 
yes way lol
taught myself from scratch
 
are you one of those genius coders? are you planning on going to school for that?
 
6:58 AM
"genius coders"? hmmm not yet. "school"? naaaaah
 
hahah damn, I hope you'll keep coding! soon you'll rule the world or invent a new algorithm
 
I'm doing Industrial Engineering already. Don't wanna get another degree
 
oh nice!
awesome field
tons of great stuff happening
 
are you familiar with processing or Arduino?
 
7:01 AM
yeah
 
nice! I created some projects using those two. super fun
I love arduino, I wish I knew about it before I went to school
 
me too lol
 
pretty cool
 
thanks!
 
7:09 AM
we get to program these robots at our school
whoops lol hold on
 
says "image not found"
lol its okay
 
what!
holy crap
 
yea lol
 
thats awesome!
 
7:24 AM
you r lucky that you have illustrator lol
I use Inkscape on my linux
 
oh you're on linux?
damn.
you should get a mac or pc
 
I love linux lol
I'm thinking I should get a Mac tho
 
you should!
im not too familiar with linux
 
its pretty much the same as Mac
I mean Unix type
programmers use Mac and Linux
Windows is for rookies :p lol
who can't use the great command line
no offence lol
 
lol
no no Im a mac
never was a fan of windows.
so many problems
 
7:32 AM
ikr lol
I meant "no offence (to Windows users)" tho lol
 
oh hahaha
yeah
they'll probably rage
 
7:47 AM
hows it going with the responsive text?
 
well I'm gnna have to do alot of math, coz when The window's width gets bigger I'm gnna have to increase the red part's width as well as shift the right parts co-ordinates
The problem is with B and D
for O its easy
 
interesting
what is the math like?
 
intense lol
 
oh man
is that the stuff you enjoy doing?
like part of coding
 
hells yeah lol
 
7:51 AM
nice!
 
I love math btw
 
thats rad :)
never was a strong suit for me haha
 
lol
If I had hand-written the svg code, it would've been a lot more easier
 
really
holy crap
I cant imagine
 
lol
the problem for D is solved
last is B
 
8:01 AM
nice!
 
8:33 AM
how you doing?
 
well breaking down the letter B
 
awesome
 
done with the letter D ----> Fiddle
 
nice!
 
Shifting the cubic bezier curve is the crucial part
 
8:35 AM
haha i dont know what that means but that sounds rad
 
8:49 AM
There lol B is down ---- > Fiddle
 
thats awesome!
wow, that was a long haul
 
Now I know what co-ordinates to shift and now I'll start the coding part
 
rad :)
 
yea lol that took quite a time
so for what minimum window width do you want the red part's width to be 0?
 
minimum is 0 i think
 
8:56 AM
I mean the last picture
 
exactly
0 would be ideal
 
what would be the window's width?
not the red part's width
 
ohhh
hmmm.....
if I didnt' know the answer right now, would it be difficult to change?
 
no I don't think so
 
like would it be a simple modfication to min-width: 500px to min-width: 900px for example?
 
8:58 AM
yea
depends tho
can't really tell before the code is up and running
 
oh i see
i think 400 is the smallest size right?
 
yea
when do you need this done?
its 4 in the morning here lol, is it okay if I finish this timorrow?
 
for sure!
by tomorrow or the day after
but please sleep :) and thank you!
 
should we stay in this chat room?
 
9:04 AM
you're welcome
yea
 
awesome. talk to ya tomorrow!
night
 
save the link if you leave the chatroom
 
for sure!
 
okay then see ya tomorrow
 
 
9 hours later…
5:37 PM
@kenhimself - You there?
 

  last day (16 days later) »