Last active
August 12, 2016 12:26
-
-
Save tinybeans/e75c2d722146ef75f06487f56b2face1 to your computer and use it in GitHub Desktop.
MTAppAssetFields.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
(function($){ | |
// --------------------------------------------------------------------- | |
// $(foo).MTAppAssetFields(); | |
// --------------------------------------------------------------------- | |
// Latest update: 2016/07/01 | |
// | |
// input:text で MT 標準の「アイテム」ダイアログを利用できるようにします。 | |
// id, filename, url, thumnail(imageのみ)の値を JSON で保存します。 | |
// --------------------------------------------------------------------- | |
$.fn.MTAppAssetFields = function(options, words){ | |
var op = $.extend({}, $.fn.MTAppAssetFields.defaults, options); | |
var language = mtappVars.language === 'ja' ? 'ja' : 'en'; | |
var words = words || {}; | |
var l10n = $.extend({}, $.fn.MTAppAssetFields.l10n[language], words); | |
// フィールド保存用スクリプト(MT標準のスクリプト) | |
var insertScriptHTML = [ | |
'<scr' + 'ipt type="text/javascript">', | |
'function insertCustomFieldAsset(html, id, preview_html) {', | |
' getByID(id).value = html;', | |
' if ( !preview_html )', | |
' preview_html = html ? html : \'\';', | |
' try {', | |
' /* remove the form enclosure from the preview */', | |
' var enc = document.createElement( "div" );', | |
' enc.innerHTML = preview_html;', | |
' var form = enc.getElementsByTagName( "form" )[ 0 ];', | |
' getByID(id + \'_preview\').innerHTML = form ? form.innerHTML : preview_html;', | |
' } catch(e) { ', | |
' log.error(e);', | |
' };', | |
' var remove_button = getByID(id + \'_remove_asset\');', | |
' if (remove_button && html) {', | |
' TC.removeClassName(getByID(id + \'_remove_asset\'), \'hidden\');', | |
' }', | |
' else if (remove_button) {', | |
' TC.addClassName(getByID(id + \'_remove_asset\'), \'hidden\');', | |
' }', | |
'}', | |
'</scr' + 'ipt>' | |
]; | |
$('body').append(insertScriptHTML.join('')); | |
// MTAppAssetFields を適用したフィールドの ID を保存する | |
if (!$('body').data('MTAppAssetFieldsIDs')) { | |
$('body').data('MTAppAssetFieldsIDs',[]); | |
} | |
// 保存時に form タグを置換する | |
var MTAppAssetFieldsSubmit = function(){ | |
var ids = $('body').data('MTAppAssetFieldsIDs'); | |
for (var i = 0, l = ids.length; i < l; i++) { | |
var $field = $('#' + ids[i]); | |
var value = $field.val(); | |
if (/<form mt:asset-id/.test(value)) { | |
value = value.replace(/<form mt:asset-id="(\d+)".+?href="([^"]+)">([^<]+).+/gi, '{"id":"$1","filename":"$3","url":"$2"}'); | |
var $customfieldPreviewImage = $field.next().find('img'); | |
if ($customfieldPreviewImage.length > 0) { | |
var thumbURL = $customfieldPreviewImage.attr('src'); | |
value = value.replace(/\}$/, ',"thumbnail":' + '"' + thumbURL + '"}'); | |
} | |
$field.val(value); | |
if ($field.hasClass('jsontable-input')) { | |
$field.closest('div.mtapp-json-table').prev().trigger('MTAppJSONTableSave'); | |
} | |
} | |
} | |
return true; | |
}; | |
this.closest('form').off('submit.MTAppAssetFieldsSubmit').on('submit.MTAppAssetFieldsSubmit', MTAppAssetFieldsSubmit); | |
return this.each(function(){ | |
var $this = $(this); | |
if (!op.debug) { | |
$this.hide(); | |
} | |
if ($this.hasClass('isMTAppAssetFields')) { | |
return; | |
} else { | |
$this.addClass('isMTAppAssetFields') | |
} | |
// 要素のidを取得。ない場合はTemporary idを作成 | |
var thisId = $this.attr('id') || $.temporaryId(); | |
thisId = 'customfield_mtappassetfields_' + thisId; | |
// id を body の data に保存 | |
var bodyData = $('body').data('MTAppAssetFieldsIDs'); | |
bodyData.push(thisId); | |
$this.attr('id', thisId); | |
// アイテム用 HTML を作成 | |
var assetTypeLabel = ''; | |
if (op.assetTypeLabel !== '') { | |
assetTypeLabel = op.assetTypeLabel; | |
} else { | |
assetTypeLabel = l10n[op.assetType]; | |
} | |
// - 保存されている値を取得(JSON) | |
var json = $this.val(); | |
if (json) { | |
try { | |
json = JSON.parse(json); | |
} | |
catch(e) { | |
alert(e.message); | |
} | |
} | |
var itemThumbHTML = ''; | |
var removeLinkHidden = 'hidden' | |
if (json.url) { | |
if (op.assetType === 'image') { | |
itemThumbHTML = '<a href="' + json.url + '" target="_blank"><img src="' + json.thumbnail + '" alt=""></a>'; | |
} else if (op.assetType === 'file') { | |
itemThumbHTML = '<a href="' + json.url + '" target="_blank">' + json.filename + '</a>'; | |
} | |
removeLinkHidden = ''; | |
} | |
var html = [ | |
'<div id="' + thisId +'_preview" class="customfield_preview">', | |
itemThumbHTML, | |
'</div>', | |
'<div class="actions-bar" style="clear: none;">', | |
'<div class="actions-bar-inner pkg actions">', | |
'<a href="' + ScriptURI + '?__mode=list_asset&_type=asset&blog_id=' + mtappVars.blog_id + '&dialog_view=1&filter=class&filter_val=' + op.assetType + '&require_type=' + op.assetType + '&edit_field=' + thisId +'&asset_select=1" class="mtapp-open-dialog">', | |
assetTypeLabel + l10n.select, | |
'</a> ', | |
'<a href="#" id="' + thisId +'_remove_asset" class="' + removeLinkHidden + '" type="submit" onclick="insertCustomFieldAsset(\'\', \'' + thisId +'\'); return false;">', | |
assetTypeLabel + l10n.remove, | |
'</a>', | |
'</div>', | |
'</div>' | |
].join(''); | |
// アイテム用 HTML を挿入 | |
$this.after(html); | |
$this.next().next().find('.mtapp-open-dialog').mtDialog(); | |
return true; | |
}); | |
}; | |
$.fn.MTAppAssetFields.l10n = { | |
en: { | |
image: 'Image', | |
file: 'File', | |
select: ' Select', | |
remove: ' Remove' | |
}, | |
ja: { | |
image: '画像', | |
file: 'ファイル', | |
select: 'を選択', | |
remove: 'を削除' | |
} | |
}; | |
$.fn.MTAppAssetFields.defaults = { | |
// Set a blog ID which is a target to upload files. | |
blogId: mtappVars.blog_id, | |
// You can set either 'image' or 'file' | |
assetType: 'image', | |
// Set a text of <a> tag if you want to change. | |
assetTypeLabel: '', | |
// If set to true, you can edit images in a dialog. | |
edit: false, | |
// If set to true, the original field is shown. | |
debug: false | |
}; | |
// end - $.MTAppAssetFields(); | |
})(jQuery); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment