CopterCode/index.html at master · CoderDojoCHS/CopterCode · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
<!doctype html>
<html ng-app="App">
  <head>
    <title>CopterCode</title>
    <link rel="stylesheet" href="app/components/bootstrap/docs/assets/css/bootstrap.css">
    <link rel="stylesheet" href="app/components/codemirror/lib/codemirror.css">
    <link rel="stylesheet" href="app/components/codemirror/theme/monokai.css" type="text/css" media="screen" title="no title" charset="utf-8">
    <style>
      body {
        margin-top: 70px;
      }
      .CodeMirror {
        border: 1px solid #eee;
        height: auto;
      }
      .CodeMirror-scroll {
        overflow-y: hidden;
        overflow-x: auto;
      }
    </style>
  </head>
  <body ng-controller="MainCtrl">
    <div class="navbar navbar-inverse navbar-fixed-top">
      <div class="navbar-inner">
        <div class="container">
          <a class="brand" href="#">CopterCode</a>
          <!-- <button class="btn pull-right" ng-click="cmds()">Commands</button> -->
        </div>
      </div>
    </div>
    <div class="container">
      <div class="row" style="margin-bottom: 20px;">
        <div class="btn-toolbar">
          <div class="btn-group pull-right">
            <button class="btn" ng-click="reset()">Reset</button>
            <button class="btn" ng-click="stop()">Stop</button>
            <button class="btn" ng-click="run()">Run</button>
            <button class="btn" ng-click="save()">Save</button>
          </div>
        </div>
      </div>
      <div class="row" >

      </div>
      <div class="row" >
        <div class="well span4">
          <table class="table">
            <tr>
              <th>Commands</th>
            </tr>
            <tr><td>takeoff(callback)</td></tr>
            <tr><td>land(callback)</td></tr>
            <tr><td>up(speed)</td></tr>
            <tr><td>down(speed)</td></tr>
            <tr><td>front(speed)</td></tr>
            <tr><td>back(speed)</td></tr>
            <tr><td>clockwise(speed)</td></tr>
            <tr><td>counterClockwise(speed)</td></tr>
            <tr><td>stop()</td></tr>
            <tr><td>calibrate(device_num)</td></tr>
            <tr>
              <td>
                animate(animation, duration)
                <ul>
                  <li>phiM30Deg</li>
                  <li>phi30Deg</li>
                  <li>thetaM30Deg</li>
                  <li>thetaM30Deg</li>
                  <li>theta20degYaw200deg</li>
                  <li>theta20degYawM200deg</li>
                  <li>turnaround</li>
                  <li>turnaroundGodown</li>
                  <li>yawShake</li>
                  <li>yawDance</li>
                  <li>phiDance</li>
                  <li>thetaDance</li>
                  <li>vzDance</li>
                  <li>wave</li>
                  <li>phiThetaMixed</li>
                  <li>doublePhiThetaMixed</li>
                  <li>flipAhead</li>
                  <li>flipBehind</li>
                  <li>flipLeft</li>
                  <li>flipRight</li>

                </ul>
                <code>client.animate('flipLeft', 1500);</code>
                <br />
                <small>Please note that the drone will need a good amount of altitude and headroom to perform a flip. So be careful!</small>
              </td>
            </tr>

          </table>
          <h3>client.takeoff(callback)</h3>
          <p>Sets the internal fly state to true, callback is invoked after the drone reports that it is hovering.</p>
          <h3>client.land(callback)</h3>
          <p>Sets the internal fly state to false, callback is invoked after the drone reports it has landed.</p>

        </div>
        <div class="span7">
          <div class="alert alert-danger" style="font-size: .7em;color: darkred" ng-show="errors">
            <p ng-repeat="err in errors">
              (L{{err.line}}:C{{err.character}}) {{err.reason}}
            </p>
          </div>
          <div style="font-size: 1.2em;">
            <textarea style="height: 2000px;width: 100%;" ui-codemirror="{
              lineNumbers: true,
              mode: 'javascript'
            }" ng-model="code"></textarea>
          </div>
        </div>
      </div>
    </div>
    <script src="app/components/codemirror/lib/codemirror.js"></script>
    <script src="app/components/codemirror/mode/javascript/javascript.js" type="text/javascript" charset="utf-8"></script>

    <script src="app/components/angular/angular.js"></script>
    <script src="app/components/angular-ui-codemirror/ui-codemirror.js"></script>
    <script src="app/index.js"></script>
  </body>
</html>