forked from extern/egroupware
WIP EGroupware tutorial:
-Add popup tutorials player -List tutorials in sidebox with their titles and thumbnails only
This commit is contained in:
Hadi Nategh
parent
86a1e4fbfa
commit
a6837b6a40
@ -8,11 +8,11 @@
|
||||
<column/>
|
||||
</columns>
|
||||
<rows>
|
||||
<row>
|
||||
<vbox>
|
||||
<description value = "$row_cont[title]" onclick="$row_cont[onclick]"/>
|
||||
<iframe value="$row_cont[src]" width="99%" seamless="true" fullscreen="true"/>
|
||||
</vbox>
|
||||
<row >
|
||||
<hbox onclick="$row_cont[onclick]">
|
||||
<image src="$row_cont[thumbnail]" height="70px"/>
|
||||
<description value = "$row_cont[title]" class="et2_ellipsis"/>
|
||||
</hbox>
|
||||
</row>
|
||||
</rows>
|
||||
</grid>
|
||||
|
||||
72
home/inc/class.home_tutorial_ui.inc.php
Normal file
72
home/inc/class.home_tutorial_ui.inc.php
Normal file
@ -0,0 +1,72 @@
|
||||
<?php
|
||||
/**
|
||||
* EGroupware - Tutorial
|
||||
*
|
||||
* @link http://www.egroupware.org
|
||||
* @package home
|
||||
* @author Hadi Nategh [hn@stylite.de]
|
||||
* @copyright (c) 2015 by Stylite AG <info-AT-stylite.de>
|
||||
* @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
|
||||
* @version $Id:$
|
||||
*/
|
||||
|
||||
class home_tutorial_ui {
|
||||
|
||||
/**
|
||||
* Methods callable via menuaction
|
||||
*
|
||||
* @var array
|
||||
*/
|
||||
public $public_functions = array(
|
||||
'popup' => true
|
||||
);
|
||||
|
||||
/**
|
||||
* Popup window to display youtube video
|
||||
* @param type $content
|
||||
*/
|
||||
function popup ($content)
|
||||
{
|
||||
//Allow youtube frame to pass the CSP check
|
||||
egw_framework::csp_frame_src_attrs(array('www.youtube.com'));
|
||||
|
||||
$tmpl = new etemplate_new('home.tutorial');
|
||||
|
||||
// Get tutorial object id
|
||||
$tuid_indx = explode('-',$_GET['tuid']);
|
||||
|
||||
// read tutorials json file to fetch data
|
||||
$tutorials = json_decode(self::getJsonData(), true);
|
||||
|
||||
$content = $tutorials[$tuid_indx[0]][$tuid_indx[1]][$tuid_indx[2]];
|
||||
|
||||
$tmpl->exec('home.home_tutorial_ui.popup', $content,array(),array(),array(),array(),2);
|
||||
}
|
||||
|
||||
/**
|
||||
* Ajax function to get videos links as json
|
||||
*/
|
||||
function ajax_data()
|
||||
{
|
||||
$response = egw_json_response::get();
|
||||
$response->data(json_decode(self::getJsonData()));
|
||||
}
|
||||
|
||||
/**
|
||||
* Function to fetch data from tutorials.json file
|
||||
* @return string returns json string
|
||||
*
|
||||
* @TODO: implement tree level caching
|
||||
*/
|
||||
static function getJsonData()
|
||||
{
|
||||
if (!($json = egw_cache::getCache(egw_cache::TREE, 'home', 'egw_tutorial_json')))
|
||||
{
|
||||
$json = file_get_contents('http://www.egroupware.de/videos/tutorials.json');
|
||||
// Cache the json object for one month
|
||||
egw_cache::addCache(egw_cache::TREE, 'home', 'egw_tutorial_json', $json, 3600 * 720);
|
||||
}
|
||||
|
||||
return $json;
|
||||
}
|
||||
}
|
||||
13
home/templates/default/tutorial.xet
Normal file
13
home/templates/default/tutorial.xet
Normal file
@ -0,0 +1,13 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<!DOCTYPE overlay PUBLIC "-//Stylite AG//eTemplate 2//EN" "http://www.egroupware.org/etemplate2.dtd">
|
||||
<!-- $Id$ -->
|
||||
<overlay>
|
||||
<template id="home.tutorial" template="" lang="" group="0" version="15.1">
|
||||
<hbox height="87%">
|
||||
<iframe id="src" height="100%" width="100%" seamless="true" fullscreen="true"/>
|
||||
</hbox>
|
||||
<hbox class="dialogFooterToolbar">
|
||||
<button align="left" statustext="Close this window" label="Close" id="button[close]" onclick="window.close()" image="close" background_image="1"/>
|
||||
</hbox>
|
||||
</template>
|
||||
</overlay>
|
||||
@ -961,26 +961,18 @@ var AppJS = Class.extend(
|
||||
|
||||
/**
|
||||
* Get json data for videos from the given url
|
||||
* @param {string} _url url of tutorials json file
|
||||
*
|
||||
* @return {Promise, object} return Promise, json object as resolved result and error message in case of failure
|
||||
*/
|
||||
egwTutorialGetData: function(_url){
|
||||
var url = _url;
|
||||
egwTutorialGetData: function(){
|
||||
var self = this;
|
||||
return new Promise (function(_resolve, _reject)
|
||||
{
|
||||
var resolve = _resolve;
|
||||
var reject = _reject;
|
||||
jQuery.ajax({
|
||||
method:'GET',
|
||||
url: url,
|
||||
success: function (_data) {
|
||||
self.egw.json('home.home_tutorial_ui.ajax_data', [self.egw.app_name()], function(_data){
|
||||
resolve(_data);
|
||||
},
|
||||
fail: function (_err) {
|
||||
reject(_err);
|
||||
}
|
||||
});
|
||||
}).sendRequest();
|
||||
});
|
||||
},
|
||||
|
||||
@ -993,7 +985,7 @@ var AppJS = Class.extend(
|
||||
* {
|
||||
* [app name]:{
|
||||
* [language tag]:[
|
||||
* {src:"",title:"",top:""}
|
||||
* {src:"",thumbnail:"",title:"",top:""}
|
||||
* ]
|
||||
* }
|
||||
* }
|
||||
@ -1005,12 +997,12 @@ var AppJS = Class.extend(
|
||||
* {
|
||||
* "mail":{
|
||||
* "en":[
|
||||
* {src:"https://www.youtube.com/embed/mCDJndpjO40", "title":"PGP Encryption"},
|
||||
* {src:"https://www.youtube.com/embed/mCDJndpjO", "title":"Subscription", top:true},
|
||||
* {src:"https://www.youtube.com/embed/mCDJndpjO40", thumbnail:"http://img.youtube.com/vi/mCDJndpjO40/1.jpg", "title":"PGP Encryption"},
|
||||
* {src:"https://www.youtube.com/embed/mCDJndpjO", thumbnail:"http://img.youtube.com/vi/mCDJndpjO/1.jpg", "title":"Subscription", top:true},
|
||||
* ],
|
||||
* "de":[
|
||||
* {src:"https://www.youtube.com/embed/m40", "title":"PGP Verschlüsselung"},
|
||||
* {src:"https://www.youtube.com/embed/mpjO", "title":"Ordner Abonnieren", top:true},
|
||||
* {src:"https://www.youtube.com/embed/m40", thumbnail:"http://img.youtube.com/vi/m40/1.jpg", "title":"PGP Verschlüsselung"},
|
||||
* {src:"https://www.youtube.com/embed/mpjO", thumbnail:"http://img.youtube.com/vi/mpjO/1.jpg", "title":"Ordner Abonnieren", top:true},
|
||||
* ]
|
||||
* }
|
||||
* }
|
||||
@ -1025,7 +1017,7 @@ var AppJS = Class.extend(
|
||||
var etemplate = new etemplate2 (div, false);
|
||||
var template = egw.webserverUrl+'/etemplate/templates/default/egw_tutorial.xet';
|
||||
|
||||
this.egwTutorialGetData(egw.webserverUrl+'/tutorials.json').then(function(_data){
|
||||
this.egwTutorialGetData().then(function(_data){
|
||||
var lang = egw.preference('lang');
|
||||
var content = {content:{list:[]}};
|
||||
if (_data && _data[egw.app_name()])
|
||||
@ -1034,9 +1026,10 @@ var AppJS = Class.extend(
|
||||
if (typeof _data[egw.app_name()][lang] !='undefined'
|
||||
&& _data[egw.app_name()][lang].length > 0)
|
||||
{
|
||||
for (var i=0;i<=_data[egw.app_name()][lang];i++)
|
||||
for (var i=0;i < _data[egw.app_name()][lang].length;i++)
|
||||
{
|
||||
_data[egw.app_name()][lang][i]['onclick'] = 'egw.open()';
|
||||
var tuid = egw.app_name() + '-' +lang + '-' + i;
|
||||
_data[egw.app_name()][lang][i]['onclick'] = 'app.'+egw.app_name()+'.egwTutorialPopup("'+tuid+'")';
|
||||
}
|
||||
content.content.list = _data[egw.app_name()][lang];
|
||||
// Get the video with top property into the top of the list
|
||||
@ -1056,13 +1049,19 @@ var AppJS = Class.extend(
|
||||
}
|
||||
},
|
||||
function(_err){
|
||||
consloe.log(_err);
|
||||
console.log(_err);
|
||||
});
|
||||
},
|
||||
|
||||
egwTutorialPopup: function ()
|
||||
/**
|
||||
* Open popup to show given tutorial id
|
||||
* @param {string} _tuid tutorial object id
|
||||
* - tuid: appname-lang-index
|
||||
*/
|
||||
egwTutorialPopup: function (_tuid)
|
||||
{
|
||||
|
||||
var url = egw.link('/index.php', 'menuaction=home.home_tutorial_ui.popup&tuid='+_tuid);
|
||||
egw.open_link(url,'_blank','500x400');
|
||||
},
|
||||
|
||||
/**
|
||||
|
||||
Loading…
Reference in New Issue
Block a user