Skip to content

CIRCLE / cloud

Go to a project
Commit bc97b546 by Őry Máté
Options

one: retab new-template-flow.html

parent 671c982f
Showing with 124 additions and 124 deletions
one/templates/new-template-flow.html
<form action="/" method="post" id="template-wizard">
<div id="new-template-step-1" class="wizard">
<div class="progress">
<div class="bar-container">
<div class="bar" style="width: 33%"></div>
</div>
<h3>1/3</h3>
</div>
<h2>1. lépés</h2>
<p>Leírás, mit is kéne itt ezen az ablakon csinálni, és miért jó, ha azt csinálja, amit.</p>
<ul>
<li>
<label for="new-template-name">Név</label>
<input type="text" placeholder="A sablon rövid neve" name="name" id="new-template-name" />
<div class="clear"></div>
</li>
<li>
<label for="new-template-type">Típus</label>
<ul class="radio">
<li>
<input type="radio" name="type" value="labor" id="new-template-type-labor" />
<label for="new-template-type-labor">Labor</label>
</li>
<li>
<input type="radio" name="type" value="project" id="new-template-type-project" />
<label for="new-template-type-project">Project</label>
</li>
</ul>
<div class="clear"></div>
</li>
<li>
<label for="new-template-size">Méret</label>
<ul class="radio">
<li>
<input type="radio" name="size" value="small" id="new-template-size-small" />
<label for="new-template-size-small">Kicsi</label>
</li>
<li>
<input type="radio" name="size" value="medium" id="new-template-size-medium" />
<label for="new-template-size-medium">Közepes</label>
</li>
<li>
<input type="radio" name="size" value="large" id="new-template-size-large" />
<label for="new-template-size-large">Nagy</label>
</li>
</ul>
<div class="clear"></div>
</li>
<li style="border: none">
<label for="new-template-description">Leírás</label>
<textarea name="description" id="new-template-description" placeholder="A sablonhoz fűzött megjegyzések"></textarea>
<div class="clear"></div>
</li>
</ul>
<nav>
<a href="#" class="prev">&laquo; Mégse</a>
<a href="#" class="next">Tovább &raquo;</a>
<div class="clear"></div>
</nav>
<script type="text/javascript">
$(function(){
$('#new-template-step-1 nav .next').click(function(){
$('#new-template-step-1').hide();
$('#new-template-step-2').show();
})
$('#new-template-step-1 nav .prev').click(function(){
$('#modal').hide();
})
})
</script>
</div>
<div id="new-template-step-2" class="wizard" style="display: none">
<div class="progress">
<div class="bar-container">
<div class="bar" style="width: 66%"></div>
</div>
<h3>2/3</h3>
</div>
<h2>2. lépés</h2>
<p>Leírás, mit is kéne itt ezen az ablakon csinálni, és miért jó, ha azt csinálja, amit.</p>
<div class="container">
<div id="new-template-step-1" class="wizard">
<div class="progress">
<div class="bar-container">
<div class="bar" style="width: 33%"></div>
</div>
<h3>1/3</h3>
</div>
<h2>1. lépés</h2>
<p>Leírás, mit is kéne itt ezen az ablakon csinálni, és miért jó, ha azt csinálja, amit.</p>
<ul>
<li>
<label for="new-template-name">Név</label>
<input type="text" placeholder="A sablon rövid neve" name="name" id="new-template-name" />
<div class="clear"></div>
</li>
<li>
<label for="new-template-type">Típus</label>
<ul class="radio">
<li>
<input type="radio" name="type" value="labor" id="new-template-type-labor" />
<label for="new-template-type-labor">Labor</label>
</li>
<li>
<input type="radio" name="type" value="project" id="new-template-type-project" />
<label for="new-template-type-project">Project</label>
</li>
</ul>
<div class="clear"></div>
</li>
<li>
<label for="new-template-size">Méret</label>
<ul class="radio">
<li>
<input type="radio" name="size" value="small" id="new-template-size-small" />
<label for="new-template-size-small">Kicsi</label>
</li>
<li>
<input type="radio" name="size" value="medium" id="new-template-size-medium" />
<label for="new-template-size-medium">Közepes</label>
</li>
<li>
<input type="radio" name="size" value="large" id="new-template-size-large" />
<label for="new-template-size-large">Nagy</label>
</li>
</ul>
<div class="clear"></div>
</li>
<li style="border: none">
<label for="new-template-description">Leírás</label>
<textarea name="description" id="new-template-description" placeholder="A sablonhoz fűzött megjegyzések"></textarea>
<div class="clear"></div>
</li>
</ul>
<nav>
<a href="#" class="prev">&laquo; Mégse</a>
<a href="#" class="next">Tovább &raquo;</a>
<div class="clear"></div>
</nav>
<script type="text/javascript">
$(function(){
$('#new-template-step-1 nav .next').click(function(){
$('#new-template-step-1').hide();
$('#new-template-step-2').show();
})
$('#new-template-step-1 nav .prev').click(function(){
$('#modal').hide();
})
})
</script>
</div>
<div id="new-template-step-2" class="wizard" style="display: none">
<div class="progress">
<div class="bar-container">
<div class="bar" style="width: 66%"></div>
</div>
<h3>2/3</h3>
</div>
<h2>2. lépés</h2>
<p>Leírás, mit is kéne itt ezen az ablakon csinálni, és miért jó, ha azt csinálja, amit.</p>
<div class="container">
<ul class="wm-list modal">
{% for m in templates %}
<li class="wm">
......@@ -106,51 +106,51 @@
{% endfor %}
</ul>
</div>
<nav>
<a href="#" class="prev">&laquo; Mégse</a>
<a href="#" class="next">Tovább &raquo;</a>
<div class="clear"></div>
</nav>
<script type="text/javascript">
$(function(){
<nav>
<a href="#" class="prev">&laquo; Mégse</a>
<a href="#" class="next">Tovább &raquo;</a>
<div class="clear"></div>
</nav>
<script type="text/javascript">
$(function(){
console.log('foo');
$('#modal .wm .summary').each(function(){
console.log('foo');
$('#modal .wm .summary').each(function(){
$(this).next('.details').show();
console.log($(this).next('.details').css('display'), $(this).next('.details').css('height'));
//this.originalHeight=parseInt($(this).next('.details').css('height'));
})
$('#modal .wm .summary').click(function(){
if($(this).next('.details').is(':hidden')){
$(this).next('.details')
.slideDown(700);
$(this).parent('.wm').addClass('opened');
} else {
var that=this;
$(this).next('.details')
.removeClass('opened')
.slideUp(700);
}
});
$('#new-template-step-2 nav .prev').click(function(){
$('#new-template-step-2').hide();
$('#new-template-step-1').show();
})
$('#new-template-step-2 nav .next').click(function(){
$('#new-template-step-2').hide();
$('#new-template-step-3').show();
$.ajax({
'type': 'POST',
'url': '/ajax/templateWizard',
'data': $('#template-wizard').serialize()
})
.done(function(){ console.log('ok')});
})
})
</script>
</div>
<div id="new-template-step-3" class="wizard" style="display: none">
$(this).next('.details').show();
console.log($(this).next('.details').css('display'), $(this).next('.details').css('height'));
//this.originalHeight=parseInt($(this).next('.details').css('height'));
})
$('#modal .wm .summary').click(function(){
if($(this).next('.details').is(':hidden')){
$(this).next('.details')
.slideDown(700);
$(this).parent('.wm').addClass('opened');
} else {
var that=this;
$(this).next('.details')
.removeClass('opened')
.slideUp(700);
}
});
$('#new-template-step-2 nav .prev').click(function(){
$('#new-template-step-2').hide();
$('#new-template-step-1').show();
})
$('#new-template-step-2 nav .next').click(function(){
$('#new-template-step-2').hide();
$('#new-template-step-3').show();
$.ajax({
'type': 'POST',
'url': '/ajax/templateWizard',
'data': $('#template-wizard').serialize()
})
.done(function(){ console.log('ok')});
})
})
</script>
</div>
<div id="new-template-step-3" class="wizard" style="display: none">
</div>
</div>
</form>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment