重构进度填报

public/webrtc/json2.js

@@ -0,0 +1,486 @@
+/*
+    json2.js
+    2013-05-26
+
+    Public Domain.
+
+    NO WARRANTY EXPRESSED OR IMPLIED. USE AT YOUR OWN RISK.
+
+    See http://www.JSON.org/js.html
+
+
+    This code should be minified before deployment.
+    See http://javascript.crockford.com/jsmin.html
+
+    USE YOUR OWN COPY. IT IS EXTREMELY UNWISE TO LOAD CODE FROM SERVERS YOU DO
+    NOT CONTROL.
+
+
+    This file creates a global JSON object containing two methods: stringify
+    and parse.
+
+        JSON.stringify(value, replacer, space)
+            value       any JavaScript value, usually an object or array.
+
+            replacer    an optional parameter that determines how object
+                        values are stringified for objects. It can be a
+                        function or an array of strings.
+
+            space       an optional parameter that specifies the indentation
+                        of nested structures. If it is omitted, the text will
+                        be packed without extra whitespace. If it is a number,
+                        it will specify the number of spaces to indent at each
+                        level. If it is a string (such as '\t' or ' '),
+                        it contains the characters used to indent at each level.
+
+            This method produces a JSON text from a JavaScript value.
+
+            When an object value is found, if the object contains a toJSON
+            method, its toJSON method will be called and the result will be
+            stringified. A toJSON method does not serialize: it returns the
+            value represented by the name/value pair that should be serialized,
+            or undefined if nothing should be serialized. The toJSON method
+            will be passed the key associated with the value, and this will be
+            bound to the value
+
+            For example, this would serialize Dates as ISO strings.
+
+                Date.prototype.toJSON = function (key) {
+                    function f(n) {
+                        // Format integers to have at least two digits.
+                        return n < 10 ? '0' + n : n;
+                    }
+
+                    return this.getUTCFullYear()   + '-' +
+                         f(this.getUTCMonth() + 1) + '-' +
+                         f(this.getUTCDate())      + 'T' +
+                         f(this.getUTCHours())     + ':' +
+                         f(this.getUTCMinutes())   + ':' +
+                         f(this.getUTCSeconds())   + 'Z';
+                };
+
+            You can provide an optional replacer method. It will be passed the
+            key and value of each member, with this bound to the containing
+            object. The value that is returned from your method will be
+            serialized. If your method returns undefined, then the member will
+            be excluded from the serialization.
+
+            If the replacer parameter is an array of strings, then it will be
+            used to select the members to be serialized. It filters the results
+            such that only members with keys listed in the replacer array are
+            stringified.
+
+            Values that do not have JSON representations, such as undefined or
+            functions, will not be serialized. Such values in objects will be
+            dropped; in arrays they will be replaced with null. You can use
+            a replacer function to replace those with JSON values.
+            JSON.stringify(undefined) returns undefined.
+
+            The optional space parameter produces a stringification of the
+            value that is filled with line breaks and indentation to make it
+            easier to read.
+
+            If the space parameter is a non-empty string, then that string will
+            be used for indentation. If the space parameter is a number, then
+            the indentation will be that many spaces.
+
+            Example:
+
+            text = JSON.stringify(['e', {pluribus: 'unum'}]);
+            // text is '["e",{"pluribus":"unum"}]'
+
+
+            text = JSON.stringify(['e', {pluribus: 'unum'}], null, '\t');
+            // text is '[\n\t"e",\n\t{\n\t\t"pluribus": "unum"\n\t}\n]'
+
+            text = JSON.stringify([new Date()], function (key, value) {
+                return this[key] instanceof Date ?
+                    'Date(' + this[key] + ')' : value;
+            });
+            // text is '["Date(---current time---)"]'
+
+
+        JSON.parse(text, reviver)
+            This method parses a JSON text to produce an object or array.
+            It can throw a SyntaxError exception.
+
+            The optional reviver parameter is a function that can filter and
+            transform the results. It receives each of the keys and values,
+            and its return value is used instead of the original value.
+            If it returns what it received, then the structure is not modified.
+            If it returns undefined then the member is deleted.
+
+            Example:
+
+            // Parse the text. Values that look like ISO date strings will
+            // be converted to Date objects.
+
+            myData = JSON.parse(text, function (key, value) {
+                var a;
+                if (typeof value === 'string') {
+                    a =
+/^(\d{4})-(\d{2})-(\d{2})T(\d{2}):(\d{2}):(\d{2}(?:\.\d*)?)Z$/.exec(value);
+                    if (a) {
+                        return new Date(Date.UTC(+a[1], +a[2] - 1, +a[3], +a[4],
+                            +a[5], +a[6]));
+                    }
+                }
+                return value;
+            });
+
+            myData = JSON.parse('["Date(09/09/2001)"]', function (key, value) {
+                var d;
+                if (typeof value === 'string' &&
+                        value.slice(0, 5) === 'Date(' &&
+                        value.slice(-1) === ')') {
+                    d = new Date(value.slice(5, -1));
+                    if (d) {
+                        return d;
+                    }
+                }
+                return value;
+            });
+
+
+    This is a reference implementation. You are free to copy, modify, or
+    redistribute.
+*/
+
+/*jslint evil: true, regexp: true */
+
+/*members "", "\b", "\t", "\n", "\f", "\r", "\"", JSON, "\\", apply,
+    call, charCodeAt, getUTCDate, getUTCFullYear, getUTCHours,
+    getUTCMinutes, getUTCMonth, getUTCSeconds, hasOwnProperty, join,
+    lastIndex, length, parse, prototype, push, replace, slice, stringify,
+    test, toJSON, toString, valueOf
+*/
+
+
+// Create a JSON object only if one does not already exist. We create the
+// methods in a closure to avoid creating global variables.
+
+if (typeof JSON !== 'object') {
+    JSON = {};
+}
+
+(function () {
+    'use strict';
+
+    function f(n) {
+        // Format integers to have at least two digits.
+        return n < 10 ? '0' + n : n;
+    }
+
+    if (typeof Date.prototype.toJSON !== 'function') {
+
+        Date.prototype.toJSON = function () {
+
+            return isFinite(this.valueOf())
+                ? this.getUTCFullYear()     + '-' +
+                    f(this.getUTCMonth() + 1) + '-' +
+                    f(this.getUTCDate())      + 'T' +
+                    f(this.getUTCHours())     + ':' +
+                    f(this.getUTCMinutes())   + ':' +
+                    f(this.getUTCSeconds())   + 'Z'
+                : null;
+        };
+
+        String.prototype.toJSON      =
+            Number.prototype.toJSON  =
+            Boolean.prototype.toJSON = function () {
+                return this.valueOf();
+            };
+    }
+
+    var cx = /[\u0000\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g,
+        escapable = /[\\\"\x00-\x1f\x7f-\x9f\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g,
+        gap,
+        indent,
+        meta = {    // table of character substitutions
+            '\b': '\\b',
+            '\t': '\\t',
+            '\n': '\\n',
+            '\f': '\\f',
+            '\r': '\\r',
+            '"' : '\\"',
+            '\\': '\\\\'
+        },
+        rep;
+
+
+    function quote(string) {
+
+// If the string contains no control characters, no quote characters, and no
+// backslash characters, then we can safely slap some quotes around it.
+// Otherwise we must also replace the offending characters with safe escape
+// sequences.
+
+        escapable.lastIndex = 0;
+        return escapable.test(string) ? '"' + string.replace(escapable, function (a) {
+            var c = meta[a];
+            return typeof c === 'string'
+                ? c
+                : '\\u' + ('0000' + a.charCodeAt(0).toString(16)).slice(-4);
+        }) + '"' : '"' + string + '"';
+    }
+
+
+    function str(key, holder) {
+
+// Produce a string from holder[key].
+
+        var i,          // The loop counter.
+            k,          // The member key.
+            v,          // The member value.
+            length,
+            mind = gap,
+            partial,
+            value = holder[key];
+
+// If the value has a toJSON method, call it to obtain a replacement value.
+
+        if (value && typeof value === 'object' &&
+                typeof value.toJSON === 'function') {
+            value = value.toJSON(key);
+        }
+
+// If we were called with a replacer function, then call the replacer to
+// obtain a replacement value.
+
+        if (typeof rep === 'function') {
+            value = rep.call(holder, key, value);
+        }
+
+// What happens next depends on the value's type.
+
+        switch (typeof value) {
+        case 'string':
+            return quote(value);
+
+        case 'number':
+
+// JSON numbers must be finite. Encode non-finite numbers as null.
+
+            return isFinite(value) ? String(value) : 'null';
+
+        case 'boolean':
+        case 'null':
+
+// If the value is a boolean or null, convert it to a string. Note:
+// typeof null does not produce 'null'. The case is included here in
+// the remote chance that this gets fixed someday.
+
+            return String(value);
+
+// If the type is 'object', we might be dealing with an object or an array or
+// null.
+
+        case 'object':
+
+// Due to a specification blunder in ECMAScript, typeof null is 'object',
+// so watch out for that case.
+
+            if (!value) {
+                return 'null';
+            }
+
+// Make an array to hold the partial results of stringifying this object value.
+
+            gap += indent;
+            partial = [];
+
+// Is the value an array?
+
+            if (Object.prototype.toString.apply(value) === '[object Array]') {
+
+// The value is an array. Stringify every element. Use null as a placeholder
+// for non-JSON values.
+
+                length = value.length;
+                for (i = 0; i < length; i += 1) {
+                    partial[i] = str(i, value) || 'null';
+                }
+
+// Join all of the elements together, separated with commas, and wrap them in
+// brackets.
+
+                v = partial.length === 0
+                    ? '[]'
+                    : gap
+                    ? '[\n' + gap + partial.join(',\n' + gap) + '\n' + mind + ']'
+                    : '[' + partial.join(',') + ']';
+                gap = mind;
+                return v;
+            }
+
+// If the replacer is an array, use it to select the members to be stringified.
+
+            if (rep && typeof rep === 'object') {
+                length = rep.length;
+                for (i = 0; i < length; i += 1) {
+                    if (typeof rep[i] === 'string') {
+                        k = rep[i];
+                        v = str(k, value);
+                        if (v) {
+                            partial.push(quote(k) + (gap ? ': ' : ':') + v);
+                        }
+                    }
+                }
+            } else {
+
+// Otherwise, iterate through all of the keys in the object.
+
+                for (k in value) {
+                    if (Object.prototype.hasOwnProperty.call(value, k)) {
+                        v = str(k, value);
+                        if (v) {
+                            partial.push(quote(k) + (gap ? ': ' : ':') + v);
+                        }
+                    }
+                }
+            }
+
+// Join all of the member texts together, separated with commas,
+// and wrap them in braces.
+
+            v = partial.length === 0
+                ? '{}'
+                : gap
+                ? '{\n' + gap + partial.join(',\n' + gap) + '\n' + mind + '}'
+                : '{' + partial.join(',') + '}';
+            gap = mind;
+            return v;
+        }
+    }
+
+// If the JSON object does not yet have a stringify method, give it one.
+
+    if (typeof JSON.stringify !== 'function') {
+        JSON.stringify = function (value, replacer, space) {
+
+// The stringify method takes a value and an optional replacer, and an optional
+// space parameter, and returns a JSON text. The replacer can be a function
+// that can replace values, or an array of strings that will select the keys.
+// A default replacer method can be provided. Use of the space parameter can
+// produce text that is more easily readable.
+
+            var i;
+            gap = '';
+            indent = '';
+
+// If the space parameter is a number, make an indent string containing that
+// many spaces.
+
+            if (typeof space === 'number') {
+                for (i = 0; i < space; i += 1) {
+                    indent += ' ';
+                }
+
+// If the space parameter is a string, it will be used as the indent string.
+
+            } else if (typeof space === 'string') {
+                indent = space;
+            }
+
+// If there is a replacer, it must be a function or an array.
+// Otherwise, throw an error.
+
+            rep = replacer;
+            if (replacer && typeof replacer !== 'function' &&
+                    (typeof replacer !== 'object' ||
+                    typeof replacer.length !== 'number')) {
+                throw new Error('JSON.stringify');
+            }
+
+// Make a fake root object containing our value under the key of ''.
+// Return the result of stringifying the value.
+
+            return str('', {'': value});
+        };
+    }
+
+
+// If the JSON object does not yet have a parse method, give it one.
+
+    if (typeof JSON.parse !== 'function') {
+        JSON.parse = function (text, reviver) {
+
+// The parse method takes a text and an optional reviver function, and returns
+// a JavaScript value if the text is a valid JSON text.
+
+            var j;
+
+            function walk(holder, key) {
+
+// The walk method is used to recursively walk the resulting structure so
+// that modifications can be made.
+
+                var k, v, value = holder[key];
+                if (value && typeof value === 'object') {
+                    for (k in value) {
+                        if (Object.prototype.hasOwnProperty.call(value, k)) {
+                            v = walk(value, k);
+                            if (v !== undefined) {
+                                value[k] = v;
+                            } else {
+                                delete value[k];
+                            }
+                        }
+                    }
+                }
+                return reviver.call(holder, key, value);
+            }
+
+
+// Parsing happens in four stages. In the first stage, we replace certain
+// Unicode characters with escape sequences. JavaScript handles many characters
+// incorrectly, either silently deleting them, or treating them as line endings.
+
+            text = String(text);
+            cx.lastIndex = 0;
+            if (cx.test(text)) {
+                text = text.replace(cx, function (a) {
+                    return '\\u' +
+                        ('0000' + a.charCodeAt(0).toString(16)).slice(-4);
+                });
+            }
+
+// In the second stage, we run the text against regular expressions that look
+// for non-JSON patterns. We are especially concerned with '()' and 'new'
+// because they can cause invocation, and '=' because it can cause mutation.
+// But just to be safe, we want to reject all unexpected forms.
+
+// We split the second stage into 4 regexp operations in order to work around
+// crippling inefficiencies in IE's and Safari's regexp engines. First we
+// replace the JSON backslash pairs with '@' (a non-JSON character). Second, we
+// replace all simple value tokens with ']' characters. Third, we delete all
+// open brackets that follow a colon or comma or that begin the text. Finally,
+// we look to see that the remaining characters are only whitespace or ']' or
+// ',' or ':' or '{' or '}'. If that is so, then the text is safe for eval.
+
+            if (/^[\],:{}\s]*$/
+                    .test(text.replace(/\\(?:["\\\/bfnrt]|u[0-9a-fA-F]{4})/g, '@')
+                        .replace(/"[^"\\\n\r]*"|true|false|null|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?/g, ']')
+                        .replace(/(?:^|:|,)(?:\s*\[)+/g, ''))) {
+
+// In the third stage we use the eval function to compile the text into a
+// JavaScript structure. The '{' operator is subject to a syntactic ambiguity
+// in JavaScript: it can begin a block or an object literal. We wrap the text
+// in parens to eliminate the ambiguity.
+
+                j = eval('(' + text + ')');
+
+// In the optional fourth stage, we recursively walk the new structure, passing
+// each name/value pair to a reviver function for possible transformation.
+
+                return typeof reviver === 'function'
+                    ? walk({'': j}, '')
+                    : j;
+            }
+
+// If the text is not JSON parseable, then a SyntaxError is thrown.
+
+            throw new SyntaxError('JSON.parse');
+        };
+    }
+}());

public/webrtc/srs.log.js

@@ -0,0 +1,37 @@
+/**
+* log specified, there must be a log element as:
+    <!-- for the log -->
+    <div class="alert alert-info fade in" id="txt_log">
+        <button type="button" class="close" data-dismiss="alert">×</button>
+        <strong><span id="txt_log_title">标题:</span></strong>
+        <span id="txt_log_msg">日志内容</span>
+    </div>
+*/
+var srs_log_disabled = false;
+function info(desc) {
+    if (srs_log_disabled) {
+        return;
+    }
+    
+    $("#txt_log").addClass("alert-info").removeClass("alert-error").removeClass("alert-warn");
+    $("#txt_log_title").text("Info:");
+    $("#txt_log_msg").html(desc);
+}
+function warn(code, desc) {
+    if (srs_log_disabled) {
+        return;
+    }
+    
+    $("#txt_log").removeClass("alert-info").removeClass("alert-error").addClass("alert-warn");
+    $("#txt_log_title").text("Warn:");
+    $("#txt_log_msg").html("code: " + code + ", " + desc);
+}
+function error(code, desc) {
+    if (srs_log_disabled) {
+        return;
+    }
+    
+    $("#txt_log").removeClass("alert-info").addClass("alert-error").removeClass("alert-warn");
+    $("#txt_log_title").text("Error:");
+    $("#txt_log_msg").html("code: " + code + ", " + desc);
+}

public/webrtc/srs.page.js

@@ -0,0 +1,182 @@
+
+// to query the swf anti cache.
+function srs_get_version_code() { return "1.33"; }
+
+/**
+* player specified size.
+*/
+function srs_get_player_modal() { return 740; }
+function srs_get_player_width() { return srs_get_player_modal() - 30; }
+function srs_get_player_height() { return srs_get_player_width() * 9 / 19; }
+
+/**
+* update the navigator, add same query string.
+*/
+function update_nav() {
+    $("#nav_srs_player").attr("href", "srs_player.html" + window.location.search);
+    $("#nav_rtc_player").attr("href", "rtc_player.html" + window.location.search);
+    $("#nav_rtc_publisher").attr("href", "rtc_publisher.html" + window.location.search);
+    $("#nav_whip").attr("href", "whip.html" + window.location.search);
+    $("#nav_whep").attr("href", "whep.html" + window.location.search);
+    $("#nav_srs_publisher").attr("href", "srs_publisher.html" + window.location.search);
+    $("#nav_srs_chat").attr("href", "srs_chat.html" + window.location.search);
+    $("#nav_srs_bwt").attr("href", "srs_bwt.html" + window.location.search);
+    $("#nav_vlc").attr("href", "vlc.html" + window.location.search);
+}
+
+// Special extra params, such as auth_key.
+function user_extra_params(query, params, rtc) {
+    var queries = params || [];
+
+    for (var key in query.user_query) {
+        if (key === 'app' || key === 'autostart' || key === 'dir'
+            || key === 'filename' || key === 'host' || key === 'hostname'
+            || key === 'http_port' || key === 'pathname' || key === 'port'
+            || key === 'server' || key === 'stream' || key === 'buffer'
+            || key === 'schema' || key === 'vhost' || key === 'api'
+            || key === 'path'
+        ) {
+            continue;
+        }
+
+        if (query[key]) {
+            queries.push(key + '=' + query[key]);
+        }
+    }
+
+    return queries;
+}
+
+function is_default_port(schema, port) {
+    return (schema === 'http' && port === 80)
+        || (schema === 'https' && port === 443)
+        || (schema === 'webrtc' && port === 1985)
+        || (schema === 'rtmp' && port === 1935);
+}
+
+/**
+@param server the ip of server. default to window.location.hostname
+@param vhost the vhost of HTTP-FLV. default to window.location.hostname
+@param port the port of HTTP-FLV. default to 1935
+@param app the app of HTTP-FLV. default to live.
+@param stream the stream of HTTP-FLV. default to livestream.flv
+*/
+function build_default_flv_url() {
+    var query = parse_query_string();
+
+    var schema = (!query.schema)? "http":query.schema;
+    var server = (!query.server)? window.location.hostname:query.server;
+    var port = (!query.port)? (schema==="http"? 8080:1935) : Number(query.port);
+    var vhost = (!query.vhost)? window.location.hostname:query.vhost;
+    var app = (!query.app)? "live":query.app;
+    var stream = (!query.stream)? "livestream.flv":query.stream;
+
+    var queries = [];
+    if (server !== vhost && vhost !== "__defaultVhost__") {
+        queries.push("vhost=" + vhost);
+    }
+    queries = user_extra_params(query, queries);
+
+    var uri = schema + "://" + server;
+    if (!is_default_port(schema, port)) {
+        uri += ":" + port;
+    }
+    uri += "/" + app + "/" + stream + "?" + queries.join('&');
+    while (uri.indexOf("?") === uri.length - 1) {
+        uri = uri.slice(0, uri.length - 1);
+    }
+
+    return uri;
+}
+
+function build_default_rtc_url(query) {
+    // The format for query string to overwrite configs of server.
+    console.log('?eip=x.x.x.x to overwrite candidate. 覆盖服务器candidate(外网IP)配置');
+    console.log('?api=x to overwrite WebRTC API(1985).');
+    console.log('?schema=http|https to overwrite WebRTC API protocol.');
+
+    var server = (!query.server)? window.location.hostname:query.server;
+    var vhost = (!query.vhost)? window.location.hostname:query.vhost;
+    var app = (!query.app)? "live":query.app;
+    var stream = (!query.stream)? "livestream":query.stream;
+    var api = query.api? ':'+query.api : '';
+
+    var queries = [];
+    if (server !== vhost && vhost !== "__defaultVhost__") {
+        queries.push("vhost=" + vhost);
+    }
+    if (query.schema && window.location.protocol !== query.schema + ':') {
+        queries.push('schema=' + query.schema);
+    }
+    queries = user_extra_params(query, queries, true);
+
+    var uri = "webrtc://" + server + api + "/" + app + "/" + stream + "?" + queries.join('&');
+    while (uri.lastIndexOf("?") === uri.length - 1) {
+        uri = uri.slice(0, uri.length - 1);
+    }
+
+    return uri;
+};
+
+function build_default_whip_whep_url(query, apiPath) {
+    // The format for query string to overwrite configs of server.
+    console.log('?eip=x.x.x.x to overwrite candidate. 覆盖服务器candidate(外网IP)配置');
+    console.log('?api=x to overwrite WebRTC API(1985).');
+    console.log('?schema=http|https to overwrite WebRTC API protocol.');
+    console.log(`?path=xxx to overwrite default ${apiPath}`);
+
+    var server = (!query.server)? window.location.hostname:query.server;
+    var vhost = (!query.vhost)? window.location.hostname:query.vhost;
+    var app = (!query.app)? "live":query.app;
+    var stream = (!query.stream)? "livestream":query.stream;
+    var api = ':' + (query.api || (window.location.protocol === 'http:' ? '1985' : '1990'));
+    const realApiPath = query.path || apiPath;
+
+    var queries = [];
+    if (server !== vhost && vhost !== "__defaultVhost__") {
+        queries.push("vhost=" + vhost);
+    }
+    if (query.schema && window.location.protocol !== query.schema + ':') {
+        queries.push('schema=' + query.schema);
+    }
+    queries = user_extra_params(query, queries, true);
+
+    var uri = window.location.protocol + "//" + server + api + realApiPath + "?app=" + app + "&stream=" + stream + "&" + queries.join('&');
+    while (uri.lastIndexOf("?") === uri.length - 1) {
+        uri = uri.slice(0, uri.length - 1);
+    }
+    while (uri.lastIndexOf("&") === uri.length - 1) {
+        uri = uri.slice(0, uri.length - 1);
+    }
+
+    return uri;
+}
+
+/**
+* initialize the page.
+* @param flv_url the div id contains the flv stream url to play
+* @param hls_url the div id contains the hls stream url to play
+* @param modal_player the div id contains the modal player
+*/
+function srs_init_flv(flv_url, modal_player) {
+    update_nav();
+    if (flv_url) {
+        $(flv_url).val(build_default_flv_url());
+    }
+    if (modal_player) {
+        $(modal_player).width(srs_get_player_modal() + "px");
+        $(modal_player).css("margin-left", "-" + srs_get_player_modal() / 2 +"px");
+    }
+}
+function srs_init_rtc(id, query) {
+    update_nav();
+    $(id).val(build_default_rtc_url(query));
+}
+function srs_init_whip(id, query) {
+    update_nav();
+    $(id).val(build_default_whip_whep_url(query, '/rtc/v1/whip/'));
+}
+function srs_init_whep(id, query) {
+    update_nav();
+    $(id).val(build_default_whip_whep_url(query, '/rtc/v1/whep/'));
+}

public/webrtc/srs.player.js

@@ -0,0 +1,382 @@
+/**
+* the SrsPlayer object.
+* @param container the html container id.
+* @param width a float value specifies the width of player.
+* @param height a float value specifies the height of player.
+* @param private_object [optional] an object that used as private object, 
+*       for example, the logic chat object which owner this player.
+* Usage:
+        <script type="text/javascript" src="js/swfobject.js"></script>
+        <script type="text/javascript" src="js/srs.player.js"></script>
+        <div id="player"></div>
+        var p = new SrsPlayer("player", 640, 480);
+        p.set_srs_player_url("srs_player.swf?v=1.0.0");
+        p.on_player_ready = function() {
+            p.set_bt(0.8);
+            p.set_mbt(1.2);
+            p.play("rtmp://ossrs.net/live/livestream");
+        };
+        p.on_player_metadata = function(metadata) {
+            console.log(metadata);
+            console.log(p.dump_log());
+        };
+        p.start();
+*/
+function SrsPlayer(container, width, height, private_object) {
+    if (!SrsPlayer.__id) {
+        SrsPlayer.__id = 100;
+    }
+    if (!SrsPlayer.__players) {
+        SrsPlayer.__players = [];
+    }
+    
+    SrsPlayer.__players.push(this);
+    
+    this.private_object = private_object;
+    this.container = container;
+    this.width = width;
+    this.height = height;
+    this.id = SrsPlayer.__id++;
+    this.stream_url = null;
+    this.buffer_time = 0.3; // default to 0.3
+    this.max_buffer_time = this.buffer_time * 3; // default to 3 x bufferTime.
+    this.volume = 1.0; // default to 100%
+    this.callbackObj = null;
+    this.srs_player_url = "srs_player/release/srs_player.swf?_version="+srs_get_version_code();
+    
+    // callback set the following values.
+    this.meatadata = {}; // for on_player_metadata
+    this.time = 0; // current stream time.
+    this.buffer_length = 0; // current stream buffer length.
+    this.kbps = 0; // current stream bitrate(video+audio) in kbps.
+    this.fps = 0; // current stream video fps.
+    this.rtime = 0; // flash relative time in ms.
+
+    this.__fluency = {
+        total_empty_count: 0,
+        total_empty_time: 0,
+        current_empty_time: 0
+    };
+    this.__fluency.on_stream_empty = function(time) {
+        this.total_empty_count++;
+        this.current_empty_time = time;
+    };
+    this.__fluency.on_stream_full = function(time) {
+        if (this.current_empty_time > 0) {
+            this.total_empty_time += time - this.current_empty_time;
+            this.current_empty_time = 0;
+        }
+    };
+    this.__fluency.calc = function(time) {
+        var den = this.total_empty_count * 4 + this.total_empty_time * 2 + time;
+        if (den > 0) {
+            return time * 100 / den;
+        }
+        return 0;
+    };
+}
+/**
+* user can set some callback, then start the player.
+* @param url the default url.
+* callbacks:
+*      on_player_ready():int, when srs player ready, user can play().
+*      on_player_metadata(metadata:Object):int, when srs player get metadata.
+* methods:
+*      set_bt(t:Number):void, set the buffer time in seconds.
+*      set_mbt(t:Number):void, set the max buffer time in seconds.
+*      dump_log():String, get all logs of player.
+*/
+SrsPlayer.prototype.start = function(url) {
+    if (url) {
+        this.stream_url = url;
+    }
+    
+    // embed the flash.
+    var flashvars = {};
+    flashvars.id = this.id;
+    flashvars.on_player_ready = "__srs_on_player_ready";
+    flashvars.on_player_metadata = "__srs_on_player_metadata";
+    flashvars.on_player_timer = "__srs_on_player_timer";
+    flashvars.on_player_empty = "__srs_on_player_empty";
+    flashvars.on_player_full = "__srs_on_player_full";
+    flashvars.on_player_status = "__srs_on_player_status";
+    
+    var params = {};
+    params.wmode = "opaque";
+    params.allowFullScreen = "true";
+    params.allowScriptAccess = "always";
+    
+    var attributes = {};
+    
+    var self = this;
+    
+    swfobject.embedSWF(
+        this.srs_player_url, 
+        this.container,
+        this.width, this.height,
+        "11.1.0", "js/AdobeFlashPlayerInstall.swf",
+        flashvars, params, attributes,
+        function(callbackObj){
+            self.callbackObj = callbackObj;
+            if (!callbackObj.success) {
+                console.error('Initialize player failed:'); console.error(callbackObj);
+            }
+        }
+    );
+    
+    return this;
+}
+/**
+* play the stream.
+* @param stream_url the url of stream, rtmp or http.
+* @param volume the volume, 0 is mute, 1 is 100%, 2 is 200%.
+*/
+SrsPlayer.prototype.play = function(url, volume) {
+    this.stop();
+    SrsPlayer.__players.push(this);
+    
+    if (url) {
+        this.stream_url = url;
+    }
+    
+    // volume maybe 0, so never use if(volume) to check its value.
+    if (volume != null && volume != undefined) {
+        this.volume = volume;
+    }
+    
+    this.callbackObj.ref.__play(this.stream_url, this.width, this.height, this.buffer_time, this.max_buffer_time, this.volume);
+}
+/**
+ * stop play stream.
+ */
+SrsPlayer.prototype.stop = function() {
+    this.callbackObj.ref.__stop();
+}
+/**
+ * pause the play.
+ */
+SrsPlayer.prototype.pause = function() {
+    this.callbackObj.ref.__pause();
+}
+/**
+ * resume the play.
+ */
+SrsPlayer.prototype.resume = function() {
+    this.callbackObj.ref.__resume();
+}
+/**
+ * get the stream fluency, where 100 is 100%.
+ */
+SrsPlayer.prototype.fluency = function() {
+    return this.__fluency.calc(this.rtime);
+}
+/**
+ * get the stream empty count.
+ */
+SrsPlayer.prototype.empty_count = function() {
+    return this.__fluency.total_empty_count;
+}
+/**
+ * get all log data.
+ */
+SrsPlayer.prototype.dump_log = function() {
+    return this.callbackObj.ref.__dump_log();
+}
+/**
+* to set the DAR, for example, DAR=16:9 where num=16,den=9.
+* @param num, for example, 16. 
+*       use metadata width if 0.
+*       use user specified width if -1.
+* @param den, for example, 9. 
+*       use metadata height if 0.
+*       use user specified height if -1.
+*/
+SrsPlayer.prototype.set_dar = function(num, den) {
+    this.callbackObj.ref.__set_dar(num, den);
+}
+/**
+* set the fullscreen size data.
+* @refer the refer fullscreen mode. it can be:
+*       video: use video orignal size.
+*       screen: use screen size to rescale video.
+* @param percent, the rescale percent, where
+*       100 means 100%.
+*/
+SrsPlayer.prototype.set_fs = function(refer, percent) {
+    this.callbackObj.ref.__set_fs(refer, percent);
+}
+/**
+* set the stream buffer time in seconds.
+* @buffer_time the buffer time in seconds.
+*/
+SrsPlayer.prototype.set_bt = function(buffer_time) {
+    if (this.buffer_time == buffer_time) {
+        return;
+    }
+
+    this.buffer_time = buffer_time;
+    this.callbackObj.ref.__set_bt(buffer_time);
+
+    // reset the max buffer time to 3 x buffer_time.
+    this.set_mbt(buffer_time * 3);
+}
+/**
+ * set the stream max buffer time in seconds.
+ * @param max_buffer_time the max buffer time in seconds.
+ * @remark this is the key feature for realtime communication by flash.
+ */
+SrsPlayer.prototype.set_mbt = function(max_buffer_time) {
+    // we must atleast set the max buffer time to 0.6s.
+    max_buffer_time = Math.max(0.6, max_buffer_time);
+    // max buffer time always greater than buffer time.
+    max_buffer_time = Math.max(this.buffer_time, max_buffer_time);
+
+    if (parseInt(this.max_buffer_time * 10) == parseInt(max_buffer_time * 10)) {
+        return;
+    }
+
+    this.max_buffer_time = max_buffer_time;
+    this.callbackObj.ref.__set_mbt(max_buffer_time);
+}
+/**
+ * set the srs_player.swf url
+ * @param url, srs_player.swf's url.
+ * @param params, object.
+ */
+ SrsPlayer.prototype.set_srs_player_url = function(url, params) {
+    var query_array = [], 
+        query_string = "", 
+        p;
+    params = params || {}; 
+    params._version = srs_get_version_code();
+    for (p in params) {
+        if (params.hasOwnProperty(p)) {
+            query_array.push(p + "=" + encodeURIComponent(params[p]));
+        }
+    }   
+    query_string = query_array.join("&");
+    this.srs_player_url = url + "?" + query_string;
+}
+ /**
+  * the callback when player is ready.
+  */
+SrsPlayer.prototype.on_player_ready = function() {
+}
+/**
+ * the callback when player got metadata.
+ * @param metadata the metadata which player got.
+ */
+SrsPlayer.prototype.on_player_metadata = function(metadata) {
+    // ignore.
+}
+/**
+ * the callback when player timer event.
+ * @param time current stream time.
+ * @param buffer_length current buffer length.
+ * @param kbps current video plus audio bitrate in kbps.
+ * @param fps current video fps.
+ * @param rtime current relative time by flash.util.getTimer().
+ */
+SrsPlayer.prototype.on_player_timer = function(time, buffer_length, kbps, fps, rtime) {
+    // ignore.
+}
+/**
+ * the callback when player got NetStream.Buffer.Empty
+ * @param time current relative time by flash.util.getTimer().
+ */
+SrsPlayer.prototype.on_player_empty = function(time) {
+    // ignore.
+}
+/**
+ * the callback when player got NetStream.Buffer.Full
+ * @param time current relative time by flash.util.getTimer().
+ */
+SrsPlayer.prototype.on_player_full = function(time) {
+    // ignore.
+}
+/**
+ * the callback when player status change.
+ * @param code the status code, "init", "connected", "play", "closed", "rejected", "failed".
+ *      init => connected/rejected/failed
+ *      connected => play/rejected => closed
+ * @param desc the description for the status.
+ */
+SrsPlayer.prototype.on_player_status = function(code, desc) {
+    // ignore.
+}
+
+/**
+ * helpers.
+ */
+function __srs_find_player(id) {
+    for (var i = 0; i < SrsPlayer.__players.length; i++) {
+        var player = SrsPlayer.__players[i];
+        
+        if (player.id != id) {
+            continue;
+        }
+        
+        return player;
+    }
+    
+    throw new Error("player not found. id=" + id);
+}
+function __srs_on_player_ready(id) {
+    var player = __srs_find_player(id);
+    player.on_player_ready();
+}
+function __srs_on_player_metadata(id, metadata) {
+    var player = __srs_find_player(id);
+    
+    // user may override the on_player_metadata, 
+    // so set the data before invoke it.
+    player.metadata = metadata;
+    
+    player.on_player_metadata(metadata);
+}
+function __srs_on_player_timer(id, time, buffer_length, kbps, fps, rtime) {
+    var player = __srs_find_player(id);
+    
+    buffer_length = Math.max(0, buffer_length);
+    buffer_length = Math.min(player.buffer_time, buffer_length);
+    
+    time = Math.max(0, time);
+    
+    // user may override the on_player_timer, 
+    // so set the data before invoke it.
+    player.time = time;
+    player.buffer_length = buffer_length;
+    player.kbps = kbps;
+    player.fps = fps;
+    player.rtime = rtime;
+
+    player.on_player_timer(time, buffer_length, kbps, fps, rtime);
+}
+function __srs_on_player_empty(id, time) {
+    var player = __srs_find_player(id);
+    player.__fluency.on_stream_empty(time);
+    player.on_player_empty(time);
+}
+function __srs_on_player_full(id, time) {
+    var player = __srs_find_player(id);
+    player.__fluency.on_stream_full(time);
+    player.on_player_full(time);
+}
+function __srs_on_player_status(id, code, desc) {
+    var player = __srs_find_player(id);
+    player.on_player_status(code, desc);
+
+    if (code != "closed") {
+        return;
+    }
+    for (var i = 0; i < SrsPlayer.__players.length; i++) {
+        var player = SrsPlayer.__players[i];
+
+        if (player.id != this.id) {
+            continue;
+        }
+
+        SrsPlayer.__players.splice(i, 1);
+        break;
+    }
+}

public/webrtc/srs.publisher.js

@@ -0,0 +1,173 @@
+/**
+* the SrsPublisher object.
+* @param container the html container id.
+* @param width a float value specifies the width of publisher.
+* @param height a float value specifies the height of publisher.
+* @param private_object [optional] an object that used as private object, 
+*       for example, the logic chat object which owner this publisher.
+*/
+function SrsPublisher(container, width, height, private_object) {
+    if (!SrsPublisher.__id) {
+        SrsPublisher.__id = 100;
+    }
+    if (!SrsPublisher.__publishers) {
+        SrsPublisher.__publishers = [];
+    }
+    
+    SrsPublisher.__publishers.push(this);
+    
+    this.private_object = private_object;
+    this.container = container;
+    this.width = width;
+    this.height = height;
+    this.id = SrsPublisher.__id++;
+    this.callbackObj = null;
+    
+    // set the values when publish.
+    this.url = null;
+    this.vcodec = {};
+    this.acodec = {};
+    
+    // callback set the following values.
+    this.cameras = [];
+    this.microphones = [];
+    this.code = 0;
+    
+    // error code defines.
+    this.errors = {
+        "100": "无法获取指定的摄像头。", //error_camera_get 
+        "101": "无法获取指定的麦克风。", //error_microphone_get 
+        "102": "摄像头为禁用状态，推流时请允许flash访问摄像头。", //error_camera_muted 
+        "103": "服务器关闭了连接。", //error_connection_closed 
+        "104": "服务器连接失败。", //error_connection_failed 
+        "199": "未知错误。"
+    };
+}
+/**
+* user can set some callback, then start the publisher.
+* callbacks:
+*      on_publisher_ready(cameras, microphones):int, when srs publisher ready, user can publish.
+*      on_publisher_error(code, desc):int, when srs publisher error, callback this method.
+*      on_publisher_warn(code, desc):int, when srs publisher warn, callback this method.
+*/
+SrsPublisher.prototype.start = function() {
+    // embed the flash.
+    var flashvars = {};
+    flashvars.id = this.id;
+    flashvars.width = this.width;
+    flashvars.height = this.height;
+    flashvars.on_publisher_ready = "__srs_on_publisher_ready";
+    flashvars.on_publisher_error = "__srs_on_publisher_error";
+    flashvars.on_publisher_warn = "__srs_on_publisher_warn";
+    
+    var params = {};
+    params.wmode = "opaque";
+    params.allowFullScreen = "true";
+    params.allowScriptAccess = "always";
+    
+    var attributes = {};
+    
+    var self = this;
+    
+    swfobject.embedSWF(
+        "srs_publisher/release/srs_publisher.swf?_version="+srs_get_version_code(), 
+        this.container,
+        this.width, this.height,
+        "11.1.0", "js/AdobeFlashPlayerInstall.swf",
+        flashvars, params, attributes,
+        function(callbackObj){
+            self.callbackObj = callbackObj;
+        }
+    );
+    
+    return this;
+}
+/**
+* publish stream to server.
+* @param url a string indicates the rtmp url to publish.
+* @param vcodec an object contains the video codec info.
+* @param acodec an object contains the audio codec info.
+*/
+SrsPublisher.prototype.publish = function(url, vcodec, acodec) {
+    this.stop();
+    SrsPublisher.__publishers.push(this);
+    
+    if (url) {
+        this.url = url;
+    }
+    if (vcodec) {
+        this.vcodec = vcodec;
+    }
+    if (acodec) {
+        this.acodec = acodec;
+    }
+    
+    this.callbackObj.ref.__publish(this.url, this.width, this.height, this.vcodec, this.acodec);
+}
+SrsPublisher.prototype.stop = function() {
+    for (var i = 0; i < SrsPublisher.__publishers.length; i++) {
+        var player = SrsPublisher.__publishers[i];
+        
+        if (player.id != this.id) {
+            continue;
+        }
+        
+        SrsPublisher.__publishers.splice(i, 1);
+        break;
+    }
+    
+    this.callbackObj.ref.__stop();
+}
+/**
+* when publisher ready.
+* @param cameras a string array contains the names of cameras.
+* @param microphones a string array contains the names of microphones.
+*/
+SrsPublisher.prototype.on_publisher_ready = function(cameras, microphones) {
+}
+/**
+* when publisher error.
+* @code the error code.
+* @desc the error desc message.
+*/
+SrsPublisher.prototype.on_publisher_error = function(code, desc) {
+    throw new Error("publisher error. code=" + code + ", desc=" + desc);
+}
+SrsPublisher.prototype.on_publisher_warn = function(code, desc) {
+    throw new Error("publisher warn. code=" + code + ", desc=" + desc);
+}
+function __srs_find_publisher(id) {
+    for (var i = 0; i < SrsPublisher.__publishers.length; i++) {
+        var publisher = SrsPublisher.__publishers[i];
+        
+        if (publisher.id != id) {
+            continue;
+        }
+        
+        return publisher;
+    }
+    
+    throw new Error("publisher not found. id=" + id);
+}
+function __srs_on_publisher_ready(id, cameras, microphones) {
+    var publisher = __srs_find_publisher(id);
+    
+    publisher.cameras = cameras;
+    publisher.microphones = microphones;
+    
+    publisher.on_publisher_ready(cameras, microphones);
+}
+function __srs_on_publisher_error(id, code) {
+    var publisher = __srs_find_publisher(id);
+    
+    publisher.code = code;
+    
+    publisher.on_publisher_error(code, publisher.errors[""+code]);
+}
+function __srs_on_publisher_warn(id, code) {
+    var publisher = __srs_find_publisher(id);
+    
+    publisher.code = code;
+    
+    publisher.on_publisher_warn(code, publisher.errors[""+code]);
+}

public/webrtc/srs.sdk.js

@@ -0,0 +1,681 @@
+
+//
+// Copyright (c) 2013-2021 Winlin
+//
+// SPDX-License-Identifier: MIT
+//
+
+'use strict';
+
+function SrsError(name, message) {
+    this.name = name;
+    this.message = message;
+    this.stack = (new Error()).stack;
+}
+SrsError.prototype = Object.create(Error.prototype);
+SrsError.prototype.constructor = SrsError;
+
+// Depends on adapter-7.4.0.min.js from https://github.com/webrtc/adapter
+// Async-awat-prmise based SRS RTC Publisher.
+function SrsRtcPublisherAsync() {
+    var self = {};
+
+    // https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia
+    self.constraints = {
+        audio: true,
+        video: {
+            width: {ideal: 320, max: 576}
+        }
+    };
+
+    // @see https://github.com/rtcdn/rtcdn-draft
+    // @url The WebRTC url to play with, for example:
+    //      webrtc://r.ossrs.net/live/livestream
+    // or specifies the API port:
+    //      webrtc://r.ossrs.net:11985/live/livestream
+    // or autostart the publish:
+    //      webrtc://r.ossrs.net/live/livestream?autostart=true
+    // or change the app from live to myapp:
+    //      webrtc://r.ossrs.net:11985/myapp/livestream
+    // or change the stream from livestream to mystream:
+    //      webrtc://r.ossrs.net:11985/live/mystream
+    // or set the api server to myapi.domain.com:
+    //      webrtc://myapi.domain.com/live/livestream
+    // or set the candidate(eip) of answer:
+    //      webrtc://r.ossrs.net/live/livestream?candidate=39.107.238.185
+    // or force to access https API:
+    //      webrtc://r.ossrs.net/live/livestream?schema=https
+    // or use plaintext, without SRTP:
+    //      webrtc://r.ossrs.net/live/livestream?encrypt=false
+    // or any other information, will pass-by in the query:
+    //      webrtc://r.ossrs.net/live/livestream?vhost=xxx
+    //      webrtc://r.ossrs.net/live/livestream?token=xxx
+    self.publish = async function (url) {
+        var conf = self.__internal.prepareUrl(url);
+        self.pc.addTransceiver("audio", {direction: "sendonly"});
+        self.pc.addTransceiver("video", {direction: "sendonly"});
+        //self.pc.addTransceiver("video", {direction: "sendonly"});
+        //self.pc.addTransceiver("audio", {direction: "sendonly"});
+
+        if (!navigator.mediaDevices && window.location.protocol === 'http:' && window.location.hostname !== 'localhost') {
+            throw new SrsError('HttpsRequiredError', `Please use HTTPS or localhost to publish, read https://github.com/ossrs/srs/issues/2762#issuecomment-983147576`);
+        }
+        var stream = await navigator.mediaDevices.getUserMedia(self.constraints);
+
+        // @see https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/addStream#Migrating_to_addTrack
+        stream.getTracks().forEach(function (track) {
+            self.pc.addTrack(track);
+
+            // Notify about local track when stream is ok.
+            self.ontrack && self.ontrack({track: track});
+        });
+
+        var offer = await self.pc.createOffer();
+        await self.pc.setLocalDescription(offer);
+        var session = await new Promise(function (resolve, reject) {
+            // @see https://github.com/rtcdn/rtcdn-draft
+            var data = {
+                api: conf.apiUrl, tid: conf.tid, streamurl: conf.streamUrl,
+                clientip: null, sdp: offer.sdp
+            };
+            console.log("Generated offer: ", data);
+
+            const xhr = new XMLHttpRequest();
+            xhr.onload = function() {
+                if (xhr.readyState !== xhr.DONE) return;
+                if (xhr.status !== 200 && xhr.status !== 201) return reject(xhr);
+                const data = JSON.parse(xhr.responseText);
+                console.log("Got answer: ", data);
+                return data.code ? reject(xhr) : resolve(data);
+            }
+            xhr.open('POST', conf.apiUrl, true);
+            xhr.setRequestHeader('Content-type', 'application/json');
+            xhr.send(JSON.stringify(data));
+        });
+        await self.pc.setRemoteDescription(
+            new RTCSessionDescription({type: 'answer', sdp: session.sdp})
+        );
+        session.simulator = conf.schema + '//' + conf.urlObject.server + ':' + conf.port + '/rtc/v1/nack/';
+
+        return session;
+    };
+
+    // Close the publisher.
+    self.close = function () {
+        self.pc && self.pc.close();
+        self.pc = null;
+    };
+
+    // The callback when got local stream.
+    // @see https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/addStream#Migrating_to_addTrack
+    self.ontrack = function (event) {
+        // Add track to stream of SDK.
+        self.stream.addTrack(event.track);
+    };
+
+    // Internal APIs.
+    self.__internal = {
+        defaultPath: '/rtc/v1/publish/',
+        prepareUrl: function (webrtcUrl) {
+            var urlObject = self.__internal.parse(webrtcUrl);
+
+            // If user specifies the schema, use it as API schema.
+            var schema = urlObject.user_query.schema;
+            schema = schema ? schema + ':' : window.location.protocol;
+
+            var port = urlObject.port || 1985;
+            if (schema === 'https:') {
+                port = urlObject.port || 443;
+            }
+
+            // @see https://github.com/rtcdn/rtcdn-draft
+            var api = urlObject.user_query.play || self.__internal.defaultPath;
+            if (api.lastIndexOf('/') !== api.length - 1) {
+                api += '/';
+            }
+
+            var apiUrl = schema + '//' + urlObject.server + ':' + port + api;
+            for (var key in urlObject.user_query) {
+                if (key !== 'api' && key !== 'play') {
+                    apiUrl += '&' + key + '=' + urlObject.user_query[key];
+                }
+            }
+            // Replace /rtc/v1/play/&k=v to /rtc/v1/play/?k=v
+            apiUrl = apiUrl.replace(api + '&', api + '?');
+
+            var streamUrl = urlObject.url;
+
+            return {
+                apiUrl: apiUrl, streamUrl: streamUrl, schema: schema, urlObject: urlObject, port: port,
+                tid: Number(parseInt(new Date().getTime()*Math.random()*100)).toString(16).slice(0, 7)
+            };
+        },
+        parse: function (url) {
+            // @see: http://stackoverflow.com/questions/10469575/how-to-use-location-object-to-parse-url-without-redirecting-the-page-in-javascri
+            var a = document.createElement("a");
+            a.href = url.replace("rtmp://", "http://")
+                .replace("webrtc://", "http://")
+                .replace("rtc://", "http://");
+
+            var vhost = a.hostname;
+            var app = a.pathname.substring(1, a.pathname.lastIndexOf("/"));
+            var stream = a.pathname.slice(a.pathname.lastIndexOf("/") + 1);
+
+            // parse the vhost in the params of app, that srs supports.
+            app = app.replace("...vhost...", "?vhost=");
+            if (app.indexOf("?") >= 0) {
+                var params = app.slice(app.indexOf("?"));
+                app = app.slice(0, app.indexOf("?"));
+
+                if (params.indexOf("vhost=") > 0) {
+                    vhost = params.slice(params.indexOf("vhost=") + "vhost=".length);
+                    if (vhost.indexOf("&") > 0) {
+                        vhost = vhost.slice(0, vhost.indexOf("&"));
+                    }
+                }
+            }
+
+            // when vhost equals to server, and server is ip,
+            // the vhost is __defaultVhost__
+            if (a.hostname === vhost) {
+                var re = /^(\d+)\.(\d+)\.(\d+)\.(\d+)$/;
+                if (re.test(a.hostname)) {
+                    vhost = "__defaultVhost__";
+                }
+            }
+
+            // parse the schema
+            var schema = "rtmp";
+            if (url.indexOf("://") > 0) {
+                schema = url.slice(0, url.indexOf("://"));
+            }
+
+            var port = a.port;
+            if (!port) {
+                // Finger out by webrtc url, if contains http or https port, to overwrite default 1985.
+                if (schema === 'webrtc' && url.indexOf(`webrtc://${a.host}:`) === 0) {
+                    port = (url.indexOf(`webrtc://${a.host}:80`) === 0) ? 80 : 443;
+                }
+
+                // Guess by schema.
+                if (schema === 'http') {
+                    port = 80;
+                } else if (schema === 'https') {
+                    port = 443;
+                } else if (schema === 'rtmp') {
+                    port = 1935;
+                }
+            }
+
+            var ret = {
+                url: url,
+                schema: schema,
+                server: a.hostname, port: port,
+                vhost: vhost, app: app, stream: stream
+            };
+            self.__internal.fill_query(a.search, ret);
+
+            // For webrtc API, we use 443 if page is https, or schema specified it.
+            if (!ret.port) {
+                if (schema === 'webrtc' || schema === 'rtc') {
+                    if (ret.user_query.schema === 'https') {
+                        ret.port = 443;
+                    } else if (window.location.href.indexOf('https://') === 0) {
+                        ret.port = 443;
+                    } else {
+                        // For WebRTC, SRS use 1985 as default API port.
+                        ret.port = 1985;
+                    }
+                }
+            }
+
+            return ret;
+        },
+        fill_query: function (query_string, obj) {
+            // pure user query object.
+            obj.user_query = {};
+
+            if (query_string.length === 0) {
+                return;
+            }
+
+            // split again for angularjs.
+            if (query_string.indexOf("?") >= 0) {
+                query_string = query_string.split("?")[1];
+            }
+
+            var queries = query_string.split("&");
+            for (var i = 0; i < queries.length; i++) {
+                var elem = queries[i];
+
+                var query = elem.split("=");
+                obj[query[0]] = query[1];
+                obj.user_query[query[0]] = query[1];
+            }
+
+            // alias domain for vhost.
+            if (obj.domain) {
+                obj.vhost = obj.domain;
+            }
+        }
+    };
+
+    self.pc = new RTCPeerConnection(null);
+
+    // To keep api consistent between player and publisher.
+    // @see https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/addStream#Migrating_to_addTrack
+    // @see https://webrtc.org/getting-started/media-devices
+    self.stream = new MediaStream();
+
+    return self;
+}
+
+// Depends on adapter-7.4.0.min.js from https://github.com/webrtc/adapter
+// Async-await-promise based SRS RTC Player.
+function SrsRtcPlayerAsync() {
+    var self = {};
+
+    // @see https://github.com/rtcdn/rtcdn-draft
+    // @url The WebRTC url to play with, for example:
+    //      webrtc://r.ossrs.net/live/livestream
+    // or specifies the API port:
+    //      webrtc://r.ossrs.net:11985/live/livestream
+    //      webrtc://r.ossrs.net:80/live/livestream
+    // or autostart the play:
+    //      webrtc://r.ossrs.net/live/livestream?autostart=true
+    // or change the app from live to myapp:
+    //      webrtc://r.ossrs.net:11985/myapp/livestream
+    // or change the stream from livestream to mystream:
+    //      webrtc://r.ossrs.net:11985/live/mystream
+    // or set the api server to myapi.domain.com:
+    //      webrtc://myapi.domain.com/live/livestream
+    // or set the candidate(eip) of answer:
+    //      webrtc://r.ossrs.net/live/livestream?candidate=39.107.238.185
+    // or force to access https API:
+    //      webrtc://r.ossrs.net/live/livestream?schema=https
+    // or use plaintext, without SRTP:
+    //      webrtc://r.ossrs.net/live/livestream?encrypt=false
+    // or any other information, will pass-by in the query:
+    //      webrtc://r.ossrs.net/live/livestream?vhost=xxx
+    //      webrtc://r.ossrs.net/live/livestream?token=xxx
+    self.play = async function(url) {
+        var conf = self.__internal.prepareUrl(url);
+        self.pc.addTransceiver("audio", {direction: "recvonly"});
+        self.pc.addTransceiver("video", {direction: "recvonly"});
+        //self.pc.addTransceiver("video", {direction: "recvonly"});
+        //self.pc.addTransceiver("audio", {direction: "recvonly"});
+
+        var offer = await self.pc.createOffer();
+        await self.pc.setLocalDescription(offer);
+        var session = await new Promise(function(resolve, reject) {
+            // @see https://github.com/rtcdn/rtcdn-draft
+            var data = {
+                api: conf.apiUrl, tid: conf.tid, streamurl: conf.streamUrl,
+                clientip: null, sdp: offer.sdp
+            };
+            console.log("Generated offer: ", data);
+
+            const xhr = new XMLHttpRequest();
+            xhr.onload = function() {
+                if (xhr.readyState !== xhr.DONE) return;
+                if (xhr.status !== 200 && xhr.status !== 201) return reject(xhr);
+                const data = JSON.parse(xhr.responseText);
+                console.log("Got answer: ", data);
+                return data.code ? reject(xhr) : resolve(data);
+            }
+            xhr.open('POST', conf.apiUrl, true);
+            xhr.setRequestHeader('Content-type', 'application/json');
+            xhr.send(JSON.stringify(data));
+        });
+        await self.pc.setRemoteDescription(
+            new RTCSessionDescription({type: 'answer', sdp: session.sdp})
+        );
+        session.simulator = conf.schema + '//' + conf.urlObject.server + ':' + conf.port + '/rtc/v1/nack/';
+
+        return session;
+    };
+
+    // Close the player.
+    self.close = function() {
+        self.pc && self.pc.close();
+        self.pc = null;
+    };
+
+    // The callback when got remote track.
+    // Note that the onaddstream is deprecated, @see https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/onaddstream
+    self.ontrack = function (event) {
+        // https://webrtc.org/getting-started/remote-streams
+        self.stream.addTrack(event.track);
+    };
+
+    // Internal APIs.
+    self.__internal = {
+        defaultPath: '/rtc/v1/play/',
+        prepareUrl: function (webrtcUrl) {
+            var urlObject = self.__internal.parse(webrtcUrl);
+
+            // If user specifies the schema, use it as API schema.
+            var schema = urlObject.user_query.schema;
+            schema = schema ? schema + ':' : window.location.protocol;
+
+            var port = urlObject.port || 1985;
+            if (schema === 'https:') {
+                port = urlObject.port || 443;
+            }
+
+            // @see https://github.com/rtcdn/rtcdn-draft
+            var api = urlObject.user_query.play || self.__internal.defaultPath;
+            if (api.lastIndexOf('/') !== api.length - 1) {
+                api += '/';
+            }
+
+            var apiUrl = schema + '//' + urlObject.server + ':' + port + api;
+            for (var key in urlObject.user_query) {
+                if (key !== 'api' && key !== 'play') {
+                    apiUrl += '&' + key + '=' + urlObject.user_query[key];
+                }
+            }
+            // Replace /rtc/v1/play/&k=v to /rtc/v1/play/?k=v
+            apiUrl = apiUrl.replace(api + '&', api + '?');
+
+            var streamUrl = urlObject.url;
+
+            return {
+                apiUrl: apiUrl, streamUrl: streamUrl, schema: schema, urlObject: urlObject, port: port,
+                tid: Number(parseInt(new Date().getTime()*Math.random()*100)).toString(16).slice(0, 7)
+            };
+        },
+        parse: function (url) {
+            // @see: http://stackoverflow.com/questions/10469575/how-to-use-location-object-to-parse-url-without-redirecting-the-page-in-javascri
+            var a = document.createElement("a");
+            a.href = url.replace("rtmp://", "http://")
+                .replace("webrtc://", "http://")
+                .replace("rtc://", "http://");
+
+            var vhost = a.hostname;
+            var app = a.pathname.substring(1, a.pathname.lastIndexOf("/"));
+            var stream = a.pathname.slice(a.pathname.lastIndexOf("/") + 1);
+
+            // parse the vhost in the params of app, that srs supports.
+            app = app.replace("...vhost...", "?vhost=");
+            if (app.indexOf("?") >= 0) {
+                var params = app.slice(app.indexOf("?"));
+                app = app.slice(0, app.indexOf("?"));
+
+                if (params.indexOf("vhost=") > 0) {
+                    vhost = params.slice(params.indexOf("vhost=") + "vhost=".length);
+                    if (vhost.indexOf("&") > 0) {
+                        vhost = vhost.slice(0, vhost.indexOf("&"));
+                    }
+                }
+            }
+
+            // when vhost equals to server, and server is ip,
+            // the vhost is __defaultVhost__
+            if (a.hostname === vhost) {
+                var re = /^(\d+)\.(\d+)\.(\d+)\.(\d+)$/;
+                if (re.test(a.hostname)) {
+                    vhost = "__defaultVhost__";
+                }
+            }
+
+            // parse the schema
+            var schema = "rtmp";
+            if (url.indexOf("://") > 0) {
+                schema = url.slice(0, url.indexOf("://"));
+            }
+
+            var port = a.port;
+            if (!port) {
+                // Finger out by webrtc url, if contains http or https port, to overwrite default 1985.
+                if (schema === 'webrtc' && url.indexOf(`webrtc://${a.host}:`) === 0) {
+                    port = (url.indexOf(`webrtc://${a.host}:80`) === 0) ? 80 : 443;
+                }
+
+                // Guess by schema.
+                if (schema === 'http') {
+                    port = 80;
+                } else if (schema === 'https') {
+                    port = 443;
+                } else if (schema === 'rtmp') {
+                    port = 1935;
+                }
+            }
+
+            var ret = {
+                url: url,
+                schema: schema,
+                server: a.hostname, port: port,
+                vhost: vhost, app: app, stream: stream
+            };
+            self.__internal.fill_query(a.search, ret);
+
+            // For webrtc API, we use 443 if page is https, or schema specified it.
+            if (!ret.port) {
+                if (schema === 'webrtc' || schema === 'rtc') {
+                    if (ret.user_query.schema === 'https') {
+                        ret.port = 443;
+                    } else if (window.location.href.indexOf('https://') === 0) {
+                        ret.port = 443;
+                    } else {
+                        // For WebRTC, SRS use 1985 as default API port.
+                        ret.port = 1985;
+                    }
+                }
+            }
+
+            return ret;
+        },
+        fill_query: function (query_string, obj) {
+            // pure user query object.
+            obj.user_query = {};
+
+            if (query_string.length === 0) {
+                return;
+            }
+
+            // split again for angularjs.
+            if (query_string.indexOf("?") >= 0) {
+                query_string = query_string.split("?")[1];
+            }
+
+            var queries = query_string.split("&");
+            for (var i = 0; i < queries.length; i++) {
+                var elem = queries[i];
+
+                var query = elem.split("=");
+                obj[query[0]] = query[1];
+                obj.user_query[query[0]] = query[1];
+            }
+
+            // alias domain for vhost.
+            if (obj.domain) {
+                obj.vhost = obj.domain;
+            }
+        }
+    };
+
+    self.pc = new RTCPeerConnection(null);
+
+    // Create a stream to add track to the stream, @see https://webrtc.org/getting-started/remote-streams
+    self.stream = new MediaStream();
+
+    // https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/ontrack
+    self.pc.ontrack = function(event) {
+        if (self.ontrack) {
+            self.ontrack(event);
+        }
+    };
+
+    return self;
+}
+
+// Depends on adapter-7.4.0.min.js from https://github.com/webrtc/adapter
+// Async-awat-prmise based SRS RTC Publisher by WHIP.
+function SrsRtcWhipWhepAsync() {
+    var self = {};
+
+    // https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia
+    self.constraints = {
+        audio: true,
+        video: {
+            width: {ideal: 320, max: 576}
+        }
+    };
+
+    // See https://datatracker.ietf.org/doc/draft-ietf-wish-whip/
+    // @url The WebRTC url to publish with, for example:
+    //      http://localhost:1985/rtc/v1/whip/?app=live&stream=livestream
+    self.publish = async function (url) {
+        if (url.indexOf('/whip/') === -1) throw new Error(`invalid WHIP url ${url}`);
+
+        self.pc.addTransceiver("audio", {direction: "sendonly"});
+        self.pc.addTransceiver("video", {direction: "sendonly"});
+
+        if (!navigator.mediaDevices && window.location.protocol === 'http:' && window.location.hostname !== 'localhost') {
+            throw new SrsError('HttpsRequiredError', `Please use HTTPS or localhost to publish, read https://github.com/ossrs/srs/issues/2762#issuecomment-983147576`);
+        }
+        var stream = await navigator.mediaDevices.getUserMedia(self.constraints);
+
+        // @see https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/addStream#Migrating_to_addTrack
+        stream.getTracks().forEach(function (track) {
+            self.pc.addTrack(track);
+
+            // Notify about local track when stream is ok.
+            self.ontrack && self.ontrack({track: track});
+        });
+
+        var offer = await self.pc.createOffer();
+        await self.pc.setLocalDescription(offer);
+        const answer = await new Promise(function (resolve, reject) {
+            console.log("Generated offer: ", offer);
+
+            const xhr = new XMLHttpRequest();
+            xhr.onload = function() {
+                if (xhr.readyState !== xhr.DONE) return;
+                if (xhr.status !== 200 && xhr.status !== 201) return reject(xhr);
+                const data = xhr.responseText;
+                console.log("Got answer: ", data);
+                return data.code ? reject(xhr) : resolve(data);
+            }
+            xhr.open('POST', url, true);
+            xhr.setRequestHeader('Content-type', 'application/sdp');
+            xhr.send(offer.sdp);
+        });
+        await self.pc.setRemoteDescription(
+            new RTCSessionDescription({type: 'answer', sdp: answer})
+        );
+
+        return self.__internal.parseId(url, offer.sdp, answer);
+    };
+
+    // See https://datatracker.ietf.org/doc/draft-ietf-wish-whip/
+    // @url The WebRTC url to play with, for example:
+    //      http://localhost:1985/rtc/v1/whep/?app=live&stream=livestream
+    self.play = async function(url) {
+        if (url.indexOf('/whip-play/') === -1 && url.indexOf('/whep/') === -1) throw new Error(`invalid WHEP url ${url}`);
+
+        self.pc.addTransceiver("audio", {direction: "recvonly"});
+        self.pc.addTransceiver("video", {direction: "recvonly"});
+
+        var offer = await self.pc.createOffer();
+        await self.pc.setLocalDescription(offer);
+        const answer = await new Promise(function(resolve, reject) {
+            console.log("Generated offer: ", offer);
+
+            const xhr = new XMLHttpRequest();
+            xhr.onload = function() {
+                if (xhr.readyState !== xhr.DONE) return;
+                if (xhr.status !== 200 && xhr.status !== 201) return reject(xhr);
+                const data = xhr.responseText;
+                console.log("Got answer: ", data);
+                return data.code ? reject(xhr) : resolve(data);
+            }
+            xhr.open('POST', url, true);
+            xhr.setRequestHeader('Content-type', 'application/sdp');
+            xhr.send(offer.sdp);
+        });
+        await self.pc.setRemoteDescription(
+            new RTCSessionDescription({type: 'answer', sdp: answer})
+        );
+
+        return self.__internal.parseId(url, offer.sdp, answer);
+    };
+
+    // Close the publisher.
+    self.close = function () {
+        self.pc && self.pc.close();
+        self.pc = null;
+    };
+
+    // The callback when got local stream.
+    // @see https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/addStream#Migrating_to_addTrack
+    self.ontrack = function (event) {
+        // Add track to stream of SDK.
+        self.stream.addTrack(event.track);
+    };
+
+    self.pc = new RTCPeerConnection(null);
+
+    // To keep api consistent between player and publisher.
+    // @see https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/addStream#Migrating_to_addTrack
+    // @see https://webrtc.org/getting-started/media-devices
+    self.stream = new MediaStream();
+
+    // Internal APIs.
+    self.__internal = {
+        parseId: (url, offer, answer) => {
+            let sessionid = offer.substr(offer.indexOf('a=ice-ufrag:') + 'a=ice-ufrag:'.length);
+            sessionid = sessionid.substr(0, sessionid.indexOf('\n') - 1) + ':';
+            sessionid += answer.substr(answer.indexOf('a=ice-ufrag:') + 'a=ice-ufrag:'.length);
+            sessionid = sessionid.substr(0, sessionid.indexOf('\n'));
+
+            const a = document.createElement("a");
+            a.href = url;
+            return {
+                sessionid: sessionid, // Should be ice-ufrag of answer:offer.
+                simulator: a.protocol + '//' + a.host + '/rtc/v1/nack/',
+            };
+        },
+    };
+
+    // https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/ontrack
+    self.pc.ontrack = function(event) {
+        if (self.ontrack) {
+            self.ontrack(event);
+        }
+    };
+
+    return self;
+}
+
+// Format the codec of RTCRtpSender, kind(audio/video) is optional filter.
+// https://developer.mozilla.org/en-US/docs/Web/Media/Formats/WebRTC_codecs#getting_the_supported_codecs
+function SrsRtcFormatSenders(senders, kind) {
+    var codecs = [];
+    senders.forEach(function (sender) {
+        var params = sender.getParameters();
+        params && params.codecs && params.codecs.forEach(function(c) {
+            if (kind && sender.track.kind !== kind) {
+                return;
+            }
+
+            if (c.mimeType.indexOf('/red') > 0 || c.mimeType.indexOf('/rtx') > 0 || c.mimeType.indexOf('/fec') > 0) {
+                return;
+            }
+
+            var s = '';
+
+            s += c.mimeType.replace('audio/', '').replace('video/', '');
+            s += ', ' + c.clockRate + 'HZ';
+            if (sender.track.kind === "audio") {
+                s += ', channels: ' + c.channels;
+            }
+            s += ', pt: ' + c.payloadType;
+
+            codecs.push(s);
+        });
+    });
+    return codecs.join(", ");
+}
+

public/webrtc/srs.utility.js

@@ -0,0 +1,8 @@
+/**
+* parse the rtmp url,
+* for example: rtmp://demo.srs.com:1935/live...vhost...players/livestream
+* @return object {server, port, vhost, app, stream}
+*/
+function srs_parse_rtmp_url(rtmp_url) {
+    return parse_rtmp_url(rtmp_url);
+}

public/webrtc/winlin.utility.js

@@ -0,0 +1,686 @@
+// winlin.utility.js
+
+/**
+ * common utilities
+ * depends: jquery1.10
+ * https://gitee.com/winlinvip/codes/rpn0c2ewbomj81augzk4y59
+ * @see: http://blog.csdn.net/win_lin/article/details/17994347
+ * v 1.0.23
+ */
+
+/**
+ * padding the output.
+ * padding(3, 5, '0') is 00003
+ * padding(3, 5, 'x') is xxxx3
+ * @see http://blog.csdn.net/win_lin/article/details/12065413
+ */
+function padding(number, length, prefix) {
+    if(String(number).length >= length){
+        return String(number);
+    }
+    return padding(prefix+number, length, prefix);
+}
+
+/**
+ * extends system array, to remove all specified elem.
+ * @param arr the array to remove elem from.
+ * @param elem the elem to remove.
+ * @remark all elem will be removed.
+ * for example,
+ *      arr = [10, 15, 20, 30, 20, 40]
+ *      system_array_remove(arr, 10) // arr=[15, 20, 30, 20, 40]
+ *      system_array_remove(arr, 20) // arr=[15, 30, 40]
+ */
+function system_array_remove(arr, elem) {
+    if (!arr) {
+        return;
+    }
+
+    var removed = true;
+    var i = 0;
+    while (removed) {
+        removed = false;
+        for (; i < arr.length; i++) {
+            if (elem == arr[i]) {
+                arr.splice(i, 1);
+                removed = true;
+                break;
+            }
+        }
+    }
+}
+
+/**
+ * whether the array contains specified element.
+ * @param arr the array to find.
+ * @param elem_or_function the element value or compare function.
+ * @returns true contains elem; otherwise false.
+ * for example,
+ *      arr = [10, 15, 20, 30, 20, 40]
+ *      system_array_contains(arr, 10) // true
+ *      system_array_contains(arr, 11) // false
+ *      system_array_contains(arr, function(elem){return elem == 30;}); // true
+ *      system_array_contains(arr, function(elem){return elem == 60;}); // false
+ */
+function system_array_contains(arr, elem_or_function) {
+    return system_array_get(arr, elem_or_function) != null;
+}
+
+/**
+ * get the specified element from array
+ * @param arr the array to find.
+ * @param elem_or_function the element value or compare function.
+ * @returns the matched elem; otherwise null.
+ * for example,
+ *      arr = [10, 15, 20, 30, 20, 40]
+ *      system_array_get(arr, 10) // 10
+ *      system_array_get(arr, 11) // null
+ *      system_array_get(arr, function(elem){return elem == 30;}); // 30
+ *      system_array_get(arr, function(elem){return elem == 60;}); // null
+ */
+function system_array_get(arr, elem_or_function) {
+    for (var i = 0; i < arr.length; i++) {
+        if (typeof elem_or_function == "function") {
+            if (elem_or_function(arr[i])) {
+                return arr[i];
+            }
+        } else {
+            if (elem_or_function == arr[i]) {
+                return arr[i];
+            }
+        }
+    }
+    return null;
+}
+
+/**
+ * to iterate on array.
+ * @param arr the array to iterate on.
+ * @param pfn the function to apply on it. return false to break loop.
+ * for example,
+ *      arr = [10, 15, 20, 30, 20, 40]
+ *      system_array_foreach(arr, function(elem, index){
+ *          console.log('index=' + index + ',elem=' + elem);
+ *      });
+ * @return true when iterate all elems.
+ */
+function system_array_foreach(arr, pfn) {
+    if (!pfn) {
+        return false;
+    }
+
+    for (var i = 0; i < arr.length; i++) {
+        if (!pfn(arr[i], i)) {
+            return false;
+        }
+    }
+
+    return true;
+}
+
+/**
+ * whether the str starts with flag.
+ */
+function system_string_startswith(str, flag) {
+    if (typeof flag == "object" && flag.constructor == Array) {
+        for (var i = 0; i < flag.length; i++) {
+            if (system_string_startswith(str, flag[i])) {
+                return true;
+            }
+        }
+    }
+
+    return str && flag && str.length >= flag.length && str.indexOf(flag) == 0;
+}
+
+/**
+ * whether the str ends with flag.
+ */
+function system_string_endswith(str, flag) {
+    if (typeof flag == "object" && flag.constructor == Array) {
+        for (var i = 0; i < flag.length; i++) {
+            if (system_string_endswith(str, flag[i])) {
+                return true;
+            }
+        }
+    }
+
+    return str && flag && str.length >= flag.length && str.indexOf(flag) == str.length - flag.length;
+}
+
+/**
+ * trim the start and end of flag in str.
+ * @param flag a string to trim.
+ */
+function system_string_trim(str, flag) {
+    if (!flag || !flag.length || typeof flag != "string") {
+        return str;
+    }
+
+    while (system_string_startswith(str, flag)) {
+        str = str.slice(flag.length);
+    }
+
+    while (system_string_endswith(str, flag)) {
+        str = str.slice(0, str.length - flag.length);
+    }
+
+    return str;
+}
+
+/**
+ * array sort asc, for example:
+ * [a, b] in [10, 11, 9]
+ * then sort to: [9, 10, 11]
+ * Usage, for example:
+ obj.data.data.sort(function(a, b){
+            return array_sort_asc(a.metadata.meta_id, b.metadata.meta_id);
+        });
+ * @see: http://blog.csdn.net/win_lin/article/details/17994347
+ * @remark, if need desc, use -1*array_sort_asc(a,b)
+ */
+function array_sort_asc(elem_a, elem_b) {
+    if (elem_a > elem_b) {
+        return 1;
+    }
+    return (elem_a < elem_b)? -1 : 0;
+}
+function array_sort_desc(elem_a, elem_b) {
+    return -1 * array_sort_asc(elem_a, elem_b);
+}
+function system_array_sort_asc(elem_a, elem_b) {
+    return array_sort_asc(elem_a, elem_b);
+}
+function system_array_sort_desc(elem_a, elem_b) {
+    return -1 * array_sort_asc(elem_a, elem_b);
+}
+
+/**
+ * parse the query string to object.
+ * parse the url location object as: host(hostname:http_port), pathname(dir/filename)
+ * for example, url http://192.168.1.168:1980/ui/players.html?vhost=player.vhost.com&app=test&stream=livestream
+ * parsed to object:
+ {
+     host        : "192.168.1.168:1980",
+     hostname    : "192.168.1.168",
+     http_port   : 1980,
+     pathname    : "/ui/players.html",
+     dir         : "/ui",
+     filename    : "/players.html",
+
+     vhost       : "player.vhost.com",
+     app         : "test",
+     stream      : "livestream"
+ }
+ * @see: http://blog.csdn.net/win_lin/article/details/17994347
+ */
+function parse_query_string(){
+    var obj = {};
+
+    // add the uri object.
+    // parse the host(hostname:http_port), pathname(dir/filename)
+    obj.host = window.location.host;
+    obj.hostname = window.location.hostname;
+    obj.http_port = (window.location.port == "")? 80:window.location.port;
+    obj.pathname = window.location.pathname;
+    if (obj.pathname.lastIndexOf("/") <= 0) {
+        obj.dir = "/";
+        obj.filename = "";
+    } else {
+        obj.dir = obj.pathname.slice(0, obj.pathname.lastIndexOf("/"));
+        obj.filename = obj.pathname.slice(obj.pathname.lastIndexOf("/"));
+    }
+
+    // pure user query object.
+    obj.user_query = {};
+
+    // parse the query string.
+    var query_string = String(window.location.search).replace(" ", "").split("?")[1];
+    if(query_string === undefined){
+        query_string = String(window.location.hash).replace(" ", "").split("#")[1];
+        if(query_string === undefined){
+            return obj;
+        }
+    }
+
+    __fill_query(query_string, obj);
+
+    return obj;
+}
+
+function __fill_query(query_string, obj) {
+    // pure user query object.
+    obj.user_query = {};
+
+    if (query_string.length === 0) {
+        return;
+    }
+
+    // split again for angularjs.
+    if (query_string.indexOf("?") >= 0) {
+        query_string = query_string.split("?")[1];
+    }
+
+    var queries = query_string.split("&");
+    for (var i = 0; i < queries.length; i++) {
+        var elem = queries[i];
+
+        var query = elem.split("=");
+        obj[query[0]] = query[1];
+        obj.user_query[query[0]] = query[1];
+    }
+
+    // alias domain for vhost.
+    if (obj.domain) {
+        obj.vhost = obj.domain;
+    }
+}
+
+/**
+ * parse the rtmp url,
+ * for example: rtmp://demo.srs.com:1935/live...vhost...players/livestream
+ * @return object {server, port, vhost, app, stream}
+ * for exmaple, rtmp_url is rtmp://demo.srs.com:1935/live...vhost...players/livestream
+ * parsed to object:
+ {
+    server: "demo.srs.com",
+    port: 1935,
+    vhost: "players",
+    app: "live",
+    stream: "livestream"
+ }
+ */
+function parse_rtmp_url(rtmp_url) {
+    // @see: http://stackoverflow.com/questions/10469575/how-to-use-location-object-to-parse-url-without-redirecting-the-page-in-javascri
+    var a = document.createElement("a");
+    a.href = rtmp_url.replace("rtmp://", "http://")
+        .replace("webrtc://", "http://")
+        .replace("rtc://", "http://");
+
+    var vhost = a.hostname;
+    var app = a.pathname.substring(1, a.pathname.lastIndexOf("/"));
+    var stream = a.pathname.slice(a.pathname.lastIndexOf("/") + 1);
+
+    // parse the vhost in the params of app, that srs supports.
+    app = app.replace("...vhost...", "?vhost=");
+    if (app.indexOf("?") >= 0) {
+        var params = app.slice(app.indexOf("?"));
+        app = app.slice(0, app.indexOf("?"));
+
+        if (params.indexOf("vhost=") > 0) {
+            vhost = params.slice(params.indexOf("vhost=") + "vhost=".length);
+            if (vhost.indexOf("&") > 0) {
+                vhost = vhost.slice(0, vhost.indexOf("&"));
+            }
+        }
+    }
+
+    // when vhost equals to server, and server is ip,
+    // the vhost is __defaultVhost__
+    if (a.hostname === vhost) {
+        var re = /^(\d+)\.(\d+)\.(\d+)\.(\d+)$/;
+        if (re.test(a.hostname)) {
+            vhost = "__defaultVhost__";
+        }
+    }
+    
+    // parse the schema
+    var schema = "rtmp";
+    if (rtmp_url.indexOf("://") > 0) {
+        schema = rtmp_url.slice(0, rtmp_url.indexOf("://"));
+    }
+
+    var port = a.port;
+    if (!port) {
+        if (schema === 'http') {
+            port = 80;
+        } else if (schema === 'https') {
+            port = 443;
+        } else if (schema === 'rtmp') {
+            port = 1935;
+        }
+    }
+
+    var ret = {
+        url: rtmp_url,
+        schema: schema,
+        server: a.hostname, port: port,
+        vhost: vhost, app: app, stream: stream
+    };
+    __fill_query(a.search, ret);
+
+    // For webrtc API, we use 443 if page is https, or schema specified it.
+    if (!ret.port) {
+        if (schema === 'webrtc' || schema === 'rtc') {
+            if (ret.user_query.schema === 'https') {
+                ret.port = 443;
+            } else if (window.location.href.indexOf('https://') === 0) {
+                ret.port = 443;
+            } else {
+                // For WebRTC, SRS use 1985 as default API port.
+                ret.port = 1985;
+            }
+        }
+    }
+
+    return ret;
+}
+
+/**
+ * get the agent.
+ * @return an object specifies some browser.
+ *   for example, get_browser_agents().MSIE
+ * @see: http://blog.csdn.net/win_lin/article/details/17994347
+ */
+function get_browser_agents() {
+    var agent = navigator.userAgent;
+
+    /**
+     WindowsPC platform, Win7:
+     chrome 31.0.1650.63:
+     Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36
+     (KHTML, like Gecko) Chrome/31.0.1650.63 Safari/537.36
+     firefox 23.0.1:
+     Mozilla/5.0 (Windows NT 6.1; WOW64; rv:23.0) Gecko/20100101
+     Firefox/23.0
+     safari 5.1.7(7534.57.2):
+     Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/534.57.2
+     (KHTML, like Gecko) Version/5.1.7 Safari/534.57.2
+     opera 15.0.1147.153:
+     Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36
+     (KHTML, like Gecko) Chrome/28.0.1500.95 Safari/537.36
+     OPR/15.0.1147.153
+     360 6.2.1.272:
+     Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.1; WOW64;
+     Trident/6.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729;
+     .NET CLR 3.0.30729; Media Center PC 6.0; InfoPath.2; .NET4.0C;
+     .NET4.0E)
+     IE 10.0.9200.16750(update: 10.0.12):
+     Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.1; WOW64;
+     Trident/6.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729;
+     .NET CLR 3.0.30729; Media Center PC 6.0; InfoPath.2; .NET4.0C;
+     .NET4.0E)
+     */
+
+    return {
+        // platform
+        Android: agent.indexOf("Android") != -1,
+        Windows: agent.indexOf("Windows") != -1,
+        iPhone: agent.indexOf("iPhone") != -1,
+        // Windows Browsers
+        Chrome: agent.indexOf("Chrome") != -1,
+        Firefox: agent.indexOf("Firefox") != -1,
+        QQBrowser: agent.indexOf("QQBrowser") != -1,
+        MSIE: agent.indexOf("MSIE") != -1,
+        // Android Browsers
+        Opera: agent.indexOf("Presto") != -1,
+        MQQBrowser: agent.indexOf("MQQBrowser") != -1
+    };
+}
+
+/**
+ * format relative seconds to HH:MM:SS,
+ * for example, 210s formated to 00:03:30
+ * @see: http://blog.csdn.net/win_lin/article/details/17994347
+ * @usage relative_seconds_to_HHMMSS(210)
+ */
+function relative_seconds_to_HHMMSS(seconds){
+    var date = new Date();
+    date.setTime(Number(seconds) * 1000);
+
+    var ret = padding(date.getUTCHours(), 2, '0')
+        + ":" + padding(date.getUTCMinutes(), 2, '0')
+        + ":" + padding(date.getUTCSeconds(), 2, '0');
+
+    return ret;
+}
+
+/**
+ * format absolute seconds to HH:MM:SS,
+ * for example, 1389146480s (2014-01-08 10:01:20 GMT+0800) formated to 10:01:20
+ * @see: http://blog.csdn.net/win_lin/article/details/17994347
+ * @usage absolute_seconds_to_HHMMSS(new Date().getTime() / 1000)
+ */
+function absolute_seconds_to_HHMMSS(seconds){
+    var date = new Date();
+    date.setTime(Number(seconds) * 1000);
+
+    var ret = padding(date.getHours(), 2, '0')
+        + ":" + padding(date.getMinutes(), 2, '0')
+        + ":" + padding(date.getSeconds(), 2, '0');
+
+    return ret;
+}
+
+/**
+ * format absolute seconds to YYYY-mm-dd,
+ * for example, 1389146480s (2014-01-08 10:01:20 GMT+0800) formated to 2014-01-08
+ * @see: http://blog.csdn.net/win_lin/article/details/17994347
+ * @usage absolute_seconds_to_YYYYmmdd(new Date().getTime() / 1000)
+ */
+function absolute_seconds_to_YYYYmmdd(seconds) {
+    var date = new Date();
+    date.setTime(Number(seconds) * 1000);
+
+    var ret = date.getFullYear()
+        + "-" + padding(date.getMonth() + 1, 2, '0')
+        + "-" + padding(date.getDate(), 2, '0');
+
+    return ret;
+}
+
+/**
+ * parse the date in str to Date object.
+ * @param str the date in str, format as "YYYY-mm-dd", for example, 2014-12-11
+ * @returns a date object.
+ * @usage YYYYmmdd_parse("2014-12-11")
+ */
+function YYYYmmdd_parse(str) {
+    var date = new Date();
+    date.setTime(Date.parse(str));
+    return date;
+}
+
+/**
+ * async refresh function call. to avoid multiple call.
+ * @remark AsyncRefresh is for jquery to refresh the speicified pfn in a page;
+ *      if angularjs, use AsyncRefresh2 to change pfn, cancel previous request for angularjs use singleton object.
+ * @param refresh_interval the default refresh interval ms.
+ * @see: http://blog.csdn.net/win_lin/article/details/17994347
+ * the pfn can be implements as following:
+ var async_refresh = new AsyncRefresh(pfn, 3000);
+ function pfn() {
+            if (!async_refresh.refresh_is_enabled()) {
+                async_refresh.request(100);
+                return;
+            }
+            $.ajax({
+                type: 'GET', async: true, url: 'xxxxx',
+                complete: function(){
+                    if (!async_refresh.refresh_is_enabled()) {
+                        async_refresh.request(0);
+                    } else {
+                        async_refresh.request(async_refresh.refresh_interval);
+                    }
+                },
+                success: function(res){
+                    // if donot allow refresh, directly return.
+                    if (!async_refresh.refresh_is_enabled()) {
+                        return;
+                    }
+
+                    // render the res.
+                }
+            });
+        }
+ */
+function AsyncRefresh(pfn, refresh_interval) {
+    this.refresh_interval = refresh_interval;
+
+    this.__handler = null;
+    this.__pfn = pfn;
+
+    this.__enabled = true;
+}
+/**
+ * disable the refresher, the pfn must check the refresh state.
+ */
+AsyncRefresh.prototype.refresh_disable = function() {
+    this.__enabled = false;
+}
+AsyncRefresh.prototype.refresh_enable = function() {
+    this.__enabled = true;
+}
+AsyncRefresh.prototype.refresh_is_enabled = function() {
+    return this.__enabled;
+}
+/**
+ * start new async request
+ * @param timeout the timeout in ms.
+ *      user can use the refresh_interval of the AsyncRefresh object,
+ *      which initialized in constructor.
+ */
+AsyncRefresh.prototype.request = function(timeout) {
+    if (this.__handler) {
+        clearTimeout(this.__handler);
+    }
+
+    this.__handler = setTimeout(this.__pfn, timeout);
+}
+
+/**
+ * async refresh v2, support cancellable refresh, and change the refresh pfn.
+ * @remakr for angularjs. if user only need jquery, maybe AsyncRefresh is better.
+ * @see: http://blog.csdn.net/win_lin/article/details/17994347
+ * Usage:
+ bsmControllers.controller('CServers', ['$scope', 'MServer', function($scope, MServer){
+            async_refresh2.refresh_change(function(){
+                // 获取服务器列表
+                MServer.servers_load({}, function(data){
+                    $scope.servers = data.data.servers;
+                    async_refresh2.request();
+                });
+            }, 3000);
+
+            async_refresh2.request(0);
+        }]);
+ bsmControllers.controller('CStreams', ['$scope', 'MStream', function($scope, MStream){
+            async_refresh2.refresh_change(function(){
+                // 获取流列表
+                MStream.streams_load({}, function(data){
+                    $scope.streams = data.data.streams;
+                    async_refresh2.request();
+                });
+            }, 3000);
+
+            async_refresh2.request(0);
+        }]);
+ */
+function AsyncRefresh2() {
+    /**
+     * the function callback before call the pfn.
+     * the protype is function():bool, which return true to invoke, false to abort the call.
+     * null to ignore this callback.
+     *
+     * for example, user can abort the refresh by find the class popover:
+     *      async_refresh2.on_before_call_pfn = function() {
+     *          if ($(".popover").length > 0) {
+     *              async_refresh2.request();
+     *              return false;
+     *          }
+     *          return true;
+     *      };
+     */
+    this.on_before_call_pfn = null;
+
+    // use a anonymous function to call, and check the enabled when actually invoke.
+    this.__call = {
+        pfn: null,
+        timeout: 0,
+        __enabled: false,
+        __handler: null
+    };
+}
+// singleton
+var async_refresh2 = new AsyncRefresh2();
+/**
+ * initialize or refresh change. cancel previous request, setup new request.
+ * @param pfn a function():void to request after timeout. null to disable refresher.
+ * @param timeout the timeout in ms, to call pfn. null to disable refresher.
+ */
+AsyncRefresh2.prototype.initialize = function(pfn, timeout) {
+    this.refresh_change(pfn, timeout);
+}
+/**
+ * stop refresh, the refresh pfn is set to null.
+ */
+AsyncRefresh2.prototype.stop = function() {
+    this.__call.__enabled = false;
+}
+/**
+ * restart refresh, use previous config.
+ */
+AsyncRefresh2.prototype.restart = function() {
+    this.__call.__enabled = true;
+    this.request(0);
+}
+/**
+ * change refresh pfn, the old pfn will set to disabled.
+ */
+AsyncRefresh2.prototype.refresh_change = function(pfn, timeout) {
+    // cancel the previous call.
+    if (this.__call.__handler) {
+        clearTimeout(this.__handler);
+    }
+    this.__call.__enabled = false;
+
+    // setup new call.
+    this.__call = {
+        pfn: pfn,
+        timeout: timeout,
+        __enabled: true,
+        __handler: null
+    };
+}
+/**
+ * start new request, we never auto start the request,
+ * user must start new request when previous completed.
+ * @param timeout [optional] if not specified, use the timeout in initialize or refresh_change.
+ */
+AsyncRefresh2.prototype.request = function(timeout) {
+    var self = this;
+    var this_call = this.__call;
+
+    // clear previous timeout.
+    if (this_call.__handler) {
+        clearTimeout(this_call.__handler);
+    }
+
+    // override the timeout
+    if (timeout == undefined) {
+        timeout = this_call.timeout;
+    }
+
+    // if user disabled refresher.
+    if (this_call.pfn == null || timeout == null) {
+        return;
+    }
+
+    this_call.__handler = setTimeout(function(){
+        // cancelled by refresh_change, ignore.
+        if (!this_call.__enabled) {
+            return;
+        }
+
+        // callback if the handler installled.
+        if (self.on_before_call_pfn) {
+            if (!self.on_before_call_pfn()) {
+                return;
+            }
+        }
+
+        // do the actual call.
+        this_call.pfn();
+    }, timeout);
+}
+