UiTwidgets build on Drupal7 by CultuurNet

29
UiTwidgets [email protected] @svenhoutmeyers More than ‘just a widget’

description

Presentation in Dutch about the release of the new UiTwidgets, a platform build on Drupal7 to configure en preview widgets to expose our event data.

Transcript of UiTwidgets build on Drupal7 by CultuurNet

Page 1: UiTwidgets build on Drupal7 by CultuurNet

UiTwidgets

[email protected]@svenhoutmeyers

More than ‘just a widget’

Page 2: UiTwidgets build on Drupal7 by CultuurNet

Wat gaan jullie te zien krijgen?1. Developmentfase met demo2. Wat is er nieuw? 3. Overzicht tools.uitdatabank.be met demo

Page 3: UiTwidgets build on Drupal7 by CultuurNet

Widgets? Facebook

<iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fplatform&amp;width=292&amp;colorscheme=light&amp;show_faces=true&amp;stream=true&amp;header=false&amp;height=395" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:395px;" allowTransparency="true"></iframe>

Via iframe tag

Of via Facebook Javascript API en tag<div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like-box href="http://www.facebook.com/UiTinVlaanderen" width="292" show_faces="true" stream="true" header="false"></fb:like-box>

Page 4: UiTwidgets build on Drupal7 by CultuurNet

Widgets? Twitter

<script src="http://widgets.twimg.com/j/2/widget.js"></script><script>new TWTR.Widget({ version: 2, interval: 6000, width: 100, height: ff0000, theme: { shell: { background: '255', color: '0' }, tweets: { background: '0', color: '0', links: '100' } },}).render().setUser('ff0000').start();</script>

Via script tag

Page 5: UiTwidgets build on Drupal7 by CultuurNet

Widgets? CultuurNet: zoekbox + resultaten

Tags voor HEAD

<link href="http://build.uitdatabank.be/widgets/p/271/widgets.css". <script type="text/javascript" src="http://build.uitdatabank.be/widgets/js/json.js"></script><script type="text/javascript" src="http://build.uitdatabank.be/widgets/p/271/widgets.js"></script>

<div id="widgets_search" class="widget"></div>

<div id="widgets_output" class="widget"></div>

Tags voor zoekbox

Tags voor resultaten/detail

Page 6: UiTwidgets build on Drupal7 by CultuurNet

Scope van de nieuwe widgets?

• Nieuwe features:

• “In de kijker” (UiTtips)

• HTML blokken

• Meer configuratieopties

• Geen custom widgets meer

• 1 tag ipv verschillende tags in head en body

• Verschillende API’s kunnen aanspreken

• Clean html / css / js

• Integratie met API projecten, documentatie,

issuetracker,...Dit werden dan ook de uitdagingen

Page 7: UiTwidgets build on Drupal7 by CultuurNet

Wat werd er behouden?

• Basis functionaliteit zoekbox / resultaatslijst / detail• Javascript (tov iframes)• Basis workflow (patnermedewerker geeft toestemming om

widget aan te maken)

Page 8: UiTwidgets build on Drupal7 by CultuurNet

Keuze Drupal (uit bestek):

1. Groot deel kan gebouwd worden met contributed modules (cck, views, context, rules, notifications ...).

2. Alle Front End sites van CultuurNet zijn Drupal, waardoor er zich toch al een kenniscentrum binnen CultuurNet heeft ontwikkeld over Drupal. Tevens beschikken we over 2 developers met Drupalkennis.

3. Cultuurnet Vlaanderen beschikt over een Drupal framework (de „CultuurNet API‟ of „CnAPI‟).

Meer info over CnAPI op http://build.uitdatabank.be/docs/Cnapi.pdf (binnenkort op tools.uitdatabank.be/docs ;-)

Page 9: UiTwidgets build on Drupal7 by CultuurNet

Toch ook twijfels

1. Beheerderstool: keuze Drupal vrij evident

2. Keuze widgetserver: keuze opengelaten in bestek

Page 10: UiTwidgets build on Drupal7 by CultuurNet

Uiteindelijk toch gekozen voor Drupal, 7!

• Bestek van leverancier Statik was overtuigend genoeg dat de widgetserver ook met Drupal/php performant en schaalbaar kon worden opgezet

• Vermits versie 7 stabiel genoeg was om op verder te gaan werd er beslist om op deze versie verder te bouwen.

Timing

Dev OO interface widgets

november december

