Topic: Web Dev question

Offline Bell

  • Addicted
  • Bell is on the verge of being accepted.Bell is on the verge of being accepted.Bell is on the verge of being accepted.Bell is on the verge of being accepted.Bell is on the verge of being accepted.
  • Posts: 4,263
Hey smart people I have a random question.

So i'm doing a small side project for a friend that involves allowing people to SMS to a certain number that feeds messages into a database and then displays the messages on a website at the certain time.
There will also some be pictures that will be displayed at the same time as the messages in sort of a slide show fashion.
My mate would like to be able to deal with the slide show stuff on his side without me having to do it so he can control the feel.
So this all smells like flash to me but he has no skills in this and wanted something 'simple' that allows him to create picture transitions are there any other options?
Personally i'd like to just do this myself using abit of javascript there is probably some library that has already deal with this.

Any thoughts would be much appreciated.

Posted: April 04, 2013, 07:30:53 am

Offline Xenolightning

  • Moderator
  • Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!
  • Posts: 3,485
Design a library of JQuery transitions he can use. You set up all the parameters and make it pretty, maybe expose the transition time as a setting.

He'll get to choose from.
- Blinds - [ms]
- Slide Left - [ms]
- Spin - [ms]

etc..

EDIT: You could skip this^ step and try integrate with something like NivoSlider

Then create a simplistic slideshow creator page, can be as simple as a grid. Eg. Add photo, select transition for photo. Save slideshow to database, with transitions. (If no transition set maybe choose a random one)

Load slideshow into HTML
Success?

EDIT 2: Fuck Nivo Slider, https://github.com/joelambert/Flux-Slider, that looks boss. With a timer, transition attribute in html, and some other bits n pieces you should be able to boss a solution.
Last Edit: April 04, 2013, 08:31:43 am by Xenolightning

Reply #1 Posted: April 04, 2013, 08:06:50 am
-= Sad pug is sad =-

Offline Xenolightning

  • Moderator
  • Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!
  • Posts: 3,485
If you use flux, then here are 2 code snippets that I tested. These add support for adding data-transition attributes to specify the transition in the DOM.

Code: [Select]
//xeno: added support to copy for data- attributes
var img_attributes = $(found_img).prop("attributes");
$.each(img_attributes, function() {
if(this.name.indexOf('data-') > 0)
$(imgClone).attr(this.name, this.value);
});

Code: [Select]
if(transition == undefined || !flux.transitions[transition])
       {
//xeno: Added support to check a data-transition attribute
//if it exists then use that as the transition
var trans = $(this.getImage(this.currentImageIndex)).attr('data-transition');
if(trans === undefined){
// Pick a transition at random from the (possibly reduced set of) transitions
var index = Math.floor(Math.random()*(this.options.transitions.length));
transition = this.options.transitions[index];
}else{
transition = trans;
}
       }

Usage:
Code: [Select]

""


/Thread
Last Edit: April 04, 2013, 10:02:25 am by Xenolightning

Reply #2 Posted: April 04, 2013, 09:55:56 am
-= Sad pug is sad =-

Offline mycoolcar

  • Addicted
  • mycoolcar might someday be someone...mycoolcar might someday be someone...mycoolcar might someday be someone...mycoolcar might someday be someone...
  • Posts: 4,528
Like a boss.

Reply #3 Posted: April 04, 2013, 10:37:52 am

Offline Xenolightning

  • Moderator
  • Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!
  • Posts: 3,485
:afro:

Reply #4 Posted: April 04, 2013, 02:21:17 pm
-= Sad pug is sad =-

Offline Pyromanik

  • Hero Member
  • Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!
  • Posts: 28,834
Cycle. Best slider. Now in the flavour of 2.

http://jquery.malsup.com/cycle2

