Archive for category: demos

You are here: / / demos

jQuery / jQuery UI / CKeditor4 / Layout Editor

/in , , , , /by

In my search for a visual composer style plugin but *not* for wordpress, I didn’t find much. So I thought I’d try and build one (jQuery isn’t my strong suit) – what do you think?

Edit: now released as a jQuery plugin: gridmanager.js

New Open Source Project – Room Booking System

/in , , , , /by

I’m pleased to announce a new open source project for a room booking system – it’s basically a backend to the excellent fullcalendar.js jQuery plugin, using cfWheels as the back end.

Features include:

  • All (well most) configuration done via database settings
  • Uses the DBMigrate plugin for cfWheels for easy future updates
  • Uses the FullCalendar.js month/day/week views
  • Allows for multiple locations, which can be filtered from the main view
  • Each location can be colour coded, and have room layout options
  • Allows you to bulk create events, so easy to add placeholders for repeating series
  • Completely configurable via web interface, all you need to do is setup a datasource called ‘roombooking’
  • Has a theme switcher so you can use/try any theme on http://bootswatch.com/
  • Can send confirmation emails on a new booking

You can download the code from gitHub – https://github.com/neokoenig/RoomBooking or try a demo at http://roombooking.oxalto.co.uk. Some screenshots below. Full documentation at http://roombooking.readme.io/

 

Feel free to contribute or log a bug at https://github.com/neokoenig/RoomBooking – hopefully it’ll be useful for someone!

Download Now From gitHub
Try a Demo

Query to Unordered/Ordered List with hierachy

/in , /by

This has been bugging me for ages – how to take a query object, and loop it into an unordered/ordered list, with the script working out when the various ‘LI’ and ‘UL’ elements should be closed or opened.

I didn’t want to specify a parent item in the query, all I wanted to do is specify the depth – i.e how many levels from the top the LI element is.

So here, for the greater good (or bad, depending if you like/agree with my code) is my solution….

<cfsilent>
<cfscript>
	menu=querynew("id,name,link,depth,sortorder", "integer,varchar,varchar,integer,integer");
    queryaddrow(menu, 10);
	
        counter=1;
        QuerySetCell(menu, "id", counter, counter);
        QuerySetCell(menu, "name", "Home", counter);
        QuerySetCell(menu, "link", "/", counter);
        QuerySetCell(menu, "depth", 1, counter);
		QuerySetCell(menu, "sortorder", counter, counter);
         counter=counter+1;
        QuerySetCell(menu, "id", counter, counter);
        QuerySetCell(menu, "name", "Home", counter);
        QuerySetCell(menu, "link", "/", counter);
        QuerySetCell(menu, "depth", 1, counter);
		QuerySetCell(menu, "sortorder", counter, counter);
         counter=counter+1;
        QuerySetCell(menu, "id", counter, counter);
        QuerySetCell(menu, "name", "Home", counter);
        QuerySetCell(menu, "link", "/", counter);
        QuerySetCell(menu, "depth", 2, counter);
		QuerySetCell(menu, "sortorder", counter, counter);
         counter=counter+1;
        QuerySetCell(menu, "id", counter, counter);
        QuerySetCell(menu, "name", "Home", counter);
        QuerySetCell(menu, "link", "/", counter);
        QuerySetCell(menu, "depth", 2, counter);
		QuerySetCell(menu, "sortorder", counter, counter);
         counter=counter+1;
        QuerySetCell(menu, "id", counter, counter);
        QuerySetCell(menu, "name", "Home", counter);
        QuerySetCell(menu, "link", "/", counter);
        QuerySetCell(menu, "depth", 3, counter);
		QuerySetCell(menu, "sortorder", counter, counter);
         counter=counter+1;
        QuerySetCell(menu, "id", counter, counter);
        QuerySetCell(menu, "name", "Home", counter);
        QuerySetCell(menu, "link", "/", counter);
        QuerySetCell(menu, "depth", 1, counter);
		QuerySetCell(menu, "sortorder", counter, counter);
         counter=counter+1;
        QuerySetCell(menu, "id", counter, counter);
        QuerySetCell(menu, "name", "Home", counter);
        QuerySetCell(menu, "link", "/", counter);
        QuerySetCell(menu, "depth",2, counter);
		QuerySetCell(menu, "sortorder", counter, counter);
         counter=counter+1;
        QuerySetCell(menu, "id", counter, counter);
        QuerySetCell(menu, "name", "Home", counter);
        QuerySetCell(menu, "link", "/", counter);
        QuerySetCell(menu, "depth", 3, counter);
		QuerySetCell(menu, "sortorder", counter, counter);
         counter=counter+1;
        QuerySetCell(menu, "id", counter, counter);
        QuerySetCell(menu, "name", "Home", counter);
        QuerySetCell(menu, "link", "/", counter);
        QuerySetCell(menu, "depth", 2, counter);
		QuerySetCell(menu, "sortorder", counter, counter);
         counter=counter+1;
        QuerySetCell(menu, "id", counter, counter);
        QuerySetCell(menu, "name", "Home", counter);
        QuerySetCell(menu, "link", "/", counter);
        QuerySetCell(menu, "depth", 1, counter);
		QuerySetCell(menu, "sortorder", counter, counter);
    </cfscript> 
    
<cffunction name="createListFromQuery" returntype="string" access="public" output="no">
    <cfargument name="menu" type="query">
    <cfargument name="type" type="string" default="ul">
    <cfset var previousRowDepth=1>
    <cfset var nextrowDepth=1>
    <cfsavecontent variable="output">
	<cfoutput> 
    <#arguments.type#>
    <cfloop query="menu">
    <cfquery name="query" type="query">
    SELECT * FROM arguments.menu WHERE id=<cfqueryparam cfsqltype="cf_sql_integer" value="#(currentrow + 1)#">
    </cfquery>
     
         <cfscript>
		 if (query.recordcount == 1){
		 	nextrowDepth=query.depth;
		 }
	 	if (depth == previousRowDepth && depth == nextrowDepth && currentrow != 1){
      		writeoutput("</li>");}
		if (depth > previousRowDepth){
			for(i=1; i <= #(Depth - previousRowDepth)#; i++) {
      			writeoutput("<#arguments.type#>");}
      	} 		
		if (depth < previousRowDepth){
			for(i=1; i <= #(previousRowDepth - Depth)#; i++) {		
				writeoutput("</#arguments.type#></li>");
			 }
		}
		writeoutput("<li><a href=""#link#"">#name# (Depth = #Depth#)</a>");
		 if (query.recordcount ==1) {
		  if (depth > previousrowDepth && depth >= nextrowDepth){
			writeoutput("</li>");}
		  if (previousRowDepth > depth && depth > nextrowDepth){
			writeoutput("</li>");}
		  if (nextrowDepth = depth && currentrow == 1){
			writeoutput("</li>");}
		  }
		  else if (currentrow == arguments.menu.recordcount) {
			  for(i=1; i <= #(previousRowDepth - Depth)#; i++) {
					writeoutput("</li></#arguments.type#>");}
					}			 
		  previousRowDepth=Depth;
		  </cfscript> 
       
    </cfloop>
	</cfoutput>
    </cfsavecontent>
    <cfreturn output />
</cffunction>
</cfsilent>
<cfoutput> 
<html>
<head>List Demo</head>
<body> 
#createListFromQuery(menu, 'ul')# 
</body>
</html> 
</cfoutput>

Ideas on how I might improve this to be more efficient welcomed!