<!--
  ~ Licensed to the Apache Software Foundation (ASF) under one or more
  ~ contributor license agreements.  See the NOTICE file distributed with
  ~ this work for additional information regarding copyright ownership.
  ~ The ASF licenses this file to You under the Apache License, Version 2.0
  ~ (the "License"); you may not use this file except in compliance with
  ~ the License.  You may obtain a copy of the License at
  ~
  ~    http://www.apache.org/licenses/LICENSE-2.0
  ~
  ~ Unless required by applicable law or agreed to in writing, software
  ~ distributed under the License is distributed on an "AS IS" BASIS,
  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  ~ See the License for the specific language governing permissions and
  ~ limitations under the License.
  ~
  -->

<div flex="100" layout="column">
    <div flex="100" layout="row" style="border-bottom:1px solid #ccc">
        <div layout="row">
            <md-menu-bar>
                <md-menu>
                    <button ng-click="$mdOpenMenu()" style="color: rgb(63, 81, 181);">
                        <md-icon md-svg-icon="content:ic_add_circle_outline_24px"
                                 style="color: rgb(63,81,181);"></md-icon>
                        Create new source
                    </button>
                    <md-menu-content>
                        <md-menu-item class="md-indent">
                            <md-button ng-click="ctrl.addNewSource()">&nbsp;New model</md-button>
                        </md-menu-item>
                        <md-menu-item class="md-indent">
                            <md-menu>
                                <md-button ng-click="$mdOpenMenu()">Create from existing model</md-button>
                                <md-menu-content>
                                    <div ng-repeat="(pointer, source) in ctrl.sources track by $index">
                                        <md-menu-item class="md-indent">

                                            <md-button ng-click="ctrl.getSourceDetailsFromOntology(source.uri)">
                                                &nbsp;{{source.name}}
                                            </md-button>
                                        </md-menu-item>
                                    </div>
                                </md-menu-content>
                            </md-menu>
                        </md-menu-item>
                    </md-menu-content>
                </md-menu>
            </md-menu-bar>
        </div>
        <div layout="row">
            <md-menu-bar>
                <md-menu>
                    <button ng-click="$mdOpenMenu()" style="color: rgb(63, 81, 181);">
                        <md-icon md-svg-icon="file:ic_folder_open_24px"
                                 style="color: rgb(63,81,181);"></md-icon>
                        View existing sources
                    </button>
                    <md-menu-content>
                        <div ng-repeat="(pointer, source) in ctrl.sources track by $index">
                            <md-menu-item class="md-indent">
                                <md-button ng-click="ctrl.loadSourceDetails(pointer)">&nbsp;{{source.name}}
                                </md-button>
                            </md-menu-item>
                        </div>
                    </md-menu-content>
                </md-menu>
            </md-menu-bar>
        </div>
        <span flex></span>
        <div layout="row" layout-align="center center">
            <md-switch ng-model="showHints" style="margin:0px;margin-right:20%">{{ctrl.showHints ? "Showing
                hints" : "Hiding hints"}}
            </md-switch>
        </div>
    </div>
</div>