我一直在研究代码组织技术,特别是针对JavaScript,但尚未找到合适的解决方案。所以我想我在这里要求就此事提出任何意见。
简介
我目前正在开发一个基于自定义开发的php框架的Intranet项目。
框架的工作原理如下:
模块内的文件夹结构如下所示:
[MODULEROOT]
--[include]
----[auto] # every php script inhere gets autocincluded when the module loads
----[css] # module specific css files go in here. They also get autoincluded and injected into the header tag of the generated html
----[js] # module specific js files go in here. They also get autoincluded and injected into the header tag of the generated html
--[interface]
---- class.modInterface.php # Provides an easy interface for other modules to use their functionality.
---- class.modAjaxInterface.php # All AjaxCalls inside this framework go through php which does context changes (switch working directories when calling other modules etc...), generates the necessary JavaScript calls etc... (based on jQuery's $.get())
---- class.modSearch.php # Basically an interface for providing module specific search results and hooks them into the global search
全局AjaxInterface类看起来像这样(简化):
class ModuleAjaxInterface extends LibBase{
private static $handler_file = "";
private static $file_upload_handler_file = "";
private static $registered_objects = array();
public static function init(){
// Initialization of the class. Getting all the modules interfaces and registering them etc...
// Setting up the handler_file base on the config
}
public static function create($request_params=array(), $funcname, $options=array()){
// Basically builds a JavaScript CodeBlock which handles all the function calling to the right file, parameter handling and callback functionality and returns it as String
}
public static function createPeriodical($request_params=array(), $funcname, $options=array()){
// Same as above but creates periodical calls to the given function
}
public static function createUploadElement($upload_target, $input="file", $options=array()){
// Creates an AjaxBased uploader and returns it as String
}
public function getHandlerUrl($params=array()){
// Returns the URL for manual AjaxCalls to a Module defined by params
}
}
问题
现在你已经对这里的设置有了基本的了解<我的问题
我有一些相当重的javascript模块。因此,它自己的AjaxInterface或其他模块的AjaxInterfaces有很多AjaxCalls。
这些AjaxCalls是通过回显到页面的PHP函数结束生成的。
然后我有特定的逻辑来调用Ajax JavaScript函数以及响应数据的所有处理并将其注入到当前模块的JavaScript中的dom中。
很多时候调用AjaxFunctions的JavaScript代码是通过PHP生成的,因为它依赖于来自PHP环境的信息。像会话信息或用户特定的信息或数据库相关的东西。
所以我目前正在编写一个PHP函数,它将带有AjaxCall的JavaScript函数输出到PHP函数。这个JavaScript函数由另一个JavaScript函数调用,或者在JavaScript事件中调用,它可能依赖于当前的PHP环境,这就是为什么它是用PHP编写的。
我希望有人能解决我的问题。因此,我经常会使用大量内联JavaScript,因为所有模块都在html中的内容div中呈现。 另外我应该如何处理$(document).ready()调用?
为了举例说明如何使用此设置,请参阅以下代码行:
在我们的预订系统内
facility_container.php:
<?php
...
include_once('facility_dropdown.php');
include_once('facility_calendar.php');
include_once('facility_javascript.php');
?>
facility_javascript.php:
<script type="text/javascript">
<?php
if(!$rights->getSpecialRight('IS_FACACC', $facility_id) && $resmode==2){
?>
_flash("<h3>Information</h3><p>You don't have access to this facility.</p>", 'INFO', 0);
<?php
}
?>
$(document).ready(function(){
function setFacilityListAndShow(html){
$('#facility-list').html(html).parent().show();
$('#facility-list').combobox();
}
function setFacilityListAndHide(html){
$('#facility-list').html(html).parent().show();
$('#facility-list').combobox();
}
function setFacilityList(html){
$('#facility-list').html(html);
}
[...]
$('#facility-list').change(function(){
$('form[name="facility_form"]').submit();
});
<?php echo ModuleAjaxInterface::create(array('intname'=>'facilities', 'funcname'=>'getFacilitiesByTid'), 'getFacilitiesByTid', array('use_callback'=>true)); ?>
<?php echo ModuleAjaxInterface::create(array('intname'=>'facilities', 'funcname'=>'addReservationAsArray'), 'addReservationAsArray', array('use_callback'=>true)); ?>
<?php echo ModuleAjaxInterface::create(array('intname'=>'facilities', 'funcname'=>'addReservationAsSeriesAsArray'), 'addReservationAsSeriesAsArray', array('use_callback'=>true)); ?>
<?php echo ModuleAjaxInterface::create(array('intname'=>'facilities', 'funcname'=>'addSeriesElementAsArray'), 'addSeriesElementAsArray', array('use_callback'=>true)); ?>
<?php echo ModuleAjaxInterface::create(array('intname'=>'facilities', 'funcname'=>'fetchEvents'), 'fetchEvents', array('use_callback'=>true)); ?>
<?php echo ModuleAjaxInterface::create(array('intname'=>'facilities', 'funcname'=>'removeEvent'), 'removeEvent', array('use_callback'=>true)); ?>
<?php echo ModuleAjaxInterface::create(array('intname'=>'facilities', 'funcname'=>'updateEvent'), 'updateEvent', array('use_callback'=>true)); ?>
[...]
function removeEventComplete(data, input_params){
if(data.status == 'success'){
$('#calendar').fullCalendar('removeEvents', current_event.id);
current_event = null;
resetBookingForm();
}
_flash('<h3>'+data.title+'</h3><p>'+data.msg+'</p>', data.status, data.timeout);
}
function updateEventComplete(data, input_params){
if(data.status == false){
$('#submit').show();
$('#calendar').fullCalendar('rerenderEvents'); // Nothing was updated. So we rerender all the events so that the reservation appears on the same place
}else{
resetBookingForm();
}
}
<?php
if(!empty($facility_id)){
?>
[...] // 1000 lines of logic
$('#submit').click(function(){
$(this).hide();
$('#delete').hide();
var startdate = new Date(_parseInt($('#start-year').val()), _parseInt($('#start-month').val()-1), _parseInt($('#start-day').val()), _parseInt($('#start-hour').val()), _parseInt($('#start-minute').val()),0);
var enddate = new Date(_parseInt($('#start-year').val()), _parseInt($('#start-month').val()-1), _parseInt($('#start-day').val()), _parseInt($('#end-hour').val()), _parseInt($('#end-minute').val()), 0);
var send_notification = 0;
if($('#notify').is(':checked')){
send_notification = 1;
}
var is_private = 0;
if($('#is_private').is(':checked')){
is_private = 1;
}
// New Event was created so we call addReservationAsArray();
if(current_event.db_id == 0){
var event_type = $('input[name=type]:checked').val();
if(event_type == 'single'){
var new_event = {
'reservation': {
'facilityid': <?php echo $facility_id; ?>,
'userid': '<?php echo $session->getUser(); ?>',
'serid': 0,
'reason': $('#title').val(),
'begin': startdate.getTime()/1000,
'end': enddate.getTime()/1000,
'send_notification': send_notification,
'is_private': is_private,
'style': current_event.category,
'count': 1
}
};
addReservationAsArray(new_event);
current_event.is_temp = false;
}else{
[...]
}
<?php
}else{
?>
$('.combobox').combobox();
$('#facility-list').siblings().find('input.ui-combobox-input').val("");
<?php
}
?>
}); // document.ready() END
</script>
我真的没有一个好的概念,即组织此代码的最佳方式是什么。
感谢您阅读所有这些内容。 任何输入都将不胜感激