Use iframe instead of popup window to display editor components in mobile

This commit is contained in:
Kijin Sung 2025-05-14 01:09:59 +09:00
parent 833cf111bd
commit f6313d44d9
5 changed files with 50 additions and 2 deletions

View file

@ -55,12 +55,23 @@ class EditorView extends Editor
{
// add a css file
Context::loadFile($this->module_path."tpl/css/editor.css", true);
// List variables
$editor_sequence = Context::get('editor_sequence');
$component = Context::get('component');
$iframe_sequence = Context::get('iframe_sequence');
if (empty($editor_sequence) || !ctype_alnum($editor_sequence))
{
return new BaseObject(-1, 'msg_invalid_request');
}
if (isset($iframe_sequence) && !ctype_alnum($iframe_sequence))
{
return new BaseObject(-1, 'msg_invalid_request');
}
$component = Context::get('component');
$site_module_info = Context::get('site_module_info');
$site_srl = (int)$site_module_info->site_srl;
// Get compoenet object
$oComponent = EditorModel::getComponentObject($component, $editor_sequence, $site_srl);
if(!$oComponent->toBool())

View file

@ -1,3 +1,5 @@
<include target="popup_iframe.blade.php" />
<script>
alert("{$message}");
window.close();

View file

@ -210,7 +210,25 @@ function openComponent(component_name, editor_sequence, manual_url) {
if(typeof(manual_url)!="undefined" && manual_url) popup_url += "&manual_url="+escape(manual_url);
if(typeof(current_mid)!="undefined" && current_mid) popup_url += "&mid="+escape(current_mid);
if (navigator.userAgent.match(/mobile/i)) {
openComponentInIframe(popup_url);
} else {
popopen(popup_url, 'editorComponent');
}
}
function openComponentInIframe(popup_url) {
var iframe_sequence = String(Date.now()) + Math.round(Math.random() * 1000000);
var iframe = document.createElement('iframe');
popup_url += '&iframe_sequence=' + iframe_sequence;
iframe.setAttribute('id', 'editor_iframe_' + iframe_sequence);
iframe.setAttribute('src', popup_url);
iframe.setAttribute('width', '100%');
iframe.setAttribute('height', '100%');
iframe.setAttribute('frameborder', '0');
iframe.setAttribute('scrolling', 'no');
iframe.setAttribute('style', 'position:fixed; top:0; left:0; width:100%; height:100%; z-index:999999999; background-color: #fff; overflow-y:auto');
$(document.body).append(iframe);
}
// 더블클릭 이벤트 발생시에 본문내에 포함된 컴포넌트를 찾는 함수

View file

@ -1,3 +1,5 @@
<include target="popup_iframe.blade.php" />
<div>
{$popup_content|noescape}
</div>

View file

@ -0,0 +1,15 @@
@if (isset($iframe_sequence) && !empty($iframe_sequence))
<script>
const iframe_sequence = '{{ $iframe_sequence }}';
window.opener = window.parent;
window.close = function() {
parent.document.getElementById('editor_iframe_' + iframe_sequence).remove();
};
</script>
<style>
.x.popup { width: 100vw; height: 100vh; }
.x.popup > div { width: 100vw; height: 100vh; display: flex; flex-direction: column; }
.x_modal-header { flex: 0 0 auto; }
.x_modal-body { flex: 1; overflow: scroll; }
</style>
@endif