Tampilkan postingan dengan label standalone. Tampilkan semua postingan
Tampilkan postingan dengan label standalone. Tampilkan semua postingan

Rabu, 04 Desember 2013

IdeaFeed - Interactive User Feedback System (Forms)

What is it?


IdeaFeed is a feedback system which allows for the collection of different
feedback properties from live users through a customizable form based survey.


This system is an intent to collect useful information for further
enhancement and stability of a website whether it be in beta or production
level.

Demo


Live demo & docs: http://ideafeed.nsyed.com/


Administration demo: http://ideafeed.nsyed.com/ideafeed/
user: admin
pass: password

Features


General:

  • Multi-Language support (English, Spanish, Russian)

  • PHP5 and MySQL5 powered

  • Ajax powered

  • Built-in ORM

  • Built-in forum

  • Automated installation process

  • Ability to post replies

  • Ability to collect public vote (up or down)

  • Categories: Question, Idea, Compliment, and Problem

  • Secured admin panel

  • Collective user system

  • User rating collection at end of new feed

  • A new implementation of color captcha

  • Call IdeaFeed through custom element (i.e. link, div, span, *any element)


Administration:

  • Extensive statistical information

  • Feed search/view/modification system

  • Post search/view/modification system

  • User search/view/modification system

  • Enable or disable system

  • Ability to control which pages to display feedback button

  • Easy language selection

  • Control email notification of new feeds

  • Control automatic activation of feeds and posts

  • Control whether or not to automatically start IdeaFeed button

  • Configure start delay time

  • Customize title of feedback modal

  • Customize button position

  • Customize button text

  • Customize button foreground & background colors

  • Customize button radius

  • Customize button’s special border



Change log


v1.1.0 – 11/29/2013

  1. Feature: Added gravatars

  2. Modal: Added feed count to each category

  3. Modal: Choose language on the modal

  4. Modal: Highlight author replies

  5. Modal: Highlight admin replies

  6. Bug Fix: Proper feed display for posts


v1.0.7 – 11/23/2013

  1. Feature: Manual initiation of IdeaFeed

  2. Admin: Subcategorized settings

  3. Admin: Control manual/automatic activation of feeds

  4. Admin: Hide button on startup

  5. Admin: Add time delay to show button

  6. Admin: More advanced post management


v1.0.1 – 11/22/2013

  1. Bug Fix: Fixed hidden buttons in some browsers by adding a conditional scrollbar to new feed section

JSON Painter (Miscellaneous)

If you have ever had a need to read a raw JSON string, you probably noticed that it aint that much human-readable…



What is JSON painter?


This simple jQuery plugin will reformat and colorize any valid JSON, and you eyes will be forever gratefull for it :)



Here are the highlighs:



  • Formats the JSON

  • Syntax highlight

  • Open / close individual object whitin


  • One js file (3.1Kb) + one line of code

  • Handles both JSON strings and objects

  • Customize the style via CSS to fit your needs



See it in action


I beleive that there is no need to describe this plugin in more details, but if you are intrigued – here is a online demo with code snippets.



The How to guide



Step 1:
Download the script and place wherever you place the java scripts.




Step 2:
Include the jQuery and the JSON painter script in the <head> tag of your document, like this:



<head>
<!-- additional header content -->

<script type="text/javascript" src="http://code.jquery.com/jquery.min.js" charset="utf-8"></script>
<script type="text/javascript" src="jquery.jsonPainter-1.0.js" charset="utf-8"></script>
</head>

Note that if you already have jQuery plugin included, you do not need to include it twice.


Step 3:
Create an element in the document that will hold the painted JSON



<div id="json"></div>



Step 4:
Have fun :)



<script type="text/javascript">

// Transform the data within the element (no params passed)
$('#json').jsonPainter();

// Show painted JSON from a atring
var str = '{ node: "value", list: [ 1, 3, 4 ] }';
$('#json').jsonPainter(str);

// Show painter JSON from an object
var obj = { node: "value", list: [ 1, 3, 4 ] };
$('#json').jsonPainter(obg);
</script>



Step 5:
If you are familiar with CSS, you can easily define your own styles.
Simply customize the snipper below add it to the <head> tag of your HTML document.



<style>

/** Define gloval style, like font size and family */
jsonpainter { }

/** Define how the key will be show */
jsonpainter-key { }

/** Define style for each variable type */
jsonpainter-value { }
jsonpainter-value-url { }
jsonpainter-value-null { }
jsonpainter-value-number { }
jsonpainter-value-string { }
jsonpainter-value-boolean { }
jsonpainter-value-boolean-true { }
jsonpainter-value-boolean-false { }

</style>