Skip to content

Instantly share code, notes, and snippets.

@studio3104

studio3104/ng-muzukashii.html

Created December 31, 2013 07:26
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save studio3104/8193684 to your computer and use it in GitHub Desktop.
Save studio3104/8193684 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
ng-muzukashii.html
<!DOCTYPE html>
<html lang="en" ng-app="">
<head>
<meta charset="UTF-8" />
<link href="/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<link href="/css/bootstrap-theme.min.css" rel="stylesheet" type="text/css" />
<style type="text/css">
body { padding-top: 70px; }
</style>
</head>
<body>
<header class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button class="navbar-toggle" data-target=".bs-navbar-collapse" data-toggle="collapse" type="button"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a class="navbar-brand" href="/">鉈</a>
</div>
<div class="collapse navbar-collapse bs-navbar-collapse" role="navigation">
<ul class="nav navbar-nav">
<li>
<a class="droppedHover" href="#">Getting started</a>
</li>
<li>
<a href="#">Editor</a>
</li>
<li>
<a href="#">Visual Builder</a>
</li>
<li>
<a href="#">Community</a>
</li>
</ul>
</div>
</div>
</header>
<div class="container">
<div class="row">
<form name="indexForm" ng-controller="indexCtrl">
<div class="col-md-3">
<div class="panel-group" id="accordion1">
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-parent="#accordion1" data-toggle="collapse" href="#collapse1">
<div>
host1
</div>
</a>
</h4>
</div>
<div class="panel-collapse collapse in" id="collapse1">
<div class="panel-body">
<div class="btn-group-justified">
<label class="btn btn-default"><input ng-false-value="" ng-model="host1_db1" ng-true-value="host1: db1" type="checkbox" value="{host:host1, db:db1}">
<div>
db1
</div>
</input></label>
</div>
<div class="btn-group-justified">
<label class="btn btn-default"><input ng-false-value="" ng-model="host1_db2" ng-true-value="host1: db2" type="checkbox" value="{host:host1, db:db2}">
<div>
db2
</div>
</input></label>
</div>
<div class="btn-group-justified">
<label class="btn btn-default"><input ng-false-value="" ng-model="host1_db3" ng-true-value="host1: db3" type="checkbox" value="{host:host1, db:db3}">
<div>
db3
</div>
</input></label>
</div>
</div>
</div>
</div>
</div><div class="panel-group" id="accordion4">
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-parent="#accordion4" data-toggle="collapse" href="#collapse4">
<div>
host2
</div>
</a>
</h4>
</div>
<div class="panel-collapse collapse in" id="collapse4">
<div class="panel-body">
<div class="btn-group-justified">
<label class="btn btn-default"><input ng-false-value="" ng-model="host2_db1" ng-true-value="host2: db1" type="checkbox" value="{host:host2, db:db1}">
<div>
db1
</div>
</input></label>
</div>
<div class="btn-group-justified">
<label class="btn btn-default"><input ng-false-value="" ng-model="host2_db2" ng-true-value="host2: db2" type="checkbox" value="{host:host2, db:db2}">
<div>
db2
</div>
</input></label>
</div>
<div class="btn-group-justified">
<label class="btn btn-default"><input ng-false-value="" ng-model="host2_db3" ng-true-value="host2: db3" type="checkbox" value="{host:host2, db:db3}">
<div>
db3
</div>
</input></label>
</div>
<div class="btn-group-justified">
<label class="btn btn-default"><input ng-false-value="" ng-model="host2_ddatabase001" ng-true-value="host2: ddatabase001" type="checkbox" value="{host:host2, db:ddatabase001}">
<div>
ddatabase001
</div>
</input></label>
</div>
<div class="btn-group-justified">
<label class="btn btn-default"><input ng-false-value="" ng-model="host2_ddatabase002" ng-true-value="host2: ddatabase002" type="checkbox" value="{host:host2, db:ddatabase002}">
<div>
ddatabase002
</div>
</input></label>
</div>
<div class="btn-group-justified">
<label class="btn btn-default"><input ng-false-value="" ng-model="host2_ddatabase003" ng-true-value="host2: ddatabase003" type="checkbox" value="{host:host2, db:ddatabase003}">
<div>
ddatabase003
</div>
</input></label>
</div>
<div class="btn-group-justified">
<label class="btn btn-default"><input ng-false-value="" ng-model="host2_ddatabase004" ng-true-value="host2: ddatabase004" type="checkbox" value="{host:host2, db:ddatabase004}">
<div>
ddatabase004
</div>
</input></label>
</div>
<div class="btn-group-justified">
<label class="btn btn-default"><input ng-false-value="" ng-model="host2_ddatabase005" ng-true-value="host2: ddatabase005" type="checkbox" value="{host:host2, db:ddatabase005}">
<div>
ddatabase005
</div>
</input></label>
</div>
</div>
</div>
</div>
</div><div class="panel-group" id="accordion9">
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-parent="#accordion9" data-toggle="collapse" href="#collapse9">
<div>
host3
</div>
</a>
</h4>
</div>
<div class="panel-collapse collapse in" id="collapse9">
<div class="panel-body">
<div class="btn-group-justified">
<label class="btn btn-default"><input ng-false-value="" ng-model="host3_db1" ng-true-value="host3: db1" type="checkbox" value="{host:host3, db:db1}">
<div>
db1
</div>
</input></label>
</div>
</div>
</div>
</div>
</div><div class="panel-group" id="accordion10">
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-parent="#accordion10" data-toggle="collapse" href="#collapse10">
<div>
host4
</div>
</a>
</h4>
</div>
<div class="panel-collapse collapse in" id="collapse10">
<div class="panel-body">
<div class="btn-group-justified">
<label class="btn btn-default"><input ng-false-value="" ng-model="host4_db1" ng-true-value="host4: db1" type="checkbox" value="{host:host4, db:db1}">
<div>
db1
</div>
</input></label>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-9">
<div class="sidebar-nav affix" role="complementary">
<h3>
Control
</h3>
<hr />
<h3>
Choiced
</h3>
<div>
{{host1_db1}}
</div>
<div>
{{host1_db2}}
</div>
<div>
{{host1_db3}}
</div>
<div>
{{host2_db1}}
</div>
<div>
{{host2_db2}}
</div>
<div>
{{host2_db3}}
</div>
<div>
{{host2_ddatabase001}}
</div>
<div>
{{host2_ddatabase002}}
</div>
<div>
{{host2_ddatabase003}}
</div>
<div>
{{host2_ddatabase004}}
</div>
<div>
{{host2_ddatabase005}}
</div>
<div>
{{host3_db1}}
</div>
<div>
{{host4_db1}}
</div>
</div>
</div>
</form>
<script type="text/javascript">
function indexCtrl($scope) {
}
</script>
</div>
<footer class="footer">
<div class="pull-right">
Copyright © 2013
</div>
</footer>
</div>
<script src="/js/jquery-2.0.3.min.js" type="text/javascript"></script>
<script src="/js/bootstrap.min.js" type="text/javascript"></script>
<script src="/js/angular.min.js" type="text/javascript"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment