Remove_frames

Michal Čihař edited this page May 16, 2016 · 4 revisions

This page is a concept, a rough idea. It is a proposal of how the page loading could work without html frames, ready for discussion.

Background

Until phpMyAdmin 3, html frames were used to seperate the navigation pane from the main pane. Removing frames is on the roadmap for phpMyAdmin 4.

Definitions

  • section : server, database, table
  • subsection : structure, data, operations, ...

Concept

  • 1 html page, f.e. index.php (but it also applies to any other section_subsection.php file), where the navigation section and main section are defined by <div> tags (as opposed to frames needing at least 3 different pages)
  • every section_subsection has it's own page, to make direct links or using right-click in tabbed browsing possible

Layout

  • navigation pane (left or right, depending on LTR setting)
    • header (logo, shortcuts)
    • database/table list
  • main pane
    • breadcrumb
    • tabs (applicable to the current section : server, database, table)
    • data (f.e. table list, edit table structure, users management, ...)

Refreshing/browsing

Clicking on a link in the navigation frame, or clicking on a link in the breadcrumb or tabs, would reload the main pane : data, but also updating of breadcrumb and tabs, using Javascript, AJAX and/or AHAH Opening a file from a direct link, or opening a link in seperate browser tab, would reload the entire html page (navigation + main)

Implementation

File structure

  • PMA root

One file per section_subsection.php : containing nothing but includes to libraries and a function call to load the page.

  • libraries
    • Page.Class.php : common layout functionality (html structure, navi pane, page loading, ...)
    • Page_section_subsection.Class.php : containing the specific functionality for creating each section_subsection

OOP

Every section_subsection page could be a derived from a base PMA_Page Class

PMA_Page Class

This base class would have common functionality to load a page :

  • init
    • check token validity
    • load Configuration
    • User Authentication
    • check url parameters
    • load user preferences (cookies, PMA Storage)
  • definition
    • define breadcrumb
    • define tabs
    • define js.files to include
  • layout
    • display navi pane
    • display breadcrumb
    • display tabs
    • display data [abstract]
    • include js files
    • display page (using the different parts mentioned here)

PMA_Page_Section_Subsection Class

Derives from PMA_Page and overrides some sections :

  • definition
    • define breadcrumb
    • define tabs
    • define js.files to include
  • layout
    • display data

In action

Initial loading of a page

A section_subsection.php file loads a corresponding inc.php file, creates an instance of a PMA_Page Class (using a factory pattern) and loads the page :

<?php require "libraries\Page.Class.php"; $page = PageFactory->create("section_subsection"); $page->display_page(); ?>

Updating a section

When updating only a section of a page, f.e. when clicking a different tab, the corresponding function class can be used to get the html part that changes. This part can be replaced in the original html page. f.e.:

<?php require "libraries\Page.Class.php"; $page = PageFactory->create("section_subsection"); return $page->display_data(); ?>

The output of this function/page can be inserted/replaced by Javascript in the current page. (AHAH)

Refreshing data

If the subsection stays the same, the data could be refreshed using AJAX. F.e. when browsing a table and the next 30 rows are called. No need to reload all the html. An AJAX call to get the next 30 rows and update the current page is sufficient.

Category:Devel

Clone this wiki locally
You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.
Press h to open a hovercard with more details.