Dawson Arts is a floating collective team of Ballet specialists who collaborate with famous British dance maker, David Dawson. Over the past decade Dawson's collective have created and performed their works at many top international venues.

www.dawsonarts.net

About the website

The homepage features a slideshow and three equal sized dynamic Views blocks. The design choice has obvious implications and will not fit on all screen sizes. However, Dawson Arts aims to stand out and accepts the consequences. The website kind of looks like a Flash website, but it is not.

The closeup section provides a biography about choreographer David Dawson, interviews and acknowledgements. For custom the slider barwe choose to use a jQuery plugin jScrollBar. These interviews ('dialogues') are regular D7 pages.

The work section presents Performances, a separate content type with custom fields. We added an image field for the slides and a reviews longtext block. The Reviews (once they are available) are shown as a Views menu tab at /node/%/Reviews. A custom PHP block helps navigate the performances in the top right corner. The previous-next buttons are a custom PHP/MySQL script to query previous and next nodes.

The blog section uses the Feeds module to import Twitter RSS messages. Tweets go along regular 'Blog' posts with an image upload option.

The team section represents all team members sorted by their last name, and grouped into five groups. This categorization does not use Taxonomy at all: we add the links to the Main Menu system manually.

Note on the menu system: the entire website is 1 main menu with 3 levels. Using the Context module, which already works for D7, we were able to tweak some custom blocks here and there based on active menus. The reason we did this, firstly for easy of use, but secondly for proper active-menu classes throughout the site. We use the menu firstchild module to help with navigation logic.

The lineup section is built with the Date module and Views with custom fields. We do not use the Events or Calendar modules, because they are inflexible, buggy and bloated. Views, Date and Core fields can do anything you ever needed for a Lineup.

The showroom consists of slides and video content types. The slideshows use custom jQuery combined with custom Views.

About Drupal 7

This Drupal 7 site uses regular modules, such as Views, Date and Core fields, to build a custom Lineup events section. Video galleries are provided by the Media and Media_Youtube modules. Extensive Photo galleries are provide by D7's built-in Image styles (D6 Imagecache).

We use many custom node, page and views templates to accomodate specific needs (&CSS) for each page. The Youtube videos are stored in the Media module, but output in a custom node--video.tpl.php with the regular html Youtube widget, to cut Media module overhead.

Drupal 7 was chosen for its major user-interface improvements - Client can manage their own site much more easily.

The slideshow transition effects are custom-built with basic jQuery, while the slides are retrieved with Views. A custom views template overrides the output to fit with our custom slideshow jQuery.

Credits

Design & project by Rem-art, http://www.rem-art.com
Drupal 7 development by Morningtime, http://www.morningtime.com

Photography by Dawson Arts

Comments

KingOfMyCastle’s picture

Lovely site you've made there.

I'm a little stuck on getting my YouTube videos playing in D7. I've got my Media and Media_Youtube modules running and I can enter the YouTube video's URL and see the preview image. But when visiting the node I just get a link to the YouTube page, no actual video.

I have the manage fields settings on "Multimedia asset" and "Media file selector" and display fields format "Original".

Can you let me know roughly how you did it? It would be much appreciated.

Thanks!

John..

Anonymous’s picture

I recognize your issue, had the same problem, but I use a temporary workaround. I just created a custom node--video.tpl.php and did this:

(my youtube field is $node->field_media)

<div id="node-<?php print $node->nid; ?>" class="<?php print $classes; ?> clearfix"<?php print $attributes; ?>>

  <div class="content clearfix"<?php print $content_attributes; ?>>
    <p><?php print $field_subtitle['0']['value']; ?></p>
    <div class="media-youtube-outer-wrapper">
      <div style="width: 748px; height: 448px;" class="media-youtube-preview-wrapper" id="video_<?php print $field_media['0']->filename; ?>">
        <object height="448" width="748">
          <param value="http://www.youtube.com/v/<?php print $field_media['0']->filename; ?>" name="movie">
          <param value="false" name="allowFullScreen">
          <embed height="448" width="748" allowfullscreen="false" type="application/x-shockwave-flash" src="http://www.youtube.com/v/<?php print $field_media['0']->filename; ?>">
        </object>
      </div>
    </div>
    <div class="video-desc">
      <?php print $body['0']['value']; ?>
    </div>
  </div>

</div>

The media module is still very buggy in D7... for now, this will have to do.

Dont' forget to visit 'Appearance' and then Clear all caches to recognize the new template.

KingOfMyCastle’s picture

I'll give this a go and let you know how it pans out.

I've created another post on the forum which asks the about the current general status of video in Drupal 7, so some other clever types may come up with alternative solutions. I've linked to your site and this post too.

John..

KingOfMyCastle’s picture

I just want to say thanks. It works like a dream.

I've set up Views too to display a list of video thumbnails list and it was easier than I expected.

Oh, and if anybody is stuck on getting the preview image to show in their View, select the Fomatter - Preview option at the bottom of the Views field edit screen.

heyyo’s picture

Instead of creating a new template file, an alternative could be to create a custom format with the module custom formatter.
http://drupal.org/project/custom_formatters

heyyo’s picture

It seems that in last Media the database structure has changed. $field_media['0']->filename doesn't work anymore.
Needs to add ['file']

socialtalker’s picture

the pictures really come alive with the design.
the type is too small for my eyes to read comfortably, but small type seems to be the fashion these days.
i like that fade to white effect at the bottom of the blocks. how do you do that?

Anonymous’s picture

Hi, that white fade is basically a transparent PNG image file, inside a DIV. About 150px high, with a fade from white to transparent. It's then used as a background for an absolutely positioned DIV at the bottom of the blocks.
That way text goes under it, and you get the fade effect.