flashmaster

Help with implenting of booking system under PW

Recommended Posts

Hi im new to this forum and i need some help with a booking system that i have trying to implement under Processwire. I hope that i can explain as much as i can what my problem is.

Here is the orginal script https://github.com/olejon/phpmyreservation

I downloaded the script and got some help to fix it because it was all messed up. I have attached a file "ReservationSystem.rar" and it should work out of the box. Also attached the database file "Phpmyreservation.sql".

The thing is the script works great as it is now but when i install a blank version of processwire and import the script to the template folder it wont work. I have tried many things but cant get it to work just error after error etc. Please ask me if you need some more information about this. I know you are the experts so thats why im asking you.

ReservationSystem.rar

phpmyreservation.sql

Share this post


Link to post
Share on other sites

Just to clarify...

a) you wanna integrate this tool into processwire? or

b) you wanna use this script beside a processwire website?

 

  • Like 1

Share this post


Link to post
Share on other sites

Hi, thanks for your reply. I want to have this script under Processwire in the default template map. I am gonna modify the look of it later but for now i just want it to work. I have a website that im working on and this is gonna be a sub page later on. I dont need to have any fields to edit inside admin. Just have it as it is.

Thinking the problem is with some kind of path for it to work, im clueless though.

Share this post


Link to post
Share on other sites

PW does alter/check every URL that is requested, you need to map it with url segment/url vars and make check if the urls that the script need are blocked.

For using external scripts right you have to bootstrap processwire in your script so you can save and find the data via the API.

http://processwire.com/api/include/

For me i would go and setup the fields and templates in processwire and just simple use the calendar generation and you could use the HTML, JS and CSS and replace the PHP magic with PW API magic....this yould be much more flexible on the long run.

regards mr-fan

  • Like 2

Share this post


Link to post
Share on other sites

It got very confusing for me right now :) I am really bad at php so thats why i need help with this. I dont need any fields/template for the script, dont need to change anything in admin but maybe later though. Have you downloaded the attached files and look at it?

Share this post


Link to post
Share on other sites

As mr-fan suggested, why not just use the great power of processwire? It might take you a few minutes to get the fields/templates set up (though I know you say you dont need it), the advantages I think would greatly outweigh the headache of trying to get this .rar to run reliably on a page that is already in the processwire environment. Using some simple php, a calendar (or even just a check box in the backend etc) you could get this set up quickly.

Share this post


Link to post
Share on other sites

Ok maybe i was not clear enought about this. I have tried this

1. Installed a blank copy of processwire

2. Then i took all the files in the attachment that works outside processwire.

3. In admin i clicked on add new template and then all the pages was there so i added them.

4. In the code i changed the path to all the links etc to

(example)

<script src="<?=$config->urls->templates;?>js/jquery-cookies.js" type="text/javascript"></script>

instead of

<script src="js/jquery-cookies.js" type="text/javascript"></script>

Dont know what else to do?

Share this post


Link to post
Share on other sites

I know very very little about php just a few lines in fact so thats why i need your help. I know design/frontend html css. I need all the functions in the script. But for now i dont need to change any text or anything through admin in this stage. The problem is that the login screen wont show up when i put it inside the template map.

Share this post


Link to post
Share on other sites

I think there is something wrong with the main.js because it wont load the login screen. I have paste the javascript below so if anybody can see whats wrong or maybe not with the script below it would be super.

 

 


 

// Show pages

function showabout()
{
    page_load();
    div_hide('#content_div');
    $.get('about.php', function(data) { $('#content_div').html(data); div_fadein('#content_div'); page_loaded('about'); });
}

function showlogin()
{
    page_load();
    div_hide('#content_div');

    $.get('login.php', function(data)
    {
        $('#content_div').html(data);
        div_fadein('#content_div');
        page_loaded();

        var user_email = $('#user_email_input').val();
        var user_password = $('#user_password_input').val();

        if(user_email != '' && user_password != '')
        {
            setTimeout(function() { $('#login_form').submit(); }, 250);
        }
        else
        {
            input_focus('#user_email_input');
        }
    });
}

function shownew_user()
{
    page_load();
    div_hide('#content_div');
    $.get('login.php?new_user', function(data) { $('#content_div').html(data); div_fadein('#content_div'); page_loaded(); input_focus('#user_name_input'); });
    
}

function showforgot_password()
{
    page_load();
    div_hide('#content_div');
    $.get('login.php?forgot_password', function(data) { $('#content_div').html(data); div_fadein('#content_div'); page_loaded(); });
    
}

function showreservations()
{
    page_load('reservation');
    div_hide('#content_div');

    $.get('reservation.php', function(data)
    {
        $('#content_div').html(data);
        div_fadein('#content_div');

        $.get('reservation.php?week='+global_week_number, function(data)
        {
            $('#reservation_table_div').html(data).slideDown('slow', function() { setTimeout(function() { div_fadein('#reservation_table_div'); }, 250); });
            page_loaded();
        });
    });
}

function showweek(week, option)
{
    if(week == 'next')
    {
        var week = parseInt($('#week_number_span').html()) + 1;
    }
    else if(week == 'previous')
    {
        var week = parseInt($('#week_number_span').html()) - 1;
    }
    else
    {
        var week = parseInt(week);
    }

    if(isNaN(week))
    {
        notify('Invalid week number', 4);
    }
    else
    {
        if(week < 1)
        {
            var week = 52;
        }
        else if(week > 52)
        {
            var week = 1;
        }

        page_load('week');
        div_hide('#reservation_table_div');

        $.get('reservation.php?week='+week, function(data)
        {
            $('#reservation_table_div').html(data);
            $('#week_number_span').html(week);
            div_fadein('#reservation_table_div');
            page_loaded('week');

            if(week != global_week_number)
            {
                $('#reservation_today_button').css('visibility', 'visible');
            }

            if(option == 'today')
            {
                setTimeout(function() { $('#today_span').animate({ opacity: 0 }, 250, function() { $('#today_span').animate({ opacity: 1 }, 250);  }); }, 500);
            }
        });
    }
}

function showcp()
{
    page_load();
    div_hide('#content_div');
    $.get('cp.php', function(data) { $('#content_div').html(data); div_fadein('#content_div'); page_loaded(); });
}

function showhelp()
{
    page_load();
    div_hide('#content_div');
    $.get('help.php', function(data) { $('#content_div').html(data); div_fadein('#content_div'); page_loaded(); });
}

// Page load

function page_load(page)
{
    // All
    setTimeout(function()
    {
        if($('#content_div').css('opacity') == 0)
        {
            notify('Loading...', 300);
        }
    }, 500);

    // Individual
    if(page == 'reservation')
    {
        setTimeout(function()
        {
            if($('#reservation_table_div').is(':hidden'))
            {
                notify('Loading...', 300);
            }
        }, 500);
    }    
    else if(page == 'week')
    {
        setTimeout(function()
        {
            if($('#reservation_table_div').css('opacity') == 0)
            {
                notify('Loading...', 300);
            }
        }, 500);
    }
}

function page_loaded(page)
{
    // All
    $.get('main.php?day_number', function(data)
    {
        if(data != global_day_number)
        {
            notify('Day have changed. Refreshing...', '300');
            setTimeout(function() { window.location.replace('.'); }, 2000);
        }
    });

    setTimeout(function()
    {
        if($('#notification_inner_cell_div').is(':visible') && $('#notification_inner_cell_div').html() == 'Loading...')
        {
            notify();
        }
    }, 1000);

    read_reservation_details();

    // Individual
    if(page == 'about')
    {
        $('#about_latest_version_p').html('<img src="img/loading.gif" alt="Loading"> Getting latest version...');

        setTimeout(function()
        {
            $.get('main.php?latest_version', function(data)
            {
                if($('#about_latest_version_p').length)
                {
                    $('#about_latest_version_p').html(data);
                }
            });
        }, 1000);
    }
}

// Login

function login()
{
    var user_email = $('#user_email_input').val();
    var user_password = $('#user_password_input').val();

    $('#login_message_p').html('<img src="img/loading.gif" alt="Loading"> Logging in...').slideDown('fast');

    var remember_me_checkbox = $('#remember_me_checkbox').prop('checked');

    if(remember_me_checkbox)
    {
        var user_remember = 1;
    }
    else
    {
        var user_remember = 0;
    }

    $.post('login.php?login', { user_email: user_email, user_password: user_password, user_remember: user_remember }, function(data)
    {
        if(data == 1)
        {
            input_focus();
            setTimeout(function() { window.location.replace('.'); }, 1000);
        }
        else
        {
            if(data == '')
            {
                $('#login_message_p').html('<span class="error_span">Wrong email and/or password</span>');
                $('#user_email_input').val('');
                $('#user_password_input').val('');
                input_focus('#user_email_input');
            }
            else
            {
                $('#login_message_p').html(data);
            }
        }
    });
}

function logout()
{
    notify('Logging out...', 300);
    $.get('login.php?logout', function(data) { setTimeout(function() { window.location.replace('.'); }, 1000); });
}

function create_user()
{
    var user_name = $('#user_name_input').val();
    var user_email = $('#user_email_input').val();
    var user_password = $('#user_password_input').val();
    var user_password_confirm = $('#user_password_confirm_input').val();

    if($('#user_secret_code_input').length)
    {
        var user_secret_code =  $('#user_secret_code_input').val();
    }
    else
    {
        var user_secret_code = '';
    }

    if(user_password != user_password_confirm)
    {
        $('#new_user_message_p').html('<span class="error_span">Passwords do not match</span>').slideDown('fast');
        $('#user_password_input').val('');
        $('#user_password_confirm_input').val('');
        input_focus('#user_password_input');
    }
    else
    {
        $('#new_user_message_p').html('<img src="img/loading.gif" alt="Loading"> Creating user...').slideDown('fast');

        $.post('login.php?create_user', { user_name: user_name, user_email: user_email, user_password: user_password, user_secret_code: user_secret_code }, function(data)
        {
            if(data == 1)
            {
                input_focus();

                setTimeout(function()
                {
                    $('#new_user_message_p').html('User created successfully! Logging in... <img src="img/loading.gif" alt="Loading">');
                    setTimeout(function() { window.location.replace('#login'); }, 2000);
                }, 1000);
            }
            else
            {
                input_focus();
                $('#new_user_message_p').html(data);
            }
        });
    }
}

