by Svilen Vassilev
After logging in the app, you'll get redirected to the backend dashboard. Leave it open for convenience and open another browser tab with the frontend (vateud.net). You'll notice, that as a logged in user you'll have an Admin Bar fixed to the bottom of the screen like this:
The admin bar will always be there, while you navigate the site when logged in, but its buttons will change depending on the pages that you're looking at to reflect your abilities to edit those pages.
The Admin Panel button will always be there to allow you going to the backend.
The Logout button will always be there to let you exit the session.
The "New Page" or "New News Item" buttons, when present, will send you to the backend form for creating a new page or new news item respectively. This is just for convenience. You have this functionality on the backend anyway.
The "Edit text" or "Edit news item" buttons, when available, will put you in edit mode, opening an overlay WYSIWYG editor directly on the frontend. The editable zones are outlined with light blue and you get the standard familiar editor functionality to format the text, tables, images, links, etc:
When ready, remember to hit the Save button.
So, editing the website is as simple as navigating to the page you want to edit and clicking the edit button on the adminbar. Same applies for news items.
The admin backend (http://vateud.net/admin) is used to create or delete pages and news, to edit SEO metadata and other basic preferences for the pages/news and to rearrange page order. The backend is not used or needed for content editing.
The backend contains the following sections: dashboard, news management, pages management. On the dashboard there's nothing useful right now and it's underdeveloped; can be used potentially to get a quick overview of recent activity at a glance, but with only 2 backend models, this does not provide much value.
The page management interface provides a listing of all existing pages together with their properties, quick action links and search filters. To enable data liberation, there's the possiblity to download all data in either json, xml or csv formats. Those links are not public. Interface preview:
It's done by clicking the "Add page" button and filling in the form. The following settings / attributes are available:
When created, the page will appear on the frontend and its content can be edited there. Content is not edited on the backend.
All pages form a tree structure, much like a genealogical tree. The position of each individual page in that tree is defined by its parent page and its position among its siblings (pages of the same level). So you can change the page position by putting it under a different parent and/or moving it left or right in regards to its siblings (or up and down if you prefer to think of it that way).
Changing the page's parent is done via the page edit interface. Changing its position (order) is done in page view mode. When you open a page in view mode on the backend you'll see a section that lists that page's parent, siblings and children (if any) and provides buttons to move the page one step per click to the left or to the right.
In this example the currently active page is the orange one (Phraseology). It's currently position in the right end of its siblings line, meaning, it's the last page on this level. We have a "Move Left" button available to make it move to the left (or higher if you prefer to think of it that way), and thus to put it between "Pilot training introduction" and "P1 Manual". Here's how it looks after clicking that button:
Now the Phraseology page is in the middle, between the other two pages, it's no longer the last one. This change will be reflected on the frontend menus as the users see them.
Also because the page is now in the middle and we can move it in either direction, we have a "Move Left" and "Move Right" buttons. Once again, you can think of those as moving up or down, depending on what's easier on your brain :) It doesn't matter if a tree is envisioned as a vertical structure (file manager style) or as a horizontal structure (traditional genealogy or horizontal menu style): the position of each element and the end result is exactly the same.
Also, when editing those trees, keep in mind all those page name blocks are clickable links and you can use them to quickly jump between the different pages (branches of the tree) and adjust them.
Managin the new is essentially the same as managing the pages with minor differences:
Model versioning is implemented for both pages and news via the "paper_trail" library. Meaning every revision made to a page or news item is recorded, together with its timestamp and the user who did it and those versioned entires can be used as revert points if needed. There's only command line interface for that in the initial release though, no web UI. The data however is there, and accumulating and it can be hooked to a web UI in future revisions.
Country profiles and especially airport profiles aggregate a lot of live data, and might take a while to load depending on how recently they have been requested previously. There's a lot of server fragment caching going on to minimize the annoyance. The fragment caching times overlap in order to almost never require a full data refresh and they are as follows:
The site is designed to be cross-browser compatible and responsive. It should scale automatically to fit any desktop or mobile device screen without significant visual issues. Tested on Chrome, Firefox, Opera and Internet Explorer latest versions on desktop, mobile Chrome, Dolphin, Opera and default Android browser on both phone and tablet (Android).