<div>
    <button class="button"  ng:click="selectVideos()">{{$resource('videos.select..')}}</button>
    <ul>
        <li ng:repeat="selected in selectedItems">{{selected.Title}}</li>
    </ul>
    <div qn:dialog="ui.dialogSelect" style="padding: 0">
        <div class="toolbar cfix">
            <div class="toolbar-group">
                <h3>{{$resource('videos.select_videos')}}</h3>
            </div>
            <div class="toolbar-group right">
                <select ng:Model="selectedLibrary">
                    <option value="0"  selected ng:click="getAll()">{{$resource('videos.all_libraries')}}</option>
                    <option value="{{library.ID}}" ng:repeat="library in libraries">{{library.Title}}</option>
                </select>
            </div>
        </div>
        <div style="height: 400px; overflow: auto;">
            <ul qn:Selector="options"  ng:model="videos" >
                <li ng:repeat="video in videos" class="ui-state-default" style="padding: 5px">
                    {{video.Title}}
                </li>
            </ul>
        </div>
        <div style="margin-top: 15px">
            <button class="button lightblue" ng:click="doneSelection()"><i class="icon-ok"></i> {{$resource('videos.save')}}</button> or <button class="button" ng:click="cancelSeletion()">{{$resource('videos.cancel')}}</button>
        </div>
    </div>
</div>
