Skip to content

Instantly share code, notes, and snippets.

@mailtruck
Created June 22, 2012 22:18
Show Gist options
  • Save mailtruck/2975520 to your computer and use it in GitHub Desktop.
Save mailtruck/2975520 to your computer and use it in GitHub Desktop.
rawr
<!DOCTYPE html>
<html ng-app="Notes">
<head>
<title> Simple and Delightful Notes Everywhere</title>
<%= stylesheet_link_tag "application", :media => "all" %>
<%= csrf_meta_tags %>
<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame -->
<!-- Mobile Viewport Fix
j.mp/mobileviewport davidbcalhoun.com/2010/viewport-metatag
device-width : Occupy full width of the screen in its current orientation
initial-scale = 1.0 retains dimensions instead of zooming out if page height > device height
maximum-scale = 1.0 retains dimensions instead of zooming in if page width < device width
-->
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<!-- enable html5 web app for ios -->
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
</head>
<body class= "container">
<div ng-controller="NotesCtrl" ng-init="init()">
<form class="row omniform" ng-submit="newNote(omni)">
<button id="mobile" class="button nice large west list-toggle hide-on-desktops"><i class="icon-list"></i></button>
<fieldset>
<!--fuck yea omnibar -->
<!-- *****^****** -->
<!-- ****/_@_\***** -->
<input ng-model="omni" type="text"
class="input-text large oversize omni expand" placeholder="search or create">
</fieldset>
</form>
<div class="row">
<!-- WE DO IT BIG IN THE WEST (left sidebar) -->
<!-- ******************************* -->
<div class="three columns command phone-four">
<dl class="vertical tabs row" >
<!-- NG REPEAT -->
<!-- ******************************* -->
<dd ng-repeat="note in notes | filter:omni | orderBy:sortby">
<a ng-click="loadNote(note)" >
<strong ng-bind="note.title"><!-- title --></strong>
<i class="east icon-edit icon-large"></i>
<!-- ______________________ -->
<!-- V***DEBUG REMOVE ME***V -->
<!-- <span class="round white label">{{note.id}}</span> -->
<!-- Not Debug But I need To Fix The Format Of The Dates -->
<!-- <small class="updated" ng-bind="note.updated_at"> --><!-- updated --> <!--
</small> --> <p><small class="west updated" ng-bind="note.updated_at"> </small></p>
</a>
</dd>
</dl>
<form class="listsort custom row show-on-desktops" ng-init="sortby = '-updated_at'">
<fieldset>
<select ng-model="sortby" class="hide">
<option ng-selected="selected" value="-updated_at">order by modified</option>
<option value="title">order by name</option>
<option value="-created_at">order by date created</option>
</select>
<div class="custom dropdown"><a href="#" class="current">order by modified</a><a href="#" class="selector icon-chevron-up"></a><ul><li class="selected">order by modified</li><li>order by name</li><li>order by date created</li></ul></div>
</fieldset>
</form>
</div>
<form class="five columns phone-four notearea ">
<!-- Debug fields REMOVE ME -->
<!--<input type="text" ng-model="current">
<input type="text" ngModel="locationPath"> -->
<input ng-change="saveNote(currentNote)" placeholder="no note selected" class="title input-text expand" ng-model="currentNote.title" type="text">
<textarea ng-change="saveNote(currentNote)"
class="input-text expand content" ng-model="currentNote.content" onFocus="this.value = this.value;">
</textarea>
<input type ="submit" class="hidden">
</form>
<div class="four columns mdpane hide-on-phones">
<div class="panel">
<markdown>
### markdown Preview
* this is a list item
* this is a list item
</markdown>
</div>
</div>
</div>
<div class="controls" ng-show="currentNote || ghostNote"
>
<!-- Controls Below Note Area -->
<!-- ***************************** -->
<i class="icon-trash icon-large east red" ng-click="triggerDeleteModal()"
data-confirm="u sure?" ng-click="delete(notes[current].id)" title="Delete {{currentNote.title}}" data-dismissmodalclass="cancel-delete-modal"></i>
<a href="#" ng-click="triggerMdCodeModal()" class=" button nice show-on-desktops small east white">&lt; ></a>
<div class="alert-box undo" ng-show="ghostNote != null"> <strong>POW!</strong> Wow, you deleted that note <span class="red">"{{ghostNote.title}}"</span> so hard! This is seriously your last chance to undo:
<a href="#" ng-click="resurrectGhostNote()">click here to undo</a>
<a href="#" ng-click="dismissUndo()">dismiss</button>
</div>
</div>
<!-- Modal For Delete Confirmation -->
<!-- ****************************************** -->
<div id="deleteModal" class="reveal-modal">
<h2><i class="icon-exclamation-sign red"></i>
Srsly delete note: <span class="red">{{currentNote.title}}</span>?
</h2>
<p class="lead highlight">Once it's gone, it's gone.</p>
<p>We're working on an archive feature and versioning, but for now be careful.</p>
<button class="button nice red west" ng-click="destroyNote(currentNote)">
<i class="icon-trash"></i> goodbye forever! (delete)
</button>
<button class="cancel-delete-modal button nice white west">
<i class="icon-arrow-up"></i> get me outa here
</button>
<a class="close-reveal-modal cancel-delete-modal">&#215;</a>
</div>
</div>
<textarea id="md-code-modal" class="reveal-modal">
md code goes here
</textarea>
<!-- <div class="reveal-modal" id="yield-modal"> -->
<!-- <%= yield %> -->
<!-- </div> -->
<%= javascript_include_tag "application" %>
<script>document.write('<script src="http://' + (location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1"></' + 'script>')</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment