Contact Us for Bookings and Enquiries | Cloud Spaces
Circle Mall JVC
Level 2, Circle Mall, Jumeirah Village Circle.
connect@cloudspaces.ae
+971 4 837 8300
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros.
Dubai Mall Fountain Views
Mezzanine Floor, Dubai Mall Fountain Views, Downtown, Dubai, United Arab Emirates.
connect@cloudspaces.ae
+971 4 490 0900
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros.
.png)
Opening Soon
AL HAMRA MALL
First Floor, Al Hamra Mall, Ras Al Khaimah, United Arab Emirates.
connect@cloudspaces.ae
+971 4 490 0800
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros.
custom code.
Requires jQuery (Webflow loads it by default).
Supported URL params:
?location=yas-mall -> matched against city "link-item"
?service=meeting-room -> matched against service "slug"
?interest=Meeting%20Room -> legacy, matched by slug/value/text
?interestedin=bookatour -> legacy, selects "Book a Tour"
Matching is punctuation- and case-insensitive, so "meeting-room",
"Meeting Room" and "meetingroom" all resolve to the same option.
========================================================================= */
$(document).ready(function () {
/* -----------------------------------------------------------------------
1. LOCATION + SERVICE DATA
value = what gets submitted | slug = what appears in the URL
--------------------------------------------------------------------- */
var cities = {
"United Arab Emirates": [
{
"value": "1",
"text": "Yas Mall – Abu Dhabi",
"slug": "Yas Mall",
"link-item": "yas-mall",
"services": [
{ "value": "Book a Tour", "text": "Book a Tour", "slug": "book-a-tour" },
{ "value": "Office Space", "text": "Office Space", "slug": "office-space" },
{ "value": "Cloud Membership", "text": "Cloud Membership", "slug": "cloud-membership" },
{ "value": "Business Setup", "text": "Business Setup", "slug": "business-setup" },
{ "value": "Recording Studio", "text": "Recording Studio", "slug": "recording-studio" },
{ "value": "Meeting Room", "text": "Meeting Room", "slug": "meeting-room" },
{ "value": "Day Pass", "text": "Day Pass", "slug": "day-pass" },
{ "value": "Event Space", "text": "Event Space", "slug": "event-space" },
{ "value": "Pod", "text": "Pod", "slug": "pod" },
{ "value": "Cubicle", "text": "Cubicle", "slug": "cubicle" },
{ "value": "Bubble", "text": "Bubble", "slug": "bubble" }
]
},
{
"value": "4",
"text": "ADGM - Abu Dhabi",
"slug": "adgm_level 15",
"link-item": "abu-dhabi-global-market",
"services": [
{ "value": "Book a Tour", "text": "Book a Tour", "slug": "book-a-tour" },
{ "value": "Office Space", "text": "Office Space", "slug": "office-space" },
{ "value": "Cloud Membership", "text": "Cloud Membership", "slug": "cloud-membership" },
{ "value": "Business Setup", "text": "Business Setup", "slug": "business-setup" },
{ "value": "Meeting Room", "text": "Meeting Room", "slug": "meeting-room" },
{ "value": "Day Pass", "text": "Day Pass", "slug": "day-pass" },
{ "value": "Event Space", "text": "Event Space", "slug": "event-space" },
{ "value": "Cubicle", "text": "Cubicle", "slug": "cubicle" },
{ "value": "Bubble", "text": "Bubble", "slug": "bubble" }
]
},
{
"value": "7",
"text": "The Mall WTC – Abu Dhabi",
"slug": "The WTC Mall",
"link-item": "wtc-mall-abu-dhabi",
"services": [
{ "value": "Book a Tour", "text": "Book a Tour", "slug": "book-a-tour" },
{ "value": "Office Space", "text": "Office Space", "slug": "office-space" },
{ "value": "Cloud Membership", "text": "Cloud Membership", "slug": "cloud-membership" },
{ "value": "Business Setup", "text": "Business Setup", "slug": "business-setup" },
{ "value": "Meeting Room", "text": "Meeting Room", "slug": "meeting-room" },
{ "value": "Day Pass", "text": "Day Pass", "slug": "day-pass" },
{ "value": "Event Space", "text": "Event Space", "slug": "event-space" },
{ "value": "Cubicle", "text": "Cubicle", "slug": "cubicle" },
{ "value": "Bubble", "text": "Bubble", "slug": "bubble" }
]
},
{
"value": "8",
"text": "Circle Mall – Dubai",
"slug": "Circle Mall",
"link-item": "circle-mall-jvc",
"services": [
{ "value": "Book a Tour", "text": "Book a Tour", "slug": "book-a-tour" },
{ "value": "Office Space", "text": "Office Space", "slug": "office-space" },
{ "value": "Cloud Membership", "text": "Cloud Membership", "slug": "cloud-membership" },
{ "value": "Business Setup", "text": "Business Setup", "slug": "business-setup" },
{ "value": "Photo Studio", "text": "Photo Studio", "slug": "photo-studio" },
{ "value": "Meeting Room", "text": "Meeting Room", "slug": "meeting-room" },
{ "value": "Day Pass", "text": "Day Pass", "slug": "day-pass" },
{ "value": "Event Space", "text": "Event Space", "slug": "event-space" },
{ "value": "Cubicle", "text": "Cubicle", "slug": "cubicle" },
{ "value": "Bubble", "text": "Bubble", "slug": "bubble" }
]
},
{
"value": "11",
"text": "Dubai Mall Fountain Views - Dubai",
"slug": "Dubai Mall Fountain Views",
"link-item": "dubai-fountain-views",
"services": [
{ "value": "Book a Tour", "text": "Book a Tour", "slug": "book-a-tour" },
{ "value": "Office Space", "text": "Office Space", "slug": "office-space" },
{ "value": "Cloud Membership", "text": "Cloud Membership", "slug": "cloud-membership" },
{ "value": "Business Setup", "text": "Business Setup", "slug": "business-setup" },
{ "value": "Meeting Room", "text": "Meeting Room", "slug": "meeting-room" },
{ "value": "Day Pass", "text": "Day Pass", "slug": "day-pass" },
{ "value": "Event Space", "text": "Event Space", "slug": "event-space" },
{ "value": "Cubicle", "text": "Cubicle", "slug": "cubicle" },
{ "value": "Bubble", "text": "Bubble", "slug": "bubble" },
{ "value": "Podcast Studio", "text": "Podcast Studio", "slug": "podcast-studio" },
{ "value": "Auditorium", "text": "Auditorium", "slug": "auditorium" }
]
},
{
"value": "17",
"text": "Al Hamra Mall - Opening Soon",
"slug": "Al Hamra Mall",
"link-item": "al-hamra-mall",
"services": [
{ "value": "Office Space", "text": "Office Space", "slug": "office-space" }
]
},
{
"value": "18",
"text": "The Galleria – Opening Soon",
"slug": "Clouds Galleria Mall",
"link-item": "the-galleria",
"services": [
{ "value": "Office Space", "text": "Office Space", "slug": "office-space" }
]
}
],
"Kingdom of Saudi Arabia": [
{
"value": "13",
"text": "Roshn Front - Riyadh",
"slug": "Roshan Front KSA",
"link-item": "roshn-front-ksa",
"services": [
{ "value": "Book a Tour", "text": "Book a Tour", "slug": "book-a-tour" },
{ "value": "Office Space", "text": "Office Space", "slug": "office-space" },
{ "value": "Cloud Membership", "text": "Cloud Membership", "slug": "cloud-membership" },
{ "value": "Business Setup", "text": "Business Setup", "slug": "business-setup" },
{ "value": "Meeting Room", "text": "Meeting Room", "slug": "meeting-room" },
{ "value": "Day Pass", "text": "Day Pass", "slug": "day-pass" },
{ "value": "Event Space", "text": "Event Space", "slug": "event-space" },
{ "value": "Cubicle", "text": "Cubicle", "slug": "cubicle" },
{ "value": "Bubble", "text": "Bubble", "slug": "bubble" }
]
},
{
"value": "12",
"text": "Kingdom Centre - Riyadh",
"slug": "Kingdom Centre - KSA",
"link-item": "kingdom-center-ksa",
"services": [
{ "value": "Book a Tour", "text": "Book a Tour", "slug": "book-a-tour" },
{ "value": "Office Space", "text": "Office Space", "slug": "office-space" },
{ "value": "Cloud Membership", "text": "Cloud Membership", "slug": "cloud-membership" },
{ "value": "Business Setup", "text": "Business Setup", "slug": "business-setup" },
{ "value": "Meeting Room", "text": "Meeting Room", "slug": "meeting-room" },
{ "value": "Day Pass", "text": "Day Pass", "slug": "day-pass" },
{ "value": "Event Space", "text": "Event Space", "slug": "event-space" },
{ "value": "Cubicle", "text": "Cubicle", "slug": "cubicle" },
{ "value": "Bubble", "text": "Bubble", "slug": "bubble" }
]
}
]
};
var DEFAULT_COUNTRY = "United Arab Emirates";
var params = new URLSearchParams(window.location.search);
/* -----------------------------------------------------------------------
2. HELPERS
--------------------------------------------------------------------- */
// "Book a Tour" / "book-a-tour" / "bookatour" all collapse to "bookatour"
function norm(str) {
return String(str == null ? "" : str).toLowerCase().replace(/[^a-z0-9]/g, "");
}
// find a city by its "link-item", across all countries
function findCityByLinkItem(linkItem) {
var wanted = norm(linkItem);
if (!wanted) return null;
var match = null;
Object.keys(cities).forEach(function (country) {
cities[country].forEach(function (city) {
if (norm(city["link-item"]) === wanted) {
match = { country: country, city: city };
}
});
});
return match;
}
// find a service on the currently selected city, by slug / value / text
function findServiceOnCurrentCity(needle) {
var wanted = norm(needle);
if (!wanted) return null;
var city = getSelectedCity();
if (!city || !city.services) return null;
return city.services.filter(function (svc) {
return norm(svc.slug) === wanted ||
norm(svc.value) === wanted ||
norm(svc.text) === wanted;
})[0] || null;
}
function getSelectedCity() {
var locations = cities[$("#Country").val()];
if (!locations) return null;
var citySlug = $("#City").val();
return locations.filter(function (loc) { return loc.slug === citySlug; })[0] || null;
}
/* -----------------------------------------------------------------------
3. CASCADING DROPDOWNS (Country -> City -> I am interested in)
--------------------------------------------------------------------- */
// Country changed -> rebuild City options
$("#Country").on("change", function () {
$('#City option[value!=""]').remove();
$('#ud_Iaminterestedin option[value!=""]').remove();
var selectedCountry = $(this).val();
if (!cities[selectedCountry]) return;
cities[selectedCountry].forEach(function (city) {
$("#City").append($("", {
value: city.slug,
text: city.text,
"data-slug": city["link-item"]
}));
});
});
// City changed -> rebuild service options
$("#City").on("change", function () {
$('#ud_Iaminterestedin option[value!=""]').remove();
var city = getSelectedCity();
if (!city || !city.services) return;
city.services.forEach(function (service) {
$("#ud_Iaminterestedin").append($("", {
value: service.value,
text: service.text,
"data-slug": service.slug
}));
});
// keep the hidden location field in sync with whatever is chosen
$("#Location-Name").val(city.text);
});
/* -----------------------------------------------------------------------
4. URL PARAM HANDLING
--------------------------------------------------------------------- */
function applyLocationFromUrl() {
var found = findCityByLinkItem(params.get("location"));
if (!found) return false;
$("#Country").val(found.country).trigger("change"); // builds City options
$("#City").val(found.city.slug).trigger("change"); // builds service options
return true;
}
// select a service only if it exists for the chosen location
function selectService(needle) {
var service = findServiceOnCurrentCity(needle);
if (!service) return false;
$("#ud_Iaminterestedin").val(service.value).trigger("change");
return true;
}
function applyServiceFromUrl() {
// ?service=meeting-room (preferred)
if (selectService(params.get("service"))) return;
// ?interest=Meeting%20Room (legacy)
if (selectService(params.get("interest"))) return;
// ?interestedin=bookatour (legacy)
if (norm(params.get("interestedin")) === "bookatour") {
selectService("book-a-tour");
}
}
// Boot order matters: country/city first, then the service selection.
if (!applyLocationFromUrl()) {
$("#Country").val(DEFAULT_COUNTRY).trigger("change");
}
applyServiceFromUrl();
/* -----------------------------------------------------------------------
5. "NUMBER OF PEOPLE" FIELD — show only for relevant services
(listed by slug)
--------------------------------------------------------------------- */
var SHOW_PEOPLE_FOR = [
"office-space",
"cloud-membership",
"meeting-room",
"event-space"
].map(norm);
function togglePeopleField() {
var $wrapper = $("#NumberOfPeopleWrapper");
var $input = $("#NumberOfPeople");
if (!$wrapper.length || !$input.length) return;
var slug = norm($("#ud_Iaminterestedin").find("option:selected").data("slug") ||
$("#ud_Iaminterestedin").val());
if (SHOW_PEOPLE_FOR.indexOf(slug) !== -1) {
$wrapper.css("display", "flex");
$input.attr("required", "required");
} else {
$wrapper.css("display", "none");
$input.removeAttr("required");
}
}
$("#ud_Iaminterestedin").on("change", togglePeopleField);
togglePeopleField(); // run once in case the URL preselected a service
/* -----------------------------------------------------------------------
6. PEOPLE COUNTER (+ / -)
--------------------------------------------------------------------- */
$(document).on("click", ".minus-counter", function () {
var $target = $(".no-people-input");
var value = Number($target.val()) || 0;
if (value >= 1) value--;
$target.val(value);
});
$(document).on("click", ".plus-counter", function () {
var $target = $(".no-people-input");
var value = Number($target.val()) || 0;
value++;
$target.val(value);
});
/* -----------------------------------------------------------------------
7. UTM PASSTHROUGH — read from localStorage into hidden fields,
clear only after a successful Webflow submission
--------------------------------------------------------------------- */
var utmFieldMap = {
utm_source: "UtmSource",
utm_medium: "UtmMedium",
utm_campaign: "UtmCampaign",
utm_term: "UtmTerm",
utm_content: "UtmContent"
};
Object.keys(utmFieldMap).forEach(function (key) {
var val = "";
try { val = localStorage.getItem(key) || ""; } catch (e) { /* storage blocked */ }
$('[name="' + utmFieldMap[key] + '"]').val(val);
});
var formWrapper = document.querySelector(".w-form");
if (formWrapper && window.MutationObserver) {
var observer = new MutationObserver(function (mutations) {
mutations.forEach(function (m) {
m.addedNodes.forEach(function (node) {
if (node.nodeType === 1 && node.classList && node.classList.contains("w-form-done")) {
Object.keys(utmFieldMap).forEach(function (key) {
try { localStorage.removeItem(key); } catch (e) {}
});
}
});
});
});
observer.observe(formWrapper, { childList: true, subtree: true });
}
});