Delete lib directory
This commit is contained in:
Mohammad Fares
parent
b5f2dfb05c
commit
487c86dc0d
@ -1,222 +0,0 @@
|
||||
/**
|
||||
* Terminalizer Web Plugin
|
||||
* https://terminalizer.com
|
||||
*
|
||||
* @author Mohammad Fares <faressoft.com@gmail.com>
|
||||
*/
|
||||
|
||||
.terminalizer {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.terminalizer .xterm-viewport {
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
.terminalizer-frame {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/*//// [ Reset ] ////*/
|
||||
|
||||
.terminalizer div {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
outline: 0;
|
||||
font-weight: inherit;
|
||||
font-style: inherit;
|
||||
font-size: 100%;
|
||||
font-family: inherit;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
/*//// [ Window ] ////*/
|
||||
|
||||
.terminalizer-frame.terminalizer-window {
|
||||
-moz-border-radius: 6px;
|
||||
-webkit-border-radius: 6px;
|
||||
border-radius: 6px;
|
||||
border: 1px solid #B3B3B3;
|
||||
box-shadow: 0px 0px 18px #B3B3B3;
|
||||
margin: 18px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.terminalizer-frame.terminalizer-window .terminalizer-titlebar {
|
||||
-moz-border-top-left-radius: 6px;
|
||||
-moz-border-top-right-radius: 6px;
|
||||
-webkit-border-top-left-radius: 6px;
|
||||
-webkit-border-top-right-radius: 6px;
|
||||
background: #E8E8E8;
|
||||
background: -moz-linear-gradient(top, #EBEBEB, #D6D6D6);
|
||||
background: -ms-linear-gradient(top, #EBEBEB, #D6D6D6);
|
||||
background: -o-linear-gradient(top, #EBEBEB, #D6D6D6);
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0.0, #EBEBEB, color-stop(1.0, #D6D6D6)));
|
||||
background: -webkit-linear-gradient(top, #EBEBEB, #D6D6D6);
|
||||
background: linear-gradient(top, #EBEBEB, #D6D6D6);
|
||||
border-bottom: 1px solid #B1AEB1;
|
||||
border-top-left-radius: 6px;
|
||||
border-top-right-radius: 6px;
|
||||
border-top: 1px solid #F3F1F3;
|
||||
color: #3B4247;
|
||||
font-family: Arial, sans-serif;
|
||||
font-size: 14px;
|
||||
height: 22px;
|
||||
line-height: 22px;
|
||||
position: relative;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.terminalizer-frame.terminalizer-window .terminalizer-titlebar .buttons {
|
||||
left: 8px;
|
||||
line-height: 0px;
|
||||
position: absolute;
|
||||
top: 3.5px;
|
||||
}
|
||||
|
||||
.terminalizer-frame.terminalizer-window .terminalizer-titlebar .close {
|
||||
-moz-border-radius: 50%;
|
||||
-webkit-border-radius: 50%;
|
||||
background: #FF5C5C;
|
||||
border-radius: 50%;
|
||||
border: 1px solid #E33E41;
|
||||
display: inline-block;
|
||||
height: 12px;
|
||||
width: 12px;
|
||||
}
|
||||
|
||||
.terminalizer-frame.terminalizer-window .terminalizer-titlebar .minimize {
|
||||
-moz-border-radius: 50%;
|
||||
-webkit-border-radius: 50%;
|
||||
background: #FFBD4C;
|
||||
border-radius: 50%;
|
||||
border: 1px solid #E09E3E;
|
||||
display: inline-block;
|
||||
height: 12px;
|
||||
margin-left: 4px;
|
||||
width: 12px;
|
||||
}
|
||||
|
||||
.terminalizer-frame.terminalizer-window .terminalizer-titlebar .maximize {
|
||||
-moz-border-radius: 50%;
|
||||
-webkit-border-radius: 50%;
|
||||
background: #00CA56;
|
||||
border-radius: 50%;
|
||||
border: 1px solid #14AE46;
|
||||
display: inline-block;
|
||||
height: 12px;
|
||||
margin-left: 4px;
|
||||
width: 12px;
|
||||
}
|
||||
|
||||
.terminalizer-frame.terminalizer-window .terminalizer-body {
|
||||
background-color: #1D1D1D;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
/*//// [ Floating ] ////*/
|
||||
|
||||
.terminalizer-frame.terminalizer-floating {
|
||||
-moz-border-radius: 6px;
|
||||
-webkit-border-radius: 6px;
|
||||
background-color: #1D1D1D;
|
||||
border-radius: 6px;
|
||||
box-shadow: 0px 0px 18px #B3B3B3;
|
||||
margin: 18px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.terminalizer-frame.terminalizer-floating .terminalizer-titlebar {
|
||||
color: white;
|
||||
font-family: Arial, sans-serif;
|
||||
font-size: 14px;
|
||||
height: 34px;
|
||||
line-height: 34px;
|
||||
position: relative;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.terminalizer-frame.terminalizer-floating .terminalizer-titlebar .buttons {
|
||||
left: 13px;
|
||||
line-height: 0px;
|
||||
position: absolute;
|
||||
top: 9px;
|
||||
}
|
||||
|
||||
.terminalizer-frame.terminalizer-floating .terminalizer-titlebar .close {
|
||||
-moz-border-radius: 50%;
|
||||
-webkit-border-radius: 50%;
|
||||
background: #FF5C5C;
|
||||
border-radius: 50%;
|
||||
display: inline-block;
|
||||
height: 15px;
|
||||
width: 15px;
|
||||
}
|
||||
|
||||
.terminalizer-frame.terminalizer-floating .terminalizer-titlebar .minimize {
|
||||
-moz-border-radius: 50%;
|
||||
-webkit-border-radius: 50%;
|
||||
background: #FFBD4C;
|
||||
border-radius: 50%;
|
||||
display: inline-block;
|
||||
height: 15px;
|
||||
line-height: 10px;
|
||||
margin-left: 4px;
|
||||
width: 15px;
|
||||
}
|
||||
|
||||
.terminalizer-frame.terminalizer-floating .terminalizer-titlebar .maximize {
|
||||
-moz-border-radius: 50%;
|
||||
-webkit-border-radius: 50%;
|
||||
background: #00CA56;
|
||||
border-radius: 50%;
|
||||
display: inline-block;
|
||||
height: 15px;
|
||||
line-height: 10px;
|
||||
margin-left: 4px;
|
||||
width: 15px;
|
||||
}
|
||||
|
||||
.terminalizer-frame.terminalizer-floating .terminalizer-body {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
/*//// [ Solid ] ////*/
|
||||
|
||||
.terminalizer-frame.terminalizer-solid {
|
||||
-moz-border-radius: 6px;
|
||||
-webkit-border-radius: 6px;
|
||||
background-color: #1D1D1D;
|
||||
border-radius: 6px;
|
||||
box-shadow: 0px 0px 18px #B3B3B3;
|
||||
margin: 18px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.terminalizer-frame.terminalizer-solid .terminalizer-titlebar {
|
||||
color: white;
|
||||
font-family: Arial, sans-serif;
|
||||
font-size: 14px;
|
||||
position: relative;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.terminalizer-frame.terminalizer-solid .terminalizer-titlebar .title {
|
||||
margin: 15px 15px 15px;
|
||||
}
|
||||
|
||||
.terminalizer-frame.terminalizer-solid .terminalizer-titlebar .title:empty {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.terminalizer-frame.terminalizer-solid .terminalizer-titlebar .buttons {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.terminalizer-frame.terminalizer-solid .terminalizer-body {
|
||||
padding: 20px;
|
||||
}
|
||||
@ -1,299 +0,0 @@
|
||||
/**
|
||||
* Terminalizer Web Plugin
|
||||
* https://terminalizer.com
|
||||
*
|
||||
* @author Mohammad Fares <faressoft.com@gmail.com>
|
||||
*/
|
||||
|
||||
(function($) {
|
||||
|
||||
$.fn.terminalizer = function(options) {
|
||||
|
||||
/**
|
||||
* The target object
|
||||
* @type {Object}
|
||||
*/
|
||||
var self = this;
|
||||
|
||||
/**
|
||||
* The terminal instance
|
||||
* @type {Object}
|
||||
*/
|
||||
var term = null;
|
||||
|
||||
/**
|
||||
* Recording file
|
||||
* @type {Object}
|
||||
*/
|
||||
var data = null;
|
||||
|
||||
/**
|
||||
* HTML template code
|
||||
* @type {String}
|
||||
*/
|
||||
var template = '<div class="terminalizer">' +
|
||||
'<div class="terminalizer-frame"><div class="terminalizer-titlebar">' +
|
||||
'<div class="buttons"><div class="close"></div><div class="minimize">' +
|
||||
'</div><div class="maximize"></div></div><div class="title"></div>' +
|
||||
'</div><div class="terminalizer-body"></div></div></div>';
|
||||
|
||||
// Default options
|
||||
options = $.extend({
|
||||
recordingFile: null,
|
||||
realTiming: false,
|
||||
speedFactor: 1.0,
|
||||
beforeMiddleware: null,
|
||||
afterMiddleware: null
|
||||
}, options);
|
||||
|
||||
// Load the recording file
|
||||
loadJSON(options.recordingFile).then(function(result) {
|
||||
|
||||
// Cache the data
|
||||
data = result;
|
||||
|
||||
// Marge the plugin's options with recording file's configs
|
||||
options = $.extend(data.config, options);
|
||||
|
||||
// Terminal
|
||||
term = new Terminal({
|
||||
cols: options.cols,
|
||||
rows: options.rows,
|
||||
cursorStyle: options.cursorStyle,
|
||||
fontFamily: options.fontFamily,
|
||||
fontSize: options.fontSize,
|
||||
lineHeight: options.lineHeight,
|
||||
letterSpacing: options.letterSpacing,
|
||||
allowTransparency: true,
|
||||
theme: options.theme
|
||||
});
|
||||
|
||||
// Insert the HTML template
|
||||
self.html($(template));
|
||||
|
||||
if (options.frameBox.type) {
|
||||
self.find('.terminalizer-frame').addClass('terminalizer-' + options.frameBox.type);
|
||||
}
|
||||
|
||||
if (options.frameBox.type && options.frameBox.title) {
|
||||
self.find('.terminalizer-frame .title').text(options.frameBox.title);
|
||||
}
|
||||
|
||||
self.find('.terminalizer-frame').css(options.frameBox.style);
|
||||
|
||||
// Open the terminal
|
||||
term.open(self.find('.terminalizer-body')[0]);
|
||||
term.focus();
|
||||
|
||||
// Add a watermark
|
||||
if (options.watermark.imagePath) {
|
||||
return self._addWatermark(options.watermark);
|
||||
}
|
||||
|
||||
}).then(function() {
|
||||
|
||||
// Play
|
||||
play(data.records, self._playCallback, self._doneCallback, options);
|
||||
|
||||
}).catch(function(error) {
|
||||
|
||||
console.error(error);
|
||||
|
||||
});
|
||||
|
||||
/**
|
||||
* Add a watermark and wait until it is fully loaded
|
||||
*
|
||||
* @param {Object} watermarkConfig {imagePath, style}
|
||||
* @return {Promise}
|
||||
*/
|
||||
this._addWatermark = function(watermarkConfig) {
|
||||
|
||||
var watermarkImg = document.createElement('img');
|
||||
|
||||
$(watermarkImg).addClass('terminalizer-watermark');
|
||||
$(watermarkImg).attr('src', watermarkConfig.imagePath);
|
||||
$(watermarkImg).css(watermarkConfig.style);
|
||||
|
||||
this.find('.terminalizer-frame').prepend(watermarkImg);
|
||||
|
||||
return new Promise(function(resolve, reject) {
|
||||
|
||||
$('.terminalizer-watermark').on('load', resolve);
|
||||
|
||||
});
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Executed after all frames are played
|
||||
*/
|
||||
this._doneCallback = function() {
|
||||
|
||||
self.trigger('playingDone');
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Print the passed record's content
|
||||
*
|
||||
* @param {String} record
|
||||
* @param {Function} callback
|
||||
*/
|
||||
this._playCallback = function(record, callback) {
|
||||
|
||||
var tasks = [];
|
||||
|
||||
// The beforeMiddleware is set
|
||||
if (options.beforeMiddleware) {
|
||||
|
||||
tasks.push(function(callback) {
|
||||
options.beforeMiddleware.call(self, record, callback.bind(null, null, null));
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
// Rendering
|
||||
tasks.push(function(callback) {
|
||||
|
||||
term.write(record.content);
|
||||
|
||||
// Workaround since xterm doesn't provide a rendered event
|
||||
var renderCheckTimer = setInterval(function() {
|
||||
|
||||
if (term.writeInProgress) {
|
||||
return;
|
||||
}
|
||||
|
||||
clearInterval(renderCheckTimer);
|
||||
callback();
|
||||
|
||||
}, 1);
|
||||
|
||||
});
|
||||
|
||||
// The afterMiddleware is set
|
||||
if (options.afterMiddleware) {
|
||||
|
||||
tasks.push(function(callback) {
|
||||
options.afterMiddleware.call(self, record, callback.bind(null, null, null));
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
async.series(tasks, function(error, result) {
|
||||
|
||||
callback();
|
||||
|
||||
});
|
||||
|
||||
};
|
||||
|
||||
return this;
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Load, and parse JSON files
|
||||
*
|
||||
* @param {String} url
|
||||
* @return {Promise}
|
||||
*/
|
||||
function loadJSON(url) {
|
||||
|
||||
return new Promise(function(resolve, reject) {
|
||||
|
||||
$.getJSON(url).done(resolve).fail(function(jqxhr, textStatus, error) {
|
||||
reject('Failed to load ' + url);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Play recording records
|
||||
*
|
||||
* Options:
|
||||
*
|
||||
* - frameDelay (default: auto)
|
||||
* - Delay between frames in ms
|
||||
* - If the value is `auto` use the actual recording delays
|
||||
*
|
||||
* - maxIdleTime (default: 2000)
|
||||
* - Maximum delay between frames in ms
|
||||
* - Ignored if the `frameDelay` isn't set to `auto`
|
||||
* - Set to `auto` to prevent limiting the max idle time
|
||||
*
|
||||
* - speedFactor (default: 1)
|
||||
* - Multiply the frames delays by this factor
|
||||
*
|
||||
* @param {Array} records
|
||||
* @param {Function} playCallback
|
||||
* @param {Function|Null} doneCallback
|
||||
* @param {Object} options (optional)
|
||||
*/
|
||||
function play(records, playCallback, doneCallback, options) {
|
||||
|
||||
var tasks = [];
|
||||
|
||||
// Default value for options
|
||||
if (typeof options === 'undefined') {
|
||||
options = {};
|
||||
}
|
||||
|
||||
// Default value for options.frameDelay
|
||||
if (typeof options.frameDelay === 'undefined') {
|
||||
options.frameDelay = 'auto';
|
||||
}
|
||||
|
||||
// Default value for options.maxIdleTime
|
||||
if (typeof options.maxIdleTime === 'undefined') {
|
||||
options.maxIdleTime = 2000;
|
||||
}
|
||||
|
||||
// Default value for options.speedFactor
|
||||
if (typeof options.speedFactor === 'undefined') {
|
||||
options.speedFactor = 1;
|
||||
}
|
||||
|
||||
// Foreach record
|
||||
records.forEach(function(record, index) {
|
||||
|
||||
// Create a task to handle each frame
|
||||
tasks.push(function(callback) {
|
||||
|
||||
var delay = record.delay;
|
||||
|
||||
// Adjust the delay according to the options
|
||||
if (options.frameDelay != 'auto') {
|
||||
delay = options.frameDelay;
|
||||
} else if (options.maxIdleTime != 'auto' && delay > options.maxIdleTime) {
|
||||
delay = options.maxIdleTime;
|
||||
}
|
||||
|
||||
// Apply speedFactor
|
||||
delay = delay * options.speedFactor;
|
||||
|
||||
// Add an index to the record object
|
||||
record.index = index;
|
||||
|
||||
setTimeout(function() {
|
||||
playCallback(record, callback);
|
||||
}, delay);
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
async.series(tasks, function(error, results) {
|
||||
|
||||
if (doneCallback) {
|
||||
doneCallback();
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
}(jQuery));
|
||||
Loading…
x
Reference in New Issue
Block a user