Nivo can be a cunt to set up, Flux I have not played with, but cycle is the most flexible thing I've ever used. Almost never go past it. Now also has plugin for 'tiles' (nivo-like behaviour). Even if you don't use it for images, can use it for messages, or anything (it's not just an image slider, it cycles any element).

http://www.joelambert.co.uk/flux/
Flux does look extremely sexy, but looks like it needs CSS3 features (so bascially no IE < 10).
Thanks for protip tho xeno.
Last Edit: April 04, 2013, 05:50:21 pm by Pyromanik

Reply #5 Posted: April 04, 2013, 05:43:21 pm
Everyone needs more Bruce Campbell.

Offline Bell

  • Addicted
  • Bell is on the verge of being accepted.Bell is on the verge of being accepted.Bell is on the verge of being accepted.Bell is on the verge of being accepted.Bell is on the verge of being accepted.
  • Posts: 4,263
Awesome replies, i'll give this a crack this weekend and tell yas how I get on.

Thanks heaps bros

Reply #6 Posted: April 04, 2013, 06:16:57 pm

Offline Bell

  • Addicted
  • Bell is on the verge of being accepted.Bell is on the verge of being accepted.Bell is on the verge of being accepted.Bell is on the verge of being accepted.Bell is on the verge of being accepted.
  • Posts: 4,263
Awesome replies, i'll give this a crack this weekend and tell yas how I get on.

Thanks heaps bros

Reply #7 Posted: April 04, 2013, 06:17:27 pm

Offline Xenolightning

  • Moderator
  • Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!
  • Posts: 3,485
Quote from: Pyromanik;1522569
Cycle. Best slider. Now in the flavour of 2.

http://jquery.malsup.com/cycle2

Nivo can be a cunt to set up, Flux I have not played with, but cycle is the most flexible thing I've ever used. Almost never go past it. Now also has plugin for 'tiles' (nivo-like behaviour). Even if you don't use it for images, can use it for messages, or anything (it's not just an image slider, it cycles any element).

http://www.joelambert.co.uk/flux/
Flux does look extremely sexy, but looks like it needs CSS3 features (so bascially no IE < 10).
Thanks for protip tho xeno.

Wow, I also like Cycle, shit legit. Giving and receiving that's what programming is about...

Yeah pitty about flux using CSS3. But DAYMN those 3D effects.

Reply #8 Posted: April 04, 2013, 11:07:51 pm
-= Sad pug is sad =-

Offline Pyromanik

  • Hero Member
  • Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!
  • Posts: 28,834
Yeh, I love cycle for making 0 assumptions on anything. No required HTML structure or anything. You just give it a collection of shit to cycle through and it does it. All the control in my hands.
And if you find some builtin component doesn't have the flexibility you want, it has all the right hooks in all the right places to get around it. Like building your own 'pager' system, etc.

Reply #9 Posted: April 04, 2013, 11:55:22 pm
Everyone needs more Bruce Campbell.

Offline Bell

  • Addicted
  • Bell is on the verge of being accepted.Bell is on the verge of being accepted.Bell is on the verge of being accepted.Bell is on the verge of being accepted.Bell is on the verge of being accepted.
  • Posts: 4,263
So I used cycle and it went fucking swimmingly cheers for the tip.

Reply #10 Posted: April 10, 2013, 02:15:22 am

Offline Xenolightning

  • Moderator
  • Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!
  • Posts: 3,485
Quote from: Bell;1522987
So I used cycle and it went fucking swimmingly cheers for the tip.
BAM AND THE DIRT IS GONE.

Son, I am Appoint.

Reply #11 Posted: April 10, 2013, 09:15:04 am
-= Sad pug is sad =-

Offline Pyromanik

  • Hero Member
  • Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!
  • Posts: 28,834
:D

Reply #12 Posted: April 10, 2013, 05:46:49 pm
Everyone needs more Bruce Campbell.

Offline Garrett303

  • I Posted!
  • Garrett303 has no influence.
  • Posts: 1
Guys.. please never delete my questions on cleanup. I need them PAQ'd for some statistical reasons. Probably some day I will get all them deleted but just now Ineed them Paq'd. Thanks

Reply #13 Posted: April 11, 2013, 03:05:11 pm

Offline Xenolightning

  • Moderator
  • Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!Xenolightning is awe-inspiring!
  • Posts: 3,485
^WTF

Reply #14 Posted: April 11, 2013, 03:20:15 pm
-= Sad pug is sad =-

Offline Pyromanik

  • Hero Member
  • Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!Pyromanik is awe-inspiring!
  • Posts: 28,834
Spambot. Duh.

Reply #15 Posted: April 11, 2013, 05:27:19 pm
Everyone needs more Bruce Campbell.