Dev beheerderstool

januari februai maart april

Testing

Testing & tweaking tool

Soft rollout widgets

Page 11: UiTwidgets build on Drupal7 by CultuurNet

Architectuur UiTdatabank

Page 12: UiTwidgets build on Drupal7 by CultuurNet

Architectuur widgets

Page 13: UiTwidgets build on Drupal7 by CultuurNet

DEMO code / aanmaak nieuwe widget

Page 14: UiTwidgets build on Drupal7 by CultuurNet

Wat is er nieuw op tools.uitdatabank.be?

En is interessant voor jullie partners?

Page 15: UiTwidgets build on Drupal7 by CultuurNet

Zoekbox

• Zowat alle mogelijke zoekparameters kunnen in de zoekbox verwerkt worden

• Flexibele rubricering• Custom filtering

Page 16: UiTwidgets build on Drupal7 by CultuurNet

Resultatenlijst/detailpagina

• Verfijningen• Verrijkingen (Service attachments)• Custom sortering• Custom filtering

Page 17: UiTwidgets build on Drupal7 by CultuurNet

UiTtips

• Volledig nieuw soort widget om events in de kijker te zetten.

• Carrousel- of lijstpresentatie.• Manuele- of automatische selectie

van events

Page 18: UiTwidgets build on Drupal7 by CultuurNet

HTML box• Paginavullende widgets• Flexibel• 1 tag

Page 19: UiTwidgets build on Drupal7 by CultuurNet

Toekomst?

Nieuwe features / widgets / functionaliteiten zullen op een vrij makkelijke manier toe te voegen zijn.

Denken we vooral aan UiTid (Culture Feed)!

http://www.uitinvlaanderen.be/aanbevelingstest

Page 20: UiTwidgets build on Drupal7 by CultuurNet

Wat is er nieuw?

En wat is interessant voor jullie?

Page 21: UiTwidgets build on Drupal7 by CultuurNet

tools.UiTdatabank.be!

Page 22: UiTwidgets build on Drupal7 by CultuurNet

tools.UiTdatabank.be

• Projectbeheer van alle online publicaties op basis van UiTdatabank

• Documentatie (rechtstreeks via tools.uitdatabank.be/docs):• Widgets• CnAPI (coming)• Search API• Import

• Widgets bouw- en beheersmodule• Issuetracker• Login = UiTdatabank account (!)• Permissies: aanvragen van ‘advanced user permissions’

Page 23: UiTwidgets build on Drupal7 by CultuurNet

Projectbeheer

• Aanvraagformulier projecten

• Configuratie en beheer van lopende projecten

Page 24: UiTwidgets build on Drupal7 by CultuurNet

Widget bouwen: 1. drag and drop componenten

Page 25: UiTwidgets build on Drupal7 by CultuurNet

Widget bouwen: 2: Klikken en configureren

Page 26: UiTwidgets build on Drupal7 by CultuurNet

Widget bouwen: 2: Klikken en configureren

Advanced features:• Zoekbox op andere sites plaatsen• Zoeken op zowat elk WAT/WAAR/WANNEER veld met

verschillende control mogelijkheden (invul, dropdown, autosuggest, kalender, …)

• Resultaten: velden en labels ervan bepalen• Resultaten: extra parameters toevoegen• Resulaten sorteren, verfijningen tonen (facetten), …• Detailpagina: Google Maps, afbeeldingen, logo ‘Vlieg’, …• Detailpagina: service attachments (feature to be released)• UiTtips: push of view van events, obv zoekcriteria of obv

event id’s

Page 27: UiTwidgets build on Drupal7 by CultuurNet

Widget bouwen: 3. Plug and play.

• Alle configuratie-opties in ééninterface

• Widgets passen zich uitstekend aan CSS van de partner

• Klein beetje grafische finetuning door de leverancier

Page 28: UiTwidgets build on Drupal7 by CultuurNet

Samenvatting Tools.uitdatabank.be

• Alle geavanceerde UiTdatabank-mogelijkheden onder één dak

• Handleidingen opvragen• Nieuwe projecten aanvragen• Meldpunt voor problemen

Demo! tools.uitdatabank.be

Page 29: UiTwidgets build on Drupal7 by CultuurNet

Oude widgets?

Migratie oude widgets• Cnet bouwt widgets na, bezorgt tags (augustus)• Jaar tijd om in te plakken• Oude machine wordt afgezet

Vragen?