D3 Examples - pyNXrp

xxxxxxxxxx
 
<body ng-app>
  <div class="container">
    {{3.14159265359 | currency}}
    <br>
    {{3.14159265359 | currency : "€ "}}
    
    <h3>Say Anything</h3>
    <input type="text" ng-model="anything">
    <p>Yelling: <b>{{ anything | uppercase }}</b></p>
    <p>Whispering: <em>{{ anything | lowercase }}</em></p>
    
    {{3.14159265359 | number:3}}<br>
    {{3.14159265359 | number:6}}<br>
    {{3.14159265359 | number:1}}<br>
    <label for="piPreference">How many sices of pi do you want?</label>
    <select name="piPreference" ng-model="pi">
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="3">3</option>
      <option value="4">4</option>
      <option value="5">5</option>
      <option value="6">6</option>
      <option value="7">7</option>
    </select>
    <br>
    <p>Cool, {{pi}} slices coming up...</p>
    {{3.14159265359 | number: pi}}
<!--     then use ngPluralize -->
    
    <h1>Tip Calculator</h1>
    <label for="cost">Meal Cost</label>
    <input name="cost" ng-model="cost"/><br>
    <label for="tip">Tip</label>
    <select ng-model="tip">
      <option value=".10">10%</option>
      <option value=".15">15%</option>
      <option value=".20">20%</option>
    </select>
    <h3>Subtotal: {{ (1 * cost) * (1 * tip) + (1 * cost) | currency }}</h3>
    <h3>Tip: {{ (1 * cost) * (1 * tip) | currency }}</h3>
    
    <h3>Please fill out!</h3>
   <form class="madForm">
    <fieldset class="form-group">
      <label for="boyName">Boy's Name</label>
      <input name="boyName" ng-model="boyName"/>
    </fieldset>
    <fieldset class="form-group">
      <label for="adjective">Adjective</label>
      <input name="adjective" ng-model="adjective"/>
    </fieldset>
    <fieldset class="form-group">
      <label for="">Plural Noun</label>
      <input name="" ng-model="pluralNoun1"/>
    </fieldset>
    <fieldset class="form-group">
      <label for="pluralNoun2">Plural Noun</label>
      <input name="pluralNoun2" ng-model="pluralNoun2"/>
    </fieldset>
    <fieldset class="form-group">
      <label for="pluralInsect">Insect (plural)</label>
      <input name="pluralInsect" ng-model="pluralInsect"/>
    </fieldset>    
    <fieldset class="form-group">
      <label for="pluralNoun3">Plural Noun</label>
      <input name="pluralNoun3" ng-model="pluralNoun3"/>
    </fieldset>    
    <fieldset class="form-group">
      <label for="verbs">Verb ending in 's'</label>
      <input name="verbs" ng-model="verbs"/>
    </fieldset>     
    <button type="submit" class="btn btn-primary btn-lg" ng-click="generate=true">Generate!</button>
  </form>
    <div ng-show="generate">
      <h1>Mad with the libs</h1>
      <h3>I'm in love with <span>{{boyName}}</span>. He's so <span>{{adjective}}</span>! He has big flat <span>{{pluralNoun1}}</span>, and when our <span>{{pluralNoun2}}</span> meet, I get <span>{{pluralInsect}}</span> in my stomach. I've fallen for him like a ton of <span>{{pluralNoun3}}</span>, and he <span>{{verbs}}</span> for me, too. But I think he's got another girlfriend. What should I do?</h3>
    </div>
    
  </div>
</body>
    