I saw WOW.js on Product Hunt today and thought, "neat, that looks like fun." I'd also had the thought to play around with the Hacker News FireBase API so why not merge the two?

It's quite easy to change the way a Bootstrap modal appears. The basic premise is to replace the .modal.fade and .modal.fade.in classes. You can use any number of transformations and transitions. For this example I'm growing and fading the modal in from below. This is all the CSS you need to modify your vanilla Bootstrap modals.

In my attempt to mimic Google's Material Design circular button I ran into some hardships dealing with cross browser compatibility. Centering a plain text "+" sign within a circle is much more difficult that it seems. Not because the CSS is complicated, but because each browser interprets the CSS differently. There is a particular discrepancy between Mozilla and Webkit. My first attempt used line-height..

We now support CodePen embeds! While our page editor strips out most HTML tags, including <script> tags, we've made a special provision to support tags specifically from CodePen. All you need to do is paste the embed code directly from CodePen into the page editor.

One of our more advanced features here at Hawkee is our markdown page editor. What sets it apart is fluid integration with CodeMirror to quickly and easily add code to a page. There's no fumbling with tabs and no need to paste between fences. This article gives a general overview of how it works.

You might be wondering where the snippets went and what these new "Pages" are. To answer that, let me give you a little history. When we introduced snippets in 2004 (10 years ago) the concept was simple: Paste a single block of code into a textarea and share it. This was a popular medium at the time. Syntax highlighting wasn't even necessary. We just offered the code back in plain black and white..

This will show you how to handle form errors with Node.js and AngularJS when server-side validation is necessary. It highlights the erroneous field and displays an error message below indicating the problem. This example uses Node.js, Express, Express Validator, AngularJS and Bootstrap 3.

Hawkee uses the most common form of Markdown with many GitHub elements such as fenced code and tables. Here are some examples to help you create more clear and easy to understand pages.

This will take a string of keywords and wrap a highlight span around each word. It takes two inputs: keywords and element:

This uses jQuery to convert an HTML string containing < code > tags into language specific CodeMirror containers. This supports a "lang" attribute to indicate the CodeMirror mode for each code block. Here is some example input:

This will run nl2br on everything inside a string except for what is between the opening and closing tags. For example you can add 's to a comment that contains [ code ] tags without touching the code itself:

These are the steps necessary to compile the SphinxSE plugin for mySQL 5.5. This varies slightly from the 5.1 method because you don't use the ./configure command.

This is a very handy query that sorts your tables by their physical size in megabytes. Just be sure to edit the query to include the database name.

This is a command line script that interfaces with Minecraft via rcon. It gives all the players on your server a chance to win a random item by typing "join". Here are the different modes:

This is an easy to maintain method for creating clean urls without any file extensions. It's very good for hiding your underlying programming language and offers a more user friendly experience. It only uses a single series of mod_rewrite rules then all the rest of the logic can be accomplished within your script. You'll need mod_rewrite enabled and you can put these rules into your .htaccess or..

Ever wonder how many posts were made over the past few days or months? This is a very simple data visualization tool that shows you exactly how many.

This is the server side component to my jQuery @mention autocomplete plugin. It simply queries mySQL with a wildcard matching the term sent by jQuery. You'll need to modify the query to match your own schema.

This will automatically append the next page of results as you continue to scroll down a page.

This is a very handy command to avoid running the same query twice. It will tell you how many total rows there are when you only need a handful. You need to run the second query immediately following the first. If you leave out SQL_CALC_FOUND_ROWS from the first query FOUND_ROWS() will simply return the number or results you got, 10 in this case.

This will allow you to style the Uploadify upload button. Normally this button is generated through the flash object, so it's a bit tricky replacing it with a CSS button. You have to use the proper parameters to make the flash object transparent and position a CSS button over your text while positioning the flash object over the CSS button. Here is the HTML:

This widget lets you search for users to @mention in your posts. It works very much like Facebook and Google+ in that it supports users with spaces in their name. It writes to a hidden field with the user ID's formatted in this way: @ [12345] while showing @username in the input box. You can save the encoded string for easier parsing at display time.

This will take the date and time posted of an object in mySQL and convert it to a human readable form through PHP. It has 3 different modes of displaying the age:

This function will return a list of page numbers similar to the Google search results style. It will currently show up to 15 page numbers at a time and this value can be adjusted within the function.

This is a very useful script for monitoring mySQL load on a server. It will check your mySQL slow query log file and email the contents to you. It also appends the size of the file to the email subject to give you an idea of how severe the problem is at a glance. Here are the settings that go into your my.cnf file:

This will take a CSV file, create a table, and insert the data. The file needs to have a header row indicating the field names. Once it's created it uses a simple load data infile call.

This code will search the Snippets section of Hawkee.com and return a list of matching snippets on your iPhone. It demonstrates how to retrieve data from a URL and parse it using a regular expression.

This is a very short and simple snippet that will take a given string, $string, and if it is plural the 's' will be removed from the $string.

This will extract the search query from a Google search. It doesn't specifically look for Google in the referer so it may capture more than just Google searches. You can use this information to re-perform the search on your own site or just keep it for your own records.

This is a simple Javascript snippet that lets you toggle a group of checkboxes on or off at the same time. This is the format for your HTML form:

This is a very simple Javascript toggle that'll show or hide a div depending on its current state. Here is the HTML code: