Go to main content

Textpattern CMS support forum

You are not logged in. Register | Login | Help

#1 2011-11-17 18:11:32

dhritzkiv
Member
From: Toronto, Canada
Registered: 2011-02-23
Posts: 14
Website

Portfolio of Daniel Hritzkiv

An updated version of my portfolio site, ready for 2012.

See it here.

Features works including sites made in Textpattern :)
Let me know what you think!

Offline

#2 2011-11-17 21:18:39

maniqui
Member
From: Buenos Aires, Argentina
Registered: 2004-10-10
Posts: 3,070
Website

Re: Portfolio of Daniel Hritzkiv

Very nice website, love the use of AJAX/JS/pushState. Would like to read a bit more about how it’s done :)


La música ideas portará y siempre continuará

TXP Builders – finely-crafted code, design and txp

Offline

#3 2011-11-17 21:33:18

dhritzkiv
Member
From: Toronto, Canada
Registered: 2011-02-23
Posts: 14
Website

Re: Portfolio of Daniel Hritzkiv

Thanks! It was lots of fun having it all come together.

The AJAX workflow is set up to listen for clicks on all internal links (http://danielhritzkiv.com/*), animate the content out, trigger the loader gif, load the new content in based on the href in the link (while limiting the scope to a certain selector), animate the new content in (including a subtle background on certain articles), and turn off the loader gif.

Also triggered is a navigation change (listens for click on http://danielhritzkiv.com/[section]/*, and activates that [section] in the nav).

Let me know if you’d like me to go more in depth, or would like to know something else in particular.

Offline

#4 2011-11-17 22:05:27

philwareham
Core designer
From: Haslemere, Surrey, UK
Registered: 2009-06-11
Posts: 3,564
Website GitHub Mastodon

Re: Portfolio of Daniel Hritzkiv

Very nice indeed. That’s some ninja JavaScript skills right there.

Offline

#5 2011-11-17 22:22:39

Bloke
Developer
From: Leeds, UK
Registered: 2006-01-29
Posts: 11,271
Website GitHub

Re: Portfolio of Daniel Hritzkiv

Yummy. Top notch site. Internal link hijacking is the approach smd_ajax takes, but it doesn’t chain it all together anywhere near as slickly as your site does. I’m going to have to revisit that plugin to keep up with your methods.

Next time I need Javascript assistance I now know where to ask for help: if Javascript was a vampire, you’d be Blade :-)


The smd plugin menagerie — for when you need one more gribble of power from Textpattern. Bleeding-edge code available on GitHub.

Txp Builders – finely-crafted code, design and Txp

Offline

#6 2011-11-17 22:49:40

dhritzkiv
Member
From: Toronto, Canada
Registered: 2011-02-23
Posts: 14
Website

Re: Portfolio of Daniel Hritzkiv

Wow! Thanks you two.

To be honest, for the link hijacking, I actually found and used this short jQuery snippet since it fit what I needed simply and ideally.

I don’t know if I’ll be much help in terms of JS, since in actuality, I’m only just a rookie (began learning jQuery in June) and don’t really know all that much, yet. In fact, the last section of my site’s JS needs to be optimized and condensed (not sure how yet).

Last edited by dhritzkiv (2011-11-18 00:05:50)

Offline

#7 2012-08-19 21:18:15

gfdesign
Member
From: Argentina
Registered: 2009-04-20
Posts: 401

Re: Portfolio of Daniel Hritzkiv

Hi Daniel
Congratulation for your site. I love how you use AJAX for loading contents as well.
Just for curiosity, in your website, could you add an mp3 player without cuts during the song play?
I mean, listening a song while the user browses the whole site. It’s something I’ve wanted to achieve since some time in a HTML site. (I come from Flash websites branch :D )
Thanks for your reply in advance.
Best regards

Offline

#8 2012-08-19 21:33:41

dhritzkiv
Member
From: Toronto, Canada
Registered: 2011-02-23
Posts: 14
Website

Re: Portfolio of Daniel Hritzkiv

gfdesign wrote:

Hi Daniel
Congratulation for your site. I love how you use AJAX for loading contents as well.
Just for curiosity, in your website, could you add an mp3 player without cuts during the song play?
I mean, listening a song while the user browses the whole site. It’s something I’ve wanted to achieve since some time in a HTML site. (I come from Flash websites branch :D )
Thanks for your reply in advance.
Best regards

Of course it can be done! (Though, I have no need for it on my site). Playing audio in the browser can be achieved in HTML5 compliant browsers that support native audio.

Read these:
Using Audio in the Browser – HTML5 Doctor
Audio Element – Mozilla Developer Network

Here are some plugins:
Audio.js
Sound Manager 2

But of course, rolling your own is always encouraged ;)

Daniel.

Offline

#9 2012-08-19 22:39:00

gfdesign
Member
From: Argentina
Registered: 2009-04-20
Posts: 401

Re: Portfolio of Daniel Hritzkiv

Thanks Daniel for those links and your quick reply. Previously, I’ve worked with audio in HTML5 but never with contents loaded by AJAX. So, that was my doubt. BTW, do you use any method for keeping the clean URLs? Examples that I’ve seen using AJAX for loading content they always uses the same URL and they don’t in a specific page as your site does (at least the examples I saw).

Offline

#10 2012-08-19 22:45:29

dhritzkiv
Member
From: Toronto, Canada
Registered: 2011-02-23
Posts: 14
Website

Re: Portfolio of Daniel Hritzkiv

@gfdesign Check out pushState() or replaceState() JS browser methods:
https://developer.mozilla.org/en-US/docs/DOM/Manipulating_the_browser_history

Last edited by dhritzkiv (2012-08-19 22:46:00)

Offline

#11 2012-08-19 23:26:44

gfdesign
Member
From: Argentina
Registered: 2009-04-20
Posts: 401

Re: Portfolio of Daniel Hritzkiv

I’ll do it. Thanks again!

Offline

#12 2012-09-07 18:59:28

vk
Member
From: Indonesia
Registered: 2008-02-27
Posts: 46
Website

Re: Portfolio of Daniel Hritzkiv

+1 #SuperAwesome


Viking KARWUR
Textpattern Enthusiast & I run MadebyVK A small web design and web development studio based in Jakarta, Indonesia.
I’m @vikingkarwur and @MadebyVK on Twitter

Offline

Board footer

Powered by FluxBB