// Reservation

function toggle_reservation_time(id, week, day, time, from)
{
    if(session_user_is_admin == '1')
    {
        if(week < global_week_number || week == global_week_number && day < global_day_number)
        {
            notify('You are reserving back in time. You can do that because you\'re an admin', 4);
        }
        else if(week > global_week_number + global_weeks_forward)
        {
            notify('You are reserving more than '+global_weeks_forward+' weeks forward in time. You can do that because you\'re an admin', 4);
        }
    }

    var user_name = $(id).html();

    if(user_name == '')
    {
        $(id).html('Wait...');

        $.post('reservation.php?make_reservation', { week: week, day: day, time: time }, function(data)
        {
            if(data == 1)
            {
                setTimeout(function() { read_reservation(id, week, day, time); }, 1000);
            }
            else
            {
                notify(data, 4);
                setTimeout(function() { read_reservation(id, week, day, time); }, 2000);            
            }
        });
    }
    else
    {
        if(offclick_event == 'mouseup' || from == 'details')
        {
            if(user_name == 'Wait...')
            {
                notify('One click is enough', 4);
            }
            else if(user_name == session_user_name || session_user_is_admin == '1')
            {
                if(user_name != session_user_name && session_user_is_admin == '1')
                {
                    var delete_confirm = confirm('This is not your reservation, but because you\'re an admin you can remove other users\' reservations. Are you sure you want to do this?');
                }
                else
                {
                    var delete_confirm = true;
                }

                if(delete_confirm)
                {
                    $(id).html('Wait...');

                    $.post('reservation.php?delete_reservation', { week: week, day: day, time: time }, function(data)
                    {
                        if(data == 1)
                        {
                            setTimeout(function() { read_reservation(id, week, day, time); }, 1000);
                        }
                        else
                        {
                            notify(data, 4);
                            setTimeout(function() { read_reservation(id, week, day, time); }, 2000);
                        }
                    });
                }
            }
            else
            {
                notify('You can\'t remove other users\' reservations', 2);
            }

            if($('#reservation_details_div').is(':visible'))
            {
                read_reservation_details();
            }
        }
    }
}

function read_reservation(id, week, day, time)
{
    $.post('reservation.php?read_reservation', { week: week, day: day, time: time }, function(data) { $(id).html(data); });
}

function read_reservation_details(id, week, day, time)
{
    if(typeof id != 'undefined' && $(id).html() != '' && $(id).html() != 'Wait...')
    {
        if($('#reservation_details_div').is(':hidden'))
        {
            var position = $(id).position();
            var top = position.top + 50;
            var left = position.left - 100;

            $('#reservation_details_div').html('Getting details...');
            $('#reservation_details_div').css('top', top+'px').css('left', left+'px');
            $('#reservation_details_div').fadeIn('fast');

            reservation_details_id = id;
            reservation_details_week = week;
            reservation_details_day = day;
            reservation_details_time = time;

            $.post('reservation.php?read_reservation_details', { week: week, day: day, time: time }, function(data)
            {
                setTimeout(function()
                {
                    if(data == 0)
                    {
                        $('#reservation_details_div').html('This reservation no longer exists. Wait...');
                        
                        setTimeout(function()
                        {
                            if($('#reservation_details_div').is(':visible') && $('#reservation_details_div').html() == 'This reservation no longer exists. Wait...')
                            {
                                read_reservation(reservation_details_id, reservation_details_week, reservation_details_day, reservation_details_time);
                                read_reservation_details();
                            }
                        }, 2000);
                    }
                    else
                    {
                        $('#reservation_details_div').html(data);

                        if(offclick_event == 'touchend')
                        {
                            if($(reservation_details_id).html() == session_user_name || session_user_is_admin == '1')
                            {
                                var delete_link_html = '<a href="." onclick="toggle_reservation_time(reservation_details_id, reservation_details_week, reservation_details_day, reservation_details_time, \'details\'); return false">Delete</a> | ';
                            }
                            else
                            {
                                var delete_link_html = '';
                            }

                            $('#reservation_details_div').append('<br><br>'+delete_link_html+'<a href="." onclick="read_reservation_details(); return false">Close this</a>');
                        }
                    }
                }, 500);
            });
        }
    }
    else
    {
        $('div#reservation_details_div').fadeOut('fast');
    }
}

// Admin control panel

function list_users()
{
    $.get('cp.php?list_users', function(data) { $('#users_div').html(data); });
}

