Random Quotes
Loads the quotess from a JSON file via AJAX and randomly flips through them. I realized during the developement of this that creating a JSON file can be a pain in the bum by hand so I created a Python script that will create the JSON file.
JSON format
The JSON file is an array of objects with the keys q and c.
[
{
'q':'The testimonial goes here. It can have HTML elements in it.',
'c':'The person who said it'
},
{
'q':'This guy really knows what he\'s doing!',
'c':'Random Person,Owner<br>Widgets Inc.'
}
]
JSON Generator
The code below takes a semi-formatted text file and converts it to JSON appropriate for use with the widget.
#! /usr/bin/env python
'''
Creates the JSON for the random quote widget
'''
from __future__ import print_function
import io
def cleanText(text):
''' Quotes quotes and replace newlines with <br>s '''
return text.replace('"','\\"').replace('\n','<br>')
input= io.FileIO('testimonials.txt','r')
input= io.BufferedReader(input,4096)
input= io.TextIOWrapper(input,encoding='UTF-8')
output= io.FileIO('testimonials.json','w')
output= io.BufferedWriter(output)
output= io.TextIOWrapper(output,encoding='UTF-8')
cite_block=False
#start the file
output.write(u'[{"q":"')
textbuf=''
while True:
line=input.readline()
# break on EOF
if line=='':
break
# skip comments
if line[0]=='#':
continue
# end of block reached
if line[0]=='\n':
if textbuf.strip()=='':
# extra blank line, skip
continue;
if !cite_block:
# end of quote block
cite_block=True
output.write(cleanText(textbuf)+'","c":"')
else:
# end of cite block
cite_block=False
output.write(cleanText(textbuf)+'"},{"q":"')
textbuf=''
continue
textbuf+=line
output.write(cleanText(textbuf)+'"}]')
input.close()
output.close()
Input File Format
The basic format for this very simple. Testimonial is first, then at least one blank line, and then the citation. HTML and HTML entities can be used.
The examples below are from a previous client and has their client information masked out.
##################################
# Raw testimonials
#
# Please run all of them through the text cleaner first.
# http://192.168.0.50/tools/text-cleaner.php
#
# Formatting Instructions:
# Separate quotes and who said it with a blank line.
#
# For example:
# 1st quote paragraph
# 1st quote paragraph(note no blank line!)
# (blank line)
# Who said it
# (blank line)
# 2nd quote paragraph
# 2nd quote paragraph
# (blank line)
# Who said it
#
# Starting a line with # causes the parser to ignore it.
##################################
Don't cry because it's over, smile because it happened.
Dr. Seuss
I'm selfish, impatient and a little insecure. I make mistakes, I am out of control and at times hard to handle. But if you can't handle me at my worst, then you sure as hell don't deserve me at my best.
Marilyn Monroe
# comment
Be yourself; everyone else is already taken.
Oscar Wilde
# extra blank lines are ignored
Be who you are and say what you feel, because those who mind don't matter, and those who matter don't mind.
Bernard M. Baruch
You've gotta dance like there's nobody watching,
Love like you'll never be hurt,
Sing like there's nobody listening,
And live like it's heaven on earth.
William W. Purkey
The JavaScript
(function($){
"use strict";
$.fn.extend({
testimonials:function(options){
options=$.extend(
{
'fadeOut':500,
'fadeIn':250,
'waitPerLine':1530
},options||{}
);
this.append('<blockquote><p>Loading...</p></blockquote>');
var $ui=this.children('blockquote.testimonial').first();
var sizer=$('<blockquote style="display:none"></blockquote>'),
test_data=[],
change=function(){
if(test_data.length==0)return;
var idx= Math.floor(Math.random()*test_data.length);
idx=test_data[idx];
sizer.html('<p>'+idx.q+'</p><cite>'+idx.c+'</cite>');
$ui.animate({'opacity':0,'height':sizer.height()+'px'},options.fadeOut,'linear',
function(){
$ui.html('<p>'+idx.q+'</p><cite>'+idx.c+'</cite>')
.css('height','auto')
.animate({'opacity':1},options.fadeIn,'linear');
}
);
setTimeout(change,
(
(sizer.height()/parseInt(sizer.css('line-height'))
)*options.waitPerLine)+750);
};
this.append(sizer);
sizer.css('width',$ui.width()+'px');
$.getJSON(options.location)
.done(function(data){
test_data=data;
change();
})
.fail(function(jqxhr,text,err){
$ui.html('Failed to load the quotes. '+text+': '+err);
});
}
});
})(jQuery);
//Init code
$(function(){
$('#quotes').quoteRotator(
{
'location':'/projectfiles/jstestimonials/testimonials.json'
}
)
});
Options
Name | Default | Description |
---|---|---|
fadeOut | 500 | Amount of time in milliseconds for the fade out |
fadeIn | 250 | Amount of time in milliseconds for the fade in |
waitPerLine | 1530 | Amount of time in milliseconds per line to wait before loading the next |
location | None. Must be set. | The location of the JSON file |