Question

I manage a Drupal 7 based website for my College’s Student’s Association. Most of it is standard static pages. Each year we run a room ballot for people to choose their rooms and this process will need an application to display current room allocations (in real time) and wiki style information about what the different rooms are like.

I need to be able to serve up static pages of HTML, javascript and css; bypassing the theming module. I need the relative addressing in the html page which serves as the root of the application to work properly (e.g. “javascript/app.js” should pick up that file from within the module). I then need to serve up json data from php using all the drupal APIs for permissions and database access etc.

I have a fair bit of experience in HTML, Javascript etc. and some in PHP, but I’m fairly new to Drupal module development.

Answer 1

You should create a custom module as you suggest, and separately put your HTML5 application in a sub-folder of the module. When it’s accessed it will use the same relative paths as you’d normally expect so javascript/app.js will work if the file exists in the path under your HTML5 app’s folder.

For the JSON data your custom module will look something like this:

function mymodule_menu() {
  $items['my/app/data'] = array(
    'page callback' => 'mymodule_ajax_callback',
    'access callback' => TRUE,
    'type' => MENU_CALLBACK
  );

  return $items;
}

function mymodule_ajax_callback() {
  $type = $_POST['type'];

  $nodes = db_query("SELECT nid, title FROM {node} WHERE type = :type", array(':type' => $type))->fetchAllKeyed();

  drupal_json_output($nodes);

  drupal_exit();
}

That code defines a menu path (using hook_menu()) at mp/app/data which uses mymodule_ajax_callback() as it’s page callback.

mymodule_ajax_callback() simply grabs all nodes from the database that match the type parameter passed in the AJAX $_POST and outputs their id and title in a JSON string to the page (which will then be returned as your AJAX response when you request /my/app/path).

Hope that helps