function reset_user_password()
{
    if(typeof $(".user_radio:checked").val() !='undefined')
    {
        var user_id = $(".user_radio:checked").val();

        $('#user_administration_message_p').html('<img src="img/loading.gif" alt="Loading"> Resetting password...').slideDown('fast');

        $.post('cp.php?reset_user_password', { user_id: user_id }, function(data)
        {
            if(data == 0)
            {
                $('#user_administration_message_p').html('<span class="error_span">You can change your password at the bottom of this page</span>').slideDown('fast');
            }
            else
            {
                setTimeout(function() { $('#user_administration_message_p').html(data); }, 1000);
            }
        });
    }
    else
    {
        $('#user_administration_message_p').html('<span class="error_span">You must pick a user</span>').slideDown('fast');
    }
}

function change_user_permissions()
{
    if(typeof $(".user_radio:checked").val() !='undefined')
    {
        var user_id = $(".user_radio:checked").val();

        $('#user_administration_message_p').html('<img src="img/loading.gif" alt="Loading"> Changing permissions...').slideDown('fast');

        $.post('cp.php?change_user_permissions', { user_id: user_id }, function(data)
        {
            if(data == 1)
            {
                setTimeout(function()
                {
                    list_users();
                    $('#user_administration_message_p').html('Permissions changed successfully. The user must re-login to get the new permissions');
                }, 1000);
            }
            else
            {
                $('#user_administration_message_p').html(data);
            }
        });
    }
    else
    {
        $('#user_administration_message_p').html('<span class="error_span">You must pick a user</span>').slideDown('fast');
    }
}

function delete_user_data(delete_data)
{
    if(typeof $(".user_radio:checked").val() !='undefined')
    {
        var delete_confirm = confirm('Are you sure?');

        if(delete_confirm)
        {
            var user_id = $(".user_radio:checked").val();

            $('#user_administration_message_p').html('<img src="img/loading.gif" alt="Loading"> Deleting...').slideDown('fast');

            $.post('cp.php?delete_user_data', { user_id: user_id, delete_data: delete_data }, function(data)
            {
                if(data == 1)
                {
                    setTimeout(function()
                    {
                        $('#user_administration_message_p').slideUp('fast', function()
                        {
                            if(delete_data == 'reservations')
                            {
                                list_users();
                                get_usage();
                            }
                            else if(delete_data == 'user')
                            {
                                list_users();
                            }
                        });
                    }, 1000);
                }
                else
                {
                    $('#user_administration_message_p').html(data);
                }
            });
        }
    }
    else
    {
        $('#user_administration_message_p').html('<span class="error_span">You must pick a user</span>').slideDown('fast');
    }
}

function delete_all(delete_data)
{
    if(delete_data == 'reservations')
    {
        var delete_confirm = confirm('Are you sure you want to delete ALL reservations? Database backup is a good idea!');
    }
    else if(delete_data == 'users')
    {
        var delete_confirm = confirm('Are you sure you want to delete ALL users? Database backup is a good idea!');
    }
    else if(delete_data == 'everything')
    {
        var delete_confirm = confirm('Are you sure you want to delete EVERYTHING (including you)? The first user created afterwards will become admin. Database backup is a good idea!');
    }

    if(delete_confirm)
    {
        $('#database_administration_message_p').html('<img src="img/loading.gif" alt="Loading"> Deleting...').slideDown('fast');

        $.post('cp.php?delete_all', { delete_data: delete_data }, function(data)
        {
            if(data == 1)
            {
                setTimeout(function()
                {
                    if(delete_data == 'everything')
                    {
                        window.location.replace('#logout');
                    }
                    else
                    {
                        list_users();
                        $('#database_administration_message_p').slideUp('fast');
                    }
                }, 1000);
            }
            else
            {
                $('#database_administration_message_p').html(data);
            }
        });
    }
}

function save_system_configuration()
{
    var price = $('#price_input').val();

    $('#system_configuration_message_p').html('<img src="img/loading.gif" alt="Loading"> Saving...');
    $('#system_configuration_message_p').slideDown('fast');

    $.post('cp.php?save_system_configuration', { price: price }, function(data)
    {
        if(data == 1)
        {
            input_focus();

            setTimeout(function()
            {
                $('#system_configuration_message_p').slideUp('fast', function()
                {
                    get_usage();
                });
            }, 1000);
        }
        else
        {
            input_focus('#price_input');
            $('#system_configuration_message_p').html(data);
        }
    });
}

// User control panel

function get_usage()
{
    $.get('cp.php?get_usage', function(data) { $('#usage_div').html(data); });
}

function get_reservation_reminders()
{
    $.get('cp.php?get_reservation_reminders', function(data) { $('#reservation_reminders_span').html(data); });
}

function add_one_reservation()
{
    $('#usage_message_p').html('<img src="img/loading.gif" alt="Loading"> Saving...').slideDown('fast');

    $.post('reservation.php?make_reservation', { week: '0', day: '0', time: '0' }, function(data)
    {
        if(data == 1)
        {
            setTimeout(function()
            {
                if($('#users_div').length)
                {
                    list_users();
                }

                get_usage();
                $('#usage_message_p').slideUp('fast');
            }, 1000);
        }
        else
        {
            $('#usage_message_p').html(data);
        }
    });
}

