OpenPNE3 Plugins » opUploadFilePlugin

h3. 現象

opLikePluginとopUploadFilePluginを同時使用すると，ファイルアップロード用ダイアログが表示されなくなる。
なお，apiを利用してファイルアップロードは可能。

bootstrap参考URL
http://getbootstrap.com/javascript/#modals

h3. 原因

原因としては，opUploadFilePlugin と opLikePlugin のどちらもが bootstrap-modal.js を呼び出しており，かつ，どちらもが bootstrap-modal.js に用意されているAPIを利用しているため，二重にイベントが登録されている模様。

具体的には，opUploadFilePlugin の apps/pc_frontend/modules/f/templates/_fMenu.php の35行目
<pre>
<li><a href="#file-uploadmodal" data-toggle="modal">アップロード</a></li>
</pre>
上記の data-toggle=modal が bootstrap-modal.js の以下の箇所で，クリックイベントとして登録される。
<pre>
$(function () {
$('body').on('click.modal.data-api', '[data-toggle="modal"]', function ( e ) {
var $this = $(this)
, href = $this.attr('href')
, $target = $($this.attr('data-target') || (href && href.replace(/.*(?=#[^\s]+$)/, ''))) //strip for ie7
, option = $target.data('modal') ? 'toggle' : $.extend({ remote: !/#/.test(href) && href }, $target.data(), $this.data())

e.preventDefault()

$target
.modal(option)
.one('hide', function () {
$this.focus()
})
})
})
</pre>
opLikePluginを入れている場合，(おそらく)opUploadFilePluginで一度イベント登録されたあと，opLikePluginの読み込みのタイミングで再度イベント登録され(どちらが先に読まれているかは不明)，一つのクリックイベントに対して二度toggle処理される結果として表示されない，という筋になっていそう。

h3. 修正方針

opUploadFilePlugin, opLikePluginともに，bootstrap-modal.js に用意されたapi(data-toggle="modal")を利用せず，自前でイベント登録する，という方針。

h3. 修正箇所

* opUploadFilePlugin

<pre>
apps/pc_frontend/modules/f/templates/_fMenu.php
35: <li><a href="#file-uploadmodal" data-toggle="modal">アップロード</a></li>
</pre>

* opLikePlugin

<pre>
data/patches/opCommunityTopicPlugin.patch
15:+<a class="like-list" href="#likeModal" data-toggle="modal"></a>
61:+<a class="like-list" href="#likeModal" data-toggle="modal"></a>

data/patches/opDiaryPlugin.patch
15:+<a class="like-list" href="#likeModal" data-toggle="modal"></a>
61:+<a class="like-list" href="#likeModal" data-toggle="modal"></a>

data/patches/opTimelinePlugin.patch
171:+ <a class="like-list" href="#likeModal" data-toggle="modal"></a>
189:+ <a class="like-list" href="#likeModal" data-toggle="modal"></a>
</pre>