alexisylchan/oscon_angularjs_tutorial_v1

## oscon_angularjs_tutorial_v1
<html>

<head>
    <script type="text/javascript" src="angular.js"></script>
    <script type="text/javascript">
        function PlaylistCtrl($scope) {
            $scope.currentSong = 'Wish you were here';
            $scope.currentPlaylistName = '';
            $scope.playlist = [];
            $scope.playlistMap = {};
            $scope.addSong = function () {
                $scope.playlist.push($scope.currentSong);
                $scope.currentSong = null;
            };
            $scope.removeSong = function (song) {
                $scope.playlist.splice($scope.playlist.indexOf(song), 1);
            }
            $scope.savePlaylist = function () {
                // Add all songs in playlist to the map keyed by playlist name
                $scope.playlistMap[$scope.currentPlaylistName] = $scope.playlist;
                // Clear
                $scope.currentPlaylistName = null;
                $scope.playlist = [];
            }
        }
    </script>
</head>

<body ng-app>
    <div ng-controller='PlaylistCtrl'>
        <input type='text' ng-model='currentSong'></input>
        <button type='button' ng-click='addSong()'>Add song</button>
        <br />
        <input type='text' ng-model='currentPlaylistName'></input>
        <button type='button' ng-click='savePlaylist()'>Save</button>
        <h1> Songs </h1>
        <ul>
            <li ng-repeat='song in playlist'>{{song}}
                <button type='button' ng-click='removeSong(song)'>Remove song</button>
            </li>
        </ul>
        <h1> Playlist Names </h1>
        <ul>
            <li ng-repeat='(playlistName, songNames) in playlistMap'>
                {{ playlistName }}
                <ul>
                    <li ng-repeat='song in songNames'>{{ song }}</li>
                </ul>
            </li>
        </ul>
    </div>
</body>

</html>
	<html>

	<head>
	<script type="text/javascript" src="angular.js"></script>
	<script type="text/javascript">
	function PlaylistCtrl($scope) {
	$scope.currentSong = 'Wish you were here';
	$scope.currentPlaylistName = '';
	$scope.playlist = [];
	$scope.playlistMap = {};
	$scope.addSong = function () {
	$scope.playlist.push($scope.currentSong);
	$scope.currentSong = null;
	};
	$scope.removeSong = function (song) {
	$scope.playlist.splice($scope.playlist.indexOf(song), 1);
	}
	$scope.savePlaylist = function () {
	// Add all songs in playlist to the map keyed by playlist name
	$scope.playlistMap[$scope.currentPlaylistName] = $scope.playlist;
	// Clear
	$scope.currentPlaylistName = null;
	$scope.playlist = [];
	}
	}
	</script>
	</head>

	<body ng-app>
	<div ng-controller='PlaylistCtrl'>
	<input type='text' ng-model='currentSong'></input>
	<button type='button' ng-click='addSong()'>Add song</button>
	<br />
	<input type='text' ng-model='currentPlaylistName'></input>
	<button type='button' ng-click='savePlaylist()'>Save</button>
	<h1> Songs </h1>
	<ul>
	<li ng-repeat='song in playlist'>{{song}}
	<button type='button' ng-click='removeSong(song)'>Remove song</button>
	</li>
	</ul>
	<h1> Playlist Names </h1>
	<ul>
	<li ng-repeat='(playlistName, songNames) in playlistMap'>
	{{ playlistName }}
	<ul>
	<li ng-repeat='song in songNames'>{{ song }}</li>
	</ul>
	</li>
	</ul>
	</div>
	</body>

	</html>