function toggle_reservation_reminder()
{
    $('#settings_message_p').html('<img src="img/loading.gif" alt="Loading"> Saving...').slideDown('fast');

    $.post('cp.php?toggle_reservation_reminder', function(data)
    {
        if(data == 1)
        {
            setTimeout(function()
            {
                if($('#users_div').length)
                {
                    list_users();        
                }

                get_reservation_reminders();
                $('#settings_message_p').slideUp('fast');
            }, 1000);
        }
        else
        {
            $('#settings_message_p').html(data);
        }
    });
}

function change_user_details()
{
    var user_name = $('#user_name_input').val();
    var user_email = $('#user_email_input').val();
    var user_password = $('#user_password_input').val();
    var user_password_confirm = $('#user_password_confirm_input').val();

    if(user_password != user_password_confirm)
    {
        $('#user_details_message_p').html('<span class="error_span">Passwords do not match</span>').slideDown('fast');
        $('#user_password_input').val('');
        $('#user_password_confirm_input').val('');
        input_focus('#user_password_input');
    }
    else
    {    
        $('#user_details_message_p').html('<img src="img/loading.gif" alt="Loading"> Saving and refreshing...').slideDown('fast');

        $.post('cp.php?change_user_details', { user_name: user_name, user_email: user_email, user_password: user_password }, function(data)
        {
            if(data == 1)
            {
                input_focus();
                setTimeout(function() { window.location.replace('.'); }, 1000);
            }
            else
            {
                input_focus();
                $('#user_details_message_p').html(data);
            }
        });
    }
}

// UI

function div_fadein(id)
{
    setTimeout(function()
    {
        if(global_css_animations == 1)
        {
            $(id).addClass('div_fadein');
        }
        else
        {
            $(id).animate({ opacity: 1 }, 250);
        }
    }, 1);
}

function div_hide(id)
{
    $(id).removeClass('div_fadein');
    $(id).css('opacity', '0');
}

function notify(text, time)
{
    if(typeof text != 'undefined')
    {
        if(typeof notify_timeout != 'undefined')
        {
            clearTimeout(notify_timeout);
        }

        $('#notification_inner_cell_div').css('opacity', '1');

        if($('#notification_div').is(':hidden'))
        {
            $('#notification_inner_cell_div').html(text);
            $('#notification_div').slideDown('fast');
        }
        else
        {
            $('#notification_inner_cell_div').animate({ opacity: 0 }, 250, function() { $('#notification_inner_cell_div').html(text); $('#notification_inner_cell_div').animate({ opacity: 1 }, 250); });
        }

        notify_timeout = setTimeout(function() { $('#notification_inner_cell_div').animate({ opacity: 0 }, 250, function() { $('#notification_div').slideUp('fast'); }); }, 1000 * time);
    }
    else
    {
        if($('#notification_div').is(':visible'))
        {
            $('#notification_inner_cell_div').animate({ opacity: 0 }, 250, function() { $('#notification_div').slideUp('fast'); });
        }
    }
}

function input_focus(id)
{
    if(offclick_event == 'touchend')
    {
        $('input').blur();
    }
    if(typeof id != 'undefined')
    {
        $(id).focus();
    }
}

// Document ready

$(document).ready( function()
{
    // Detect touch support
    if('ontouchstart' in document.documentElement)
    {
        onclick_event = 'touchstart';
        offclick_event = 'touchend';
    }
    else
    {
        onclick_event = 'mousedown';
        offclick_event = 'mouseup';
    }

    // Visual feedback on click
    $(document).on(onclick_event, 'input:submit, input:button, .reservation_time_div', function() { $(this).css('opacity', '0.5'); });
    $(document).on(offclick_event+ ' mouseout', 'input:submit, input:button, .reservation_time_div', function() { $(this).css('opacity', '1.0'); });

    // Buttons
    $(document).on('click', '#reservation_today_button', function() { showweek(global_week_number, 'today'); });
    $(document).on('click', '#reset_user_password_button', function() { reset_user_password(); });
    $(document).on('click', '#change_user_permissions_button', function() { change_user_permissions(); });
    $(document).on('click', '#delete_user_reservations_button', function() { delete_user_data('reservations'); });
    $(document).on('click', '#delete_user_button', function() { delete_user_data('user'); });
    $(document).on('click', '#delete_all_reservations_button', function() { delete_all('reservations'); });
    $(document).on('click', '#delete_all_users_button', function() { delete_all('users'); });
    $(document).on('click', '#delete_everything_button', function() { delete_all('everything'); });
    $(document).on('click', '#add_one_reservation_button', function() { add_one_reservation(); });

    // Checkboxes
    $(document).on('click', '#reservation_reminders_checkbox', function() { toggle_reservation_reminder(); });

    // Forms
    $(document).on('submit', '#login_form', function() { login(); return false; });
    $(document).on('submit', '#new_user_form', function() { create_user(); return false; });
    $(document).on('submit', '#system_configuration_form', function() { save_system_configuration(); return false; });
    $(document).on('submit', '#user_details_form', function() { change_user_details(); return false; });

    // Links
    $(document).on('click mouseover', '#user_secret_code_a', function() { div_fadein('#user_secret_code_div'); return false; });
    $(document).on('click', '#previous_week_a', function() { showweek('previous'); return false; });
    $(document).on('click', '#next_week_a', function() { showweek('next'); return false; });

    // Divisions
    $(document).on('mouseout', '.reservation_time_cell_div', function() { read_reservation_details(); });

    $(document).on('click', '.reservation_time_cell_div', function()
    {
        var array = this.id.split(':');
        toggle_reservation_time(this, array[1], array[2], array[3], array[0]);
    });

    $(document).on('mousemove', '.reservation_time_cell_div', function()
    {
        var array = this.id.split(':');
        read_reservation_details(this, array[1], array[2], array[3]);
    });

    // Mouse pointer
    $(document).on('mouseover', 'input:button, input:submit, .reservation_time_div', function() { this.style.cursor = 'pointer'; });
});

