Index by Title

• How to install
  • Automatic installation through script
  • Manual installation
• Basic information about Envi
• Compatibility list Envi Template with OSCam revision
• Envi Plugin
  • GEO IP Location
• Preview of Envi
  • Style Switcher
• Envi Tips and Tricks
  • Own background pattern
• About color design of Envi
  • Basic colors for Envi
• The tested device
  • Desktops
  • Tablets
  • Mobile
• Improvements over the original WebIf
  • Scroll to Top
  • Marking column for sorting table
  • Smart search in Tables
• Thanks

Browse files

• http://www.streamboard.tv/oscam-addons/browser/oscam-template/Envi_template/trunk

---

How to install

Automatic installation through script

• Download script from http://www.streamboard.tv/oscam-addons/browser/oscam-template/Envi_template/branches/script/

• UpdateEnviTemplate_manual_v....sh is the script with manual override folders. More info inside the script
• UpdateEnviTemplate_autouni_v....sh is an automated script that automatically locates needed folders. More info inside the script

• Copy script file *.sh to your server into folder (for example: script) which is located in config directory of OSCam (for example: /etc/tuxbox/config/script/)
• Set file mode for file *.sh (chmod 777 UpdateEnviTemplate.sh)
• Set folder with scripts in Webif of OSCam in item "CONFIG" -> part Webif -> Script settings -> Http script: Write /etc/tuxbox/config/script/
• Save
• Now in item "SCRIPTS" you can choose autoupdate script which is called Name_of_script.sh
• When run is success full it should report: scriptname: Name_of_script.sh scriptresult: done returncode: 0 . Anything other then 0 indicates an error while processing this script.
• Reload page
• Now is Envi Template as main Webif.

NOTE: Script was tested on enigma2, raspberry pi, i686 (Xubuntu), x86_64

Manual installation

(Envi as main Webif)

• Download "*.zip" archiv http://www.streamboard.tv/oscam-addons/export/HEAD/oscam-template/Envi_template/branches/compressed_files/Envi_Template.zip
• Uncompress archiv to server into folder (for example: tpl) which is located in config directory of OSCam (for example: /etc/tuxbox/config/)
• Set folder with template in Webif of OSCam in item "CONFIG" -> part Webif -> Template settings -> Http tpl: Write /etc/tuxbox/config/
• Save
• Reload page
• Now is Envi Template as main Webif.

Basic information about Envi

Author: skyndas

About idea: When studying the Touch interface, which is implemented directly in Oscamu I got the idea "Why not use responsive design for use on all devices?".

Envi Template have design for monitor and use responsive design for smartphones and tablets. More info in The tested device.
For view on the monitor can be used Styleswitcher for selecting other design. More Info in Preview of Envi

CAUTION : Envi_template don´t make(s) call(s) to outside world. All is offline from http server.

Envi Template is ready for basic OSCam, not for modern OSCam from Gorgone.

Compatibility list Envi Template with OSCam revision

Last update of Template 05.07.2015

• Oscam r10873 and above

Envi Plugin

GEO IP Location

Forum: http://www.streamboard.tv/wbb2/thread.php?threadid=43813

GEOAPI IP Location displays the geographic location of users connected to the OSCam in status.html.

CAUTION : GEOAPI Jquery script make call to outside world to "​http://ip-api.com/" databases server after click button 'Show GEOAPI'

Basic info about ip-api.com

​http://ip-api.com/ provides free usage of its Geo IP API through multiple response formats. He support IPv4 and IPv6. Their system will automatically ban any IP addresses doing over 250 requests per minute. To unban your IP click ​http://ip-api.com/docs/unban

Preview GEOAPI Plugin

Preview of Envi

Style Switcher

NOTE: (It is available only for PC monitor)

Preview Styleswitcher - Basic settings

1. Change Webif style from Original OSCam Webif to Envi Template
2. Change Envi template color style
3. Change background color - we can use custom color with color picker
4. Show information about Envi Template
5. Other settings - we can e.g. rotate OSCam logo and other ......
6. We can add pattern to Webif
7. We can set font family or size

Preview Styleswitcher - Extended settings

1. Change colors in Main menu
2. Change colors in Submenu
3. Change colors in Footer
4. Change colors in Tables
5. Change colors in Livelog
6. Change colors in Files

Colors and Patterns in Styleswitcher

• Background colors

Default Basic background

White Color: #FFF

5% Black Color: #F2F2F2

10% Black Color: #E5E5E5

20% Black Color: #CCC

30% Black Color: #B3B3B3

40% Black Color: #999

Light Brown Color: #CDB38B

Dark Brown Color: #946D40

Light Slate Gray Color: #71918A

Custom color picker

You can setting custom background color over color picker

• Background patterns

Default Basic pattern		Diagonal line Transparent pattern		Diamond Transparent pattern		Dots1 Transparent pattern		Squares 1 Transparent pattern
Squares 2 Transparent pattern		XXX Transparent pattern		XXX Transparent pattern		XXX Transparent pattern		Dark full image Full image

Envi Tips and Tricks

Own background pattern

1. create css file (e.g. envi_custom.css)
2. add css style for background pattern
3. move file into config folder of oscam
4. select envi_custom.css in "Configuration" -> part "Webif" in "Http css:"
5. set checkbox for "Http prepend embedded css:" to checked
6. save and reload.

Download example of file "envi_custom.css" http://www.streamboard.tv/oscam-addons/browser/oscam-template/Envi_template/branches/tips_tricks/own_patterns/

Preview of own style

About color design of Envi

Basic colors for Envi

• Color #F00423 for:
  • links in Main Menu
  • links in StyleSwitcher

• Color #D80320 for:
  • links in Sub Menu

• Color #F02 for:
  • list "LI" in StyleSwitcher

• Color #BD0000 for:
  • style author in footer
  • links in footer

• Color #F00 for:
  • h4 in shutdown.html (color from original WebIf)

• Color #131517 for:
  • background in Main Menu

• Linear gradient from #F5F5F5 to #EEE for:
  • background in Sub Menu

• Color #000 for:
  • border color in footer

• Color #222 for:
  • thead in tables

#F00423

#D80320

#F02

#BD0000

#F00

#131517

#F5F5F5

#EEE

#000

#222

The tested device

Desktops

• Desktops
  • 1280 x 1024
  • 1280 x 960
  • 1280 x 800
  • 1280 x 768
  • 1280 x 720

NOTE: Everything is displayed

Tablets

Mobile

Supported browsers

• Android browser
• Google Chrome
• Dolphin Browser
• Safari

The tested devices

APPLE ------------------

• iPhone 4
• iPhone 4S
• iPhone 5
• iPhone 5C
• iPhone 5S

HTC ---------------------

• HTC 7 Mozart
• HTC 7 Trophy
• HTC Evo
• HTC Evo 3D
• HTC Evo LTE
• HTC Desire
• HTC Desire C
• HTC Desire HD
• HTC Desire Z
• HTC HD2
• HTC J Butterfly
• HTC Legend
• HTC Sensation
• HTC Sensation XL
• HTC Sensation XE
• HTC Thunderbolt
• HTC Titan II
• HTC Touch HD
• HTC One
• HTC One S
• HTC One SV
• HTC One V
• HTC One X
• HTC One X+
• HTC One XL
• HTC Velocity 4G
• HTC Wildfire S
• HTC Windows Phone 8X

NEXUS -------------------

• Nexus 5
• Nexus One
• Nexus S

SAMSUNG -----------------

• Samsung Galaxy Note 2 N7100
• Samsung Galaxy Note 3 N9005
• Samsung Galaxy S3
• Samsung Galaxy S3 mini
• Samsung Galaxy S4
• Samsung Galaxy S4 mini
• Samsung Galaxy S5

Improvements over the original WebIf

Scroll to Top

Link for scrolling the pages up is placed in the footer. Scrolling use jQuery animation.

This idea has been added to the original WebIf without using Jqeury by ultra47 ( Oscam changeset http://www.streamboard.tv/oscam/changeset/10081)

Marking column for sorting table

If you click on sorting in tables readers and users will be designated column.

This idea has been added to the original WebIf by ultra47 ( Oscam changeset http://www.streamboard.tv/oscam/changeset/10083)

Smart search in Tables

Display number of rows by SearchTerm and Highlight the cells that contain the search term.

Thanks

Special thanks for helping to develop: ultra47,schorsch100,gismo2004 - and all the testers.