CODEWITHSUNDEEP
javascriptjoomlamedia-playermedia
SKuijers
SKuijers

Reputation: 426

implementing mediaElement.js results in error

I'm trying to implement the mediaElement.js solution in a Joomla website I'm working on but i'm running into some problems. The following error is haunting me in my dreams :P:

Uncaught TypeError: Object [object Object] has no method 'mediaelementplayer'

I would assume that /mediaelement-and-player.min.js but the Console does not display any errors except the one already mentioned.

I have added the following to my template head:

$this->API->addJS($this->API->URLtemplate() . '/mediaElement/build/mediaelement-and-player.min.js');
$this->API->addJS($this->API->URLtemplate() . '/mediaElement/build/jquery.js');

This results in the right link when the page loads so I guess that won't be the problem.

In the body of my article I've added the following code:

<video id="youtube1" width="640" height="360">
  <source src="http://www.youtube.com/watch?v=nOEw9iiopwI" type="video/youtube" >
</video>

<script>
   jQuery(document).ready(function($) {
      $('#youtube1').mediaelementplayer();
   });

</script>

Eventhough this code is from the examples provided it results in the error mentioned before.

Any thoughts on this would be appreciated!

Upvotes: 0

Views: 962

Answers (2)

SKuijers
SKuijers

Reputation: 426

Thanks guys for the input.

I have found the problem and solution :D.

removing this line from the head.php

$this->API->addJS($this->API->URLtemplate() . '/mediaElement/build/jquery.js');

Solved my problem.

I guess this is because jQuery was already loaded by the template I'm using.

I hope this will safe someone else a headace in the future.

Happy coding!

Upvotes: 0

Lodder
Lodder

Reputation: 19743

Im not sure if the file is being included properly as I can't see the website, so try this to include jquery.js and the mediaelement-and-player.min.js

$document = JFactory::getDocument();
//check to see if jquery is already being loaded
if(!JFactory::getApplication()->get('jquery')){
     JFactory::getApplication()->set('jquery',true);
     $document->addScript(JURI::root() . "templates/template_name/mediaElement/build/jquery.js");
}
$document->addScript(JURI::root() . "templates/template_name/mediaElement/build/mediaelement-and-player.min.js");

don't forget to change template_name within that path in the code above.

Upvotes: 1

Related Questions