Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 7 Next »

Due to the ongoing development of the Frontend-frameworks we are using, it is recommended to update the sourcefiles to increase speed, resolve bugs and increase overall responsiveness of the website.

In most cases it is sufficient to upgrade the main file of jQuery, DataTables and Bootstrap.

The Downloadlinks for the current version are:

Bootstrap: http://getbootstrap.com/getting-started/#download

Datatables: https://datatables.net/download /index

Datatables Kombifiles

 click here to expand...

The DataTables package has a lot of features and for each feature there is a corresponding CSS and JS File. However on the linked Site it is possible to generate one CSS and JS file with the desired features. This is advantageous, because fewer HTTP Requests are needed.

Currently (as of Jan-2017) the activated options are: The changed options are printed bold

  • jQuery: no jQuery (could be included to reduce HTTP Requests further)
  • Styling: Bootstrap
    • no styling library
  • DataTables: DataTables
  • AutoFill: Do not include
  • Buttons: Buttons
    • Column visibility: Do not include
    • Flash export: Do not include
    • HTML5 export: HTML5 export
      • JSZip: Do not include
      • pdfmake: pdfmake
    • Print view: Print view
  • ColReorder: Do not include
  • Editor: Do not include
  • FixedColumns: Do not include
  • FixedHeader: Do not include
  • KeyTable: Do not include
  • Responsive: Responsive
  • RowReorder: Do not include
  • Scroller: Scroller
  • Select: Select
  • Minification: Minify
  • Concatenate: Single File
  • CDN: CDN or Local files -> own preference

jQuery: https://code.jquery.com/jquery/

The implementation is done in views/bootstrap/header.blade.php (for CSS) and views/bootstrap/footer.blade.php (JS) Files. There are several ways to implement these Frameworks, such as via cdn, by downloading the corresponding files or composer.

For every Framework there are several files available.

  • development version (uncompressed): The development version provides console warning messages when deprecated and/or removed APIs are used. Use this version during development and debugging, and whenever you are reporting bugs to the jQuery team.
  • production version (minimized): The minified production file is compressed and does not generate console warnings. It will only generate a console log message upon loading, or if it detects and error such as an outdated version of jQuery that it does not support. Do not use this file for development or debugging, it will make your life miserable.
  • (slim and slim minified): similar to development and production version but with a smaller feature set.

1 CDN implementation

For fast development, prototyping and testing it is recommended to use CDN (Content Delivery Network) links. The needed links can be found on the mentioned websites.

Example CSS implementation (Header)
 <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
Example JS implementation (Footer)
<script 
src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
ProsCons
  • easy and fast to implement
  • Requesting external sources
  • high availability (100% uptime)
  • longer access time when called from "local" network
  • easy to upgrade
  • does not work without internet access (might be bad for a NMS-Tool)
  • easy to maintain ( - no maintenance)
 

2 Local implementation

For the deployment version a local implementation is recommended.

The files can be downloaded from the mentioned websites or get them with wget and the CDN links

Get CDN files via wget
wget https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css

 

The files that need to be replaced are inside the public/components/assets-admin/plugins/[Pluginname] Folder.

Info

if you copy the files in these folders don't forget to do

#> chmod +x ./[Filename]

#> chown apache:apache ./[Filename]

Implementation is the same as with CDN variant.

Example CSS implementation (Header)
<link href="{{asset('components/assets-admin/plugins/bootstrap/css/bootstrap.min.css')}}" rel="stylesheet" />
Example JS implementation (Footer)
<script src="{{asset('components/assets-admin/plugins/bootstrap/js/bootstrap.min.js')}}"></script>
ProsCons
  • faster in "local" networks
  • installation, upgrade and maintenance required
  • independent of internet access
 
  

 

TO-DO: Check Composer implementation seems also possible and would be easier to maintain and does automatic updates, but was not used by me, because copying the files to the corresponding folders was sufficient for me.

 

 

 

Filter by label

There are no items with the selected labels at this time.

  • No labels