// Hash change

function hash()
{
    var hash = window.location.hash.slice(1);

    if(hash == '')
    {
        if(typeof session_logged_in != 'undefined')
        {
            showreservations();
        }
        else
        {
            showlogin();
        }
    }
    else
    {
        if(hash == 'about')
        {
            showabout();
        }
        else if(hash == 'new_user')
        {
            shownew_user();
        }
        else if(hash == 'forgot_password')
        {
            showforgot_password();
        }
        else if(hash == 'help')
        {
            showhelp();
        }
        else if(hash == 'cp')
        {
            showcp();
        }
        else if(hash == 'logout')
        {
            logout();
        }
        else
        {
            window.location.replace('.');
        }
    }
}

// Window load

$(window).load(function()
{
    // Make sure cookies are enabled
    $.cookie(global_cookie_prefix+'_cookies_test', '1');
    var test_cookies_cookie = $.cookie(global_cookie_prefix+'_cookies_test');

    if(test_cookies_cookie == null)
    {
        window.location.replace('error.php?error_code=3');
    }
    else
    {
        $.cookie(global_cookie_prefix+'_cookies_test', null);

        hash();

        $(window).bind('hashchange', function ()
        {
            hash();
        });
    }
});

// Settings

$(document).ready( function()
{
    $.ajaxSetup({ cache: false });
});

 

Edited by kongondo
code block

Share this post


Link to post
Share on other sites

This might have something to do with the fact that ProcessWire by default block access to files in the templates directory. @BitPoet pointed this out here:

On 8/10/2016 at 12:49 PM, BitPoet said:

ProcessWire by default blocks access to files with the extensions php, htm, html, inc and tpl underneath the templates directory (or, to be precise, the shipped .htaccess file does so). This is a security feature.

Thus, to access third party PHP code, you have two choices:

  • Move the relevant code outside of the templates directory or
  • create a template with a PHP file in site/templates that includes the external library (in your case instapast-ajax.php, and that's where Ryan's quote comes in) and a page that uses this template (and that provides you with the URL to call from JS)

