YouTube uploader tool

by eprouver

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<script src="//code.jquery.com/jquery-2.1.4.min.js"></script>
<div ng-app="rm">
    <div class="container" ng-controller="videoData as vd">
        <div class="panel panel-default" ng-controller="submitvideo as sv">
            <div class="panel-heading" onclick="$('#enterid').toggleClass('hide')"> <strong><span class="label label-primary">1</span> - Enter YouTube Id</strong>

            </div>
            <div class="panel-body" id="enterid">
                <div class="row">
                    <div class="col-xs-8">
                        <input class="form-control" id="videoId" type="text" ng-model="$root.video.id" />
                    </div>
                    <div class="col-xs-4">
                        <button class="btn btn-success form-control" ng-click="sv.getVideoData($root.video.id)">Load</button>
                    </div>
                </div>
            </div>
        </div>
        <div class="panel panel-default" ng-show="$root.video.contentDetails">
            <div class="panel-heading"> <strong><span class="label label-primary">2</span> - Add Video Data</strong>

            </div>
            <div class="panel-body">
                <div class="form-group">
                    <label>Video Title:</label>
                    <input class="form-control" type="text" ng-model="$root.video.title" />
                </div>
                <div class="form-group">
                    <div class="row">
                        <div class="col-xs-6">
                            <label>Category:</label>
                            <select ng-model="$root.video.category" class="btn btn-default select">
                                <option value="" selected>Recommended Categories</option>
                                <option value="Language Arts">Language Arts</option>
                                <option...

CSS

.addquestion {
    position: relative;
    width: 2em;
    margin-left: -0.7em;
    border: 0;
    background: rgb(92, 184, 92);
    color: white;
    font-weight: bold;
    border-radius: 5px;
    font-size: 2em;
}
.adderrow {
    margin-right: -2px;
    margin-left: -18px;
}
.close {
    text-shadow: none;
    font-weight: normal;
    color: white;
}
.rangerow {
    background: rgb(227, 221, 216);
}
.markrow {
    position: relative;
    margin-right: -4px;
    height: 1.25em;
}
.qmark {
    position: absolute;
    height: 1.7em;
    padding: 0;
    width: 11px;
}
.final {
    font-size: 25px;
    height: auto;
}
select {
    padding: 6px 12px;
    width: 100%;
}

JavaScript

angular.module('rm', []).run(['$rootScope', function ($rootScope) {
    $rootScope.video = {
        id: '6C6IfjsO7yA'
    };
    $rootScope.url = 'http://stage.funler.com';
    $rootScope.overwrite = false;

    $rootScope.video = {
        "kind": "youtube#video",
            "etag": "\"xmg9xJZuZD438sF4hb-VcBBREXc/zyYsOKpoMdZc0GC-iri4TRw8dlc\"",
            "id": "6C6IfjsO7yA",
            "contentDetails": {
            "duration": 289,
                "dimension": "2d",
                "definition": "sd",
                "caption": "false",
                "licensedContent": false
        },
            "questions": []
    };

}]).filter('toTime', function () {
    return function (seconds) {
        if (!seconds) return 0;
        return new Date(1970, 0, 1).setSeconds(seconds);
    };
}).controller('submitvideo', ['$http', '$rootScope', function ($http, $rootScope) {
    this.getVideoData = function (id) {
        $http.get('https://www.googleapis.com/youtube/v3/videos?id=' + id + '&part=contentDetails&key=AIzaSyDGXBSxCZ5txItNYhm3uq3aWQQXGByY2Yo').success(function (res) {
            $rootScope.video = res.items[0];
            var multipliers = [1, 60, 3600];
            //convert ISO time to seconds
            $rootScope.video.contentDetails.duration = $rootScope.video.contentDetails.duration.replace('PT', '')
                .replace('S', '')
                .split(/[a-zA-Z]/)
                .reverse()
                .map(parseFloat)
                .reduce(function (p, c, i) {
                return p + (c * multipliers[i]);
            }, 0);
            $rootScope.video.questions = [];
            $rootScope.video.title = 'untitled';
            $rootScope.video.targetAge = 6;
            $rootScope.video.goal = 80;
            console.log(JSON.stringify($rootScope.video));
        }).error(function () {
            alert('No Video Available: Try Another ID')
        })
    }
}])
    .controller('videoData', ['$scope', '$rootScope', '$http',...