Mootools Breaking Panoramio Javascript API

Я пытаюсь использовать JavaScript API Panoramio, но он не отображается при использовании инфраструктуры MooTools. Использование функции проверки Chrome на этом jsFiddle выявляет эту ошибку с включенным JavaScript:

Uncaught SyntaxError: Invalid regular expression: /function (keys){
    var obj = {}, length = Math.min(this.length, keys.length);
    for (var i = 0; i < length; i++) obj[keys[i]] = this[i];
    return obj;
}/: Nothing to repeat

Сайт, на котором я пытаюсь использовать API, - это Joomla 2.5, следовательно, используется фреймворк MooTools. Смена фреймворка на скрипке на jQuery или удаление его полностью приводит к появлению картинок, и ошибка не появляется.

Я пытался как-то включить функцию noConflict() в jQuery и искал похожую функцию для MooTools, но безуспешно.

Любые предложения по решению этой проблемы будут очень приветствоваться. Или это ограничение самого JavaScript API Panoramio?

2 ответа

Решение

MooTools добавляет множество функций в Array.prototype не мешая им быть перечисленными. Это означает, что они появляются в for-in циклы на массивах.

Похоже, что Panoramio JavaScript использует for..in в массиве без учета этого, потому что сообщение об ошибке содержит источник associate функция, которую добавляет MooTools:

// (Result of `String(Array.prototype.associate)` when MooTools is loaded
function (keys){
    var obj = {}, length = Math.min(this.length, keys.length);
        for (var i = 0; i < length; i++) obj[keys[i]] = this[i];
        return obj;
}

Это ошибка в скрипте Panoramio, никогда не следует использовать for..in цикл по массиву без правильных мер безопасности. Смотрите мифы и реалииfor..in (из моего блога). Если вы можете получить несжатую версию скрипта Panoramio, вы можете исправить соответствующие циклы.

Некоторые также утверждают, что это ошибка (или, по крайней мере, плохое дизайнерское решение) для MooTools для добавления перечислимых свойств в Array.prototype,


Dimitar Christoff отмечает в комментариях (спасибо Dimitar!), Что если вы загружаете скрипт Panoramio после загрузки MooTools, он работает: http://jsfiddle.net/DEWvZ/2/ Но будьте осторожны, если вы сделаете какие-либо вызовы в Panoramio позже, один раз MooTools загружен, они могут потерпеть неудачу, потому что, если они допустили ошибку в одном месте (инициализация), они, вероятно, сделают это и в другом месте.

Этот виджет Panoramio JavaScript API.

Другой тип виджета Panoramio JavaScript API, в котором вы также можете изменить цвет фона с примером и кодом, находится здесь.

Я создал страницу блога, где создал множество виджетов Panoramio JavaScript и HTML API.

Это не показывает в создании настроения. Это показывает после публикации. Я использовал это на своем сайте blogspot. Его работа.

<div dir="ltr" style="text-align: center;" trbidi="on">
<script src="https://ssl.panoramio.com/wapi/wapi.js?v=1&amp;hl=en"></script>
<div id="wapiblock" style="float: right; margin: 10px 15px"></div>
<script type="text/javascript">
var myRequest = {
  'tag': 'kahna',
  'rect': {'sw': {'lat': -30, 'lng': 10.5}, 'ne': {'lat': 50.5, 'lng': 30}}
};
  var myOptions = {
  'width': 300,
  'height': 200
};
var wapiblock = document.getElementById('wapiblock');
var photo_widget = new panoramio.PhotoWidget('wapiblock', myRequest, myOptions);
photo_widget.setPosition(0);
</script>
</div>
Другие вопросы по тегам