You might need to move this files etc outside the template directory. However, I have not gone through ALL the code yet as there is a ton. I'll keep digging through it. Someone please correct me if I am wrong, as I have not worked much with assets that dont run through the processwire environment.

  • Like 1

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.

  • Similar Content

    • By gnanasekar
      Hello All,
      Hope all doing good, I am a newbie to processwire. I have an issue please help me out!!!
      Here is my question:
      I have two usernames with one email apparently. when rebuilding my Jenkins server, I get a failed to authenticate and now I cannot reset the password of the other account. Any help would be appreciated.
      Thanks
    • By DamegoGmbH
      Hi there,
      we are a small Communication Agency in Munich and we are searching for a Processwire Developer.
      A lot of our Online Projects are based on Processwire and our current Developer is switching from Freelance to a full term job.
      The work can be done remotely from anywhere.
      For more Informations please contact me directly via Email: p.kirschvink@damego.de
      Looking forward to hear from you.
      Best
      Paul
    • By karian
      Hi, based on the work of @microcipcip and @gebeer  (see their posts here and here), I put together a Processwire + React boilerplate (profile).
      Github repo: https://github.com/lapico/process-react

      Cheers,
      K
       
    • By Sephiroth
      Hi, So today I will writing a small tutorial on developing templates in Processwire using Twig Template, Processwire is a highly flexible CMS which gives developers/designers/users options and allows easy extension of the platform. So here goes the tutorial 
      What is Twig Template ?
      Simply put in my own words, Twig is a modern templating engine that compiles down to PHP code, unlike PHP, Twig is clean on the eyes , flexible and also quite *easy* to have dynamic layout site with ease ,without pulling your hair out. Twig is trusted by various platforms. It was created by the guys behind Symfony.
      Take this code as an example
      {% for user in users %} <h1>* {{ user }}</h1> {% endfor %} This will simply be the equivalent in PHP World
      <?php $userArray = ["Nigeria","Russia"]; foreach($userArray as $user): ?> <h1><?= $user ?></h1> <?php endforeach; The PHP code though looks simple enough however, you start to notice that you have to be concerned about the PHP tags by ensuring they are closed  properly , most times projects gets bigger and comes complex and harder to read/grasp, and also in PHP you can explicitly create variables in the template making it very hard to read as it grows and prone to getting messy WordPress is a major culprit when it comes to that regard.
      Have you ever wanted to created separate layouts for different pages and  break your sites into different parts e.g Sidebar, Comment Section, Header Section ? the regular approach would be to create individual pages for each section and simply add them as templates for the pages and with time, you can end up having tons of templates, however Twig allows you to easily inherit templates and also override the templates where you can inject content into the block easily. Don't worry if you don't understand the concept, the following parts will explain with an example of how to easily inherit layouts and templates.
      Layout
      <!DOCTYPE html> <html lang="en"> <head> {{include("layout/elements/header.twig")}} </head> <body> <div class="container-fluid" id="minimal"> <header id="pageIntro"> <div class="bio_panel"> <div class="bio_section col-md-6"> <h1>Okeowo Aderemi</h1> <h2>{{ page.body }}</h2> </div> </div> <div class="clearfix"></div> </header> <section id="page-body"> <div class="container"> <div id="intro" class="col-md-7 col-lg-7"> <h1>About me</h1> <h2> {{ page.summary }} </h2> </div> {block name="content"}{/block} <a style="font-size:1.799783em; font-style:italic;color:#d29c23" href="{{pages.get('/notes').url }}">Read more articles</a> </div> <div class="clearfix"></div> </div> </section> </div> <footer> <div class="header-container headroom headroom--not-top headroom--pinned" id="header-container"> {{include("layout/elements/footer.twig")}} </div> </footer> </body> </html> This is basically a layout where we specify blocks and include other templates for the page, don't panic if you don't understand what is going on, I will simply break down the weird part as follows:
      Include
      This basically is similar to native PHP 'include', as it's name suggests it simply includes the templates and injects the content into the layout , nothing out of the ordinary here if you are already familiar with php's include function.
      {{ output }}
      This simply evaluates the expression and prints the value, this  evaluate expressions, functions that return contents , in my own short words it's basically the same as <?= output ?> except for the fact that it's cleaner to read.
      {% expression %}
      unlike the previous this executes statements such as for loops and other Twig statements.
      {% for characters in attack_on_titans %} <h1> {{characters}} </h1> {% endfor %} This  executes a for loop and within the for loop, it creates a context to which variables in that context can be referenced and evaluated, unlike dealing with the opening and closing PHP tags, Twig simply blends in with markup and makes it really quick to read. 
      I will simply post the contents of both the header and footer so you can see the content of what is included in the layout
      header.php
      <meta charset="utf-8"/> <meta content="IE=edge" http-equiv="X-UA-Compatible"/> <meta content="width=device-width, initial-scale=1" name="viewport"/> <title> {{ page.title }} </title> <link href=" {{config.urls.templates }}assets/css/bootstrap.min.css" rel="stylesheet"/> <link href="{{config.urls.templates }}assets/css/main.min.css" rel="stylesheet"/> <link rel='stylesheet' type='text/css' href='{{config.urls.FieldtypeComments}}comments.css' /> <link rel="stylesheet" href="{{config.urls.siteModules}}InputfieldCKEditor/plugins/codesnippet/lib/highlight/styles/vs.css"> <script type="text/javascript" src="{{config.urls.siteModules}}InputfieldCKEditor/plugins/codesnippet/lib/highlight/highlight.pack.js"></script> <script src="{{config.urls.templates }}assets/js/vendors/jquery-1.11.3.min.js"> </script> <script src="{{config.urls.templates }}assets/js/vendors/bootstrap.min.js"> </script> <script src="{{config.urls.FieldtypeComments}}comments.js"></script> <link rel="stylesheet" type='text/css' href="{{config.urls.templates}}js/jquery.fancybox.min.css"> <script src="{{config.urls.templates}}js/jquery.fancybox.min.js"></script> {block name="javascriptcodes"}{/block} footer.php
      <nav class="site-nav pull-right"> <div class="trigger"> <a class="page-link" href="{{pages.get('/about').url}}"> <span>{</span> About <span>}</span> </a> <a class="page-link" href="{{pages.get('/notes').url}}"> <span>{</span> Journals <span>}</span> </a> <a class="page-link" target="_blank" href="https://ng.linkedin.com/in/okeowo-aderemi-82b75730"> <span>{</span> Linkedin <span>}</span> </a> <a class="twitter page-link" target="_blank" href="https://twitter.com/qtguru"> <span>{</span> Twitter <span>}</span> </a> </div> </nav> There's nothing special here, other than twig simply injecting these fragments into the main layout , the next part is the most interesting and important concept and benefit that Twig has to offer
      {% block content %}{% endblock %}
      This tag simply creates a placeholder in which the content would be provided by the template inheriting this layout, in lay terms it simply means child templates will provide content for that block, the 'content' simply uses the name 'content' to refer to that specific block, so assuming we were to inherit this template it would simply look like this.
      Inheriting Template Layout
      {% extends 'layout/blog.twig' %} {% block content %} <div class="container blog-container"> <section class="blog"> <header class="blog-header"> <h1> {{page.title}} </h1> <h5 class="blog_date"> {{page.published|date("F d, Y")}} </h5> <br> </br> </header> <div class="blog_content"> <hr class="small" /> {{page.body}} <hr class="small" /> </div> </section> </div> {% endblock %} {% block nav %} <div class="col-md-4 col-xs-4 col-sm-4 prev-nav"> <a href="{{page.prev.url}}"> ← Prev </a> </div> <div class="col-md-4 col-xs-4 col-sm-4 home-nav"> <a href="{{homepage.url}}"> Home </a> </div> <div class="col-md-4 col-xs-4 col-sm-4 next-nav"> <a href="{{page.next.url}}"> Next → </a> </div> {% endblock %} In this snippet you can easily notice how each blocks previously created in the header and layout are simply referenced by their names, by now you will notice that twig doesn't care how you arrange the order of each block, all Twig does is to get the contents for each blocks in the child templates and inject them in the layout theme, this allows flexible templating and also extending other layouts with ease.
      Twig in Processwire
      Thanks to @Wanze we have a Twig Module for Processwire and it's currently what i use to build PW solutions to clients
      https://modules.processwire.com/modules/template-engine-twig/
      The Modules makes it easy to not only use Twig in PW but also specify folders to which it reads the twig templates, and also injects Processwire objects into it, which is why i can easily make reference to the Pages object, another useful feature in this module is that you can use your existing template files to serve as the data provider which will supply the data to be used for twig template.
      take for example, assuming I wanted the homepage to display the top six blog posts on it, TemplateEngineTwig will simply load the home.php ( Depending on what you set as the template), it is also important that your twig file bears the same name as your template name e.g home.php will render into home.twig here is an example to further explain my point.
      home.php
      <?php //Get the Top 6 Blog Posts $found=$pages->find("limit=6,include=hidden,template=blog-post,sort=-blog_date"); $view->set("posts",$found);  
      The $view variable is the TemplateEngine which in this case would be Twig, the set method simply creates a variables posts which holds the data of the blog posts, the method allows our template 'blog.twig' to simply reference the 'posts' variable in Twig Context. Here is the content of the 'blog.twig' template
      blog.tpl
      {% extends 'layout/blog.twig' %} {% block content %} <div class="block_articles col-md-5 col-lg-5"> {% for post in posts %} <div class="article_listing"> <span class="article_date"> {{post.published}}</span> <h2 class="article_title"> <a href="{{post.url}}">{{post.title}}</a> </h2> </div> {% endfor %} {% endblock %} So home.php sets the data to be used in home.tpl once Twig processes the templates and generates the output, twig takes the output from the block and injects it in the appriopriate block in the layout, this makes Processwire templating more flexible and fun to work with. 
      The major advantage this has; is that you can easily inherit layouts and provide contents for them with ease, without the need of running into confusions when handling complex layout issues,an example could be providing an administrator dashboard for users on the template side without allowing users into the Processwire back-end. You can also come up with several layouts and reusable templates.
       
      Feel free to ask questions and any concerns  in this approach or any errors I might have made or overlooked.
      Thanks
       
       
       
    • By pycode
      Hello PW, 
      discovered few days ago this awesome cms and now want to start a project on it, but need some help. I'm coming from the drupal side, which I kinda like, but it is not usable for smaller projects like I need now. I like it's way to build to content from the ground up, but it feels heavy, don't know why. PW feels really light and want to give it a try.
      Long story short, development it is a hobby for me, so everything I do is self-learned throw try & error, no programming skills yet. I want to learn JS now, and for that, want to translate a website to my native Romanian language so I can learn myself and others in the future. The site I'm talking about is www.learn.javascript.ru
      I want to build a similar structured site (please see the attached image):

      Home / Projects / About will be basic page template based, no problem with them.
      mysite.com/javascript/
      Starting Learn JavaScript will be a basic page template as well, I can make it statit, as it will contain some info and links to the Sections of the JS theory pages.
      mysite.com/javascript/section-name/
      By accessing a section page, I want to see again some description text and links of the attached unit pages to this section, so when I open any section it shows me all the attached unit pages to it. On the sidebar, I need to render links to all the sections, just that.
      Next is unit pages like mysite.com/javascript/section-name/unit-name/
      Here goes the units text, main content in other words, like a blog post. The key point is to have a dropdown and select the section page for it. For sidebar, I want to render the list with links for every headline from the unit page. Will do it by using Jumplinks Hanna Code, I believe it will do the job perfectly.
      Who can give me a hand with the templates?
      first /javascript/ page I can do as a basic page.
      next /javascript/section-name/ don't know. what fields should it contain for linking units?
      and last /javascript/section-name/unit-name/ again, what field needs to be used for linking? Page refference I believe?
      How I write it to templates?
      Would be gratefull for your help guys,
      Thank you