<div class="top-pad"></div>

<div class="content-padding" ng-show="ready">

	<h1 class="title left"><i class="fa fa-slideshare"></i><span>Community</span></h1>

	<div class="divider"></div>


	<form name="form" novalidate>

	<div class="support-boxes">

		<div class="support-box-wrap box-content2">
			<div class="support-box-wrap-header">
				<h1>Basic Info</h1>
				<div class="divider"></div>
			</div>

			<div class="no-box-content-color">

				<ul ng-class="{'submitted':submitted}" class="ul-inputs">

					<li class="li-input" ng-class="{'error':form.communityName.$invalid}">
						<div class="label">Name:</div>
						<div class="input"><input type="text" name="communityName" ng-model="community.name" required placeholder="Name" ng-minlength="2" ng-maxlength="255" ></div>
						<div class="box-error">
							<small ng-show="form.communityName.$error.required">Required.</small>
							<small ng-show="form.communityName.$error.minlength">Name is too short. Name is required to be at least 2 characters.</small>
							<small ng-show="form.communityName.$error.maxlength">Name cannot be longer than 255 characters.</small>
						</div>
					</li>

					<li class="li-input" ng-class="{'error':form.communityPermalink.$invalid}">
						<div class="label">Permalink (must be lowercase):</div>
						<div class="input"><input type="text" name="communityPermalink" ng-model="community.permalink" required placeholder="Permalink" ng-minlength="2" ng-maxlength="255" ></div>
						<div class="box-error">
							<small ng-show="form.communityPermalink.$error.required">Required.</small>
							<small ng-show="form.communityPermalink.$error.minlength">Permalink is too short. Permalink is required to be at least 2 characters.</small>
							<small ng-show="form.communityPermalink.$error.maxlength">Permalink cannot be longer than 40 characters.</small>
						</div>
					</li>

					<li class="li-input" ng-class="{'error':form.communityActive.$invalid}">
						<div class="label">Active:</div>
						<div class="input">
							<select name="communityActive" required ng-model="community.active" ng-options="opt.value as opt.label for opt in yesNo" ></select>
						</div>
					</li>

					<li class="li-input" ng-class="{'error':form.communityCanBeOpenedByDrivers.$invalid}">
						<div class="label">Community can be opened by drivers:</div>
						<div class="input">
							<select name="communityCanBeOpenedByDrivers" required ng-model="community.drivers_can_open" ng-options="opt.value as opt.label for opt in yesNo" ></select>
						</div>
					</li>

					<li class="li-input" ng-class="{'error':form.communityNotifyCustomerWhenDriverOpen.$invalid}" ng-if="community.drivers_can_open">
						<div class="label">Send notification to customers when driver opens it:</div>
						<div class="input">
							<select name="communityNotifyCustomerWhenDriverOpen" required ng-model="community.notify_customer_when_driver_open" ng-options="opt.value as opt.label for opt in yesNo" ></select>
						</div>
						<div class="note" ng-show="community.notify_customer_when_driver_open">
							<br>
							<a href="/config/community-open">Please make sure this option is also enabled here.</a>
						</div>
					</li>



					<li class="li-input" ng-class="{'error':form.communityCanBeClosedByDrivers.$invalid}">
						<div class="label">Community can be closed by drivers:</div>
						<div class="input">
							<select name="communityCanBeClosedByDrivers" required ng-model="community.drivers_can_close" ng-options="opt.value as opt.label for opt in yesNo" ></select>
						</div>
					</li>

					<li class="li-input" ng-class="{'error':form.communityAutoClose.$invalid}">
						<div class="label">Enable Auto Close:</div>
						<div class="input">
							<select name="communityAutoClose" required ng-model="community.auto_close" ng-options="opt.value as opt.label for opt in yesNo" ></select>
						</div>
					</li>

					<li class="li-input" ng-show="community.auto_close">
						<div class="label">Customize Auto-Closed message:</div>
						<div class="input"><input type="text" name="communityAutoClosePredefinedMessage" ng-model="community.auto_close_predefined_message"  placeholder="Customize Auto-Closed message" maxlength="200" ></div>
					</li>

					<li class="li-input" ng-class="{'error':form.communityImage.$invalid}">
						<div class="label">Custom image:</div>
						<div class="input">
							<select name="communityImage" required ng-model="community.image" ng-options="opt.value as opt.label for opt in yesNo" ></select>
						</div>
					</li>

				</ul>

			</div>

		</div>

	<div class="support-box-wrap box-content2">
			<div class="support-box-wrap-header">
				<h1>Shifts</h1>
				<div class="divider"></div>
			</div>

			<div class="no-box-content-color">

				<ul ng-class="{'submitted':submitted}" class="ul-inputs">

					<li class="li-input" ng-class="{'error':form.driverCheckin.$invalid}">
						<div class="label">Ask drivers to check in:</div>
						<div class="input">
							<select name="driverCheckin" required ng-model="community.driver_checkin" ng-options="opt.value as opt.label for opt in yesNo" ></select>
						</div>
					</li>

					<li class="li-input" ng-class="{'error':form.driverCheckin.$invalid}">
						<div class="label">Notify CS when drivers don't check in:</div>
						<div class="input">
							<select name="driverCheckin" required ng-model="community.notify_cs_when_driver_dont_checkin" ng-options="opt.value as opt.label for opt in yesNo" ></select>
						</div>
					</li>

					<li class="li-input" ng-class="{'error':form.communityMergeHours.$invalid}">
						<div class="label">Combine Restaurant and Driver's Shift Hours:</div>
						<div class="input">
							<select name="communityMergeHours" required ng-model="community.combine_restaurant_driver_hours" ng-options="opt.value as opt.label for opt in yesNo" ></select>
						</div>
					</li>

					<li class="li-input" ng-class="{'error':form.automaticDriverRestaurantName.$invalid}">
						<div class="label">Change driver restaurant name automatically based on assigned shifts:</div>
						<div class="input">
							<select name="automaticDriverRestaurantName" required ng-model="community.automatic_driver_restaurant_name" ng-options="opt.value as opt.label for opt in yesNo" ></select>
						</div>
					</li>

					<li class="li-input" ng-class="{'error':form.shiftSendMessagesDriversFillPreferences.$invalid}">
						<div class="label">Send messages to drivers fill their preferences:</div>
						<div class="input">
							<select name="shiftSendMessagesDriversFillPreferences" required ng-model="community.message_drivers_fill_preferences" ng-options="opt.value as opt.label for opt in yesNo" ></select>
						</div>
					</li>

					<li class="li-input" ng-class="{'error':form.remindDriversAboutTheirShifts.$invalid}">
						<div class="label">Remind drivers about their shifts:</div>
						<div class="input">
							<select name="remindDriversAboutTheirShifts" required ng-model="community.remind_drivers_about_their_shifts" ng-options="opt.value as opt.label for opt in yesNo" ></select>
						</div>
						<div class="notes">Reminders sent minutes before their shifts, daily and weekly reminders (text and email)</div>
					</li>
				</ul>

			</div>

		</div>

		<div class="support-box-wrap box-content2">
			<div class="support-box-wrap-header">
				<h1>Front end</h1>
				<div class="divider"></div>
			</div>

			<div class="no-box-content-color">

				<ul ng-class="{'submitted':submitted}" class="ul-inputs">

					<li class="li-input" ng-class="{'error':form.communityTagline1.$invalid}">
						<div class="label">Tagline 1:</div>
						<div class="input"><input type="text" name="communityTagline1" ng-model="community.tagline1" placeholder="Order the top food for {{community.name}}" maxlength="100" ></div>
					</li>

					<li class="li-input" ng-class="{'error':form.communityTagline2.$invalid}">
						<div class="label">Tagline 2:</div>
						<div class="input"><input type="text" name="communityTagline2" ng-model="community.tagline2" placeholder="After you order, everything is saved for future 1 click ordering" maxlength="100" ></div>
					</li>
					<li class="li-input" ng-class="{'error':form.displayHoursRestaurantsPage.$invalid}">
						<div class="label">Display hours of operation on Choose Restaurant page?</div>
						<div class="input">
							<select name="displayHoursRestaurantsPage" required ng-model="community.display_hours_restaurants_page" ng-options="opt.value as opt.label for opt in yesNo" ></select>
						</div>
					</li>
					<li class="li-input" ng-class="{'error':form.displayEta.$invalid}">
						<div class="label">Display delivery estimate?</div>
						<div class="input">
							<select name="displayEta" required ng-model="community.display_eta" ng-options="opt.value as opt.label for opt in yesNo" ></select>
						</div>
					</li>

				</ul>

			</div>
		</div>

		<div class="support-box-wrap box-content2">
			<div class="support-box-wrap-header">
				<h1>Delivery info</h1>
				<div class="divider"></div>
			</div>

			<div class="no-box-content-color">

			<ul ng-class="{'submitted':submitted}" class="ul-inputs">

				<li class="li-input" ng-class="{'error':form.communityDriverRestaurant.$invalid}">
					<div class="label">Driver restaurant:</div>
					<div class="input">
						<select name="communityDriverRestaurant" ng-model="community.id_driver_restaurant" ng-options="opt.id_restaurant as opt.name for opt in restaurants" ></select>
					</div>
				</li>

				<li class="li-input" ng-show="community.driver_group">
					<div class="label">Driver group name:</div>
					<div class="input">{{community.driver_group}}</div>
				</li>

				<li class="li-input" ng-class="{'error':form.communityTimezone.$invalid}">
					<div class="label">Timezone:</div>
					<div class="input">
					<select name="communityTimezone" required ng-model="community.timezone" ng-options="opt.value as opt.label for opt in timezones" ></select>

					</div>
				</li>

				<li class="li-input">
					<div class="label">Address:</div>
					<div class="input">
						<textarea ng-model="community.address"></textarea>
					</div>
				</li>

				<li class="li-input" ng-class="{'error':form.communityLocLat.$invalid}">
					<div class="label">Latitude (automagically calculated):</div>
					<div class="input"><input type="text" name="communityLocLat" ng-model="community.loc_lat" required placeholder="Latitude"></div>
					<div class="box-error">
						<small ng-show="form.communityLocLat.$error.required">Required.</small>
					</div>
				</li>

				<li class="li-input" ng-class="{'error':form.communityLocLong.$invalid}">
					<div class="label">Longitude (automagically calculated):</div>
					<div class="input"><input type="text" name="communityLocLong" ng-model="community.loc_lon" required placeholder="Longitude"></div>
					<div class="box-error">
						<small ng-show="form.communityLocLong.$error.required">Required.</small>
					</div>
				</li>

				<li class="li-input" ng-class="{'error':form.communityRange.$invalid}">
					<div class="label">Range:</div>
					<div class="input"><input type="number" name="communityRange" ng-model="community.range" placeholder="Range"></div>
					<div class="box-error">
						<small ng-show="form.communityRange.$error.required">Required.</small>
					</div>
				</li>

				<li class="li-input" ng-class="{'error':form.allowPreOrder.$invalid}">
					<div class="label">Pre-Orders Enable:</div>
					<div class="input">
						<select name="allowPreOrder" ng-model="community.allow_preorder" ng-options="opt.value as opt.label for opt in yesNo" ></select>
					</div>
					<div class="box-error">
						<small ng-show="form.allowPreOrder.$error.required">Required.</small>
					</div>
					<div class="notes">
						If it is "No" it will disable pre-orders for all restaurants that belong to this community
					</div>
				</li>


				<li class="li-input" ng-show="community.allow_preorder" ng-class="{'error':form.allowPreOrder.$invalid}">
					<div class="label">Minutes to delivery pre-orders after community is open:</div>
					<div class="input">
						<div class="input"><input  type="number" ignore-mouse-wheel name="communityRange" ng-model="community.preorder_min_after_community_open" ng-required="community.allow_preorder" placeholder="Default 60 minutes"></div>
					</div>
					<div class="box-error">
						<small ng-show="form.allowPreOrder.$error.required">Required.</small>
					</div>
				</li>

				<li class="li-input" ng-class="{'error':form.notifyNonShiftDrivers.$invalid}">
					<div class="label">Send non-scheduled community drivers orders?</div>
					<div class="input">
						<select name="notifyNonShiftDrivers" ng-model="community.notify_non_shift_drivers" ng-options="opt.value as opt.label for opt in yesNo" ></select>
					</div>
					<div class="box-error">
						<small ng-show="form.notifyNonShiftDrivers.$error.required">Required.</small>
					</div>
				</li>

				<li class="li-input" ng-class="{'error':form.notifyNonShiftDriversMin.$invalid}" ng-if="community.notify_non_shift_drivers">
					<div class="label">Minutes to delivery pre-orders after community is open:</div>
					<div class="input">
						<div class="input"><input  type="number" ignore-mouse-wheel name="notifyNonShiftDriversMin" ng-model="community.notify_non_shift_drivers_min" ng-required="community.notify_non_shift_drivers" placeholder="Default 5 minutes"></div>
					</div>
					<div class="box-error">
						<small ng-show="form.notifyNonShiftDriversMin.$error.required">Required.</small>
					</div>
				</li>



			</ul>

			</div>
		</div>

		<div class="support-box-wrap box-content2">
			<div class="support-box-wrap-header">
				<h1>Settlement</h1>
				<div class="divider"></div>
			</div>

			<div class="no-box-content-color">

				<ul ng-class="{'submitted':submitted}" class="ul-inputs">

					<li class="li-input">
						<div class="label">Amount per order:</div>
						<div class="input"><input type="number" ignore-mouse-wheel step="0.01" name="amountPerOrder" ng-model="community.amount_per_order" placeholder="Amount per order"></div>
						<div class="notes">Left blank for Delivery Fee</div>
					</li>

				</ul>

			</div>

		</div>

		<div class="support-box-wrap box-content2">
			<div class="support-box-wrap-header">
				<h1>Payment option</h1>
				<div class="divider"></div>
			</div>

			<div class="no-box-content-color">

				<ul ng-class="{'submitted':submitted}" class="ul-inputs">

					<li class="li-input" ng-class="{'error':form.campusCash.$invalid}">
						<div class="label">Campus Cash:</div>
						<div class="input">
							<select name="campusCash" required ng-model="community.campus_cash" ng-options="opt.value as opt.label for opt in yesNo" ></select>
						</div>
					</li>

					<li class="li-input" ng-show="community.campus_cash" ng-class="{'error':form.campusCashName.$invalid}">
						<div class="label">Campus Cash Name:</div>
						<div class="input"><input type="text" name="campusCashName" ng-model="community.campus_cash_name" required placeholder="Campus Cash Name" ng-required="community.campus_cash" ng-minlength="2" ng-maxlength="50" ></div>
						<div class="box-error">
							<small ng-show="form.campusCashName.$error.required">Required.</small>
						</div>
					</li>

					<li class="li-input" ng-show="community.campus_cash" ng-class="{'error':form.campusCashReceiptInfo.$invalid}">
						<div class="label">Campus Cash Receipt Info:</div>
						<div class="input">
						<textarea name="campusCashReceiptInfo" ng-model="community.campus_cash_receipt_info" required placeholder="Footer receipt info" ng-required="community.campus_cash" ng-minlength="2" ng-maxlength="250"></textarea>
						<div class="notes">Limit 250 Chars</div>
						<div class="box-error">
							<small ng-show="form.campusCashReceiptInfo.$error.required">Required.</small>
						</div>
					</li>

					<li class="li-input" ng-show="community.campus_cash">
						<div class="label">Campus Cash Fee (% per order):</div>
						<div class="input"><input type="number" ignore-mouse-wheel step="0.01" name="campusCashFee" ng-model="community.campus_cash_fee" disabled="disabled" placeholder="Campus Cash Fee"></div>
						<div class="notes">Feature disabled!</div>
					</li>

					<li class="li-input" ng-show="community.campus_cash" ng-class="{'error':form.campusCashValidation.$invalid}">
						<div class="label">Campus Cash Validation:</div>
						<div class="input"><input type="text" name="campusCashValidation" ng-model="community.campus_cash_validation" ng-required="community.campus_cash" placeholder="Campus Cash Validation (Regular Expression)" ng-maxlength="255" ></div>
						<div class="box-error">
							<small ng-show="form.campusCashValidation.$error.required">Required.</small>
						</div>
					</li>

					<li class="li-input" ng-show="community.campus_cash" ng-class="{'error':form.campusCashMask.$invalid}">
						<div class="label">Campus Cash Mask:</div>
						<div class="input"><input type="text" name="campusCashMask" ng-model="community.campus_cash_mask" ng-maxlength="255" ></div>
						<div class="notes"><a href="https://github.com/candreoliveira/ngMask/#available-patterns" target="_blank">Patterns</a></div>
						<div class="box-error">
							<small ng-show="form.campusCashMask.$error.required">Required.</small>
						</div>
					</li>

					<li class="li-input" ng-show="community.campus_cash" ng-class="{'error':form.campusCashDefault.$invalid}">
						<div class="label">Make it the default payment method at restaurant's page?</div>
						<div class="input">
							<select name="campusCashDefault" ng-required="community.campus_cash" ng-model="community.campus_cash_default_payment" ng-options="opt.value as opt.label for opt in yesNo" ></select>
						</div>
						<div class="box-error">
							<small ng-show="form.campusCashMask.$error.required">Required.</small>
						</div>
					</li>

					<li class="li-input" ng-show="community.campus_cash" ng-class="{'error':form.signature.$invalid}">
						<div class="label">Require signature on receipt?</div>
						<div class="input">
							<select name="signature" ng-required="community.campus_cash" ng-model="community.signature" ng-options="opt.value as opt.label for opt in yesNo" ></select>
						</div>
					</li>

					<li class="li-input" ng-show="community.campus_cash" ng-class="{'error':form.campusCashDeliveryConfirmation.$invalid}">
						<div class="label">Show checkbox: "I certify that the address listed above for delivery is located on campus"? </div>
						<div class="input">
							<select name="campusCashDeliveryConfirmation" ng-required="community.campus_cash" ng-model="community.campus_cash_delivery_confirmation" ng-options="opt.value as opt.label for opt in yesNo" ></select>
						</div>
						<div class="box-error">
							<small ng-show="form.campusCashMask.$error.required">Required.</small>
						</div>
					</li>

				</ul>
			</div>
		</div>

	</form>


</div>

<div class="support-box-wrap box-content2" sticky-bottom="80">
	<div class="no-box-content-color">
		<ul class="ul-inputs">
			<li class="li-input" ng-show="!isSaving">
				<button class="button save" ng-click="save();">Save</button>
			</li>
			<li class="li-input" ng-show="isSaving">
				<i class="fa fa-circle-o-notch fa-spin"></i>
			</li>
		</ul>
	</div>
</div>
