PHP Developers Network

A community of PHP developers offering assistance, advice, discussion, and friendship.
 
Loading
It is currently Mon Dec 17, 2018 8:36 am

All times are UTC - 5 hours




Post new topic Reply to topic  [ 5 posts ] 
Author Message
PostPosted: Mon Jan 01, 2018 3:07 pm 
Offline
Forum Contributor

Joined: Wed Jan 18, 2017 4:43 pm
Posts: 197
Happy New Year!

Folks,

Have you seen those online greeting cards, where you choose a template (like a bunch of people holding a big white empty sign board) and whatever you type in the "greetings" text box then that shows-up in the image (your typed text shows up in the sign board) ?
How did they program all that with php ? I mean, they did some kind of a text layout on the img, right ?
We've done this kind of thing in Adobe Photoshop but how does php manage it ? Does php have some builtin function that deals with overlaying one img or text over another img ? Img overlaying ? if not, then how'd they manage to program it ?
If you don't mind, I'd like to see a code sample from your end. That can be my new year gift!
I think the programmers do it like the following technique. See if I'm correct or not ...

They cut the template img in half. So, in our example, the bunch of people holding the empty white signboard is one whole img. Like: full.jpeg.
With phptoshop and the like, the webmaster cut the img in 2. Half half.
Like: left_half.jpeg & right_half.jpeg.

Now, let's deal with you the user's input text and its img.
With a font, let's say Ariel Style, I, the programmer, going to write each letter and save it. Like so:


a.jpeg
b.jpeg

and so on right down to:

y.jpeg
z.jpeg

Then, I'm going to give you, the visitor/greeting mssg creator a text box (in a web form).
You will type your word such as: Happy New Year 2018.
And, my script will call the required jpeg files and combine them to form your word. Like so:

h.peg,a.jpeg,p.peg,p.jpeg,y.jpeg and so on.
You get the picture. Gonna put each appropriate img files side by side that will make up your chosen word.

Eg.


$word = $h = mydomain\h.jpeg.$a = mydomain\a.jpeg; AND SO ON until your word is formed: Happy New year 2018.

//combine left half of img with right half of img with greeter's $word inbetween the 2 imgs.
echo left_half.jpeg.$word.right_half.jpeg; //concatenation taking place here.


Is this how the php programmers build these greeting card sites ? Meaning using the same method I did. Ok, maybe programming slightly differntly by using better codes but the method of adding the greeter's greeting words on the image template is done like so. Right ?

Don't forget to PM me your emails so when I get this Greeting Card site of mine up and running then I can give you all a card. Lol!


Top
 Profile  
 
PostPosted: Mon Mar 12, 2018 11:00 am 
Offline
Forum Contributor

Joined: Fri Jul 20, 2007 11:29 am
Posts: 367
1. Learn the basics of graphics programming on Khan Academy.

2. Take that knowledge over to either raw html5 canvas api or processing.js or p5.js - I assume you already have basic javascript & DOM knowledge or at least jQuery.

3. Make a simple web page where you give the user 5 photos to choose from and a text box and an html5 canvas.

4. The image with text that is created in the canvas element can be uploaded via ajax/xhr/xhr2/fetch

_________________
Warning: I have no idea what I'm talking about.


Top
 Profile  
 
PostPosted: Mon Mar 12, 2018 10:01 pm 
Offline
Site Administrator
User avatar

Joined: Wed Aug 25, 2004 7:54 pm
Posts: 13585
Location: New York, NY, US
Thinsoldier is right, not even close. It is not done with PHP. It is done with Javascript.

_________________
(#10850)


Top
 Profile  
 
PostPosted: Mon Mar 12, 2018 11:02 pm 
Offline
Forum Contributor

Joined: Fri Jul 20, 2007 11:29 am
Posts: 367
You could do it with PHP but I'm pretty sure some aspects of advanced functionality like having a lot of fonts to choose from or performance concerns like having to process 10,000 users requests server side, make javascript & canvas in the browser a significantly better choice.

_________________
Warning: I have no idea what I'm talking about.


Top
 Profile  
 
PostPosted: Mon Mar 12, 2018 11:34 pm 
Offline
Forum Newbie

Joined: Mon Mar 05, 2018 9:19 pm
Posts: 6
Christopher wrote:
Thinsoldier is right, not even close. It is not done with PHP. It is done with Javascript.


Upon checking, that's Javascript they're using


Top
 Profile  
 
Display posts from previous:  Sort by  
Post new topic Reply to topic  [ 5 posts ] 

All times are UTC - 5 hours


Who is online

Users browsing this forum: Exabot [Bot] and 7 guests


You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot post attachments in this forum

Jump to:  
Powered by phpBB® Forum Software © phpBB Group