Merge pull request #112 from rickcarlino/master

Remove restangular.js, Possible solution for presenting of sequence types in list
pull/122/head
Rick Carlino 2014-12-18 18:10:40 -07:00
commit 3ff7576d1d
3 changed files with 360 additions and 1301 deletions

File diff suppressed because it is too large Load Diff

View File

@ -1,7 +1,6 @@
//= require lodash
//= require skynet
//= require angular/angular
//= require angular/restangular
//= require angular/angular-route
//= require ng-rails-csrf
//= require farmbot_app/farmbot

View File

@ -0,0 +1,360 @@
one =
"""
<div class="row">
<div class="small-12 columns">
<div class="row">
<div class="small-12 columns">
<nav class="top-bar gray" data-topbar role="navigation">
<ul class="title-area">
<li class="name">
<h1><a href="#">WAIT</a></h1>
</li>
</ul>
<div class="icon-group">
<a href="#"><i class="fa fa-angle-up"></i></a>&nbsp;
<a href="#"><i class="fa fa-trash"></i></a>&nbsp;
<a href="#"><i class="fa fa-clipboard"></i></a>&nbsp;
<a href="#"><i class="fa fa-bars"></i></a>
</div>
</nav>
</div>
</div>
</div>
</div>
"""
changeThis =
"""
<div class="row">
<div class="small-12 columns">
<div class="row">
<div class="small-12 columns">
<nav class="top-bar green" data-topbar role="navigation">
<ul class="title-area">
<li class="name">
<h1><a href="#">MOVE RELATIVE</a></h1>
</li>
</ul>
<div class="icon-group">
<a href="#"><i class="fa fa-angle-up"></i></a>&nbsp;
<a href="#"><i class="fa fa-trash"></i></a>&nbsp;
<a href="#"><i class="fa fa-clipboard"></i></a>&nbsp;
<a href="#"><i class="fa fa-bars"></i></a>
</div>
</nav>
</div>
</div>
<div class="row">
<div class="large-2 columns">
<div class="row collapse prefix-radius">
<div class="small-3 columns">
<span class="prefix">X</span>
</div>
<div class="small-9 columns">
<input type="text" placeholder="25 mm">
</div>
</div>
</div>
<div class="large-2 columns">
<div class="row collapse prefix-radius">
<div class="small-3 columns">
<span class="prefix">Y</span>
</div>
<div class="small-9 columns">
<input type="text" placeholder="20 mm">
</div>
</div>
</div>
<div class="large-2 columns">
<div class="row collapse prefix-radius">
<div class="small-3 columns">
<span class="prefix">Z</span>
</div>
<div class="small-9 columns">
<input type="text" placeholder="0 mm">
</div>
</div>
</div>
<div class="large-6 columns">
<div class="row collapse prefix-radius">
<div class="small-3 columns">
<span class="prefix">SPEED</span>
</div>
<div class="small-7 columns">
<input type="text" placeholder="Default">
</div>
<div class="small-2 columns">
<button href="#" data-dropdown="drop1" aria-controls="drop1" aria-expanded="false" class="tiny button postfix dropdown light-gray"></button>
<ul id="drop1" data-dropdown-content class="f-dropdown" aria-hidden="true" tabindex="-1">
<li><a href="#">This is a link</a></li>
<li><a href="#">This is another</a></li>
<li><a href="#">Yet another</a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
"""
changeThis =
"""
<div class="row">
<div class="small-12 columns">
<div class="row">
<div class="small-12 columns">
<nav class="top-bar orange" data-topbar role="navigation">
<ul class="title-area">
<li class="name">
<h1><a href="#">WRITE PIN</a></h1>
</li>
</ul>
<div class="icon-group">
<a href="#"><i class="fa fa-angle-up"></i></a>&nbsp;
<a href="#"><i class="fa fa-trash"></i></a>&nbsp;
<a href="#"><i class="fa fa-clipboard"></i></a>&nbsp;
<a href="#"><i class="fa fa-bars"></i></a>
</div>
</nav>
</div>
</div>
<div class="row">
<div class="large-4 columns">
<div class="row collapse prefix-radius">
<div class="small-6 columns">
<span class="prefix uppercase">pin-number</span>
</div>
<div class="small-6 columns">
<input type="text" placeholder="10">
</div>
</div>
</div>
<div class="large-4 columns">
<div class="row collapse prefix-radius">
<div class="small-6 columns">
<span class="prefix uppercase">value</span>
</div>
<div class="small-6 columns">
<input type="text" placeholder="1">
</div>
</div>
</div>
<div class="large-4 columns">
<div class="row collapse prefix-radius">
<div class="small-6 columns">
<span class="prefix uppercase">pin-mode</span>
</div>
<div class="small-6 columns">
<input type="text" placeholder="0">
</div>
</div>
</div>
</div>
</div>
</div>
"""
changeThis =
"""
<div class="row">
<div class="small-12 columns">
<div class="row">
<div class="small-12 columns">
<nav class="top-bar blue" data-topbar role="navigation">
<ul class="title-area">
<li class="name">
<h1><a href="#">MOVE ABSOLUTE</a></h1>
</li>
</ul>
<div class="icon-group">
<a href="#"><i class="fa fa-angle-up"></i></a>&nbsp;
<a href="#"><i class="fa fa-trash"></i></a>&nbsp;
<a href="#"><i class="fa fa-clipboard"></i></a>&nbsp;
<a href="#"><i class="fa fa-bars"></i></a>
</div>
</nav>
</div>
</div>
<div class="row">
<div class="large-8 columns">
<div class="row collapse prefix-radius">
<div class="small-2 columns">
<span class="prefix uppercase">x</span>
</div>
<div class="small-8 columns">
<input type="text" placeholder="Inherit Plant-ID_X">
</div>
<div class="small-2 columns">
<button href="#" data-dropdown="drop1" aria-controls="drop1" aria-expanded="false" class="tiny button postfix dropdown light-gray"></button>
<ul id="drop1" data-dropdown-content class="f-dropdown" aria-hidden="true" tabindex="-1">
<li><a href="#">This is a link</a></li>
<li><a href="#">This is another</a></li>
<li><a href="#">Yet another</a></li>
</ul>
</div>
</div>
<div class="row collapse prefix-radius">
<div class="small-2 columns">
<span class="prefix uppercase">y</span>
</div>
<div class="small-8 columns">
<input type="text" placeholder="Inherit Plant-ID_Y">
</div>
<div class="small-2 columns">
<button href="#" data-dropdown="drop1" aria-controls="drop1" aria-expanded="false" class="tiny button postfix dropdown light-gray"></button>
<ul id="drop1" data-dropdown-content class="f-dropdown" aria-hidden="true" tabindex="-1">
<li><a href="#">This is a link</a></li>
<li><a href="#">This is another</a></li>
<li><a href="#">Yet another</a></li>
</ul>
</div>
</div>
<div class="row collapse prefix-radius">
<div class="small-2 columns">
<span class="prefix uppercase">z</span>
</div>
<div class="small-8 columns">
<input type="text" placeholder="Inherit Plant-ID Plant-Height">
</div>
<div class="small-2 columns">
<button href="#" data-dropdown="drop1" aria-controls="drop1" aria-expanded="false" class="tiny button postfix dropdown light-gray"></button>
<ul id="drop1" data-dropdown-content class="f-dropdown" aria-hidden="true" tabindex="-1">
<li><a href="#">This is a link</a></li>
<li><a href="#">This is another</a></li>
<li><a href="#">Yet another</a></li>
</ul>
</div>
</div>
<div class="row collapse prefix-radius">
<div class="small-3 columns">
<span class="prefix uppercase">speed</span>
</div>
<div class="small-7 columns">
<input type="text" placeholder="Default">
</div>
<div class="small-2 columns">
<button href="#" data-dropdown="drop1" aria-controls="drop1" aria-expanded="false" class="tiny button postfix dropdown light-gray"></button>
<ul id="drop1" data-dropdown-content class="f-dropdown" aria-hidden="true" tabindex="-1">
<li><a href="#">This is a link</a></li>
<li><a href="#">This is another</a></li>
<li><a href="#">Yet another</a></li>
</ul>
</div>
</div>
</div>
<div class="large-4 columns">
<div class="row collapse prefix-radius">
<div class="small-6 columns">
<span class="prefix uppercase">x-offset</span>
</div>
<div class="small-6 columns">
<input type="text" placeholder="-100 mm">
</div>
</div>
<div class="row collapse prefix-radius">
<div class="small-6 columns">
<span class="prefix uppercase">y-offset</span>
</div>
<div class="small-6 columns">
<input type="text" placeholder="0 mm">
</div>
</div>
<div class="row collapse prefix-radius">
<div class="small-6 columns">
<span class="prefix uppercase">z-offset</span>
</div>
<div class="small-6 columns">
<input type="text" placeholder="+20 mm">
</div>
</div>
</div>
</div>
</div>
</div>
"""
changeThis =
"""
<div class="row">
<div class="small-12 columns">
<div class="row">
<div class="small-12 columns">
<nav class="top-bar red" data-topbar role="navigation">
<ul class="title-area">
<li class="name">
<h1><a href="#">SCARE AWAY THE BIRDS</a></h1>
</li>
</ul>
<div class="icon-group">
<a href="#"><i class="fa fa-angle-up"></i></a>&nbsp;
<a href="#"><i class="fa fa-trash"></i></a>&nbsp;
<a href="#"><i class="fa fa-clipboard"></i></a>&nbsp;
<a href="#"><i class="fa fa-bars"></i></a>
</div>
</nav>
</div>
</div>
<div class="row">
<div class="large-8 columns">
<div class="row collapse prefix-radius">
<div class="small-3 columns">
<span class="prefix uppercase">plant-id</span>
</div>
<div class="small-7 columns">
<input type="text" placeholder="Inherit Plant-ID">
</div>
<div class="small-2 columns">
<button href="#" data-dropdown="drop1" aria-controls="drop1" aria-expanded="false" class="tiny button postfix dropdown light-gray"></button>
<ul id="drop1" data-dropdown-content class="f-dropdown" aria-hidden="true" tabindex="-1">
<li><a href="#">This is a link</a></li>
<li><a href="#">This is another</a></li>
<li><a href="#">Yet another</a></li>
</ul>
</div>
</div>
</div>
<div class="large-4 columns">
</div>
</div>
</div>
</div>
"""
# Friggin awesome example:
# https://coderwall.com/p/mgtrkg/variable-templates-for-an-angularjs-directive
angular.module("components", []).directive "sequencetemplate", [
"$compile"
"$http"
"$templateCache"
($compile, $http, $templateCache) ->
getTemplate = (contentType) ->
baseUrl = "/templates/components/tumblr/"
templateMap =
text: "text.html"
photo: "photo.html"
video: "video.html"
quote: "quote.html"
link: "link.html"
chat: "chat.html"
audio: "audio.html"
answer: "answer.html"
templateUrl = baseUrl + templateMap[contentType]
templateLoader = $http.get(templateUrl,
cache: $templateCache
)
templateLoader
linker = (scope, element, attrs) ->
loader = getTemplate(scope.post.type)
promise = loader.success((html) ->
element.html html
).then (response) -> element.replaceWith $compile(element.html())(scope)
return (
restrict: "E"
scope:
post: "="
link: linker
)
]