person: {
name: '', surname: '', inst: '', email: '',
},
- type: '', // just attending
+ type: 'participant',
work: {
title: '',
abstract: '',
},
symposium: { organizers: [ {name:'', surname:'', inst:'', email:'' } ], work_nr: 1, },
};
- this.last_saved = {};
this.Registration = $resource( '/data/conference/Registration/:id', { id:'' } );
this.Symposium = $resource( '/data/conference/Symposium/:id', { id:'' } );
this.reset();
},
reset: function() {
console.debug( this.Registration );
- var current_symposium = null;
- var current_person = null;
- if ( this.registration && this.registration.type == 'symposium' ) {
- current_symposium = this.registration.symposium;
- current_person = this.registration.person;
- if ( this.registration.$id ) current_symposium.work_nr++; // only if saved
-console.debug( 'current_symposium', current_symposium, this.registration )
+ var last = this.registration;
+ if ( last && last.type == 'symposium' ) {
+ if ( last.$id ) last.symposium.work_nr++; // only if saved
}
this.registration = new this.Registration( this.master );
- if ( current_symposium ) {
- this.registration.symposium = current_symposium;
- this.registration.type = 'symposium';
- this.registration.person = current_person;
+ if ( last ) {
+ this.registration.type = last.type;
+ this.registration.person = last.person;
+
+ if ( last.type == 'symposium' )
+ this.registration.symposium = last.symposium;
}
- this.last_saved = {};
-console.debug( 'reset', current_symposium, this.registration, this.$location.hashPath );
+ this.last_saved = angular.copy( this.registration ); // FIXME was: {};
+console.debug( 'reset', this.registration, this.$location.hashPath, last );
},
save: function(){
var self = this;
self.symposium = new self.Symposium( registration.symposium );
self.symposium.works = [];
}
+ registration.work.$id = registration.$id; // preserve $id
self.symposium.works[ registration.symposium.work_nr - 1 ] = registration.work;
console.debug('save_symposium', self.symposium );
self.symposium.$save();
},
};
+angular.validator.max_length = function(input, len) {
+ var ok = input.length <= len;
+console.debug( 'max_length', ok, input.length, len );
+ return ok ? '' : 'must be shorter than '+len+' characters';
+}
</script>
margin-top: 10px;
font-size: 14px;
font-family: Arial;
- font-weight: normal;
}
h2 {
a {
color: #D74F25;
- font-size: 80%;
-}
-
-.symposium, .work {
- width: 615px;
}
label {
color: #374E5A;
}
-.authors-label .name, .authors-label .surname, .authors-label .inst, .authors-label .email {
+.input {
color: #afafaf;
float: left;
margin: 2px;
padding: 0 6px;
}
-.name, .surname, .email {
- width: 18%;
+.input1 {
+ width: 40.8em;
}
-.inst {
- width: 30%;
+.input2 {
+ width: 8em;
}
-.title, .summary {
- width: 93%;
+.input3 {
+ width: 13em;
+}
+.input4 {
+ width: 10em;
}
-.authors {
- clear: both;
- margin-bottom: 6px;
+.input5 {
+ width: 21.4em;
+}
+.input6 {
+ width: 6.3em;
}
-.authors-label {
- clear: right;
+.clear {
+ clear: both;
}
+.authors {
+ clear: both;
+ margin-bottom: 6px;
+}
-.addNew {
- padding-right: 30px;
+.addPerson {
+ color: #D74F25;
+ color: #EDC8BC;
+ color: #EAB3A2;
+ font-size: 90%;
}
-input, textarea
+input, textarea, .gohome
{
font: 14px arial;
color: #000000;
border: 1px solid #46d0fe;
}
-input.ng-validation-error {
+.ng-validation-error {
border: 1px solid #D74F25;
border: 1px solid #FF6666;
- border: 1px solid #FF9966;
border: 1px solid #EDC8BC;
+ border: 1px solid #FF9966;
+ border: 1px solid #EAB3A2;
}
-.warrning {
- color: #FF6666;
+#work, #submission {
+ margin-bottom: 20px;
}
-.sworks {
- margin-top: 20px;
+.button input {
+ float: left;
+ color: #ffffff;
+ display: block;
+ text-decoration: none;
+ background: #d74f25;
}
-.save {
- margin-top: 10px;
+.button input:hover, .gohome:hover {
+ background: #dc6844;
}
-.save input
-{
+.gohome {
float: left;
color: #ffffff;
display: block;
background: #d74f25;
}
-.save input:hover
-{
- background: #dc6844;
+.gohome a {
+ color: #fff;
+ text-decoration: none;
+}
+
+
+.warrning {
+ color: #FF6666;
}
+.sworks {
+ margin-top: 20px;
+}
+
+
.newWork {
clear: left;
margin-top: 50px;
}
+.saved {
+ color: #D74F25;
+ margin-top: 20px;
+ margin-bottom: 20px;
+}
</style>
<div ng:controller="Registration" ng:init="$window.$root = this;">
-<div id="registration">
-
-<input class="name" name="registration.person.name" ng:required>
-<input class="name" name="registration.person.surname" ng:required>
-
-<input name="registration.person.inst">
-<input name="registration.person.email" ng:validate="email">
+<div id="participant">
+ <h2>Contact Information</h2>
+ <div class="labelTop">
+ <div class="input input4">First name</div>
+ <div class="input input4">Surname</div>
+ </div>
+ <div style="clear: both">
+ <input class="input4" name="registration.person.name" ng:required>
+ <input class="input4" name="registration.person.surname" ng:required>
+ </div>
+ <div class="labelTop">
+ <div class="input input5">Institution</div>
+ </div>
+ <div style="clear: both">
+ <input class="input5" name="registration.person.inst">
+ </div>
+ <div class="labelTop">
+ <div class="input input5">Address</div>
+ </div>
+ <div style="clear: both">
+ <input class="input5" name="registration.person.address1" ng:required>
+ </div>
+ <div class="labelTop">
+ <div class="input input6">City</div>
+ <div class="input input6">ZIP</div>
+ <div class="input input6">Country</div>
+ </div>
+ <div style="clear: both">
+ <input class="input6" name="registration.person.city" ng:required>
+ <input class="input6" name="registration.person.zip">
+ <input class="input6" name="registration.person.country">
+ </div>
+ <div class="labelTop">
+ <div class="input input4">E-mail</div>
+ <div class="input input4">Phone number</div>
+ </div>
+ <div style="clear: both">
+ <input class="input4" name="registration.person.email" ng:validate="email" ng:required>
+ <input class="input4" name="registration.person.phone">
+ </div>
</div>
-<div id="submission">
-
-<h2>Type of conference submission:</h2>
-<input type="radio" name="registration.type" value="">Just attending conference<br/>
-<input type="radio" name="registration.type" value="symposium">Symposia<br/>
-<input type="radio" name="registration.type" value="lecture">Oral presentation<br/>
-<input type="radio" name="registration.type" value="poster">Poster presentation<br/>
-<input type="radio" name="registration.type" value="round">Round table discussion<br/>
+<div id="submission">
+ <div>
+ <h2>Please choose:</h2>
+ <label><input type="radio" name="registration.type" value="participant" ng:required>Just attending or my work was submitted by another person</label>
+ <label><input type="radio" name="registration.type" value="symposium" ng:required>Symposia paper</label>
+ <label><input type="radio" name="registration.type" value="lecture" ng:required>Oral presentation</label>
+ <label><input type="radio" name="registration.type" value="poster" ng:required>Poster presentation</label>
+ <label><input type="radio" name="registration.type" value="round" ng:required>Round table discussion</label>
+ </div>
+</div>
-<div id="submit_work" ng:show="registration.type">
-<div ng:show="registration.type == 'symposium'" style="background:#f0f0f0">
-<label>Topic of symposium: <input name="registration.symposium.title" size="60" ng:required></label><br/>
-
-<label>Summary: <br/>
-<textarea name="registration.symposium.abstract" cols="50" rows="5"></textarea>
-</label>
-<br/>
-Organizer:
-<div ng:repeat="organizer in registration.symposium.organizers">
-[<a href="" ng:click="registration.symposium.organizers.$remove(author)">X</a>]
-<input name="organizer.name" ng:required>
-<input name="organizer.surname" ng:required>
-<input name="organizer.inst" >
-<input name="organizer.email" ng:required>
+<div id="work" ng:show="registration.type != 'participant'">
+ <div ng:show="registration.type == 'symposium'">
+
+ <h2>Symposia</h2>
+ <label>Topic:</label>
+ <input class="input1" name="registration.symposium.title" ng:required>
+ <label>Organizer:</label>
+ <div>
+ <div class="input input2">First name</div><div class="input input2">Surname</div><div class="input input3">Institution</div><div class="input input2">E-mail</div>
+ </div>
+ <div class="clear" ng:repeat="organizer in registration.symposium.organizers">
+ <input class="input2" name="organizer.name" ng:required>
+ <input class="input2" name="organizer.surname" ng:required>
+ <input class="input3" name="organizer.inst" >
+ <input class="input2" name="organizer.email" ng:required ng:validate="email">
+ <a href="" ng:click="registration.symposium.organizers.$remove(organizer)">X</a>
+ </div>
+ <a class="addPerson" href="" ng:click="registration.symposium.organizers.$add()">Add another organizer</a>
+ <label>Summary (2000 characters max.)</label>
+ <textarea class="input1" name="registration.symposium.abstract" rows="5" ng:validate="max_length:2000" ng:required></textarea>
+ <div ng:show="symposium">
+ <label>List of already submitted works</label>
+ <ol>
+ <li ng:repeat="w in symposium.works">
+ <a ng:show="registration.$id != w.$id" href="#{{w.$id}}" >{{w.title}}</a>
+ <b ng:show="registration.$id == w.$id">{{w.title}}</b>
+ </li>
+ </ol>
+ </div>
+ </div>
+
+
+ <h2 ng:show="registration.type == 'symposium'">Symposia paper ({{registration.symposium.work_nr}})</h2>
+ <h2 ng:show="registration.type == 'lecture'">Oral Presentation Sumbission</h2>
+ <h2 ng:show="registration.type == 'poster'">Poster Presentation Sumbission</h2>
+ <h2 ng:show="registration.type == 'round'">Round Table Disscussion Sumbission</h2>
+
+
+ <div ng:show="registration.type">
+
+ <label>Title:</label>
+ <input class="input1" name="registration.work.title" ng:required>
+ <label>Authors</label>
+ <div>
+ <div class="input input2">First name</div><div class="input input2">Surname</div><div class="input input3">Institution</div><div class="input input2">E-mail</div>
+ </div>
+ <div class="clear" ng:repeat="author in registration.work.authors">
+ <input class="input2" name="author.name" ng:required>
+ <input class="input2" name="author.surname" ng:required>
+ <input class="input3" name="author.inst" >
+ <input class="input2" name="author.email" ng:required ng:validate="email">
+ <a href="" ng:click="registration.work.authors.$remove(author)">X</a>
+ </div>
+ <a class="addPerson" href="" ng:click="registration.work.authors.$add()">Add another author</a>
+
+
+ <label>Abstract (2000 characters max.):</label>
+ <textarea class="input1" name="registration.work.abstract" rows="5" ng:validate="max_length:2000" ng:required></textarea>
+
+
+ </div> <!-- ng:show="registration.type" -->
</div>
-[<a href="" ng:click="registration.symposium.organizers.$add()">Add another organizer</a>]
+<div class="button">
+<input type="submit" value="Save" ng:click="save();" ng:show="! last_saved.$equals(registration) && $invalidWidgets.visible() == 0">
</div>
-<hr>
-
-<div ng:show="symposium">
-Works which are part of this symposium:
-<ol>
-<li ng:repeat="w in symposium.works"><a href="#{{w.$id}}">{{w.title}}</a></li>
-</ol>
+<div ng:show="$invalidWidgets.visible() > 0" style="color:red; margin-top: 20px">Please fill all required fields ({{$invalidWidgets.visible()}} fields left).
</div>
-<h2>Autors<span ng:show="registration.type == 'symposium'"> of {{registration.symposium.work_nr}}. work </span></h2>
-
-<div ng:repeat="author in registration.work.authors">
-[<a href="" ng:click="registration.work.authors.$remove(author)">X</a>]
-<input name="author.name" ng:required>
-<input name="author.surname" ng:required>
-<input name="author.inst" >
-<input name="author.email" ng:required>
-</div>
-[<a href="" ng:click="registration.work.authors.$add()">Add another author</a>]
-<hr>
-<label>Title: <input name="registration.work.title" size="60" ng:required></label><br/>
-<label>Summary:<br>
-<textarea name="registration.work.abstract" cols="50" rows="5"></textarea>
-</label>
-<br/>
+<div style="margin-bottom: 40px" ng:show="registration.$id && last_saved.$equals(registration)">
+ <div class="saved" ng:show="registration.type == 'participant'">
+ Your registration has been submitted successfully.
+ </div>
+ <div class="saved" ng:show="registration.type != 'participant'" class="saved">
+ <i>{{registration.work.title}}</i> submitted successfully.
+ </div>
+<!--
+ Please review your data, correct and save if needed (just start typing and Save button will show automatically).
+-->
+<!--
+ <div>
+ Registration ID: {{registration.$id}}. You can bookmark this page and review it later.
+ </div>
+-->
</div>
-<div id="buttons">
-
-<span ng:show="$invalidWidgets.visible() == 0">
-<input type="submit" value="Save" ng:click="save();" ng:show="! last_saved.$equals(registration)">
-<input type="reset" value="Add another work" ng:click="reset()" ng:show="registration && registration.$id">
-</span>
-
-<b ng:show="$invalidWidgets.visible() > 0" style="color:#800">{{$invalidWidgets.visible()}} errors to fix in submission form</b>
+<div class="button" ng:show="registration.$id && registration.type != 'participant' && last_saved.$equals(registration)">
+ <input type="reset" value="Submit another paper" ng:click="reset()">
+ <div class="gohome"><a href="http://psihologija.ffzg.hr/drzb2011/">Finish and go to the conference home page</a></div>
</div>
-
+<!--
<div ng:show="registration.$id">
Permalink to <a href="#{{registration.$id}}">DRZB2011 registration</a> which you can bookmark
</div>
+-->
-</div><!-- registration.type == just attending -->
-<hr>
-Debug Information:
-{{$window.location.href}}
-<pre>
-registration = {{registration}}
+<input type=checkbox name=debug style="float: right; clear: both">
+<pre ng:show="debug">
-dirty={{! last_saved.$equals(registration)}}
+dirty={{! last_saved.$equals(registration)}} invalid={{$invalidWidgets.visible()}}
+
+registration = {{registration}}
last_saved = {{last_saved}}
registration.$id={{registration.$id}}
</pre>
-</div>
projects / angular-mojolicious.git / blobdiff