Difference between revisions of "PT Multimedia Version 1.0 Install"

From ADF Docs
Jump to: navigation, search
(→‎Subsites)
(→‎Reset the ADF)
 
(11 intermediate revisions by the same user not shown)
Line 99: Line 99:
 
# Create a new subsite under ''lightbox'' called ''multimedia''.
 
# Create a new subsite under ''lightbox'' called ''multimedia''.
  
−
== CCAPI Configuration ==
+
== Lightbox Template ==
−
The Photo Gallery Application uses the [[CCAPI|ADF CCAPI]] to populate profile records and create profile pages.  The CCAPI needs to be configured for the site and photo gallery application.
+
The Lightbox template will be used to render pages within a lightbox.  The Lightbox template may already exist on your site if you have installed another ADF application.  Check your sites templates before following the steps below to create the template.
  
−
First, follow the steps to set up the [[CCAPI Config|CCAPI Config]] file for the site. Once that configuration is complete, follow the steps below to set up the CCAPI config for the Photo Gallery application.  Make sure to update the ''wsVars'' section with the correct URLs and username/password.
+
=== Steps ===
 +
# Create a new page named ''Lightbox Template'' from the blank template.
 +
# Submit and activate the page.
 +
# Save the page as a template.
 +
# Submit the template for public use.
  
−
# Create a new page called 'ccapiPhoto'. Recommend creating this page in the ''/webadmin/photogallery/'' subsite.
 
−
# Add the 'Photo' element to the page.
 
−
# Select the 'Photo' element indicator and go to 'more...'.  Select 'Name' from the menu.
 
−
# In the Element Name field, enter the text 'ccapiPhotoElement'.
 
−
# Publish this page and view in read mode.
 
−
# Edit the 'ccapi.xml' file for the site and add the following xml block into the <elements> section:
 
−
<source lang="xml">
 
−
<Photo>
 
−
  <pageID>#####</pageID>
 
−
  <subsiteID>##</subsiteID>
 
−
  <elementType>custom</elementType>
 
−
  <controlName>ccapiPhotoElement</controlName>
 
−
</Photo>
 
−
</source>
 
  
−
To populate the <pageID> and <subsiteID> tags, view the source code for the 'ccapiPhoto' page that was just created.
+
== Multimedia Configuration ==
−
+
The Multimedia Configuration Pages will be used to manage the PTMultiMedia Configuration custom element. Follow these steps to configure the datasheet and page for adding media.
−
Identify the following line in the source code and enter this numeric value into the <subsiteID> tag:
+
=== Steps ===
−
<source lang="java">
+
# Create a new page called 'Configuration Manager' in the ''/webadmin/multimedia/'' subsite.
−
var jsSubSiteID = ##;
 
−
</source>
 
−
 
 
−
Identify the following line in the source code and enter this numeric value into the <pageID> tag:
 
−
<source lang="java">
 
−
var jsPageID = ####;
 
−
</source>
 
−
 
 
−
[[Reset ADF|Reset the ADF]] for the server and site.
 
−
   
 
−
== Configuration Page ==
 
−
The Photo Gallery Configuration Pages will be used to manage the PTPhotoGallery Configuration custom element. Follow these steps to configure the datasheet and page for adding photos.
 
−
 
 
−
# Create a new page called 'Configuration Manager' in the ''/webadmin/photogallery/'' subsite.
 
 
# In the main content of the page, add a Custom Script element.
 
# In the main content of the page, add a Custom Script element.
 
# Enter the explicit module path for:
 
# Enter the explicit module path for:
−
## ''/ADF/apps/pt_photo_gallery/customcf/photo_config_admin_ds.cfm''
+
## ''/ADF/apps/pt_multimedia/customcf/multimedia_config_admin_ds.cfm''
 +
# From the Datasheet element interface, click the "Datasheet" icon.
 +
# From the "Datasheet Views" dialog, follow the "Click here to create a new datasheet view" link.
 +
# Enter the following information and then click "Next":
 +
## Name: All Media
 +
## Private: unchecked
 +
## Default View: unchecked
 +
## Description: View to manage all of the media
 +
## Datasheet Source: Form Result/Custom Element Sheet
 +
# From the Datasheet Source dialog choose the "PTMultimedia Configuration" custom element and click "Next".
 +
# From the Datasheet Columns Dialog choose a few columns from the Available Columns list and move them to the Selected Columns list. (TITLE,CAPTION, etc...) and then click "Finish".
 +
# You will be brought to the Datasheet View page; click "Close" to return to your page.
 +
# You will see the datasheet element on this page now. Click the Datasheet element interface icon again and this time choose "Edit Columns".
 +
# From the Datasheet View Column Properties dialog choose the link for "Add a new action column".
 +
# Within the Action Column Properties dialog enter the following information and click "Finish":
 +
## Header: Edit
 +
## Hide Header: Checked
 +
## Column Text: edit
 +
## Window Target Name: <leave blank>
 +
## Modules: edit-form-data.cfm
 +
# From the Datasheet View Column Properties dialog, choose the link for "Add a new action column" again.
 +
# Within the Action Column Properties dialog enter the following information and click "Finish":
 +
## Header: Delete
 +
## Hide Header: Checked
 +
## Column Text: delete
 +
## Window Target Name: <leave blank>
 +
## Modules: delete-form-data.cfm
 +
# Close the Edit Column window.
 
# Publish the page.
 
# Publish the page.
 +
=== Create Multimedia Configuration Record ===
  
−
=== Create Photo Gallery Configuration Record ===
+
'''Note''' that this step assumes that you have [[PT_Multimedia_Build_Templates_Pages#Admin_Pages|previously created the admin pages]].
−
<!-- '''Note''' that this step assumes that you have [[PT_Photo_Gallery_Build_Templates_Pages#Admin_Pages|previously created the admin pages]]. -->
 
  
−
We are creating a single Photo Gallery Configuration element record to be used within the application.   
+
We are creating a single Multimedia Configuration element record to be used within the application.   
  
 
Go to the Add Configuration page and submit the form to create '''one record'''.   
 
Go to the Add Configuration page and submit the form to create '''one record'''.   
Line 151: Line 154:
 
These fields will be completed as the pages are built.
 
These fields will be completed as the pages are built.
  
−
See the [[PT_Photo_Gallery_Site_Configuration_2.0|Site Configuration]] wiki page for more information on the fields and the correct values.
+
See the [[PT_Multimedia Site_Configuration|Site Configuration]] wiki page for more information on the fields and the correct values.
  
 
[[Reset ADF|Reset the ADF]] for the server and site.
 
[[Reset ADF|Reset the ADF]] for the server and site.
  
−
== Upload Page ==
+
== Media Add ==
−
The Photo Upload Page will be used to upload new photos into the Photo Element.  
+
The Media Add Page is a lightbox page to create new media records.
  
−
# Create a new page called 'Photo Upload' from the Blank Layout Template and in the ''/webadmin/photogallery/forms/'' subsite.
+
Follow these steps to configure the link and page for adding media.
−
# In the main content of the page, add a Custom Script element.
+
=== Steps ===
−
# From the Custom Script element interface, click the "Edit" icon.
+
#Create a new page called 'Media Add' from the [[PT_Multimedia_Lightbox_Template|Lightbox Template]] and in the ''/lightbox/multimedia/'' subsite.
−
# Enter the following text into the Explicit Module path: ''/ADF/apps/pt_photo_gallery/customcf/handle_photo_upload.cfm''
+
#In the main content of the page place a Simple Form element.
−
# Publish the page.
+
#From the Simple Form element interface icons choose the "Select Form" icon.
 +
#In the Create/Select Simple Form dialog choose the option to "Select Simple Form/Custom Element" option and click "next".
 +
#From the Select Form/Custom Element dialog choose the "Multimedia" custom element and click "Finish".
 +
#Within the "Manage Simple Form Element" dialog, enter the following information:
 +
##Name: (leave as is)
 +
##Email Notification Recipients: (If you would like to receive an e-mail whenever new multimedia is added, then place your e-mail in here. This is optional)
 +
##Sender's Email Address: leave checked
 +
##Anonymous Sender's Email Address: (add in an anonymous email address if needed)
 +
##Form Action: choose "Display Textblock on Submission" option and add  'Media uploaded successfully!' text in the RTE. 
 +
##Select Finish and then Finish again.
 +
#Publish the page
  
−
=== Update Photo Gallery Site Config ===
+
=== Update Configuration ===
−
Update the Photo Gallery Configuration for the UPLOAD FORM URL field.  Edit the row in the datasheet and select the CommonSpot page that was created.
+
Update the Multimedia Configuration for the ADD URL field.  Edit the row in the datasheet and select the CommonSpot page that was created.
  
 
[[Reset ADF|Reset the ADF]] for the server and site.
 
[[Reset ADF|Reset the ADF]] for the server and site.
  
−
== Display Page ==
+
== Media Upload ==
−
The Photo Display Page will be used to render a photo to the user.  
+
The Handle Media Upload Page will be used to upload new multimedia into the Multimedia Element.
 +
 
 +
=== Steps ===
 +
#Create a new page called 'Handle Media Upload' from the [[PT_Multimedia_Lightbox_Template|Lightbox Template]] and in the ''/lightbox/multimedia/'' subsite.
 +
#In the main content of the page add a Custom Script Element.
 +
#From the Custom Script element interface, click the "Edit" icon. 
 +
#Enter the following text into the Explicit Module path: /ADF/apps/pt_multimedia/customcf/handle_media_upload.cfm.
 +
#Publish the page
 +
 
 +
=== Update Multimedia Site Config ===
 +
Update the Multimedia Configuration for the HANDLE MEDIA UPLOAD FORM URL field.  Edit the row in the datasheet and select the CommonSpot page that was created.
 +
 
 +
[[Reset ADF|Reset the ADF]] for the server and site.
  
−
# Create a new page called 'Photo Display' from the Blank Template and in the ''/webadmin/photogallery/forms/'' subsite.
+
== Media Player ==
 +
# Create a new page called 'Pop Up Player' from the [[PT_Multimedia_Lightbox_Template|Lightbox Template]] and in the ''/lightbox/multimedia/'' subsite.
 
# In the main content of the page, add a Custom Script element.
 
# In the main content of the page, add a Custom Script element.
 
# From the Custom Script element interface, click the "Edit" icon.
 
# From the Custom Script element interface, click the "Edit" icon.
−
# Enter the following text into the Explicit Module path: ''/ADF/apps/pt_photo_gallery/customcf/photo_display.cfm''
+
# Enter the following text into the Explicit Module path: ''/ADF/apps/pt_multimedia/customcf/media_lightbox_player.cfm''
 
# Publish the page.
 
# Publish the page.
  
−
=== Update Photo Gallery Site Config ===
+
=== Update Multimedia Site Config ===
−
Update the Photo Gallery Configuration for the DISPLAY URL field.  Edit the row in the datasheet and select the CommonSpot page that was created.
+
Update the Multimedia Configuration for the Pop-up Player URL field.  Edit the row in the datasheet and select the CommonSpot page that was created.
  
 
[[Reset ADF|Reset the ADF]] for the server and site.
 
[[Reset ADF|Reset the ADF]] for the server and site.
  
−
== Admin Manager Page ==
+
== All Media ==
−
The Photo, Photo Category, and Photo Size are global custom elements. Managing data for these global custom elements can be configured easily through the use of Datasheets. The following sections will describe how to configure a CommonSpot page to manage the data for the elements.
+
The Multimedia "All Media" search results display page will be used to display all of the multimedia associated with a current category or series based upon a URL variable.
  
 
=== Steps ===
 
=== Steps ===
−
#Create a new page with the title 'Photo Manager' and page name 'index' from the Base Plus One template and designate creation of the page in the ''/webadmin/photogallery/'' subsite.
+
# Create a new page called 'Multimedia Search Results' from the [[PT_Multimedia_Lightbox_Template|Lightbox Template]]. Create this page either in the root of the site or if you’ve created a subsite for your multimedia then create the page within the subsite.  Do not create the page under the lightbox subsite.
 +
# In the main content of the page, add the multimedia element.
 +
# Click the multimedia "Edit" icon.  Select “Render Mode” and choose the “Display existing element data (content reuse)”  radio button.  Click the “filter” tab and choose the “Show subset of records” radio button.  Choose “Category” from the FIELD SELECTION drop-down.  Choose “contains” from the OPERATOR selection drop-down.  Next you will need to  enter a coldfusion expression as the criteria.  Click on the grey box with the three dots to enter the expression and enter a value of “url.categoryid” in the expression field.  Click “OK”.  When you receive the “Variable url.categoryid is undefined” error message select the “ignore coldfusion error” checkbox and click “OK”.  Select the “update” button to commit your change and then select the “OK” button.
 +
# Assign render handler.  Select the multimedia “Edit” icon and then choose “more” to expand the menu and select “custom render handlers”.  Select the “multimedia search results” render handler and click “next”.  The next screen presents a metadata format where you may choose the desired display format (typically row of 3 thumbs) and then select “OK”.
 +
# Publish the page.
 +
 
 +
== Multimedia Manager ==
 +
The Multimedia, Multimedia Category and Multimedia Series elements are global custom elements. Managing data for these global custom elements can be configured easily through the use of Datasheets. The following sections will describe how to configure a ComonSpot page to manage the data for the elements.
 +
 
 +
=== Steps ===
 +
#Create a new page with the title 'Multimedia Manager' and page name 'index' from the Base Plus One template and designate creation of the page in the ''/webadmin/multimedia/'' subsite.
 
#In the main content of the page, add a Custom Script element.
 
#In the main content of the page, add a Custom Script element.
 
#From the Custom Script element interface, click the "Edit" icon.
 
#From the Custom Script element interface, click the "Edit" icon.
−
#Enter the following text into the Explicit Module path: /ADF/apps/pt_photo_gallery/customcf/manager_layout.cfm
+
#Enter the following text into the Explicit Module path: /ADF/apps/pt_multimedia/customcf/manager_layout.cfm
 
# Publish this page.
 
# Publish this page.
  
−
== Admin Datasheet Page ==
+
== Manager Datasheet ==
−
The Photo Gallery element is a global custom element. Managing data for global custom elements can be configured easily through the use of Datasheets. The following sections will describe how to configure the datasheet to manage the photo element data.
+
The Multimedia element is a global custom element. Managing data for this global custom element can be configured easily through the use of a Datasheet. The following section will describe how to configure a CommonSpot page to manage the data for the Multimedia element.
  
−
# Open the ''Photo Manager'' page in author mode.
+
=== Steps ===
−
# Add the custom script element to the page.
+
# Open the ''Multimedia Manager'' page in author mode.
−
## Edit the custom script and define the explicit path with the following:
+
# On the first tab labeled "Multimedia" is a Datasheet element.
−
## /ADF/apps/pt_photo_gallery/customcf/manager_layout.cfm
 
−
# On the first tab labeled "Photo" is a Datasheet element.
 
 
# From the Datasheet element interface, click the "Datasheet" icon.
 
# From the Datasheet element interface, click the "Datasheet" icon.
 
# From the "Datasheet Views" dialog, follow the "Click here to create a new datasheet view" link.
 
# From the "Datasheet Views" dialog, follow the "Click here to create a new datasheet view" link.
 
# Enter the following information and then click "Next":
 
# Enter the following information and then click "Next":
−
## Name: All Photos
+
## Name: All Media
 
## Private: unchecked
 
## Private: unchecked
 
## Default View: unchecked
 
## Default View: unchecked
−
## Description: View to manage all of the photos
+
## Description: View to manage all of the multimedia
 
## Datasheet Source: Form Result/Custom Element Sheet
 
## Datasheet Source: Form Result/Custom Element Sheet
−
# From the Datasheet Source dialog choose the "Photo" custom element and click "Next".
+
# From the Datasheet Source dialog choose the "Multimedia" custom element and click "Next".
−
# From the Datasheet Columns Dialog select the columns PhotoID, Photo, Title, Category from the Available Columns list and move them to the Selected Columns list and then click "Finish".
+
# From the Datasheet Columns Dialog select the columns Title and Caption from the Available Columns list and move them to the Selected Columns list and then click "Finish".
 
# You will be directed to the Datasheet View page. Click "Close" to return to your page.
 
# You will be directed to the Datasheet View page. Click "Close" to return to your page.
 
# You will now see the datasheet element on this page. Click the Datasheet element interface icon again and choose "Edit Columns".
 
# You will now see the datasheet element on this page. Click the Datasheet element interface icon again and choose "Edit Columns".
−
# From the Datasheet View Column Properties dialog, select the ''PhotoID'' column, then edit.  Update the following settings for column:
+
# From the Datasheet View Column Properties dialog, choose the link for "Add a new action column".
−
## Change the Render Handler to the following file: ''/ADF/apps/pt_photo_gallery/datasheet-modules/photo-update-edit-form-data.cfm''
+
# Within the Action Column Properties dialog, enter the following information and click "Finish":
−
## Change the header text to: Edit/Delete
+
## Header: Edit
−
# From the Datasheet View Column Properties dialog, select the ''Category'' column, then edit.  Update the following setting for column:
+
## Hide Header: Checked
−
## Change the Render Handler to the following file: ''/ADF/apps/pt_photo_gallery/datasheet-modules/category-display-render.cfm''
+
## Column Text: ''edit''
−
# From the Datasheet View Column Properties dialog, select the ''Photo'' column, then edit. Update the following setting for column:
+
## Window Target Name: <leave blank>
−
## Change the Render Handler to the following file: ''/ADF/apps/pt_photo_gallery/datasheet-modules/photo-image-preview-display-render.cfm''
+
## Available Modules: edit-form-data.cfm
−
# Close the Edit Column window.
+
# From the Datasheet View Column Properties dialog, choose the link for "Add a new action column" again.
−
# Change the datasheet layout options to the following:
+
# Within the Action Column Properties dialog enter the following information and click "Finish":
−
## Uncheck "Allow JavaScript data sorting"
+
## Header: delete
−
## Set the datasheet layout to sort by the ''Title'' field
+
## Hide Header: Checked
−
## Set the results per page to 25.
+
## Column Text: ''delete''
 +
## Window Target Name: <leave blank>
 +
## Available Modules: delete-form-data.cfm
 +
# Close the Edit Columns window.
 
# Publish this page.
 
# Publish this page.
 +
[[Category:Multimedia]]
  
−
== Category Admin Datasheet Page ==
+
== Multimedia Manager Category Datasheet ==
−
The Photo Gallery Category element is a global custom element. Managing data for global custom elements can be configured easily through the use of Datasheets. The following sections will describe how to configure the datasheet to manage photo element data.
+
The Multimedia Category element is a global custom element. Managing data for global custom elements can be configured easily through the use of Datasheets. The following sections will describe how to configure the datasheet to manage Multimedia Category element data.
  
−
# Open the ''Photo Manager'' page in author mode.
+
=== Steps ===
 +
# Open the ''Multimedia Manager'' page in author mode.
 
# On the second tab labeled ''Category'' is a Datasheet element.
 
# On the second tab labeled ''Category'' is a Datasheet element.
 
# From the Datasheet element interface, click the "Datasheet" icon.
 
# From the Datasheet element interface, click the "Datasheet" icon.
Line 238: Line 277:
 
## Private: unchecked
 
## Private: unchecked
 
## Default View: unchecked
 
## Default View: unchecked
−
## Description: View to manage all of the photos
+
## Description: View to manage all of the Categories
 
## Datasheet Source: Form Result/Custom Element Sheet
 
## Datasheet Source: Form Result/Custom Element Sheet
−
# From the Datasheet Source dialog, choose the "Photo Category" custom element and click "Next".
+
# From the Datasheet Source dialog, choose the "Multimedia Category" custom element and click "Next".
−
# From the Datasheet Columns dialog, select the columns CategoryID, Title, and Directory from the Available Columns list and move them to the Selected Columns list.
+
# From the Datasheet Columns dialog, select the columns Title and Category ID from the Available Columns list and move them to the Selected Columns list.
 
# You will be directed to the Datasheet View page.  Click "Close" to return to your page.
 
# You will be directed to the Datasheet View page.  Click "Close" to return to your page.
 
# You will now see the datasheet element on this page. Click the Datasheet element interface icon again and choose "Edit Columns".
 
# You will now see the datasheet element on this page. Click the Datasheet element interface icon again and choose "Edit Columns".
−
# From the Datasheet View Column Properties dialog, select the CategoryID column, then edit. Update the following settings for column:
+
# From the Datasheet View Column Properties dialog, choose the link for "Add a new action column".
−
## Change the Render Handler to the following file: /ADF/extensions/datasheet-modules/1.0/edit-delete.cfm
+
# Within the Action Column Properties dialog, enter the following information and click "Finish":
−
## Change the header text to: Edit/Delete
+
## Header: Edit
 +
## Hide Header: Checked
 +
## Column Text: ''edit''
 +
## Window Target Name: <leave blank>
 +
## Available Modules: edit-form-data.cfm
 +
# From the Datasheet View Column Properties dialog, choose the link for "Add a new action column" again.
 +
# Within the Action Column Properties dialog enter the following information and click "Finish":
 +
## Header: delete
 +
## Hide Header: Checked
 +
## Column Text: ''delete''
 +
## Window Target Name: <leave blank>
 +
## Available Modules: delete-form-data.cfm
 
# Close the Edit Columns window.
 
# Close the Edit Columns window.
−
# Change the datasheet layout options to the following:
 
−
## Uncheck "Show Alphabet Characters for Filtering"
 
−
## Uncheck "Allow JavaScript data sorting"
 
 
# Publish this page.
 
# Publish this page.
  
−
== Size Admin Datasheet Page ==
+
== Multimedia Manager Series Datasheet ==
−
The Photo Size element is a global custom element. Managing data for global custom elements can be configured easily through the use of Datasheets. The following sections will describe how to configure the datasheet to manage the Photo Size element data.
+
The Multimedia Series element is a global custom element. Managing data for global custom elements can be configured easily through the use of Datasheets. The following sections will describe how to configure the datasheet to manage Multimedia Series element data.
  
−
# Open the ''Photo Manager'' page in authormode.
+
=== Steps ===
−
# On the third tab labeled "Size" is a Datasheet element.
+
# Open the ''Multimedia Manager'' page in author mode.
 +
# On the third tab labeled ''Series'' is a Datasheet element.
 
# From the Datasheet element interface, click the "Datasheet" icon.
 
# From the Datasheet element interface, click the "Datasheet" icon.
 
# From the "Datasheet Views" dialog, follow the "Click here to create a new datasheet view" link.
 
# From the "Datasheet Views" dialog, follow the "Click here to create a new datasheet view" link.
 
# Enter the following information and then click "Next":
 
# Enter the following information and then click "Next":
−
## Name: All Photo Size
+
## Name: All Series
 
## Private: unchecked
 
## Private: unchecked
 
## Default View: unchecked
 
## Default View: unchecked
−
## Description: View to manage all of the photo sizes
+
## Description: View to manage all of the Series
 
## Datasheet Source: Form Result/Custom Element Sheet
 
## Datasheet Source: Form Result/Custom Element Sheet
−
# From the Datasheet Source dialog, choose the "Photo_Size" custom element and click "Next".
+
# From the Datasheet Source dialog, choose the "Multimedia Series" custom element and click "Next".
−
# From the Datasheet Columns dialog select the columns SizeID, Title, Directory, Width, Height, Type and move them to the Selected Columns list then click "Finish".
+
# From the Datasheet Columns dialog, select the columns Title and Series ID from the Available Columns list and move them to the Selected Columns list.
 
# You will be directed to the Datasheet View page.  Click "Close" to return to your page.
 
# You will be directed to the Datasheet View page.  Click "Close" to return to your page.
 
# You will now see the datasheet element on this page. Click the Datasheet element interface icon again and choose "Edit Columns".
 
# You will now see the datasheet element on this page. Click the Datasheet element interface icon again and choose "Edit Columns".
−
# From the Datasheet View Column Properties dialog, select the SizeID column, then edit. Update the following settings for column:
+
# From the Datasheet View Column Properties dialog, choose the link for "Add a new action column".
−
## Change the Render Handler to the following file: /ADF/extensions/datasheet-modules/1.0/edit-delete.cfm
+
# Within the Action Column Properties dialog, enter the following information and click "Finish":
−
## Change the header text to: Edit/Delete
+
## Header: Edit
 +
## Hide Header: Checked
 +
## Column Text: ''edit''
 +
## Window Target Name: <leave blank>
 +
## Available Modules: edit-form-data.cfm
 +
# From the Datasheet View Column Properties dialog, choose the link for "Add a new action column" again.
 +
# Within the Action Column Properties dialog enter the following information and click "Finish":
 +
## Header: delete
 +
## Hide Header: Checked
 +
## Column Text: ''delete''
 +
## Window Target Name: <leave blank>
 +
## Available Modules: delete-form-data.cfm
 
# Close the Edit Columns window.
 
# Close the Edit Columns window.
−
# Change the datasheet layout options to the following:
 
−
## Uncheck "Show Alphabet Characters for Filtering"
 
−
## Uncheck "Allow JavaScript data sorting"
 
 
# Publish this page.
 
# Publish this page.
  
Line 282: Line 338:
 
[[Reset ADF|Reset the ADF]] for the server and site.
 
[[Reset ADF|Reset the ADF]] for the server and site.
  
−
[[Category:Photo Gallery]]
+
[[Category:PT Multimedia]][[Category:Multimedia]]

Latest revision as of 17:48, 6 September 2012

Download

Download the PT Multimedia Application from the Community Site or from the SVN Repository.

Extract the zip files into the following directory: /ADF/apps/pt_multimedia/

Site Configuration

The application is built within the ADF. The ADF must be installed in the site to run the application, follow the ADF Installation instructions.

  • Make sure the ADF is setup and running on the site. If the ADF is not setup, then follow the instructions for ADF Installation.
  • Open the sites 'ADF.cfc' (See Site Configuration (ADF.cfc) for more info) file (located in your site's /_cs_apps/ directory) in a text editor. Locate the Load the ADF Application into application space comment in the file. Add (or uncomment) the following command under the comment section:
loadApp("ptMultimedia");

Styles

The application ships with a style sheet to insure proper display of your multimedia. The styles are defined in the following style sheet located in the /pt_multimedia/style/ directory:

  • ptmultimedia.css (/ADF/apps/pt_multimedia/style/ptmultimedia.css)


The recommended approach is to load this style sheet into your Base Plus One Template.

'Note:' the classes and styles defined for the Multimedia application are targeted tightly for the layout generated by the Multimedia application and should not interfere with your site styles. However, it is a good idea to give these styles sheets higher precedence in your style definitions.

Import Custom Elements

Create Custom Category

  1. Go to Site Administration
  2. Expand "Elements and Forms"
  3. Click Elements
  4. Select Manage Categories
  5. "Add New Category"
  6. Name the category: "PT Multimedia Elements"

Import

Import Custom Elements in this order:

  1. Multimedia Category (Multimedia-Category -Custom-Element.zip)
  2. Multimedia Category Gallery (Multimedia-Category –Gallery-Custom-Element.zip)
  3. Multimedia (Multimedia- Custom-Element.zip)
  4. Multimedia Series (Multimedia-Series -Custom-Element.zip)
  5. Multimedia Series Gallery (Multimedia-Series -Gallery-Custom-Element.zip)
  6. Multimedia Configuration (PT Multimedia -Configuration-Custom-Element.zip)

Import Metadata form:

  1. Multimedia Display Format (MultimediaDisplayFormat -Metadata-Form.zip)
    1. Bind this form to the following Multimedia Render Handler
      1. Multimedia
      2. Multimedia Search Results

Import Custom fields:

  1. Import media host select custom field (Media-Host-Select-Field-Custom-Field.zip)
  2. import media type select custom field (Media-Type-Select-Field-Custom-Field-Type.zip)

Verify Imports

The imported components' render handlers and custom field types must be verified. During the import process, the render handler and custom field types paths may have been changed to reflect the current site's path.

Review and update these paths to reference the ADF path. In most cases, this will just require the imported item to be unlocked and a change in the path from the site name to 'ADF'. Check the paths for the custom field types that were imported with the custom elements by unlocking them and fixing the explicit paths to point to "/ADF/apps/ptMultimedia/customfields /".

If the custom elements that are imported contain custom field types that are already in the site, the naming convention for the custom field type will be unique. To resolve this, unlock the field types and elements, and reassign the element field type to the pre-existing field type.

Example: The Multimedia custom element contains two uses of the General Chooser field type, if the General Chooser field type is already installed on the site then the import process will attempt to import another General Chooser but with a new name such as "General Chooser_import_1250003208472." To resolve this issue, open the custom element and assign the field type (General Chooser_import_1250003208472) to the field type with the simple name General Chooser. Note that when you assign the existing general chooser you will need to click on the "properties" tab and enter "mediaCategoryGC" as the bean name. After reassigning the field type, delete the new imported field from the list of custom field types.

Site Configuration

The Multimedia App uses a custom element to store site specific configurations. The Multimedia App needs to know the upload URL, pop-up player URL, etc for the site.

If you are installing the Multimedia application, there is no need to do anything with this element at this time. This element will be configured in a later step.

The fields for the Multimedia Configuration custom element are defined below.

Configuration Fields

There are six major components to the configuration:

  1. UPLOAD_PATH – Directory where media is uploaded. (Example: C:/wwwroot/mysite/mediauploads/)
  2. UPLOAD _FILE_TYPES – Supported multimedia files. (Example: mp3,flv,mp4)
  3. MAXFILESIZE – Selection list limiting maximum upload size.
  4. UPLOAD_URL – URL Path on the server to store uploaded media. (Example: /mediauploads)
  5. ADD_URL - URL to the location of the media add page. (Example: /mysite/lightbox/multimedia/Media-Add.cfm)
  6. UPLOADMEDIAFORM – URL to the location of the handle media upload page. (Example: / mysite /lightbox/multimedia/handle-media-upload.cfm)
  7. POPUPPLAYERURL - URL to the location of the lightbox player page. (Example: /mysite /lightbox/multimedia/popUpPlayer.cfm)
  8. SEARCHRESULTS - URL to the location of the “All Media” display results page. (Example: / mysite /Multimedia-Search-Results.cfm )

Subsites

It is highly recommended that a Multimedia webadmin subsite is created for Administrators and a Multimedia Lightbox subsite is created for the lightbox pages. This configuration allows subsite security to be used to allow only Administrators access to the webadmin subsite and also allows the Commonspot toolbar to be turned off for the lightbox pages.

Your site may already have a webadmin and/or lightbox subsite. The steps below will add a multimedia subsite under the webadmin subsite and will add a lightbox subsite.

Web Admin

  1. Create a new subsite under the site root called webadmin.
  2. Create a new subsite under webadmin called multimedia.
  3. Configure the /webadmin/ multimedia / subsite Content Security to give 'No Rights' to 'Anonymous Users' and 'Authenticated Users'.
  4. Configure the /webadmin/ multimedia / subsite Content Security to give permissions to the group of administrators who will manage the multimedia.

Lightbox

  1. Create a new subsite under the site root called lightbox.
  2. Create a new subsite under lightbox called multimedia.

Lightbox Template

The Lightbox template will be used to render pages within a lightbox. The Lightbox template may already exist on your site if you have installed another ADF application. Check your sites templates before following the steps below to create the template.

Steps

  1. Create a new page named Lightbox Template from the blank template.
  2. Submit and activate the page.
  3. Save the page as a template.
  4. Submit the template for public use.


Multimedia Configuration

The Multimedia Configuration Pages will be used to manage the PTMultiMedia Configuration custom element. Follow these steps to configure the datasheet and page for adding media.

Steps

  1. Create a new page called 'Configuration Manager' in the /webadmin/multimedia/ subsite.
  2. In the main content of the page, add a Custom Script element.
  3. Enter the explicit module path for:
    1. /ADF/apps/pt_multimedia/customcf/multimedia_config_admin_ds.cfm
  4. From the Datasheet element interface, click the "Datasheet" icon.
  5. From the "Datasheet Views" dialog, follow the "Click here to create a new datasheet view" link.
  6. Enter the following information and then click "Next":
    1. Name: All Media
    2. Private: unchecked
    3. Default View: unchecked
    4. Description: View to manage all of the media
    5. Datasheet Source: Form Result/Custom Element Sheet
  7. From the Datasheet Source dialog choose the "PTMultimedia Configuration" custom element and click "Next".
  8. From the Datasheet Columns Dialog choose a few columns from the Available Columns list and move them to the Selected Columns list. (TITLE,CAPTION, etc...) and then click "Finish".
  9. You will be brought to the Datasheet View page; click "Close" to return to your page.
  10. You will see the datasheet element on this page now. Click the Datasheet element interface icon again and this time choose "Edit Columns".
  11. From the Datasheet View Column Properties dialog choose the link for "Add a new action column".
  12. Within the Action Column Properties dialog enter the following information and click "Finish":
    1. Header: Edit
    2. Hide Header: Checked
    3. Column Text: edit
    4. Window Target Name: <leave blank>
    5. Modules: edit-form-data.cfm
  13. From the Datasheet View Column Properties dialog, choose the link for "Add a new action column" again.
  14. Within the Action Column Properties dialog enter the following information and click "Finish":
    1. Header: Delete
    2. Hide Header: Checked
    3. Column Text: delete
    4. Window Target Name: <leave blank>
    5. Modules: delete-form-data.cfm
  15. Close the Edit Column window.
  16. Publish the page.

Create Multimedia Configuration Record

Note that this step assumes that you have previously created the admin pages.

We are creating a single Multimedia Configuration element record to be used within the application.

Go to the Add Configuration page and submit the form to create one record.

These fields will be completed as the pages are built.

See the Site Configuration wiki page for more information on the fields and the correct values.

Reset the ADF for the server and site.

Media Add

The Media Add Page is a lightbox page to create new media records.

Follow these steps to configure the link and page for adding media.

Steps

  1. Create a new page called 'Media Add' from the Lightbox Template and in the /lightbox/multimedia/ subsite.
  2. In the main content of the page place a Simple Form element.
  3. From the Simple Form element interface icons choose the "Select Form" icon.
  4. In the Create/Select Simple Form dialog choose the option to "Select Simple Form/Custom Element" option and click "next".
  5. From the Select Form/Custom Element dialog choose the "Multimedia" custom element and click "Finish".
  6. Within the "Manage Simple Form Element" dialog, enter the following information:
    1. Name: (leave as is)
    2. Email Notification Recipients: (If you would like to receive an e-mail whenever new multimedia is added, then place your e-mail in here. This is optional)
    3. Sender's Email Address: leave checked
    4. Anonymous Sender's Email Address: (add in an anonymous email address if needed)
    5. Form Action: choose "Display Textblock on Submission" option and add 'Media uploaded successfully!' text in the RTE.
    6. Select Finish and then Finish again.
  7. Publish the page

Update Configuration

Update the Multimedia Configuration for the ADD URL field. Edit the row in the datasheet and select the CommonSpot page that was created.

Reset the ADF for the server and site.

Media Upload

The Handle Media Upload Page will be used to upload new multimedia into the Multimedia Element.

Steps

  1. Create a new page called 'Handle Media Upload' from the Lightbox Template and in the /lightbox/multimedia/ subsite.
  2. In the main content of the page add a Custom Script Element.
  3. From the Custom Script element interface, click the "Edit" icon.
  4. Enter the following text into the Explicit Module path: /ADF/apps/pt_multimedia/customcf/handle_media_upload.cfm.
  5. Publish the page

Update Multimedia Site Config

Update the Multimedia Configuration for the HANDLE MEDIA UPLOAD FORM URL field. Edit the row in the datasheet and select the CommonSpot page that was created.

Reset the ADF for the server and site.

Media Player

  1. Create a new page called 'Pop Up Player' from the Lightbox Template and in the /lightbox/multimedia/ subsite.
  2. In the main content of the page, add a Custom Script element.
  3. From the Custom Script element interface, click the "Edit" icon.
  4. Enter the following text into the Explicit Module path: /ADF/apps/pt_multimedia/customcf/media_lightbox_player.cfm
  5. Publish the page.

Update Multimedia Site Config

Update the Multimedia Configuration for the Pop-up Player URL field. Edit the row in the datasheet and select the CommonSpot page that was created.

Reset the ADF for the server and site.

All Media

The Multimedia "All Media" search results display page will be used to display all of the multimedia associated with a current category or series based upon a URL variable.

Steps

  1. Create a new page called 'Multimedia Search Results' from the Lightbox Template. Create this page either in the root of the site or if you’ve created a subsite for your multimedia then create the page within the subsite. Do not create the page under the lightbox subsite.
  2. In the main content of the page, add the multimedia element.
  3. Click the multimedia "Edit" icon. Select “Render Mode” and choose the “Display existing element data (content reuse)” radio button. Click the “filter” tab and choose the “Show subset of records” radio button. Choose “Category” from the FIELD SELECTION drop-down. Choose “contains” from the OPERATOR selection drop-down. Next you will need to enter a coldfusion expression as the criteria. Click on the grey box with the three dots to enter the expression and enter a value of “url.categoryid” in the expression field. Click “OK”. When you receive the “Variable url.categoryid is undefined” error message select the “ignore coldfusion error” checkbox and click “OK”. Select the “update” button to commit your change and then select the “OK” button.
  4. Assign render handler. Select the multimedia “Edit” icon and then choose “more” to expand the menu and select “custom render handlers”. Select the “multimedia search results” render handler and click “next”. The next screen presents a metadata format where you may choose the desired display format (typically row of 3 thumbs) and then select “OK”.
  5. Publish the page.

Multimedia Manager

The Multimedia, Multimedia Category and Multimedia Series elements are global custom elements. Managing data for these global custom elements can be configured easily through the use of Datasheets. The following sections will describe how to configure a ComonSpot page to manage the data for the elements.

Steps

  1. Create a new page with the title 'Multimedia Manager' and page name 'index' from the Base Plus One template and designate creation of the page in the /webadmin/multimedia/ subsite.
  2. In the main content of the page, add a Custom Script element.
  3. From the Custom Script element interface, click the "Edit" icon.
  4. Enter the following text into the Explicit Module path: /ADF/apps/pt_multimedia/customcf/manager_layout.cfm
  5. Publish this page.

Manager Datasheet

The Multimedia element is a global custom element. Managing data for this global custom element can be configured easily through the use of a Datasheet. The following section will describe how to configure a CommonSpot page to manage the data for the Multimedia element.

Steps

  1. Open the Multimedia Manager page in author mode.
  2. On the first tab labeled "Multimedia" is a Datasheet element.
  3. From the Datasheet element interface, click the "Datasheet" icon.
  4. From the "Datasheet Views" dialog, follow the "Click here to create a new datasheet view" link.
  5. Enter the following information and then click "Next":
    1. Name: All Media
    2. Private: unchecked
    3. Default View: unchecked
    4. Description: View to manage all of the multimedia
    5. Datasheet Source: Form Result/Custom Element Sheet
  6. From the Datasheet Source dialog choose the "Multimedia" custom element and click "Next".
  7. From the Datasheet Columns Dialog select the columns Title and Caption from the Available Columns list and move them to the Selected Columns list and then click "Finish".
  8. You will be directed to the Datasheet View page. Click "Close" to return to your page.
  9. You will now see the datasheet element on this page. Click the Datasheet element interface icon again and choose "Edit Columns".
  10. From the Datasheet View Column Properties dialog, choose the link for "Add a new action column".
  11. Within the Action Column Properties dialog, enter the following information and click "Finish":
    1. Header: Edit
    2. Hide Header: Checked
    3. Column Text: edit
    4. Window Target Name: <leave blank>
    5. Available Modules: edit-form-data.cfm
  12. From the Datasheet View Column Properties dialog, choose the link for "Add a new action column" again.
  13. Within the Action Column Properties dialog enter the following information and click "Finish":
    1. Header: delete
    2. Hide Header: Checked
    3. Column Text: delete
    4. Window Target Name: <leave blank>
    5. Available Modules: delete-form-data.cfm
  14. Close the Edit Columns window.
  15. Publish this page.

Multimedia Manager Category Datasheet

The Multimedia Category element is a global custom element. Managing data for global custom elements can be configured easily through the use of Datasheets. The following sections will describe how to configure the datasheet to manage Multimedia Category element data.

Steps

  1. Open the Multimedia Manager page in author mode.
  2. On the second tab labeled Category is a Datasheet element.
  3. From the Datasheet element interface, click the "Datasheet" icon.
  4. From the "Datasheet Views" dialog, follow the "Click here to create a new datasheet view" link.
  5. Enter the following information and then click "Next":
    1. Name: All Categories
    2. Private: unchecked
    3. Default View: unchecked
    4. Description: View to manage all of the Categories
    5. Datasheet Source: Form Result/Custom Element Sheet
  6. From the Datasheet Source dialog, choose the "Multimedia Category" custom element and click "Next".
  7. From the Datasheet Columns dialog, select the columns Title and Category ID from the Available Columns list and move them to the Selected Columns list.
  8. You will be directed to the Datasheet View page. Click "Close" to return to your page.
  9. You will now see the datasheet element on this page. Click the Datasheet element interface icon again and choose "Edit Columns".
  10. From the Datasheet View Column Properties dialog, choose the link for "Add a new action column".
  11. Within the Action Column Properties dialog, enter the following information and click "Finish":
    1. Header: Edit
    2. Hide Header: Checked
    3. Column Text: edit
    4. Window Target Name: <leave blank>
    5. Available Modules: edit-form-data.cfm
  12. From the Datasheet View Column Properties dialog, choose the link for "Add a new action column" again.
  13. Within the Action Column Properties dialog enter the following information and click "Finish":
    1. Header: delete
    2. Hide Header: Checked
    3. Column Text: delete
    4. Window Target Name: <leave blank>
    5. Available Modules: delete-form-data.cfm
  14. Close the Edit Columns window.
  15. Publish this page.

Multimedia Manager Series Datasheet

The Multimedia Series element is a global custom element. Managing data for global custom elements can be configured easily through the use of Datasheets. The following sections will describe how to configure the datasheet to manage Multimedia Series element data.

Steps

  1. Open the Multimedia Manager page in author mode.
  2. On the third tab labeled Series is a Datasheet element.
  3. From the Datasheet element interface, click the "Datasheet" icon.
  4. From the "Datasheet Views" dialog, follow the "Click here to create a new datasheet view" link.
  5. Enter the following information and then click "Next":
    1. Name: All Series
    2. Private: unchecked
    3. Default View: unchecked
    4. Description: View to manage all of the Series
    5. Datasheet Source: Form Result/Custom Element Sheet
  6. From the Datasheet Source dialog, choose the "Multimedia Series" custom element and click "Next".
  7. From the Datasheet Columns dialog, select the columns Title and Series ID from the Available Columns list and move them to the Selected Columns list.
  8. You will be directed to the Datasheet View page. Click "Close" to return to your page.
  9. You will now see the datasheet element on this page. Click the Datasheet element interface icon again and choose "Edit Columns".
  10. From the Datasheet View Column Properties dialog, choose the link for "Add a new action column".
  11. Within the Action Column Properties dialog, enter the following information and click "Finish":
    1. Header: Edit
    2. Hide Header: Checked
    3. Column Text: edit
    4. Window Target Name: <leave blank>
    5. Available Modules: edit-form-data.cfm
  12. From the Datasheet View Column Properties dialog, choose the link for "Add a new action column" again.
  13. Within the Action Column Properties dialog enter the following information and click "Finish":
    1. Header: delete
    2. Hide Header: Checked
    3. Column Text: delete
    4. Window Target Name: <leave blank>
    5. Available Modules: delete-form-data.cfm
  14. Close the Edit Columns window.
  15. Publish this page.

Reset the ADF

Reset the ADF for the server and site.

Retrieved from "http://community.paperthin.com/adf-docs/index.php?title=PT_Multimedia_Version_1.0_Install&oldid=5815"