contrib/opportunity/src/templates/meetup_creation.nit

   1 # This file is part of NIT ( http://www.nitlanguage.org ).
   2 #
   3 # Licensed under the Apache License, Version 2.0 (the "License");
   4 # you may not use this file except in compliance with the License.
   5 # You may obtain a copy of the License at
   6 #
   7 #     http://www.apache.org/licenses/LICENSE-2.0
   8 #
   9 # Unless required by applicable law or agreed to in writing, software
  10 # distributed under the License is distributed on an "AS IS" BASIS,
  11 # WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  12 # See the License for the specific language governing permissions and
  13 # limitations under the License
  14
  15 module meetup_creation is i18n
  16
  17 import boilerplate
  18 import opportunity_model
  19
  20 class MeetupCreationPage
  21         super OpportunityPage
  22
  23         var meet: nullable Meetup = null is writable
  24
  25         var error: nullable String = null is writable
  26
  27         var ans: Set[String] = new HashSet[String] is writable
  28
  29         # Minimum number of input fields for answer
  30         var min_answer_fields = 5
  31
  32         # Templates of answers offered as starting point in the Web interface
  33         var templates: HashMap[String, Array[String]] do
  34                 var map = new HashMap[String, Array[String]]
  35                 map["4 kinds of pizza"] = ["Cheese", "Pepperoni", "Veggie", "All-dressed"]
  36                 map["5 days work week"] = ["Monday", "Tuesday", "Wednesday", "Thursday", "Friday"]
  37                 map["7 days week"] = ["Sunday", "Monday", "Tuesday", "Wednesday",
  38                                       "Thursday", "Friday", "Saturday"]
  39                 return map
  40         end
  41
  42         init do
  43                 header.page_js = """
  44 """
  45         end
  46
  47         redef fun rendering do
  48                 var n_answers = ans.length
  49
  50                 header.page_js = """
  51 var nb_answers = {{{n_answers.max(min_answer_fields)}}};
  52
  53 function new_answer(sender){
  54         var ansdiv = $('#answers')
  55
  56         nb_answers += 1
  57         var nb = nb_answers
  58
  59         ansdiv.append('<div class="form-group">' +
  60                 '<label for="answer_' + nb + '" class="col-sm-4 control-label">' + nb + '</label>' +
  61                 '<div class="col-sm-8">' +
  62                         '<input name="answer_' + nb + '" id="answer_' + nb + '" class="form-control" type="text" placeholder="{{{"Another opportunity"}}}">' +
  63                 '</div></div>')
  64 }
  65
  66 // Clear all answers
  67 function clear(){
  68         for(count = 1;; count ++){
  69                 var ctrl = "#answer_"+count
  70                 if ($(ctrl).length == 0) break
  71                 $(ctrl).val("")
  72         }
  73 }
  74
  75 // Apply a template of opportunities
  76 function apply_template(opportunities){
  77         clear()
  78
  79         var count = 1
  80         for (op of opportunities){
  81                 if (count > nb_answers) new_answer()
  82                 $("#answer_"+count).val(op)
  83                 count ++
  84         }
  85 }
  86 """
  87
  88                 # Do stuff with body before rendering
  89                 var bdy = new Template
  90
  91                 bdy.add "<div class=\"container\">"
  92                 bdy.add "<center>"
  93
  94                 if error != null then
  95                         bdy.add "<p></p>"
  96                         bdy.add """<div class="alert alert-danger alert-dismissible" role="alert">
  97                                 <button type="button" class="close" data-dismiss="alert"><span aria-hidden="true">&times;</span><span class="sr-only">{{{"Close"}}}</span></button>
  98                                 """
  99                         bdy.add error.as(not null)
 100                         bdy.add "</div>"
 101                 end
 102
 103                 bdy.add """
 104                 <div class="page-header">
 105                         <center><h1>{{{"Create a meetup"}}}</h1></center>
 106                 </div>
 107                 """
 108                 bdy.add """<form class="form-horizontal" action="meetup_create" method="POST" role="form">
 109                         <div class = "form-group">
 110                                 <label for="meetup_name" class="col-sm-4 control-label">{{{"Meetup name"}}}</label>
 111                                 <div class="col-sm-8">
 112                                         <input name="meetup_name" id="meetup_name" type="text" class="form-control" placeholder="{{{"My Event"}}}" value="{{{if meet != null then meet.name else ""}}}" />
 113                                 </div>
 114                         </div>
 115                         <div class = "form-group">
 116                                 <label for="meetup_date" class="col-sm-4 control-label">{{{"When?"}}}</label>
 117                                 <div class="col-sm-8">
 118                                         <input name="meetup_date" id="meetup_date" type="text" class="form-control" placeholder="{{{"Time of the event"}}}" value="{{{if meet != null then meet.date else ""}}}">
 119                                 </div>
 120                         </div>
 121                         <div class = "form-group">
 122                                 <label for="meetup_place" class="col-sm-4 control-label">{{{"Where?"}}}</label>
 123                                 <div class="col-sm-8">
 124                                         <input name="meetup_place" id="meetup_place" type="text" class="form-control" placeholder="{{{"Place of the event"}}}" value="{{{if meet != null then meet.place else ""}}}">
 125                                 </div>
 126                         </div>
 127                         <div class = "form-group">
 128                                 <label for="meetup_mode" class="col-sm-4 control-label">{{{"Add a Maybe option?"}}}</label>
 129                                 <div class="col-sm-8 text-left">
 130                                         <input name="meetup_mode" id="meetup_mode" type="checkbox">
 131                                 </div>
 132                         </div>
 133
 134                         <div class = "form-group">
 135                                 <label for="meetup_template" class="col-sm-4 control-label text-left">{{{"Template of opportunities"}}}</label>
 136                                 <div class="col-sm-8 text-left">
 137                                         <div class="dropdown">
 138                                                 <button class="btn btn-default dropdown-toggle" type="button" id="meetup_template" data-toggle="dropdown" aria-expanded="true">
 139                                                         {{{"Apply a template"}}}
 140                                                         <span class="caret"></span>
 141                                                 </button>
 142                                                 <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
 143 """
 144                 for name, answers in templates do bdy.add """
 145                 <li role="presentation"><a role="menuitem" tabindex="-1" onclick="apply_template([{{{[for ans in answers do "'"+ans+"'"].join(", ")}}}])">{{{name}}}</a></li>
 146 """
 147
 148                 bdy.add """
 149                                                 </ul>
 150                                         </div>
 151                                 </div>
 152                         </div>
 153
 154                                 <h2>{{{"Opportunities"}}}</h2>
 155 <div id="answers">
 156 """
 157
 158                 var cnt = 1
 159                 for v in ans do
 160                         bdy.add """
 161 <div class="form-group">
 162         <label for="answer_{{{cnt}}}" class="col-sm-4 control-label">{{{cnt}}}</label>
 163         <div class="col-sm-8">
 164                 <input name="answer_{{{cnt}}}" id="answer_{{{cnt}}}" type="text" class="form-control" value="{{{v}}}"/>
 165         </div>
 166 </div>
 167 """
 168                         cnt += 1
 169                 end
 170
 171                 var empties_to_show = min_answer_fields - ans.length
 172                 if empties_to_show > 0 then
 173                         for e in [0..empties_to_show[ do
 174                                 var placeholder
 175                                 if cnt == 1 then
 176                                         placeholder = "First opportunity"
 177                                 else placeholder = "Another opportunity"
 178
 179                                 bdy.add """
 180 <div class="form-group">
 181         <label for="answer_{{{cnt}}}" class="col-sm-4 control-label">{{{cnt}}}</label>
 182         <div class="col-sm-8">
 183                 <input name="answer_{{{cnt}}}" id="answer_{{{cnt}}}" type="text" class="form-control" placeholder="{{{placeholder}}}"/>
 184         </div>
 185 </div>
 186 """
 187                                 cnt += 1
 188                         end
 189                 end
 190
 191                 bdy.add """
 192                         </div>
 193                         <div class="form-group">
 194                                 <button type="button" class="btn btn-lg" onclick="new_answer(this)">{{{"Add an opportunity"}}}</button>
 195                                 <button type="submit" class="btn btn-lg btn-success">{{{"Create meetup"}}}</button>
 196                         </div>
 197                 </form>
 198                 </center>
 199                 </div>
 200 """
 201                 body = bdy
 202                 super
 203         end
 204
 205 end