diff options
52 files changed, 7040 insertions, 1051 deletions
diff --git a/CleanSpec.mk b/CleanSpec.mk index dae2b35..a9fea3e 100644 --- a/CleanSpec.mk +++ b/CleanSpec.mk @@ -211,15 +211,29 @@ $(call add-clean-step, rm -rf $(PRODUCT_OUT)/system/build.prop) # 4.4.2 $(call add-clean-step, rm -rf $(PRODUCT_OUT)/system/build.prop) +# "L" and beyond. +# Make libart the default runtime +$(call add-clean-step, rm -rf $(PRODUCT_OUT)/system/build.prop) + # Rename persist.sys.dalvik.vm.lib to allow new default $(call add-clean-step, rm -rf $(PRODUCT_OUT)/system/build.prop) +# KKWT development +$(call add-clean-step, rm -rf $(PRODUCT_OUT)/system/build.prop) +$(call add-clean-step, rm -rf $(PRODUCT_OUT)/system/app/*) +$(call add-clean-step, rm -rf $(PRODUCT_OUT)/obj/APPS/*) + # Add ro.product.cpu.abilist{32,64} to build.prop. $(call add-clean-step, rm -rf $(PRODUCT_OUT)/system/build.prop) # Adding dalvik.vm.dex2oat-flags to eng builds $(call add-clean-step, rm -rf $(PRODUCT_OUT)/system/build.prop) +# 4.4.4 (KKWT) +$(call add-clean-step, rm -rf $(PRODUCT_OUT)/system/build.prop) +$(call add-clean-step, rm -rf $(PRODUCT_OUT)/system/app/*) +$(call add-clean-step, rm -rf $(PRODUCT_OUT)/obj/APPS/*) + # Unset TARGET_PREFER_32_BIT_APPS for 64 bit targets. $(call add-clean-step, rm -rf $(PRODUCT_OUT)/system/build.prop) diff --git a/core/Makefile b/core/Makefile index 083d3c9..596c3c5 100644 --- a/core/Makefile +++ b/core/Makefile @@ -909,11 +909,6 @@ systemtarball-nodeps: $(FS_GET_STATS) \ .PHONY: stnod stnod: systemtarball-nodeps -# For platform-java goal, add platform as well -ifneq (,$(filter platform-java, $(MAKECMDGOALS))) -PLATFORM_ZIP_ADD_JAVA := true -endif - ####### ## platform.zip: system, plus other files to be used in PDK fusion build, ## in a zip file @@ -930,7 +925,7 @@ $(INSTALLED_PLATFORM_ZIP) : $(INTERNAL_SYSTEMIMAGE_FILES) $(TARGET_COPY_OUT_SYSTEM) \ $(patsubst $(PRODUCT_OUT)/%, %, $(TARGET_OUT_NOTICE_FILES)) \ $(addprefix symbols/,$(PDK_SYMBOL_FILES_LIST)) -ifeq (true,$(PLATFORM_ZIP_ADD_JAVA)) +ifneq ($(PDK_PLATFORM_JAVA_ZIP_CONTENTS),) $(hide) cd $(OUT_DIR) && zip -qry $(patsubst $(OUT_DIR)/%,%,$@) $(PDK_PLATFORM_JAVA_ZIP_CONTENTS) endif ifneq ($(PDK_PLATFORM_ZIP_PRODUCT_BINARIES),) @@ -1294,6 +1289,9 @@ endif .PHONY: target-files-package target-files-package: $(BUILT_TARGET_FILES_PACKAGE) +ifneq ($(filter $(MAKECMDGOALS),target-files-package),) +$(call dist-for-goals, target-files-package, $(BUILT_TARGET_FILES_PACKAGE)) +endif ifneq ($(TARGET_PRODUCT),sdk) ifeq ($(filter generic%,$(TARGET_DEVICE)),) @@ -1324,6 +1322,11 @@ $(INTERNAL_OTA_PACKAGE_TARGET): $(BUILT_TARGET_FILES_PACKAGE) $(DISTTOOLS) .PHONY: otapackage otapackage: $(INTERNAL_OTA_PACKAGE_TARGET) +endif # recovery_fstab is defined +endif # TARGET_NO_KERNEL != true +endif # TARGET_DEVICE != generic* +endif # TARGET_PRODUCT != sdk + # ----------------------------------------------------------------- # The update package @@ -1353,10 +1356,6 @@ $(INTERNAL_UPDATE_PACKAGE_TARGET): $(BUILT_TARGET_FILES_PACKAGE) $(DISTTOOLS) .PHONY: updatepackage updatepackage: $(INTERNAL_UPDATE_PACKAGE_TARGET) -endif # recovery_fstab is defined -endif # TARGET_NO_KERNEL != true -endif # TARGET_DEVICE != generic* -endif # TARGET_PRODUCT != sdk # ----------------------------------------------------------------- # A zip of the symbols directory. Keep the full paths to make it @@ -1506,7 +1505,6 @@ atree_dir := development/build sdk_atree_files := \ $(atree_dir)/sdk.exclude.atree \ - $(atree_dir)/sdk.atree \ $(atree_dir)/sdk-$(HOST_OS)-$(SDK_HOST_ARCH).atree # development/build/sdk-android-<abi>.atree is used to differentiate @@ -1517,6 +1515,12 @@ ifneq (,$(strip $(wildcard $(atree_dir)/sdk-android-$(TARGET_CPU_ABI).atree))) sdk_atree_files += $(atree_dir)/sdk-android-$(TARGET_CPU_ABI).atree endif +ifneq ($(PRODUCTS.$(INTERNAL_PRODUCT).PRODUCT_SDK_ATREE_FILES),) +sdk_atree_files += $(PRODUCTS.$(INTERNAL_PRODUCT).PRODUCT_SDK_ATREE_FILES) +else +sdk_atree_files += $(atree_dir)/sdk.atree +endif + deps := \ $(target_notice_file_txt) \ $(tools_notice_file_txt) \ @@ -1528,7 +1532,7 @@ deps := \ $(INSTALLED_SDK_BUILD_PROP_TARGET) \ $(INSTALLED_BUILD_PROP_TARGET) \ $(ATREE_FILES) \ - $(atree_dir)/sdk.atree \ + $(sdk_atree_files) \ $(HOST_OUT_EXECUTABLES)/atree \ $(HOST_OUT_EXECUTABLES)/line_endings diff --git a/core/android_manifest.mk b/core/android_manifest.mk new file mode 100644 index 0000000..21b95c2 --- /dev/null +++ b/core/android_manifest.mk @@ -0,0 +1,25 @@ +# Handle AndroidManifest.xmls +# Input: LOCAL_MANIFEST_FILE, LOCAL_FULL_MANIFEST_FILE, LOCAL_FULL_LIBS_MANIFEST_FILES +# Output: full_android_manifest + +ifeq ($(strip $(LOCAL_MANIFEST_FILE)),) + LOCAL_MANIFEST_FILE := AndroidManifest.xml +endif +ifdef LOCAL_FULL_MANIFEST_FILE + full_android_manifest := $(LOCAL_FULL_MANIFEST_FILE) +else + full_android_manifest := $(LOCAL_PATH)/$(LOCAL_MANIFEST_FILE) +endif + +# Set up rules to merge library manifest files +ifdef LOCAL_FULL_LIBS_MANIFEST_FILES +main_android_manifest := $(full_android_manifest) +full_android_manifest := $(intermediates.COMMON)/AndroidManifest.xml +$(full_android_manifest): PRIVATE_LIBS_MANIFESTS := $(LOCAL_FULL_LIBS_MANIFEST_FILES) +$(full_android_manifest) : $(main_android_manifest) $(LOCAL_FULL_LIBS_MANIFEST_FILES) + @echo "Merge android manifest files: $@ <-- $^" + @mkdir -p $(dir $@) + $(hide) $(ANDROID_MANIFEST_MERGER) --main $< --libs $(PRIVATE_LIBS_MANIFESTS) \ + --out $@ + +endif diff --git a/core/cleanbuild.mk b/core/cleanbuild.mk index 46a312a..fc56604 100644 --- a/core/cleanbuild.mk +++ b/core/cleanbuild.mk @@ -198,7 +198,8 @@ installclean_files := \ $(PRODUCT_OUT)/obj/EXECUTABLES/adbd_intermediates \ $(PRODUCT_OUT)/obj/EXECUTABLES/init_intermediates \ $(PRODUCT_OUT)/obj/ETC/mac_permissions.xml_intermediates \ - $(PRODUCT_OUT)/obj/ETC/sepolicy_intermediates + $(PRODUCT_OUT)/obj/ETC/sepolicy_intermediates \ + $(PRODUCT_OUT)/obj/ETC/init.environ.rc_intermediates # The files/dirs to delete during a dataclean, which removes any files # in the staging and emulator data partitions. diff --git a/core/clear_vars.mk b/core/clear_vars.mk index c6a09d8..8f76a29 100644 --- a/core/clear_vars.mk +++ b/core/clear_vars.mk @@ -111,6 +111,7 @@ LOCAL_EMMA_COVERAGE_FILTER:= LOCAL_WARNINGS_ENABLE:= LOCAL_FULL_MANIFEST_FILE:= LOCAL_MANIFEST_FILE:= +LOCAL_FULL_LIBS_MANIFEST_FILES:= LOCAL_RENDERSCRIPT_INCLUDES:= LOCAL_RENDERSCRIPT_INCLUDES_OVERRIDE:= LOCAL_RENDERSCRIPT_CC:= diff --git a/core/config.mk b/core/config.mk index 8e22fef..65370ab 100644 --- a/core/config.mk +++ b/core/config.mk @@ -409,6 +409,9 @@ ZIPALIGN := $(HOST_OUT_EXECUTABLES)/zipalign$(HOST_EXECUTABLE_SUFFIX) FINDBUGS := prebuilt/common/findbugs/bin/findbugs EMMA_JAR := external/emma/lib/emma$(COMMON_JAVA_PACKAGE_SUFFIX) +# Tool to merge AndroidManifest.xmls +ANDROID_MANIFEST_MERGER := java -classpath prebuilts/devtools/tools/lib/manifest-merger.jar com.android.manifmerger.Main merge + YACC_HEADER_SUFFIX:= .hpp # Don't use column under Windows, cygwin or not diff --git a/core/main.mk b/core/main.mk index 15b4cbc..747316f 100644 --- a/core/main.mk +++ b/core/main.mk @@ -393,7 +393,7 @@ ifdef is_sdk_build sdk_repo_goal := $(strip $(filter sdk_repo,$(MAKECMDGOALS))) MAKECMDGOALS := $(strip $(filter-out sdk_repo,$(MAKECMDGOALS))) -ifneq ($(words $(filter-out $(INTERNAL_MODIFIER_TARGETS) checkbuild,$(MAKECMDGOALS))),1) +ifneq ($(words $(filter-out $(INTERNAL_MODIFIER_TARGETS) checkbuild target-files-package,$(MAKECMDGOALS))),1) $(error The 'sdk' target may not be specified with any other targets) endif @@ -773,7 +773,7 @@ ifdef is_sdk_build dangling_modules := $(filter-out %64,$(dangling_modules)) endif ifneq ($(dangling_modules),) - $(error Module names '$(dangling_modules)' in PRODUCT_PACKAGES has nothing to install!) + $(warning: Modules '$(dangling_modules)' in PRODUCT_PACKAGES have nothing to install!) endif $(foreach m, $(PRODUCTS.$(INTERNAL_PRODUCT).PRODUCT_PACKAGES_DEBUG), \ $(if $(strip $(ALL_MODULES.$(m).INSTALLED)),,\ diff --git a/core/multi_prebuilt.mk b/core/multi_prebuilt.mk index be60e2f..bc85cea 100644 --- a/core/multi_prebuilt.mk +++ b/core/multi_prebuilt.mk @@ -69,7 +69,11 @@ $(foreach t,$(1), \ $(if $(7), \ $(eval LOCAL_BUILT_MODULE_STEM := $(7)) \ , \ - $(eval LOCAL_BUILT_MODULE_STEM := $(notdir $(LOCAL_SRC_FILES))) \ + $(if $(word 2,$(tw)), \ + $(eval LOCAL_BUILT_MODULE_STEM := $(LOCAL_MODULE)$(suffix $(LOCAL_SRC_FILES))) \ + , \ + $(eval LOCAL_BUILT_MODULE_STEM := $(notdir $(LOCAL_SRC_FILES))) \ + ) \ ) \ $(eval LOCAL_MODULE_SUFFIX := $(suffix $(LOCAL_SRC_FILES))) \ $(if $(filter user,$(TARGET_BUILD_VARIANT)), \ diff --git a/core/package_internal.mk b/core/package_internal.mk index 5285616..0f8c655 100644 --- a/core/package_internal.mk +++ b/core/package_internal.mk @@ -52,16 +52,6 @@ $(error $(LOCAL_PATH): Package modules may not define LOCAL_MODULE) endif LOCAL_MODULE := $(LOCAL_PACKAGE_NAME) -ifeq ($(strip $(LOCAL_MANIFEST_FILE)),) -LOCAL_MANIFEST_FILE := AndroidManifest.xml -endif - -# If you need to put the MANIFEST_FILE outside of LOCAL_PATH -# you can use FULL_MANIFEST_FILE -ifeq ($(strip $(LOCAL_FULL_MANIFEST_FILE)),) -LOCAL_FULL_MANIFEST_FILE := $(LOCAL_PATH)/$(LOCAL_MANIFEST_FILE) -endif - ifneq ($(strip $(LOCAL_MODULE_CLASS)),) $(error $(LOCAL_PATH): Package modules may not set LOCAL_MODULE_CLASS) endif @@ -94,8 +84,14 @@ package_resource_overlays := $(strip \ LOCAL_RESOURCE_DIR := $(package_resource_overlays) $(LOCAL_RESOURCE_DIR) -all_assets := $(call find-subdir-assets,$(LOCAL_ASSET_DIR)) -all_assets := $(addprefix $(LOCAL_ASSET_DIR)/,$(patsubst assets/%,%,$(all_assets))) +all_assets := $(strip \ + $(foreach dir, $(LOCAL_ASSET_DIR), \ + $(addprefix $(dir)/, \ + $(patsubst assets/%,%, \ + $(call find-subdir-assets, $(dir)) \ + ) \ + ) \ + )) all_resources := $(strip \ $(foreach dir, $(LOCAL_RESOURCE_DIR), \ @@ -185,7 +181,8 @@ ifeq ($(LOCAL_SDK_RES_VERSION),) LOCAL_SDK_RES_VERSION:=$(LOCAL_SDK_VERSION) endif -full_android_manifest := $(LOCAL_FULL_MANIFEST_FILE) +include $(BUILD_SYSTEM)/android_manifest.mk + $(LOCAL_INTERMEDIATE_TARGETS): \ PRIVATE_ANDROID_MANIFEST := $(full_android_manifest) ifneq (,$(filter-out current, $(LOCAL_SDK_VERSION))) diff --git a/core/pathmap.mk b/core/pathmap.mk index 28661c2..ee79647 100644 --- a/core/pathmap.mk +++ b/core/pathmap.mk @@ -105,12 +105,15 @@ FRAMEWORKS_BASE_JAVA_SRC_DIRS := \ # A list of all source roots under frameworks/support. # FRAMEWORKS_SUPPORT_SUBDIRS := \ + annotations \ v4 \ v7/gridlayout \ v7/appcompat \ v7/mediarouter \ + v7/recyclerview \ v8/renderscript \ - v13 + v13 \ + v17/leanback # # A version of FRAMEWORKS_SUPPORT_SUBDIRS that is expanded to full paths from diff --git a/core/pdk_config.mk b/core/pdk_config.mk index 9590d70..b0cccc9 100644 --- a/core/pdk_config.mk +++ b/core/pdk_config.mk @@ -37,11 +37,16 @@ endif endif # fusion endif # pdk or fusion +PDK_PLATFORM_JAVA_ZIP_JAVA_TARGET_LIB_DIR := +PDK_PLATFORM_JAVA_ZIP_JAVA_HOST_LIB_DIR := \ + host/common/obj/JAVA_LIBRARIES/bouncycastle-host_intermediates +PDK_PLATFORM_JAVA_ZIP_CONTENTS := + ifneq (,$(filter platform-java, $(MAKECMDGOALS))$(PDK_FUSION_PLATFORM_ZIP)) # additional items to add to platform.zip for platform-java build # For these dirs, add classes.jar and javalib.jar from the dir to platform.zip # all paths under out dir -PDK_PLATFORM_JAVA_ZIP_JAVA_LIB_DIR := \ +PDK_PLATFORM_JAVA_ZIP_JAVA_TARGET_LIB_DIR += \ target/common/obj/JAVA_LIBRARIES/android_stubs_current_intermediates \ target/common/obj/JAVA_LIBRARIES/core_intermediates \ target/common/obj/JAVA_LIBRARIES/core-junit_intermediates \ @@ -52,14 +57,21 @@ PDK_PLATFORM_JAVA_ZIP_JAVA_LIB_DIR := \ target/common/obj/JAVA_LIBRARIES/telephony-common_intermediates \ target/common/obj/JAVA_LIBRARIES/voip-common_intermediates \ target/common/obj/JAVA_LIBRARIES/mms-common_intermediates \ - target/common/obj/JAVA_LIBRARIES/android-ex-camera2_intermediates + target/common/obj/JAVA_LIBRARIES/android-ex-camera2_intermediates \ + target/common/obj/JAVA_LIBRARIES/android-common_intermediates \ + # not java libraries -PDK_PLATFORM_JAVA_ZIP_CONTENTS := \ +PDK_PLATFORM_JAVA_ZIP_CONTENTS += \ target/common/obj/APPS/framework-res_intermediates/package-export.apk \ target/common/obj/APPS/framework-res_intermediates/src/R.stamp +endif # platform-java or FUSION build + +PDK_PLATFORM_JAVA_ZIP_JAVA_LIB_DIR := \ + $(PDK_PLATFORM_JAVA_ZIP_JAVA_TARGET_LIB_DIR) \ + $(PDK_PLATFORM_JAVA_ZIP_JAVA_HOST_LIB_DIR) + PDK_PLATFORM_JAVA_ZIP_CONTENTS += $(foreach lib_dir,$(PDK_PLATFORM_JAVA_ZIP_JAVA_LIB_DIR),\ $(lib_dir)/classes.jar $(lib_dir)/javalib.jar) -endif # platform-java or FUSION build # check and override java support level ifneq ($(TARGET_BUILD_PDK)$(PDK_FUSION_PLATFORM_ZIP),) @@ -117,6 +129,11 @@ $(PRODUCT_OUT)/% : $(_pdk_fusion_intermediates)/% $(_pdk_fusion_stamp) $(hide) rm -rf $@ $(hide) cp -fpPR $< $@ +# implicit rules for host java files +$(HOST_COMMON_OUT_ROOT)/% : $(_pdk_fusion_intermediates)/host/common/% $(_pdk_fusion_stamp) + @mkdir -p $(dir $@) + $(hide) cp -fpPR $< $@ + ifeq (true,$(TARGET_BUILD_PDK_JAVA_PLATFORM)) PDK_FUSION_OUT_DIR := $(OUT_DIR) @@ -137,11 +154,11 @@ target/common/obj/APPS/framework-res_intermediates/src/R.stamp,\ target/common/obj/APPS/framework-res_intermediates/package-export.apk)) # javalib.jar should pull classes.jar as classes.jar is not explicitly pulled. -$(foreach lib_dir,$(PDK_PLATFORM_JAVA_ZIP_JAVA_LIB_DIR),\ +$(foreach lib_dir,$(PDK_PLATFORM_JAVA_ZIP_JAVA_TARGET_LIB_DIR),\ $(eval $(call JAVA_dependency_template,$(lib_dir)/javalib.jar,\ $(lib_dir)/classes.jar))) -# implicit rules for all others +# implicit rules for all other target files $(TARGET_COMMON_OUT_ROOT)/% : $(_pdk_fusion_intermediates)/target/common/% $(_pdk_fusion_stamp) @mkdir -p $(dir $@) $(hide) cp -fpPR $< $@ diff --git a/core/product.mk b/core/product.mk index fd405ad..174b429 100644 --- a/core/product.mk +++ b/core/product.mk @@ -86,6 +86,7 @@ _product_var_list := \ PRODUCT_PACKAGE_OVERLAYS \ DEVICE_PACKAGE_OVERLAYS \ PRODUCT_TAGS \ + PRODUCT_SDK_ATREE_FILES \ PRODUCT_SDK_ADDON_NAME \ PRODUCT_SDK_ADDON_COPY_FILES \ PRODUCT_SDK_ADDON_COPY_MODULES \ diff --git a/core/proguard_basic_keeps.flags b/core/proguard_basic_keeps.flags index af0e05d..622d4ee 100644 --- a/core/proguard_basic_keeps.flags +++ b/core/proguard_basic_keeps.flags @@ -49,9 +49,10 @@ # -keep class * extends android.preference.Preference # -keep class * extends android.app.BackupAgent -#-keep class * implements android.os.Parcelable { -# public static final android.os.Parcelable$Creator *; -#} +# Parcelable CREATORs must be kept for Parcelable functionality +-keep class * implements android.os.Parcelable { + public static final ** CREATOR; +} # The support library contains references to newer platform versions. # Don't warn about those in case this app is linking against an older diff --git a/core/static_java_library.mk b/core/static_java_library.mk index f95a382..f31ccd8 100644 --- a/core/static_java_library.mk +++ b/core/static_java_library.mk @@ -66,14 +66,7 @@ include $(BUILD_SYSTEM)/java_library.mk ifneq (,$(all_resources)) R_file_stamp := $(LOCAL_INTERMEDIATE_SOURCE_DIR)/R.stamp -ifeq ($(strip $(LOCAL_MANIFEST_FILE)),) - LOCAL_MANIFEST_FILE := AndroidManifest.xml -endif -ifdef LOCAL_FULL_MANIFEST_FILE - full_android_manifest := $(LOCAL_FULL_MANIFEST_FILE) -else - full_android_manifest := $(LOCAL_PATH)/$(LOCAL_MANIFEST_FILE) -endif +include $(BUILD_SYSTEM)/android_manifest.mk LOCAL_SDK_RES_VERSION:=$(strip $(LOCAL_SDK_RES_VERSION)) ifeq ($(LOCAL_SDK_RES_VERSION),) diff --git a/core/tasks/vendor_module_check.mk b/core/tasks/vendor_module_check.mk index 87d723c..9c19422 100644 --- a/core/tasks/vendor_module_check.mk +++ b/core/tasks/vendor_module_check.mk @@ -22,6 +22,7 @@ _vendor_owner_whitelist := \ csr \ elan \ google \ + htc \ imgtec \ invensense \ intel \ diff --git a/core/version_defaults.mk b/core/version_defaults.mk index 1e172ed..6690f70 100644 --- a/core/version_defaults.mk +++ b/core/version_defaults.mk @@ -41,7 +41,7 @@ ifeq "" "$(PLATFORM_VERSION)" # which is the version that we reveal to the end user. # Update this value when the platform version changes (rather # than overriding it somewhere else). Can be an arbitrary string. - PLATFORM_VERSION := 4.4.3 + PLATFORM_VERSION := 4.4W endif ifeq "" "$(PLATFORM_SDK_VERSION)" @@ -53,7 +53,7 @@ ifeq "" "$(PLATFORM_SDK_VERSION)" # intermediate builds). During development, this number remains at the # SDK version the branch is based on and PLATFORM_VERSION_CODENAME holds # the code-name of the new development work. - PLATFORM_SDK_VERSION := 19 + PLATFORM_SDK_VERSION := 20 endif ifeq "" "$(PLATFORM_VERSION_CODENAME)" diff --git a/envsetup.sh b/envsetup.sh index 6c25ebe..b91d518 100644 --- a/envsetup.sh +++ b/envsetup.sh @@ -11,6 +11,7 @@ Invoke ". build/envsetup.sh" from your shell to add the following functions to y - mma: Builds all of the modules in the current directory, and their dependencies. - mmma: Builds all of the modules in the supplied directories, and their dependencies. - cgrep: Greps on all local C/C++ files. +- ggrep: Greps on all local Gradle files. - jgrep: Greps on all local Java files. - resgrep: Greps on all local res/*.xml files. - godir: Go to the directory containing a file. @@ -1086,6 +1087,11 @@ function gettargetarch get_build_var TARGET_ARCH } +function ggrep() +{ + find . -name .repo -prune -o -name .git -prune -o -name out -prune -o -type f -name "*\.gradle" -print0 | xargs -0 grep --color -n "$@" +} + function jgrep() { find . -name .repo -prune -o -name .git -prune -o -name out -prune -o -type f -name "*\.java" -print0 | xargs -0 grep --color -n "$@" diff --git a/target/product/base.mk b/target/product/base.mk index 8aa3bc0..4b8326d 100644 --- a/target/product/base.mk +++ b/target/product/base.mk @@ -49,7 +49,6 @@ PRODUCT_PACKAGES += \ libeffects \ libinput \ libiprouteutil \ - libjni_latinime \ libjnigraphics \ libldnhncr \ libmedia \ @@ -58,7 +57,6 @@ PRODUCT_PACKAGES += \ libmtp \ libnetlink \ libnetutils \ - libpac \ libreference-ril \ libreverbwrapper \ libril \ @@ -103,7 +101,6 @@ PRODUCT_PACKAGES += \ tc \ vdc \ vold \ - webview \ wm diff --git a/target/product/core.mk b/target/product/core.mk index c5ef2aa..8c88b94 100644 --- a/target/product/core.mk +++ b/target/product/core.mk @@ -29,6 +29,7 @@ PRODUCT_PACKAGES += \ KeyChain \ PicoTts \ PacProcessor \ + libpac \ ProxyHandler \ SharedStorageBackup \ VpnDialogs diff --git a/target/product/core_base.mk b/target/product/core_base.mk index 8161434..10e704b 100644 --- a/target/product/core_base.mk +++ b/target/product/core_base.mk @@ -33,7 +33,6 @@ PRODUCT_PACKAGES += \ libbcc \ libfilterpack_imageproc \ libgabi++ \ - libkeystore \ libmdnssd \ libnfc_ndef \ libpowermanager \ diff --git a/target/product/core_minimal.mk b/target/product/core_minimal.mk index 9cd2903..26e868c 100644 --- a/target/product/core_minimal.mk +++ b/target/product/core_minimal.mk @@ -51,13 +51,18 @@ PRODUCT_PACKAGES += \ libdrmframework \ libdrmframework_jni \ libfilterfw \ + libkeystore \ libsqlite_jni \ libwilhelm \ logd \ make_ext4fs \ screencap \ sensorservice \ - uiautomator + uiautomator \ + webview + +PRODUCT_COPY_FILES += \ + frameworks/native/data/etc/android.software.webview.xml:system/etc/permissions/android.software.webview.xml # The order of PRODUCT_BOOT_JARS matters. PRODUCT_BOOT_JARS := \ diff --git a/target/product/core_tiny.mk b/target/product/core_tiny.mk new file mode 100644 index 0000000..52244a3 --- /dev/null +++ b/target/product/core_tiny.mk @@ -0,0 +1,114 @@ +# +# Copyright (C) 2013 The Android Open Source Project +# +# Licensed under the Apache License, Version 2.0 (the "License"); +# you may not use this file except in compliance with the License. +# You may obtain a copy of the License at +# +# http://www.apache.org/licenses/LICENSE-2.0 +# +# Unless required by applicable law or agreed to in writing, software +# distributed under the License is distributed on an "AS IS" BASIS, +# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +# See the License for the specific language governing permissions and +# limitations under the License. +# +# Tiny configuration for small devices such as wearables. Includes base and embedded. +# No telephony + +PRODUCT_PACKAGES := \ + Bluetooth \ + CalendarProvider \ + ContactsProvider \ + CertInstaller \ + FusedLocation \ + InputDevices \ + bluetooth-health \ + hostapd \ + wpa_supplicant.conf + +PRODUCT_PACKAGES += \ + audio \ + clatd \ + clatd.conf \ + dhcpcd.conf \ + network \ + pand \ + pppd \ + sdptool \ + wpa_supplicant + +PRODUCT_PACKAGES += \ + audio.primary.default \ + audio_policy.default \ + local_time.default \ + power.default + +PRODUCT_PACKAGES += \ + local_time.default + +PRODUCT_PACKAGES += \ + BackupRestoreConfirmation \ + DefaultContainerService \ + SettingsProvider \ + Shell \ + bu \ + com.android.location.provider \ + com.android.location.provider.xml \ + framework-res \ + installd \ + ip \ + ip-up-vpn \ + ip6tables \ + iptables \ + keystore \ + keystore.default \ + libOpenMAXAL \ + libOpenSLES \ + libdownmix \ + libfilterfw \ + libkeystore \ + libsqlite_jni \ + libwilhelm \ + libdrmframework_jni \ + libdrmframework \ + make_ext4fs \ + nullwebview \ + screencap \ + sensorservice \ + uiautomator \ + telephony-common \ + voip-common \ + mms-common + +# The order matters +PRODUCT_BOOT_JARS := \ + core \ + conscrypt \ + okhttp \ + core-junit \ + bouncycastle \ + ext \ + framework \ + framework2 \ + telephony-common \ + voip-common \ + mms-common \ + android.policy \ + services \ + apache-xml \ + nullwebview + +PRODUCT_RUNTIMES := runtime_libdvm_default + +PRODUCT_PROPERTY_OVERRIDES += \ + ro.carrier=unknown + +$(call inherit-product-if-exists, frameworks/base/data/fonts/fonts.mk) + +# Overrides +PRODUCT_BRAND := tiny +PRODUCT_DEVICE := tiny +PRODUCT_NAME := core_tiny + +$(call inherit-product, $(SRC_TARGET_DIR)/product/base.mk) diff --git a/target/product/embedded.mk b/target/product/embedded.mk index cfac003..b60c948 100644 --- a/target/product/embedded.mk +++ b/target/product/embedded.mk @@ -20,6 +20,7 @@ PRODUCT_PACKAGES += \ adb \ adbd \ + atrace \ bootanimation \ debuggerd \ debuggerd64 \ @@ -57,6 +58,7 @@ PRODUCT_PACKAGES += \ libutils \ linker \ linker64 \ + lmkd \ logcat \ logwrapper \ mkshrc \ diff --git a/tools/droiddoc/templates-sdk-dyn/assets/css/default.css b/tools/droiddoc/templates-sdk-dyn/assets/css/default.css index 7515360..e26aec6 100644 --- a/tools/droiddoc/templates-sdk-dyn/assets/css/default.css +++ b/tools/droiddoc/templates-sdk-dyn/assets/css/default.css @@ -98,7 +98,8 @@ body { #devdoc-nav.fixed { position: fixed; margin:0; - top: 20px; } + top: 65px; /* sticky-header height + 20px gutter */ +} #devdoc-nav span.small { font-size:12px; @@ -358,6 +359,19 @@ video.with-shadow { #nav li span.tree-list-subtitle:after { content: '—'; } + #nav li span.tree-list-subtitle.package { + padding-top:15px; + cursor:default; + } + #nav li span.tree-list-subtitle.package:before { + content: ''; + } + #nav li span.tree-list-subtitle.package:after { + content: ''; + } + #nav li ul.tree-list-children.classes { + padding-left:10px; + } #nav li ul { display:none; overflow: hidden; @@ -1365,8 +1379,7 @@ color-stop(50%, #acbc00), color-stop(50%, #bdde00), color-stop(100%, #bdde00)); .training-nav-top, .training-nav-bottom, #doc-col .content-footer, .nav-x, .nav-y, - .paging-links, - a.totop { + .paging-links { display: none !important; } @@ -1491,7 +1504,8 @@ color-stop(50%, #acbc00), color-stop(50%, #bdde00), color-stop(100%, #bdde00)); Header, Login, Nav-X, Search */ #header { - padding: 2.2em 0 0.2em 0; + margin: 0; + padding: 0; } #header:before, #header:after { content: ""; @@ -1828,8 +1842,8 @@ EndColorStr='#ececec'); #qv-wrapper { float:right; clear:right; - margin:0 0 0 20px; /* negative top-margin to counter the content-header bottom margin */ - padding:0 0 20px; + margin:0 0 0 30px; /* negative top-margin to counter the content-header bottom margin */ + padding:0 0 30px; } #tb-wrapper { @@ -2871,26 +2885,6 @@ div.design-announce p { margin:0 0 10px; } -#devdoc-nav a.totop { - display:block; - top:0; - width:inherit; - background: transparent url(../images/styles/gototop.png) no-repeat scroll 50% 50%; - text-indent:-9999em; -} -#devdoc-nav a.totop { - position:fixed; - display:none; -} -#devdoc-nav a.totop:hover { - background-color:#33B5E5; -} - -.content-footer a.totop { - text-transform:uppercase; - line-height:30px; -} - .expandable { height:34px; padding-left:20px; @@ -3955,13 +3949,174 @@ EndColorStr='#ececec'); z-index:100; } -} +/************ STICKY NAV BAR ******************/ + +#header-wrapper { + background: #f9f9f9; + margin: 0 -10px 0 -10px; + padding: 31px 10px 0px 10px; + position: relative; +} +#header-wrapper #nav-x div.wrap { + max-width: 940px; + height: 38px; +} +#header-wrapper #nav-x ul.nav-x li { + margin-right: 36px !important; + margin-top: 5px; + margin-bottom: 0px; + height: 30px; +} +#header-wrapper #nav-x > div.wrap ul.nav-x li.active { + color: #669900; + border-bottom: 3px solid #669900; +} +#header-wrapper #nav-x > div.wrap ul.nav-x li.active a { + color: #669900; +} +#header-wrapper #nav-x > div.wrap ul.nav-x a { + font-size: 14.5px; +} +#header-wrapper .developer-console-btn { + float: right; + background: #fefefe; + border-radius: 4px; + padding: 8px 14px; + box-shadow: 1px 1px 0px #7a7a7a; + font-size: 14px; + margin-top: -6px; + cursor: pointer; + color: #464646; + margin-right: 20px; +} +/* not currently used */ +#header-wrapper .shadow { + width: 1034px; + height: 4px; + position: absolute; + left: 50%; + margin-left: -517px; + bottom: -4px; + background-image: url(../images/header-shadow.png); +} + +#context { + clear: both; + padding-top: 14px; +} +#context .breadcrumb { + float: left; + margin-bottom: 10px; +} +#context .util { + float: right; + margin-right: 20px; +} + +.breadcrumb { + list-style: none; + margin: 0; + padding: 0; + position: relative; +} +.breadcrumb li { + float: left; + padding: 0 20px 0 0; + color: #000; + white-space: nowrap; +} +.breadcrumb li a { + color: #000; +} +.breadcrumb li:after { + content: url(../images/breadcrumb.png); + position: relative; + top: 1px; + left: 10px; + width: 5px; + height: 10px; +} +.breadcrumb li.current { + font-weight: 700; +} +.breadcrumb li.current:after { + display: none; +} + +/* Sticky Nav overrides */ +.sticky-menu { + position: fixed; + width: 940px; + height: 0px; + z-index: 51; + top: 12px; +} +#sticky-header { + display: none; + padding: 0 10px; + position: fixed; + background: #f9f9f9; + top: 0px; + left: 0px; + right: 0px; + height: 45px; + box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.1); + border-bottom: 1px solid #a5c43a; + z-index: 50; +} +#sticky-header.design { + border-bottom: 1px solid #33b5e5; +} +#sticky-header.develop { + border-bottom: 1px solid #F80; +} +#sticky-header.distribute { + border-bottom: 1px solid #9C0; +} +#sticky-header.about { + border-bottom: 1px solid #9933CC; +} +#sticky-header > div { + overflow: hidden; + *zoom: 1; + width: 940px; + margin: 0 auto; + clear: both; + padding-top: 9px; +} +#sticky-header > div .logo { + float: left; + width: 26px; + height: 25px; + background: url(../images/dac_logo.png); + z-index: 52; + position: relative; +} +#sticky-header > div .top { + float: left; + width: 38px; + height: 38px; + position: relative; + background: url(../images/styles/gototop.png); + z-index: 52; +} +#sticky-header > div .breadcrumb { + float: left; + padding: 0 0 0 10px; + border-left: 1px solid #d2d2d2; + line-height: 24px; + font-size: 14px; + position: relative; + top: 0px; + z-index: 52; +} +} @@ -4001,7 +4156,6 @@ EndColorStr='#ececec'); } .logo a { - width:123px; float:left; } @@ -4013,6 +4167,17 @@ EndColorStr='#ececec'); padding-right:10px; } + +#header-wrap .logo.wear-logo { + width:220px; + margin:0; + padding:0; + margin-bottom:22px; +} +#header-wrap .logo.wear-logo img { + padding:0 0 0 10px; +} + .search { height:25px; margin-top: -3px; @@ -4436,11 +4601,11 @@ a.download-sdk { } #nav-x { - padding-top: 14px; + padding-top: 13px; } #nav-x .wrap { - min-height:34px; + min-height:32px; } #nav-x .wrap, @@ -4782,53 +4947,6 @@ a.download-sdk { -/************ DISTRIBUTE HOMEPAGE ***************/ - -.marquee { - width: 760px; -} -.marquee .main-img { - float: left; - margin-top: 20px; - width: 490px; -} -.marquee .copy { - width: 270px; - float: left; - margin-top: 30px; -} -.distribute-features { - margin: 0; -} -.distribute-features ul { - margin: 0; -} -.distribute-features ul li { - list-style: none; - float: left; - border-top: 1px solid #9C0; - width: 220px; - margin-right: 50px; -} -.distribute-features ul li.last { - margin-right: 0px; -} - -.distribute-features .distribute-link li a { - color:red !important; -} - -.distribute-features .distribute-link li a, -.distribute-features .distribute-link li a:active { - color:#555 !important; -} - -.distribute-features .distribute-link li a:hover, -.distribute-features .distribute-link li a:hover * { - color:#7AA1B0 !important; -} - - /************ DEVELOP TOPIC CONTAINERS ************/ .landing-banner, @@ -5006,3 +5124,1263 @@ a.download-sdk { .fullpage #footer { margin-top: -40px; } + +/************ DISTRIBUTE PAGES ******************/ + +/* Article page header line fix */ +.headerLine { + overflow: hidden; +} +.headerLine h1 { + float: left; + padding-right: 20px; + margin-bottom: 0px; + font-size: 20px; + color: #363636; +} +.headerLine hr { + overflow: hidden; + margin: 42px 0 0 0; +} + +.article-detail #body-content { + padding-top: 10px; +} + +/* A container for grid sets with uppercase h3 and rule */ +.dynamic-grid h3 { + font-size:14px; + line-height:21px; + color:#555; + text-transform:uppercase; + border-bottom:1px solid #CCC; + padding:8px 0 0 1px; + margin-bottom:10px; + clear:both; +} + +.top-right-float { + float: right; +} + +.clearfloat { + float: none; + clear: both; +} + +.border-img { + border: 1px solid #CCC; +} + +.center-img { + margin: auto; + text-align: center; +} +.center-img img { + margin-bottom: 15px; +} + +.figure img, .border-img { + margin-bottom: 15px; +} + +/************ RESOURCE CARDS ******************/ + +/* Resource cards, 12, 13, 16-col */ + +/* Basic card-styling with shadow */ +.resource-card { + border-radius: 1px; + box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.14); + background: #fefefe; +} + +/* Styling for background image including tinting and section icons in stacks */ +.card-bg { + display: block; + position: absolute; + vertical-align: top; + width: 100%; + left: 0; + top: 0; + background-size: cover; + background-repeat: no-repeat; + background-position: center; + background-image: url(../images/resource-card-default-android.jpg); +} +.card-bg:after { + content: ""; + display: block; + height: 100%; + width: 100%; + opacity: 1; + background: rgba(0, 0, 0, 0.2); + -webkit-transition: opacity 0.5s; + -moz-transition: opacity 0.5s; + -o-transition: opacity 0.5s; + transition: opacity 0.5s; +} +.card-bg .card-section-icon { + position: absolute; + top: 50%; + width: 100%; + margin-top: -35px; + text-align: center; + padding-top: 65px; + z-index: 100; +} +.card-bg .card-section-icon .icon { + position: absolute; + left: 50%; + margin-left: -28px; + top: 0px; + width: 56px; + height: 56px; + background-repeat: no-repeat; + background-position: 50% 50%; + background-image: url(../images/stack-icon.png); +} +.card-bg .card-section-icon .section { + text-transform: uppercase; + color: white; + font-size: 14px; +} + +.card-info { + position: absolute; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; + top: 0; + right: 0; + bottom: 0; + left: 0; + overflow: hidden; + background: #fefefe; + padding: 4px 12px 6px 12px; +} +.card-info .section { + text-transform: uppercase; + color: #898989; + font-size: 12px; + margin-bottom: 1px; +} +.card-info .title { + color: #363636; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + padding-bottom: 5px; + margin-bottom: -2px; + font-size: 16px; +} +.card-info .description { + overflow: hidden; +} +.card-info .description .text { + color: #464646; + font: 13px/15px Roboto Condensed; + overflow: hidden; + width:100%; +} +.card-info .description .util { + position: absolute; + right: 5px; + bottom: 70px; /*-2px;*/ + opacity: 0; + -webkit-transition: opacity 0.5s; + -moz-transition: opacity 0.5s; + -o-transition: opacity 0.5s; + transition: opacity 0.5s; +} +.card-info.empty-desc .title { + white-space: normal; + overflow: visible; +} +.card-info.empty-desc .description { + display: none; +} +/* Truncate card summaries at bounding box and + * and apply ellipsis at lower right */ +.ellipsis { + overflow: hidden; + float:right; + line-height: 15px; + width:100%; +} +.resource-card-6x6 .card-info .description .teddddddxt { + float:left; + position:relative; + margin-left:0; +} +.ellipsis:before { + content:""; + float: left; + width: 5px; + height:100%; +} +.ellipsis > *:first-child.text { + float: right; + width: 100% !important; + margin-left: -5px; +} +.ellipsis:after { + content: "\02026"; + height:17px; + padding-bottom:4px; + + box-sizing: content-box; + -webkit-box-sizing: content-box; + -moz-box-sizing: content-box; + + float: right; position: relative; + top: -16px; left: 100%; + width: 4em; margin-left: -4em; + padding-right: 5px; + + background: -webkit-gradient(linear, left top, right top, + from(rgba(255, 255, 255, 0)), to(white), color-stop(65%, white)); + background: -moz-linear-gradient(to right, rgba(255, 255, 255, 0), white 65%, white); + background: -o-linear-gradient(to right, rgba(255, 255, 255, 0), white 65%, white); + background: -ms-linear-gradient(to right, rgba(255, 255, 255, 0), white 65%, white); + background: linear-gradient(to right, rgba(255, 255, 255, 0), white 65%, white); +} +.ellipsis:after { + font-style: normal; color: #aaa; + font-size:13px; + text-align: right; +} + +/* Flow Layout */ +.resource-flow-layout { + display: inline-block; +} +.resource-flow-layout .resource-card, .resource-flow-layout .resource-card-stack { + float: left; + position: relative; +} +.resource-flow-layout .resource-card-stack > .resource-card { + margin-right: 0px !important; +} +.resource-flow-layout:after { + content: "."; + display: block; + height: 0; + clear: both; + visibility: hidden; +} + +.resource-card:hover { + cursor: pointer; +} +.resource-card:hover .card-bg:after { + opacity: 0; +} +/* disabled to make way for fade/ellipsis truncation, + and the plusone moves up. +.resource-card:hover .card-info .description .text { + padding-right: 70px; +} */ +.resource-card:hover .card-info .description .util { + opacity: 1; +} + +/* Carousel Layout */ +/* Carousel styles for landing page */ +.resource-carousel-layout { + margin: 20px 0 20px 0; + position: relative; + overflow: hidden; +} +.resource-carousel-layout .slideshow-prev, .resource-carousel-layout .slideshow-next { + display: none; +} +.resource-carousel-layout .pagination { + bottom: 0px; +} +.resource-carousel-layout .frame li { + position: relative; +} +.resource-carousel-layout .frame li .card-bg { + height: 300px; +} +.resource-carousel-layout .frame li .card-info { + padding: 7px 15px 0px 15px; + top: 300px; +} +.resource-carousel-layout .frame li .card-info .section { + font-size: 13px; + margin-bottom: 7px; +} +.resource-carousel-layout .frame li .card-info .title { + font-size: 25px; + margin-bottom: 2px; +} +.resource-carousel-layout .frame li .card-info .description { + font-family: 15px/16px Roboto Condensed, sans-serif; +} +.resource-carousel-layout .frame li .card-info .description .text { + height: 40px; +} +.resource-carousel-layout .frame li .card-info .description .util { + bottom:97px; + right:4px; +} + +/* Stack Layout */ +.resource-stack-layout { + display: inline-block; +} +.resource-stack-layout .resource-card-stack { + float: left; + position: relative; +} +.resource-stack-layout .resource-card { + margin-bottom: 20px; + display: block; + position: relative; +} +.resource-stack-layout .section-card-menu > .card-info .section, .resource-stack-layout .section-card > .card-info .title { + /*text-transform: uppercase;*/ + color: #898989; + font-size: 17px; + line-height: 24px; + margin-bottom: 6px; +} +.resource-stack-layout .section-card { + height: 284px; +} +.resource-stack-layout .section-card > .card-bg { + height: 192px; +} +.resource-stack-layout .section-card > .card-info { + padding: 4px 12px 6px 12px; + top: 192px; +} +.resource-stack-layout .section-card > .card-info .section { + display: none; +} +.resource-stack-layout .section-card > .card-info .title { + font-size: 17px; + border-bottom: 1px solid #959595; + padding-bottom: 0px; +} +.resource-stack-layout .section-card > .card-info .description { + font-size: 13px; + line-height: 15px; +} +.resource-stack-layout .section-card > .card-info .description .text { + height: 30px; +} +.resource-stack-layout .related-card { + height: 90px; +} +.resource-stack-layout .related-card > .card-bg { + left: 0; + top: 0; + width: 90px; + height: 100%; + position: absolute; + display: block; +} +.resource-stack-layout .related-card > .card-info { + left: 90px; + padding: 4px 12px 4px 12px; +} +.resource-stack-layout .related-card > .card-info .section { + font-size: 12px; + margin-bottom: 1px; + display: none; +} +.resource-stack-layout .related-card > .card-info .title { + font-size: 16px; + margin-bottom: -2px; + white-space: normal; + overflow: visible; + text-overflow: ellipsis; +} +.resource-stack-layout .related-card > .card-info .title:after { + content: url(../images/link-out.png); + display: block; +} +.resource-stack-layout .related-card > .card-info .description { + display: none; +} +.resource-stack-layout .section-card-menu { + /* Flexible height */ + display: block; + height: auto; + width: auto; +} +.resource-stack-layout .section-card-menu .card-bg { + height: 155px; + /* Flexible height */ + position: relative; + display: inline-block; + vertical-align: top; +} +.resource-stack-layout .section-card-menu .card-info { + padding: 4px 12px 0px 12px; + /* Flexible height */ + position: relative; + left: auto; + top: auto; + right: auto; + bottom: auto; +} +.resource-stack-layout .section-card-menu .card-info ul { + list-style: none; + margin: 0; +} +.resource-stack-layout .section-card-menu .card-info ul li { + list-style: none; + margin: 0; + padding: 15px 0; + border-top-width: 1px; + border-top-style: solid; + border-top-color: #959595; +} +.resource-stack-layout .section-card-menu .card-info ul li a, .resource-stack-layout .section-card-menu .card-info ul li a:focus, .resource-stack-layout .section-card-menu .card-info ul li a:link, .resource-stack-layout .section-card-menu .card-info ul li a:visited, .resource-stack-layout .section-card-menu .card-info ul li a:active, .resource-stack-layout .section-card-menu .card-info ul li a:hover { + color: #363636 !important; +} +.resource-stack-layout .section-card-menu .card-info ul li:first-child { + border-top: none; +} +.resource-stack-layout .section-card-menu .card-info ul li:hover .title:after { + opacity: 1; + -webkit-transition: opacity 0.5s; + -moz-transition: opacity 0.5s; + -o-transition: opacity 0.5s; + transition: opacity 0.5s; +} +.resource-stack-layout .section-card-menu .card-info ul li:hover .description { + max-height: 30px; + opacity: 1; + -webkit-transition: max-height 0.5s, opacity 1s; + -moz-transition: max-height 0.5s, opacity 1s; + -o-transition: max-height 0.5s, opacity 1s; + transition: max-height 0.5s, opacity 1s; +} +.resource-stack-layout .section-card-menu .card-info .title { + font-size: 16px; + margin-bottom: -2px; + position: relative; +} +.resource-stack-layout .section-card-menu .card-info .title:after { + background: url(../images/stack-arrow-right.png); + content: ''; + opacity: 0; + -webkit-transition: opacity 0.25s; + -moz-transition: opacity 0.25s; + -o-transition: opacity 0.25s; + transition: opacity 0.25s; + position: absolute; + right: 0px; + top: 3px; + width: 10px; + height: 15px; +} +.resource-stack-layout .section-card-menu .card-info .title.more { + text-transform: uppercase; + color: #898989; + display: inline-block; +} +.resource-stack-layout .section-card-menu .card-info .title.more:after { + background: url(../images/stack-arrow-right.png); + content: ''; + display: block; + position: absolute; + right: -20px; + top: 3px; + width: 10px; + height: 15px; +} +.resource-stack-layout .section-card-menu .card-info .description { + max-height: 0px; + opacity: 0; + overflow: hidden; + font-size: 13px; + line-height: 15px; + /* Hover off */ + -webkit-transition: max-height 0.5s, opacity 0.5s; + -moz-transition: max-height 0.5s, opacity 0.5s; + -o-transition: max-height 0.5s, opacity 0.5s; + transition: max-height 0.5s, opacity 0.5s; +} +.resource-stack-layout .section-card-menu .card-info .description .text { + height: 30px; +} +.resource-stack-layout:after { + content: "."; + display: block; + height: 0; + clear: both; + visibility: hidden; +} + +/* Generate the flow layout styles for a 3-column 16-col span */ +.resource-flow-layout.col-16 { + margin: 0 -14px 0 0; + width: 954px; +} +.resource-flow-layout.col-16 .resource-card, .resource-flow-layout.col-16 .resource-card-stack { + margin: 0 14px 20px 0; +} +.resource-flow-layout.col-16 .resource-card-row-stack-last { + margin-bottom: 0px !important; +} +.resource-flow-layout.col-16 .resource-card-col-stack-last { + margin-bottom: 0px !important; +} +.resource-flow-layout.col-16 .resource-card-3x6 { + width: 145px; + height: 284px; +} +.resource-flow-layout.col-16 .resource-card-3x12 { + width: 145px; + height: 588px; +} +.resource-flow-layout.col-16 .resource-card-3x18 { + width: 145px; + height: 892px; +} +.resource-flow-layout.col-16 .resource-card-6x6 { + width: 304px; + height: 284px; +} +.resource-flow-layout.col-16 .resource-card-6x12 { + width: 304px; + height: 588px; +} +.resource-flow-layout.col-16 .resource-card-6x18 { + width: 304px; + height: 892px; +} +.resource-flow-layout.col-16 .resource-card-9x6 { + width: 463px; + height: 284px; +} +.resource-flow-layout.col-16 .resource-card-9x12 { + width: 463px; + height: 588px; +} +.resource-flow-layout.col-16 .resource-card-9x18 { + width: 463px; + height: 892px; +} +.resource-flow-layout.col-16 .resource-card-12x6 { + width: 622px; + height: 284px; +} +.resource-flow-layout.col-16 .resource-card-12x12 { + width: 622px; + height: 588px; +} +.resource-flow-layout.col-16 .resource-card-12x18 { + width: 622px; + height: 892px; +} +.resource-flow-layout.col-16 .resource-card-15x6 { + width: 781px; + height: 284px; +} +.resource-flow-layout.col-16 .resource-card-15x12 { + width: 781px; + height: 588px; +} +.resource-flow-layout.col-16 .resource-card-15x18 { + width: 781px; + height: 892px; +} +.resource-flow-layout.col-16 .resource-card-18x6 { + width: 940px; + height: 284px; +} +.resource-flow-layout.col-16 .resource-card-18x12 { + width: 940px; + height: 420px; +} +.resource-flow-layout.col-16 .resource-card-18x18 { + width: 940px; + height: 892px; +} +.resource-flow-layout.col-16 .resource-card-3x2 { + width: 145px; + height: 95px; +} +.resource-flow-layout.col-16 .resource-card-3x2x3 { + width: 145px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-16 .resource-card-3x3 { + width: 145px; + height: 142px; +} +.resource-flow-layout.col-16 .resource-card-3x3x2 { + width: 145px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-16 .resource-card-6x2 { + width: 304px; + height: 95px; +} +.resource-flow-layout.col-16 .resource-card-6x2x3 { + width: 304px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-16 .resource-card-6x3 { + width: 304px; + height: 142px; +} +.resource-flow-layout.col-16 .resource-card-6x3x2 { + width: 304px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-16 .resource-card-9x2 { + width: 463px; + height: 95px; +} +.resource-flow-layout.col-16 .resource-card-9x2x3 { + width: 463px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-16 .resource-card-9x3 { + width: 463px; + height: 142px; +} +.resource-flow-layout.col-16 .resource-card-9x3x2 { + width: 463px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-16 .resource-card-12x2 { + width: 622px; + height: 95px; +} +.resource-flow-layout.col-16 .resource-card-12x2x3 { + width: 622px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-16 .resource-card-12x3 { + width: 622px; + height: 142px; +} +.resource-flow-layout.col-16 .resource-card-12x3x2 { + width: 622px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-16 .resource-card-15x2 { + width: 781px; + height: 95px; +} +.resource-flow-layout.col-16 .resource-card-15x2x3 { + width: 781px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-16 .resource-card-15x3 { + width: 781px; + height: 142px; +} +.resource-flow-layout.col-16 .resource-card-15x3x2 { + width: 781px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-16 .resource-card-18x2 { + width: 940px; + height: 95px; +} +.resource-flow-layout.col-16 .resource-card-18x2x3 { + width: 940px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-16 .resource-card-18x3 { + width: 940px; + height: 142px; +} +.resource-flow-layout.col-16 .resource-card-18x3x2 { + width: 940px; + height: 138px; + margin-bottom: 8px; +} + +/* Generate the flow layout styles for a 3-column 16-col span */ +.resource-flow-layout.col-12 { + margin: 0 -14px 0 0; + width: 714px; +} + +.resource-flow-layout.col-12 .resource-card, .resource-flow-layout.col-12 .resource-card-stack { + margin: 0 14px 20px 0; +} +.resource-flow-layout.col-12 .resource-card-row-stack-last { + margin-bottom: 0px !important; +} +.resource-flow-layout.col-12 .resource-card-col-stack-last { + margin-bottom: 0px !important; +} +.resource-flow-layout.col-12 .resource-card-3x6 { + width: 105px; + height: 284px; +} +.resource-flow-layout.col-12 .resource-card-3x12 { + width: 105px; + height: 588px; +} +.resource-flow-layout.col-12 .resource-card-3x18 { + width: 105px; + height: 892px; +} +.resource-flow-layout.col-12 .resource-card-6x6 { + width: 224px; + height: 284px; +} +.resource-flow-layout.col-12 .resource-card-6x12 { + width: 224px; + height: 588px; +} +.resource-flow-layout.col-12 .resource-card-6x18 { + width: 224px; + height: 892px; +} +.resource-flow-layout.col-12 .resource-card-9x6 { + width: 343px; + height: 284px; +} +.resource-flow-layout.col-12 .resource-card-9x12 { + width: 343px; + height: 588px; +} +.resource-flow-layout.col-12 .resource-card-9x18 { + width: 343px; + height: 892px; +} +.resource-flow-layout.col-12 .resource-card-12x6 { + width: 462px; + height: 284px; +} +.resource-flow-layout.col-12 .resource-card-12x12 { + width: 462px; + height: 588px; +} +.resource-flow-layout.col-12 .resource-card-12x18 { + width: 462px; + height: 892px; +} +.resource-flow-layout.col-12 .resource-card-15x6 { + width: 581px; + height: 284px; +} +.resource-flow-layout.col-12 .resource-card-15x12 { + width: 581px; + height: 588px; +} +.resource-flow-layout.col-12 .resource-card-15x18 { + width: 581px; + height: 892px; +} +.resource-flow-layout.col-12 .resource-card-18x6 { + width: 700px; + height: 284px; +} +.resource-flow-layout.col-12 .resource-card-18x12 { + width: 700px; + height: 420px; +} +.resource-flow-layout.col-12 .resource-card-18x18 { + width: 700px; + height: 892px; +} +.resource-flow-layout.col-12 .resource-card-3x2 { + width: 105px; + height: 95px; +} +.resource-flow-layout.col-12 .resource-card-3x2x3 { + width: 105px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-12 .resource-card-3x3 { + width: 105px; + height: 142px; +} +.resource-flow-layout.col-12 .resource-card-3x3x2 { + width: 105px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-12 .resource-card-6x2 { + width: 224px; + height: 95px; +} +.resource-flow-layout.col-12 .resource-card-6x2x3 { + width: 224px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-12 .resource-card-6x3 { + width: 224px; + height: 142px; +} +.resource-flow-layout.col-12 .resource-card-6x3x2 { + width: 224px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-12 .resource-card-9x2 { + width: 343px; + height: 95px; +} +.resource-flow-layout.col-12 .resource-card-9x2x3 { + width: 343px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-12 .resource-card-9x3 { + width: 343px; + height: 142px; +} +.resource-flow-layout.col-12 .resource-card-9x3x2 { + width: 343px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-12 .resource-card-12x2 { + width: 462px; + height: 95px; +} +.resource-flow-layout.col-12 .resource-card-12x2x3 { + width: 462px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-12 .resource-card-12x3 { + width: 462px; + height: 142px; +} +.resource-flow-layout.col-12 .resource-card-12x3x2 { + width: 462px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-12 .resource-card-15x2 { + width: 581px; + height: 95px; +} +.resource-flow-layout.col-12 .resource-card-15x2x3 { + width: 581px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-12 .resource-card-15x3 { + width: 581px; + height: 142px; +} +.resource-flow-layout.col-12 .resource-card-15x3x2 { + width: 581px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-12 .resource-card-18x2 { + width: 700px; + height: 95px; +} +.resource-flow-layout.col-12 .resource-card-18x2x3 { + width: 700px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-12 .resource-card-18x3 { + width: 700px; + height: 142px; +} +.resource-flow-layout.col-12 .resource-card-18x3x2 { + width: 700px; + height: 138px; + margin-bottom: 8px; +} + +/* Generate the flow layout styles for a 3-column 13-col span */ + +.resource-flow-layout.col-13 { + margin: 0 -14px 0 0; + width: 774px; +} +.resource-flow-layout.col-13 .resource-card, .resource-flow-layout.col-13 .resource-card-stack { + margin: 0 14px 20px 0; +} +.resource-flow-layout.col-13 .resource-card-row-stack-last { + margin-bottom: 0px !important; +} +.resource-flow-layout.col-13 .resource-card-col-stack-last { + margin-bottom: 0px !important; +} +.resource-flow-layout.col-13 .resource-card-3x6 { + width: 115px; + height: 284px; +} +.resource-flow-layout.col-13 .resource-card-3x12 { + width: 115px; + height: 588px; +} +.resource-flow-layout.col-13 .resource-card-3x18 { + width: 115px; + height: 892px; +} +.resource-flow-layout.col-13 .resource-card-6x6 { + width: 244px; + height: 284px; +} +.resource-flow-layout.col-13 .resource-card-6x12 { + width: 244px; + height: 588px; +} +.resource-flow-layout.col-13 .resource-card-6x18 { + width: 244px; + height: 892px; +} +.resource-flow-layout.col-13 .resource-card-9x6 { + width: 373px; + height: 284px; +} +.resource-flow-layout.col-13 .resource-card-9x12 { + width: 373px; + height: 588px; +} +.resource-flow-layout.col-13 .resource-card-9x18 { + width: 373px; + height: 892px; +} +.resource-flow-layout.col-13 .resource-card-12x6 { + width: 502px; + height: 284px; +} +.resource-flow-layout.col-13 .resource-card-12x12 { + width: 502px; + height: 588px; +} +.resource-flow-layout.col-13 .resource-card-12x18 { + width: 502px; + height: 892px; +} +.resource-flow-layout.col-13 .resource-card-15x6 { + width: 631px; + height: 284px; +} +.resource-flow-layout.col-13 .resource-card-15x12 { + width: 631px; + height: 588px; +} +.resource-flow-layout.col-13 .resource-card-15x18 { + width: 631px; + height: 892px; +} +.resource-flow-layout.col-13 .resource-card-18x6 { + width: 760px; + height: 284px; +} +.resource-flow-layout.col-13 .resource-card-18x12 { + width: 760px; + height: 420px; +} +.resource-flow-layout.col-13 .resource-card-18x18 { + width: 760px; + height: 892px; +} +.resource-flow-layout.col-13 .resource-card-3x2 { + width: 115px; + height: 95px; +} +.resource-flow-layout.col-13 .resource-card-3x2x3 { + width: 115px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-13 .resource-card-3x3 { + width: 115px; + height: 142px; +} +.resource-flow-layout.col-13 .resource-card-3x3x2 { + width: 115px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-13 .resource-card-6x2 { + width: 244px; + height: 95px; +} +.resource-flow-layout.col-13 .resource-card-6x2x3 { + width: 244px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-13 .resource-card-6x3 { + width: 244px; + height: 142px; +} +.resource-flow-layout.col-13 .resource-card-6x3x2 { + width: 244px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-13 .resource-card-9x2 { + width: 373px; + height: 95px; +} +.resource-flow-layout.col-13 .resource-card-9x2x3 { + width: 373px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-13 .resource-card-9x3 { + width: 373px; + height: 142px; +} +.resource-flow-layout.col-13 .resource-card-9x3x2 { + width: 373px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-13 .resource-card-12x2 { + width: 502px; + height: 95px; +} +.resource-flow-layout.col-13 .resource-card-12x2x3 { + width: 502px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-13 .resource-card-12x3 { + width: 502px; + height: 142px; +} +.resource-flow-layout.col-13 .resource-card-12x3x2 { + width: 502px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-13 .resource-card-15x2 { + width: 631px; + height: 95px; +} +.resource-flow-layout.col-13 .resource-card-15x2x3 { + width: 631px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-13 .resource-card-15x3 { + width: 631px; + height: 142px; +} +.resource-flow-layout.col-13 .resource-card-15x3x2 { + width: 631px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-13 .resource-card-18x2 { + width: 760px; + height: 95px; +} +.resource-flow-layout.col-13 .resource-card-18x2x3 { + width: 760px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-13 .resource-card-18x3 { + width: 760px; + height: 142px; +} +.resource-flow-layout.col-13 .resource-card-18x3x2 { + width: 760px; + height: 138px; + margin-bottom: 8px; +} + +/* + The following are styles for cards in the flowlayout above, styled by the number of rows they span +*/ +/* Single row items, might be simpler to just apply a class */ +.resource-card-3x6 > .card-bg, .resource-card-6x6 > .card-bg, .resource-card-9x6 > .card-bg, .resource-card-12x6 > .card-bg, .resource-card-15x6 > .card-bg, .resource-card-18x6 > .card-bg { + height: 192px; +} +.resource-card-3x6 > .card-info, .resource-card-6x6 > .card-info, .resource-card-9x6 > .card-info, .resource-card-12x6 > .card-info, .resource-card-15x6 > .card-info, .resource-card-18x6 > .card-info { + padding: 4px 12px 6px 12px; + top: 192px; +} +.resource-card-3x6 > .card-info .section, .resource-card-6x6 > .card-info .section, .resource-card-9x6 > .card-info .section, .resource-card-12x6 > .card-info .section, .resource-card-15x6 > .card-info .section, .resource-card-18x6 > .card-info .section { + font-size: 12px; + margin-bottom: 1px; +} +.resource-card-3x6 > .card-info .title, .resource-card-6x6 > .card-info .title, .resource-card-9x6 > .card-info .title, .resource-card-12x6 > .card-info .title, .resource-card-15x6 > .card-info .title, .resource-card-18x6 > .card-info .title { + font-size: 16px; + margin-bottom: -2px; +} +.resource-card-3x6 > .card-info .description, .resource-card-6x6 > .card-info .description, .resource-card-9x6 > .card-info .description, .resource-card-12x6 > .card-info .description, .resource-card-15x6 > .card-info .description, .resource-card-18x6 > .card-info .description { + font-size: 13px; + line-height: 15px; +} +.resource-card-3x6 > .card-info .description .text, .resource-card-6x6 > .card-info .description .text, .resource-card-9x6 > .card-info .description .text, .resource-card-12x6 > .card-info .description .text, .resource-card-15x6 > .card-info .description .text, .resource-card-18x6 > .card-info .description .text { + height: 30px; +} + +/* Double row items */ +.resource-card-3x12 > .card-bg, .resource-card-6x12 > .card-bg, .resource-card-9x12 > .card-bg, .resource-card-12x12 > .card-bg, .resource-card-15x12 > .card-bg, .resource-card-18x12 > .card-bg { + height: 320px; +} +.resource-card-3x12 > .card-info, .resource-card-6x12 > .card-info, .resource-card-9x12 > .card-info, .resource-card-12x12 > .card-info, .resource-card-15x12 > .card-info, .resource-card-18x12 > .card-info { + padding: 4px 12px 6px 12px; + top: 320px; +} +.resource-card-3x12 > .card-info .section, .resource-card-6x12 > .card-info .section, .resource-card-9x12 > .card-info .section, .resource-card-12x12 > .card-info .section, .resource-card-15x12 > .card-info .section, .resource-card-18x12 > .card-info .section { + font-size: 12px; + margin-bottom: 1px; +} +.resource-card-3x12 > .card-info .title, .resource-card-6x12 > .card-info .title, .resource-card-9x12 > .card-info .title, .resource-card-12x12 > .card-info .title, .resource-card-15x12 > .card-info .title, .resource-card-18x12 > .card-info .title { + font-size: 16px; + margin-bottom: -2px; + white-space: normal; +} +.resource-card-3x12 > .card-info .description, .resource-card-6x12 > .card-info .description, .resource-card-9x12 > .card-info .description, .resource-card-12x12 > .card-info .description, .resource-card-15x12 > .card-info .description, .resource-card-18x12 > .card-info .description { + font-size: 13px; + line-height: 15px; +} + +/* 1/3 row items */ +.resource-card-3x2 > .card-bg, .resource-card-6x2 > .card-bg, .resource-card-9x2 > .card-bg, .resource-card-12x2 > .card-bg, .resource-card-15x2 > .card-bg, .resource-card-18x2 > .card-bg { + left: 0; + top: 0; + width: 90px; + height: 100%; + position: absolute; + display: block; +} +.resource-card-3x2 > .card-info, .resource-card-6x2 > .card-info, .resource-card-9x2 > .card-info, .resource-card-12x2 > .card-info, .resource-card-15x2 > .card-info, .resource-card-18x2 > .card-info { + left: 90px; + padding: 4px 12px 4px 12px; + height: 80px; + overflow: hidden; +} +.resource-card-3x2 > .card-info .section, .resource-card-6x2 > .card-info .section, .resource-card-6x3 > .card-info .section, .resource-card-9x2 > .card-info .section, .resource-card-12x2 > .card-info .section, .resource-card-15x2 > .card-info .section, .resource-card-18x2 > .card-info .section { + font-size: 12px; + margin-bottom: 1px; + /* display: none; */ +} +.resource-card-3x2 > .card-info .title, .resource-card-6x2 > .card-info .title, .resource-card-9x2 > .card-info .title, .resource-card-12x2 > .card-info .title, .resource-card-15x2 > .card-info .title, .resource-card-18x2 > .card-info .title { + font-size: 16px; + margin-bottom: -2px; + white-space: normal; + overflow: visible; + text-overflow: ellipsis; +} +.resource-card-3x2 > .card-info .title:after, .resource-card-6x2 > .card-info .title:after, .resource-card-9x2 > .card-info .title:after, .resource-card-12x2 > .card-info .title:after, .resource-card-15x2 > .card-info .title:after, .resource-card-18x2 > .card-info .title:after { + /* content: url(../images/link-out.png); */ + display: block; +} +.resource-card-3x2 > .card-info .description, .resource-card-6x2 > .card-info .description, .resource-card-9x2 > .card-info .description, .resource-card-12x2 > .card-info .description, .resource-card-15x2 > .card-info .description, .resource-card-18x2 > .card-info .description { + display: none; +} + +/* 1/2 row items */ +.resource-card-3x3 > .card-bg, .resource-card-6x3 > .card-bg, .resource-card-9x3 > .card-bg, .resource-card-12x3 > .card-bg, .resource-card-15x3 > .card-bg, .resource-card-18x3 > .card-bg { + left: 0; + top: 0; + width: 90px; + height: 100%; + position: absolute; + display: block; +} +.resource-card-3x3 > .card-info, .resource-card-6x3 > .card-info, .resource-card-9x3 > .card-info, .resource-card-12x3 > .card-info, .resource-card-15x3 > .card-info, .resource-card-18x3 > .card-info { + left: 90px; + padding: 4px 12px 0px 12px; +} +.resource-card-3x3 > .card-info .section, .resource-card-6x3 > .card-info .section, .resource-card-9x3 > .card-info .section, .resource-card-12x3 > .card-info .section, .resource-card-15x3 > .card-info .section, .resource-card-18x3 > .card-info .section { + font-size: 12px; + margin-bottom: 1px; + display: none; +} +.resource-card-3x3 > .card-info .title, .resource-card-6x3 > .card-info .title, .resource-card-9x3 > .card-info .title, .resource-card-12x3 > .card-info .title, .resource-card-15x3 > .card-info .title, .resource-card-18x3 > .card-info .title { + font-size: 16px; + margin-bottom: -2px; + white-space: normal; + overflow: visible; +} +.resource-card-3x3 > .card-info .description .text, .resource-card-6x3 > .card-info .description .text, .resource-card-9x3 > .card-info .description .text, .resource-card-12x3 > .card-info .description .text, .resource-card-15x3 > .card-info .description .text, .resource-card-18x3 > .card-info .description .text { + font-size: 12px; + line-height: 15px; + padding-right: 0px !important; + height: 80px; +} +.resource-card-3x3 > .card-info .description .util, .resource-card-6x3 > .card-info .description .util, .resource-card-9x3 > .card-info .description .util, .resource-card-12x3 > .card-info .description .util, .resource-card-15x3 > .card-info .description .util, .resource-card-18x3 > .card-info .description .util { + display: none; +} +/* placement of plusone */ +.resource-card-6x12 > .card-info .description .util, .resource-card-9x12 > .card-info .description .util, .resource-card-12x12 > .card-info .description .util, .resource-card-15x12 > .card-info .description .util { + bottom:2px; +} +.resource-card-18x12 > .card-info .description .util { + bottom:2px; +} +/* Overrides for col-16 6x6 cards linking to local content on landing pages. + Suppresses "section" and puts the title above a hairline rule. */ +.landing .card-info .section, .resource-flow-layout.col-16.landing .resource-card-9x6 .card-info .section { + display:none; +} +.landing .card-info .title { + color: #898989; + font-size: 17px; + line-height: 24px; + margin-bottom: 6px; + border-bottom: 1px solid #959595; + padding-bottom: 0px; +} +.landing .card-info .description { + font-size: 13px; + line-height: 15px; +} +.landing .card-info .description .text { +height:30px; +} +.landing .resource-card-6x6 > .card-info .description .util, .landing .resource-card-9x6 > .card-info .description .util { + bottom:2px; +} +/* + Generate a resource stack layout for a 3 column widget spanning 16 grid cols +*/ +.resource-stack-layout.col-16 { + margin: 0 -14px 0 0; + width: 954px; +} +.resource-stack-layout.col-16 .resource-card-stack { + margin: 0 14px 0 0; + width: 304px; +} + +/* Example of card menu tinting */ +.resource-widget[data-section=distribute\/tools] .section-card-menu +.card-bg:after { + background: rgba(126, 55, 148, 0.4) !important; +} +.resource-widget[data-section=distribute\/tools] .section-card-menu +.card-section-icon .icon { + background-color: #7e3794 !important; +} +.resource-widget[data-section=distribute\/tools] .section-card-menu +.card-info ul li { + border-top-color: #7e3794 !important; +} + +/* tinting for stacks */ + +div.jd-descr > .resource-widget[data-section=distribute\/tools] +.section-card-menu .card-info ul li { + border-top-color: #7e3794 !important; +}
\ No newline at end of file diff --git a/tools/droiddoc/templates-sdk-dyn/assets/css/fullscreen.css b/tools/droiddoc/templates-sdk-dyn/assets/css/fullscreen.css index 71cf65b..53d9a64 100644 --- a/tools/droiddoc/templates-sdk-dyn/assets/css/fullscreen.css +++ b/tools/droiddoc/templates-sdk-dyn/assets/css/fullscreen.css @@ -170,7 +170,7 @@ body { max-width: 100%; } -#nav-x .wrap, +#header-wrapper #nav-x div.wrap, #searchResults.wrap { max-width:100%; } @@ -184,7 +184,18 @@ body { left:20px; /* !important ... for IE i think */ } +#sticky-header { + padding: 0 20px; +} + +#sticky-header > div { + width: 100%; +} +.sticky-menu { + width:100%; + left:-20px; +} } diff --git a/tools/droiddoc/templates-sdk-dyn/assets/images/breadcrumb.png b/tools/droiddoc/templates-sdk-dyn/assets/images/breadcrumb.png Binary files differnew file mode 100644 index 0000000..407a318 --- /dev/null +++ b/tools/droiddoc/templates-sdk-dyn/assets/images/breadcrumb.png diff --git a/tools/droiddoc/templates-sdk-dyn/assets/images/dac_logo@2x.png b/tools/droiddoc/templates-sdk-dyn/assets/images/dac_logo@2x.png Binary files differnew file mode 100644 index 0000000..0f2784d --- /dev/null +++ b/tools/droiddoc/templates-sdk-dyn/assets/images/dac_logo@2x.png diff --git a/tools/droiddoc/templates-sdk-dyn/assets/images/link-out.png b/tools/droiddoc/templates-sdk-dyn/assets/images/link-out.png Binary files differnew file mode 100644 index 0000000..aa55f9a --- /dev/null +++ b/tools/droiddoc/templates-sdk-dyn/assets/images/link-out.png diff --git a/tools/droiddoc/templates-sdk-dyn/assets/images/resource-card-default-android.jpg b/tools/droiddoc/templates-sdk-dyn/assets/images/resource-card-default-android.jpg Binary files differnew file mode 100644 index 0000000..8050744 --- /dev/null +++ b/tools/droiddoc/templates-sdk-dyn/assets/images/resource-card-default-android.jpg diff --git a/tools/droiddoc/templates-sdk-dyn/assets/images/stack-arrow-right.png b/tools/droiddoc/templates-sdk-dyn/assets/images/stack-arrow-right.png Binary files differnew file mode 100644 index 0000000..46d6a50 --- /dev/null +++ b/tools/droiddoc/templates-sdk-dyn/assets/images/stack-arrow-right.png diff --git a/tools/droiddoc/templates-sdk-dyn/assets/js/docs.js b/tools/droiddoc/templates-sdk-dyn/assets/js/docs.js index 6630bf9..e6befe3 100644 --- a/tools/droiddoc/templates-sdk-dyn/assets/js/docs.js +++ b/tools/droiddoc/templates-sdk-dyn/assets/js/docs.js @@ -167,10 +167,12 @@ $(document).ready(function() { // highlight Design tab if ($("body").hasClass("design")) { $("#header li.design a").addClass("selected"); + $("#sticky-header").addClass("design"); // highlight Develop tab } else if ($("body").hasClass("develop") || $("body").hasClass("google")) { $("#header li.develop a").addClass("selected"); + $("#sticky-header").addClass("develop"); // In Develop docs, also highlight appropriate sub-tab var rootDir = pagePathOriginal.substring(1,pagePathOriginal.indexOf('/', 1)); if (rootDir == "training") { @@ -195,12 +197,34 @@ $(document).ready(function() { // highlight Distribute tab } else if ($("body").hasClass("distribute")) { $("#header li.distribute a").addClass("selected"); - } + $("#sticky-header").addClass("distribute"); + + var baseFrag = pagePathOriginal.indexOf('/', 1) + 1; + var secondFrag = pagePathOriginal.substring(baseFrag, pagePathOriginal.indexOf('/', baseFrag)); + if (secondFrag == "users") { + $("#nav-x li.users a").addClass("selected"); + } else if (secondFrag == "engage") { + $("#nav-x li.engage a").addClass("selected"); + } else if (secondFrag == "monetize") { + $("#nav-x li.monetize a").addClass("selected"); + } else if (secondFrag == "tools") { + $("#nav-x li.disttools a").addClass("selected"); + } else if (secondFrag == "stories") { + $("#nav-x li.stories a").addClass("selected"); + } else if (secondFrag == "essentials") { + $("#nav-x li.essentials a").addClass("selected"); + } else if (secondFrag == "googleplay") { + $("#nav-x li.googleplay a").addClass("selected"); + } + } else if ($("body").hasClass("about")) { + $("#sticky-header").addClass("about"); + } // set global variable so we can highlight the sidenav a bit later (such as for google reference) // and highlight the sidenav mPagePath = pagePath; highlightSidenav(); + buildBreadcrumbs(); // set up prev/next links if they exist var $selNavLink = $('#nav').find('a[href="' + pagePath + '"]'); @@ -385,70 +409,6 @@ false; // navigate across topic boundaries only in design docs }); - // Set up fixed navbar - var prevScrollLeft = 0; // used to compare current position to previous position of horiz scroll - $(window).scroll(function(event) { - if ($('#side-nav').length == 0) return; - if (event.target.nodeName == "DIV") { - // Dump scroll event if the target is a DIV, because that means the event is coming - // from a scrollable div and so there's no need to make adjustments to our layout - return; - } - var scrollTop = $(window).scrollTop(); - var headerHeight = $('#header').outerHeight(); - var subheaderHeight = $('#nav-x').outerHeight(); - var searchResultHeight = $('#searchResults').is(":visible") ? - $('#searchResults').outerHeight() : 0; - var totalHeaderHeight = headerHeight + subheaderHeight + searchResultHeight; - // we set the navbar fixed when the scroll position is beyond the height of the site header... - var navBarShouldBeFixed = scrollTop > totalHeaderHeight; - // ... except if the document content is shorter than the sidenav height. - // (this is necessary to avoid crazy behavior on OSX Lion due to overscroll bouncing) - if ($("#doc-col").height() < $("#side-nav").height()) { - navBarShouldBeFixed = false; - } - - var scrollLeft = $(window).scrollLeft(); - // When the sidenav is fixed and user scrolls horizontally, reposition the sidenav to match - if (navBarIsFixed && (scrollLeft != prevScrollLeft)) { - updateSideNavPosition(); - prevScrollLeft = scrollLeft; - } - - // Don't continue if the header is sufficently far away - // (to avoid intensive resizing that slows scrolling) - if (navBarIsFixed && navBarShouldBeFixed) { - return; - } - - if (navBarIsFixed != navBarShouldBeFixed) { - if (navBarShouldBeFixed) { - // make it fixed - var width = $('#devdoc-nav').width(); - $('#devdoc-nav') - .addClass('fixed') - .css({'width':width+'px'}) - .prependTo('#body-content'); - // add neato "back to top" button - $('#devdoc-nav a.totop').css({'display':'block','width':$("#nav").innerWidth()+'px'}); - - // update the sidenaav position for side scrolling - updateSideNavPosition(); - } else { - // make it static again - $('#devdoc-nav') - .removeClass('fixed') - .css({'width':'auto','margin':''}) - .prependTo('#side-nav'); - $('#devdoc-nav a.totop').hide(); - } - navBarIsFixed = navBarShouldBeFixed; - } - - resizeNav(250); // pass true in order to delay the scrollbar re-initialization for performance - }); - - var navBarLeftPos; if ($('#devdoc-nav').length) { setNavBarLeftPos(); @@ -593,6 +553,28 @@ function initExpandableNavItems(rootTag) { }); } + +/** Create the list of breadcrumb links in the sticky header */ +function buildBreadcrumbs() { + var $breadcrumbUl = $("#sticky-header ul.breadcrumb"); + // Add the secondary horizontal nav item, if provided + var $selectedSecondNav = $("div#nav-x ul.nav-x a.selected").clone().removeClass("selected"); + if ($selectedSecondNav.length) { + $breadcrumbUl.prepend($("<li>").append($selectedSecondNav)) + } + // Add the primary horizontal nav + var $selectedFirstNav = $("div#header-wrap ul.nav-x a.selected").clone().removeClass("selected"); + // If there's no header nav item, use the logo link and title from alt text + if ($selectedFirstNav.length < 1) { + $selectedFirstNav = $("<a>") + .attr('href', $("div#header .logo a").attr('href')) + .text($("div#header .logo img").attr('alt')); + } + $breadcrumbUl.prepend($("<li>").append($selectedFirstNav)); +} + + + /** Highlight the current page in sidenav, expanding children as appropriate */ function highlightSidenav() { // if something is already highlighted, undo it. This is for dynamic navigation (Samples index) @@ -705,9 +687,8 @@ function resizeNav(delay) { // Then figure out based on scroll position whether the header is visible var windowHeight = $window.height(); var scrollTop = $window.scrollTop(); - var headerHeight = $('#header').outerHeight(); - var subheaderHeight = $('#nav-x').outerHeight(); - var headerVisible = (scrollTop < (headerHeight + subheaderHeight)); + var headerHeight = $('#header-wrapper').outerHeight(); + var headerVisible = scrollTop < stickyTop; // get the height of space between nav and top of window. // Could be either margin or top position, depending on whether the nav is fixed. @@ -717,7 +698,7 @@ function resizeNav(delay) { // Depending on whether the header is visible, set the side nav's height. if (headerVisible) { // The sidenav height grows as the header goes off screen - navHeight = windowHeight - (headerHeight + subheaderHeight - scrollTop) - topMargin; + navHeight = windowHeight - (headerHeight - scrollTop) - topMargin; } else { // Once header is off screen, the nav height is almost full window height navHeight = windowHeight - topMargin; @@ -905,8 +886,115 @@ function writeCookie(cookie, val, section, expiration) { +var stickyTop; +/* Sets the vertical scoll position at which the sticky bar should appear. + This method is called to reset the position when search results appear or hide */ +function setStickyTop() { + stickyTop = $('#header-wrapper').outerHeight() - $('#sticky-header').outerHeight(); +} +/* + * Displays sticky nav bar on pages when dac header scrolls out of view + */ +(function() { + $(document).ready(function() { + + setStickyTop(); + var sticky = false; + var hiding = false; + var $stickyEl = $('#sticky-header'); + var $menuEl = $('.menu-container'); + + var prevScrollLeft = 0; // used to compare current position to previous position of horiz scroll + + $(window).scroll(function() { + // Exit if there's no sidenav + if ($('#side-nav').length == 0) return; + // Exit if the mouse target is a DIV, because that means the event is coming + // from a scrollable div and so there's no need to make adjustments to our layout + if (event.target.nodeName == "DIV") { + return; + } + + + var top = $(window).scrollTop(); + // we set the navbar fixed when the scroll position is beyond the height of the site header... + var shouldBeSticky = top >= stickyTop; + // ... except if the document content is shorter than the sidenav height. + // (this is necessary to avoid crazy behavior on OSX Lion due to overscroll bouncing) + if ($("#doc-col").height() < $("#side-nav").height()) { + shouldBeSticky = false; + } + + // Don't continue if the header is sufficently far away + // (to avoid intensive resizing that slows scrolling) + if (sticky && shouldBeSticky) { + return; + } + + // Account for horizontal scroll + var scrollLeft = $(window).scrollLeft(); + // When the sidenav is fixed and user scrolls horizontally, reposition the sidenav to match + if (navBarIsFixed && (scrollLeft != prevScrollLeft)) { + updateSideNavPosition(); + prevScrollLeft = scrollLeft; + } + + // If sticky header visible and position is now near top, hide sticky + if (sticky && !shouldBeSticky) { + sticky = false; + hiding = true; + // make the sidenav static again + $('#devdoc-nav') + .removeClass('fixed') + .css({'width':'auto','margin':''}) + .prependTo('#side-nav'); + // delay hide the sticky + $menuEl.removeClass('sticky-menu'); + $stickyEl.fadeOut(250); + hiding = false; + + // update the sidenaav position for side scrolling + updateSideNavPosition(); + } else if (!sticky && shouldBeSticky) { + sticky = true; + $stickyEl.fadeIn(10); + $menuEl.addClass('sticky-menu'); + + // make the sidenav fixed + var width = $('#devdoc-nav').width(); + $('#devdoc-nav') + .addClass('fixed') + .css({'width':width+'px'}) + .prependTo('#body-content'); + + // update the sidenaav position for side scrolling + updateSideNavPosition(); + + } else if (hiding && top < 15) { + $menuEl.removeClass('sticky-menu'); + $stickyEl.hide(); + hiding = false; + } + + resizeNav(250); // pass true in order to delay the scrollbar re-initialization for performance + }); + + // Stack hover states + $('.section-card-menu').each(function(index, el) { + var height = $(el).height(); + $(el).css({height:height+'px', position:'relative'}); + var $cardInfo = $(el).find('.card-info'); + + $cardInfo.css({position: 'absolute', bottom:'0px', left:'0px', right:'0px', overflow:'visible'}); + }); + + resizeNav(); // must resize once loading is finished + }); + +})(); + @@ -1724,6 +1812,7 @@ function search_changed(e, kd, toroot) $('.suggest-card').hide(); if ($("#searchResults").is(":hidden") && (search.value != "")) { // if results aren't showing (and text not empty), return true to allow search to execute + $('body,html').animate({scrollTop:0}, '500', 'swing'); return true; } else { // otherwise, results are already showing, so allow ajax to auto refresh the results @@ -2278,13 +2367,13 @@ function submit_search() { var query = document.getElementById('search_autocomplete').value; location.hash = 'q=' + query; loadSearchResults(); - $("#searchResults").slideDown('slow'); + $("#searchResults").slideDown('slow', setStickyTop); return false; } function hideResults() { - $("#searchResults").slideUp(); + $("#searchResults").slideUp('fast', setStickyTop); $(".search .close").addClass("hide"); location.hash = ''; @@ -2401,7 +2490,7 @@ google.setOnLoadCallback(function(){ return; } else { // first time loading search results for this page - $('#searchResults').slideDown('slow'); + $('#searchResults').slideDown('slow', setStickyTop); $(".search .close").removeClass("hide"); loadSearchResults(); } @@ -2409,19 +2498,22 @@ google.setOnLoadCallback(function(){ // when an event on the browser history occurs (back, forward, load) requery hash and do search $(window).hashchange( function(){ - // Exit if the hash isn't a search query or there's an error in the query + // If the hash isn't a search query or there's an error in the query, + // then adjust the scroll position to account for sticky header, then exit. if ((location.hash.indexOf("q=") == -1) || (query == "undefined")) { // If the results pane is open, close it. if (!$("#searchResults").is(":hidden")) { hideResults(); } + // Adjust the scroll position to account for sticky header + $(window).scrollTop($(window).scrollTop() - 60); return; } // Otherwise, we have a search to do var query = decodeURI(getQuery(location.hash)); searchControl.execute(query); - $('#searchResults').slideDown('slow'); + $('#searchResults').slideDown('slow', setStickyTop); $("#search_autocomplete").focus(); $(".search .close").removeClass("hide"); @@ -3233,3 +3325,560 @@ function showSamples() { $("#samples").append($ul); } + + + +/* ########################################################## */ +/* ################### RESOURCE CARDS ##################### */ +/* ########################################################## */ + +/** Handle resource queries, collections, and grids (sections). Requires + jd_tag_helpers.js and the *_unified_data.js to be loaded. */ + +(function() { + // Prevent the same resource from being loaded more than once per page. + var addedPageResources = {}; + + $(document).ready(function() { + $('.resource-widget').each(function() { + initResourceWidget(this); + }); + + /* Pass the line height to ellipsisfade() to adjust the height of the + text container to show the max number of lines possible, without + showing lines that are cut off. This works with the css ellipsis + classes to fade last text line and apply an ellipsis char. */ + + //card text currently uses 15px line height. + var lineHeight = 15; + $('.card-info .text').ellipsisfade(lineHeight); + }); + + /* + Three types of resource layouts: + Flow - Uses a fixed row-height flow using float left style. + Carousel - Single card slideshow all same dimension absolute. + Stack - Uses fixed columns and flexible element height. + */ + function initResourceWidget(widget) { + var $widget = $(widget); + var isFlow = $widget.hasClass('resource-flow-layout'), + isCarousel = $widget.hasClass('resource-carousel-layout'), + isStack = $widget.hasClass('resource-stack-layout'); + + // find size of widget by pulling out its class name + var sizeCols = 1; + var m = $widget.get(0).className.match(/\bcol-(\d+)\b/); + if (m) { + sizeCols = parseInt(m[1], 10); + } + + var opts = { + cardSizes: ($widget.data('cardsizes') || '').split(','), + maxResults: parseInt($widget.data('maxresults') || '100', 10), + itemsPerPage: $widget.data('itemsperpage'), + sortOrder: $widget.data('sortorder'), + query: $widget.data('query'), + section: $widget.data('section'), + sizeCols: sizeCols + }; + + // run the search for the set of resources to show + + var resources = buildResourceList(opts); + + if (isFlow) { + drawResourcesFlowWidget($widget, opts, resources); + } else if (isCarousel) { + drawResourcesCarouselWidget($widget, opts, resources); + } else if (isStack) { + var sections = buildSectionList(opts); + opts['numStacks'] = $widget.data('numstacks'); + drawResourcesStackWidget($widget, opts, resources, sections); + } + } + + /* Initializes a Resource Carousel Widget */ + function drawResourcesCarouselWidget($widget, opts, resources) { + $widget.empty(); + var plusone = true; //always show plusone on carousel + + $widget.addClass('resource-card slideshow-container') + .append($('<a>').addClass('slideshow-prev').text('Prev')) + .append($('<a>').addClass('slideshow-next').text('Next')); + + var css = { 'width': $widget.width() + 'px', + 'height': $widget.height() + 'px' }; + + var $ul = $('<ul>'); + + for (var i = 0; i < resources.length; ++i) { + //keep url clean for matching and offline mode handling + var urlPrefix = resources[i].url.indexOf("//") > -1 ? "" : toRoot; + var $card = $('<a>') + .attr('href', urlPrefix + resources[i].url) + .decorateResourceCard(resources[i],plusone); + + $('<li>').css(css) + .append($card) + .appendTo($ul); + } + + $('<div>').addClass('frame') + .append($ul) + .appendTo($widget); + + $widget.dacSlideshow({ + auto: true, + btnPrev: '.slideshow-prev', + btnNext: '.slideshow-next' + }); + }; + + /* Initializes a Resource Card Stack Widget (column-based layout) */ + function drawResourcesStackWidget($widget, opts, resources, sections) { + // Don't empty widget, grab all items inside since they will be the first + // items stacked, followed by the resource query + var plusone = true; //by default show plusone on section cards + var cards = $widget.find('.resource-card').detach().toArray(); + var numStacks = opts.numStacks || 1; + var $stacks = []; + var urlString; + + for (var i = 0; i < numStacks; ++i) { + $stacks[i] = $('<div>').addClass('resource-card-stack') + .appendTo($widget); + } + + var sectionResources = []; + + // Extract any subsections that are actually resource cards + for (var i = 0; i < sections.length; ++i) { + if (!sections[i].sections || !sections[i].sections.length) { + //keep url clean for matching and offline mode handling + urlPrefix = sections[i].url.indexOf("//") > -1 ? "" : toRoot; + // Render it as a resource card + + sectionResources.push( + $('<a>') + .addClass('resource-card section-card') + .attr('href', urlPrefix + sections[i].resource.url) + .decorateResourceCard(sections[i].resource,plusone)[0] + ); + + } else { + cards.push( + $('<div>') + .addClass('resource-card section-card-menu') + .decorateResourceSection(sections[i],plusone)[0] + ); + } + } + + cards = cards.concat(sectionResources); + + for (var i = 0; i < resources.length; ++i) { + //keep url clean for matching and offline mode handling + urlPrefix = resources[i].url.indexOf("//") > -1 ? "" : toRoot; + var $card = $('<a>') + .addClass('resource-card related-card') + .attr('href', urlPrefix + resources[i].url) + .decorateResourceCard(resources[i],plusone); + + cards.push($card[0]); + } + + for (var i = 0; i < cards.length; ++i) { + // Find the stack with the shortest height, but give preference to + // left to right order. + var minHeight = $stacks[0].height(); + var minIndex = 0; + + for (var j = 1; j < numStacks; ++j) { + var height = $stacks[j].height(); + if (height < minHeight - 45) { + minHeight = height; + minIndex = j; + } + } + + $stacks[minIndex].append($(cards[i])); + } + + }; + + /* Initializes a flow widget, see distribute.scss for generating accompanying css */ + function drawResourcesFlowWidget($widget, opts, resources) { + $widget.empty(); + var cardSizes = opts.cardSizes || ['6x6']; + var i = 0, j = 0; + var plusone = true; // by default show plusone on resource cards + + while (i < resources.length) { + var cardSize = cardSizes[j++ % cardSizes.length]; + cardSize = cardSize.replace(/^\s+|\s+$/,''); + console.log("cardsize is " + cardSize); + // Some card sizes do not get a plusone button, such as where space is constrained + // or for cards commonly embedded in docs (to improve overall page speed). + plusone = !((cardSize == "6x2") || (cardSize == "6x3") || + (cardSize == "9x2") || (cardSize == "9x3") || + (cardSize == "12x2") || (cardSize == "12x3")); + + // A stack has a third dimension which is the number of stacked items + var isStack = cardSize.match(/(\d+)x(\d+)x(\d+)/); + var stackCount = 0; + var $stackDiv = null; + + if (isStack) { + // Create a stack container which should have the dimensions defined + // by the product of the items inside. + $stackDiv = $('<div>').addClass('resource-card-stack resource-card-' + isStack[1] + + 'x' + isStack[2] * isStack[3]) .appendTo($widget); + } + + // Build each stack item or just a single item + do { + var resource = resources[i]; + //keep url clean for matching and offline mode handling + urlPrefix = resource.url.indexOf("//") > -1 ? "" : toRoot; + var $card = $('<a>') + .addClass('resource-card resource-card-' + cardSize + ' resource-card-' + resource.type) + .attr('href', urlPrefix + resource.url); + + if (isStack) { + $card.addClass('resource-card-' + isStack[1] + 'x' + isStack[2]); + if (++stackCount == parseInt(isStack[3])) { + $card.addClass('resource-card-row-stack-last'); + stackCount = 0; + } + } else { + stackCount = 0; + } + + $card.decorateResourceCard(resource,plusone) + .appendTo($stackDiv || $widget); + + } while (++i < resources.length && stackCount > 0); + } + } + + /* Build a site map of resources using a section as a root. */ + function buildSectionList(opts) { + if (opts.section && SECTION_BY_ID[opts.section]) { + return SECTION_BY_ID[opts.section].sections || []; + } + return []; + } + + function buildResourceList(opts) { + var maxResults = opts.maxResults || 100; + + var query = opts.query || ''; + var expressions = parseResourceQuery(query); + var addedResourceIndices = {}; + var results = []; + + for (var i = 0; i < expressions.length; i++) { + var clauses = expressions[i]; + + // build initial set of resources from first clause + var firstClause = clauses[0]; + var resources = []; + switch (firstClause.attr) { + case 'type': + resources = ALL_RESOURCES_BY_TYPE[firstClause.value]; + break; + case 'lang': + resources = ALL_RESOURCES_BY_LANG[firstClause.value]; + break; + case 'tag': + resources = ALL_RESOURCES_BY_TAG[firstClause.value]; + break; + case 'collection': + var urls = RESOURCE_COLLECTIONS[firstClause.value].resources || []; + resources = urls.map(function(url){ return ALL_RESOURCES_BY_URL[url]; }); + break; + case 'section': + var urls = SITE_MAP[firstClause.value].sections || []; + resources = urls.map(function(url){ return ALL_RESOURCES_BY_URL[url]; }); + break; + } + // console.log(firstClause.attr + ':' + firstClause.value); + resources = resources || []; + + // use additional clauses to filter corpus + if (clauses.length > 1) { + var otherClauses = clauses.slice(1); + resources = resources.filter(getResourceMatchesClausesFilter(otherClauses)); + } + + // filter out resources already added + if (i > 1) { + resources = resources.filter(getResourceNotAlreadyAddedFilter(addedResourceIndices)); + } + + // add to list of already added indices + for (var j = 0; j < resources.length; j++) { + // console.log(resources[j].title); + addedResourceIndices[resources[j].index] = 1; + } + + // concat to final results list + results = results.concat(resources); + } + + if (opts.sortOrder && results.length) { + var attr = opts.sortOrder; + + if (opts.sortOrder == 'random') { + var i = results.length, j, temp; + while (--i) { + j = Math.floor(Math.random() * (i + 1)); + temp = results[i]; + results[i] = results[j]; + results[j] = temp; + } + } else { + var desc = attr.charAt(0) == '-'; + if (desc) { + attr = attr.substring(1); + } + results = results.sort(function(x,y) { + return (desc ? -1 : 1) * (parseInt(x[attr], 10) - parseInt(y[attr], 10)); + }); + } + } + + results = results.filter(getResourceNotAlreadyAddedFilter(addedPageResources)); + results = results.slice(0, maxResults); + + for (var j = 0; j < results.length; ++j) { + addedPageResources[results[j].index] = 1; + } + + return results; + } + + + function getResourceNotAlreadyAddedFilter(addedResourceIndices) { + return function(resource) { + return !addedResourceIndices[resource.index]; + }; + } + + + function getResourceMatchesClausesFilter(clauses) { + return function(resource) { + return doesResourceMatchClauses(resource, clauses); + }; + } + + + function doesResourceMatchClauses(resource, clauses) { + for (var i = 0; i < clauses.length; i++) { + var map; + switch (clauses[i].attr) { + case 'type': + map = IS_RESOURCE_OF_TYPE[clauses[i].value]; + break; + case 'lang': + map = IS_RESOURCE_IN_LANG[clauses[i].value]; + break; + case 'tag': + map = IS_RESOURCE_TAGGED[clauses[i].value]; + break; + } + + if (!map || (!!clauses[i].negative ? map[resource.index] : !map[resource.index])) { + return clauses[i].negative; + } + } + return true; + } + + + function parseResourceQuery(query) { + // Parse query into array of expressions (expression e.g. 'tag:foo + type:video') + var expressions = []; + var expressionStrs = query.split(',') || []; + for (var i = 0; i < expressionStrs.length; i++) { + var expr = expressionStrs[i] || ''; + + // Break expression into clauses (clause e.g. 'tag:foo') + var clauses = []; + var clauseStrs = expr.split(/(?=[\+\-])/); + for (var j = 0; j < clauseStrs.length; j++) { + var clauseStr = clauseStrs[j] || ''; + + // Get attribute and value from clause (e.g. attribute='tag', value='foo') + var parts = clauseStr.split(':'); + var clause = {}; + + clause.attr = parts[0].replace(/^\s+|\s+$/g,''); + if (clause.attr) { + if (clause.attr.charAt(0) == '+') { + clause.attr = clause.attr.substring(1); + } else if (clause.attr.charAt(0) == '-') { + clause.negative = true; + clause.attr = clause.attr.substring(1); + } + } + + if (parts.length > 1) { + clause.value = parts[1].replace(/^\s+|\s+$/g,''); + } + + clauses.push(clause); + } + + if (!clauses.length) { + continue; + } + + expressions.push(clauses); + } + + return expressions; + } +})(); + +(function($) { + /* Simple jquery function to create dom for a standard resource card */ + $.fn.decorateResourceCard = function(resource,plusone) { + var section = resource.group || resource.type; + var imgUrl; + if (resource.image) { + //keep url clean for matching and offline mode handling + var urlPrefix = resource.image.indexOf("//") > -1 ? "" : toRoot; + imgUrl = urlPrefix + resource.image; + } + //add linkout logic here. check url or type, assign a class, map to css :after + $('<div>') + .addClass('card-bg') + .css('background-image', 'url(' + (imgUrl || toRoot + 'assets/images/resource-card-default-android.jpg') + ')') + .appendTo(this); + if (!plusone) { + $('<div>').addClass('card-info' + (!resource.summary ? ' empty-desc' : '')) + .append($('<div>').addClass('section').text(section)) + .append($('<div>').addClass('title').html(resource.title)) + .append($('<div>').addClass('description ellipsis') + .append($('<div>').addClass('text').html(resource.summary)) + .append($('<div>').addClass('util'))) + .appendTo(this); + } else { + $('<div>').addClass('card-info' + (!resource.summary ? ' empty-desc' : '')) + .append($('<div>').addClass('section').text(section)) + .append($('<div>').addClass('title').html(resource.title)) + .append($('<div>').addClass('description ellipsis') + .append($('<div>').addClass('text').html(resource.summary)) + .append($('<div>').addClass('util') + .append($('<div>').addClass('g-plusone') + .attr('data-size', 'small') + .attr('data-align', 'right') + .attr('data-href', resource.url)))) + .appendTo(this); + } + + return this; + }; + + /* Simple jquery function to create dom for a resource section card (menu) */ + $.fn.decorateResourceSection = function(section,plusone) { + var resource = section.resource; + //keep url clean for matching and offline mode handling + var urlPrefix = resource.image.indexOf("//") > -1 ? "" : toRoot; + var $base = $('<a>') + .addClass('card-bg') + .attr('href', resource.url) + .append($('<div>').addClass('card-section-icon') + .append($('<div>').addClass('icon')) + .append($('<div>').addClass('section').html(resource.title))) + .appendTo(this); + + var $cardInfo = $('<div>').addClass('card-info').appendTo(this); + + if (section.sections && section.sections.length) { + // Recurse the section sub-tree to find a resource image. + var stack = [section]; + + while (stack.length) { + if (stack[0].resource.image) { + $base.css('background-image', 'url(' + urlPrefix + stack[0].resource.image + ')'); + break; + } + + if (stack[0].sections) { + stack = stack.concat(stack[0].sections); + } + + stack.shift(); + } + + var $ul = $('<ul>') + .appendTo($cardInfo); + + var max = section.sections.length > 3 ? 3 : section.sections.length; + + for (var i = 0; i < max; ++i) { + + var subResource = section.sections[i]; + if (!plusone) { + $('<li>') + .append($('<a>').attr('href', subResource.url) + .append($('<div>').addClass('title').html(subResource.title)) + .append($('<div>').addClass('description ellipsis') + .append($('<div>').addClass('text').html(subResource.summary)) + .append($('<div>').addClass('util')))) + .appendTo($ul); + } else { + $('<li>') + .append($('<a>').attr('href', subResource.url) + .append($('<div>').addClass('title').html(subResource.title)) + .append($('<div>').addClass('description ellipsis') + .append($('<div>').addClass('text').html(subResource.summary)) + .append($('<div>').addClass('util') + .append($('<div>').addClass('g-plusone') + .attr('data-size', 'small') + .attr('data-align', 'right') + .attr('data-href', resource.url))))) + .appendTo($ul); + } + } + + // Add a more row + if (max < section.sections.length) { + $('<li>') + .append($('<a>').attr('href', resource.url) + .append($('<div>') + .addClass('title') + .text('More'))) + .appendTo($ul); + } + } else { + // No sub-resources, just render description? + } + + return this; + }; +})(jQuery); +/* Calculate the vertical area remaining */ +(function($) { + $.fn.ellipsisfade= function(lineHeight) { + this.each(function() { + // get element text + var $this = $(this); + var remainingHeight = $this.parent().parent().height(); + $this.parent().siblings().each(function () + { + var h = $(this).height(); + remainingHeight = remainingHeight - h; + }); + + adjustedRemainingHeight = ((remainingHeight)/lineHeight>>0)*lineHeight + $this.parent().css({'height': adjustedRemainingHeight}); + $this.css({'height': "auto"}); + }); + + return this; + }; +}) (jQuery); diff --git a/tools/droiddoc/templates-sdk-dyn/components/masthead.cs b/tools/droiddoc/templates-sdk-dyn/components/masthead.cs index 47639bb..d0ff64d 100644 --- a/tools/droiddoc/templates-sdk-dyn/components/masthead.cs +++ b/tools/droiddoc/templates-sdk-dyn/components/masthead.cs @@ -1,225 +1,131 @@ <?cs def:custom_masthead() ?> +<?cs if:wear ?> + <?cs call:wear_masthead() ?> +<?cs else ?> <a name="top"></a> -<?cs if:!devsite ?><?cs # leave out the global header for devsite; it's in devsite template ?> - <!-- Header --> +<?cs if:!devsite ?><?cs # leave out the global header for devsite; it is in devsite template ?> + <!-- Header --> + <div id="header-wrapper"> <div id="header"> - <div class="wrap" id="header-wrap"> - <div class="col-3 logo"> + <div class="wrap" id="header-wrap"> + <div class="col-3 logo"> <a href="<?cs var:toroot ?>index.html"> - <img src="<?cs var:toroot ?>assets/images/dac_logo.png" width="123" height="25" alt="Android Developers" /> + <img src="<?cs var:toroot ?>assets/images/dac_logo.png" + srcset="<?cs var:toroot ?>assets/images/dac_logo@2x.png 2x" + width="123" height="25" alt="Android Developers" /> </a> <div class="btn-quicknav" id="btn-quicknav"> - <a href="#" class="arrow-inactive">Quicknav</a> - <a href="#" class="arrow-active">Quicknav</a> + <a href="#" class="arrow-inactive">Quicknav</a> + <a href="#" class="arrow-active">Quicknav</a> </div> - </div> - <ul class="nav-x col-9"> - <li class="design"> - <a href="<?cs var:toroot ?>design/index.html" - zh-tw-lang="設計" - zh-cn-lang="设计" - ru-lang="Проектирование" - ko-lang="디자인" - ja-lang="設計" - es-lang="Diseñar" - >Design</a></li> - <li class="develop"><a href="<?cs var:toroot ?>develop/index.html" - zh-tw-lang="開發" - zh-cn-lang="开发" - ru-lang="Разработка" - ko-lang="개발" - ja-lang="開発" - es-lang="Desarrollar" - >Develop</a></li> - <li class="distribute last"><a href="<?cs var:toroot ?>distribute/index.html" - zh-tw-lang="發佈" - zh-cn-lang="分发" - ru-lang="Распространение" - ko-lang="배포" - ja-lang="配布" - es-lang="Distribuir" - >Distribute</a></li> - </ul> - - <!-- New Search --> - <div class="menu-container"> - <div class="moremenu"> - <div id="more-btn"></div> - </div> - <div class="morehover" id="moremenu"> - <div class="top"></div> - <div class="mid"> - <div class="header">Links</div> - <ul> - <li><a href="https://play.google.com/apps/publish/">Google Play Developer Console</a></li> - <li><a href="http://android-developers.blogspot.com/">Android Developers Blog</a></li> - <li><a href="<?cs var:toroot ?>about/index.html">About Android</a></li> - </ul> - <div class="header">Android Sites</div> - <ul> - <li><a href="http://www.android.com">Android.com</a></li> - <li class="active"><a>Android Developers</a></li> - <li><a href="http://source.android.com">Android Open Source Project</a></li> - </ul> - - <?cs # Include language switcher only in online docs ?> - <?cs if:android.whichdoc == "online" ?> - <div class="header">Language</div> - <div id="language" class="locales"> - <select name="language" onChange="changeLangPref(this.value, true)"> - <option value="en">English</option> - <option value="es">Español</option> - <option value="ja">日本語</option> - <option value="ko">한국어</option> - <option value="ru">Русский</option> - <option value="zh-cn">中文 (中国)</option> - <option value="zh-tw">中文 (台灣)</option> - </select> - </div> - <script type="text/javascript"> - <!-- - loadLangPref(); - //--> - </script> - <?cs /if ?> - <?cs # End of lang switcher ?> + </div> + <ul class="nav-x col-9"> + <li class="design"> + <a href="<?cs var:toroot ?>design/index.html" + zh-tw-lang="設計" + zh-cn-lang="设计" + ru-lang="Проектирование" + ko-lang="디자인" + ja-lang="設計" + es-lang="Diseñar" + >Design</a></li> + <li class="develop"><a href="<?cs var:toroot ?>develop/index.html" + zh-tw-lang="開發" + zh-cn-lang="开发" + ru-lang="Разработка" + ko-lang="개발" + ja-lang="開発" + es-lang="Desarrollar" + >Develop</a></li> + <li class="distribute last"><a href="<?cs var:toroot ?>distribute/<?cs + if:android.whichdoc == "offline" ?>googleplay/<?cs /if ?>index.html" + zh-tw-lang="發佈" + zh-cn-lang="分发" + ru-lang="Распространение" + ko-lang="배포" + ja-lang="配布" + es-lang="Distribuir" + >Distribute</a></li> + </ul> - <br class="clearfix" /> - </div> - <div class="bottom"></div> - </div> - <div class="search" id="search-container"> - <div class="search-inner"> - <div id="search-btn"></div> - <div class="left"></div> - <form onsubmit="return submit_search()"> - <input id="search_autocomplete" type="text" value="" autocomplete="off" name="q" -onfocus="search_focus_changed(this, true)" onblur="search_focus_changed(this, false)" -onkeydown="return search_changed(event, true, '<?cs var:toroot ?>')" -onkeyup="return search_changed(event, false, '<?cs var:toroot ?>')" /> - </form> - <div class="right"></div> - <a class="close hide">close</a> - <div class="left"></div> - <div class="right"></div> - </div> - </div> + <?cs # ADD SEARCH AND MENU ?> + <?cs call:header_search_widget() ?> - <div class="search_filtered_wrapper reference"> - <div class="suggest-card reference no-display"> - <ul class="search_filtered"> - </ul> - </div> - </div> - <div class="search_filtered_wrapper docs"> - <div class="suggest-card dummy no-display"> </div> - <div class="suggest-card develop no-display"> - <ul class="search_filtered"> - </ul> - <div class="child-card guides no-display"> - </div> - <div class="child-card training no-display"> - </div> - <div class="child-card samples no-display"> - </div> - </div> - <div class="suggest-card design no-display"> - <ul class="search_filtered"> - </ul> - </div> - <div class="suggest-card distribute no-display"> - <ul class="search_filtered"> - </ul> - </div> - </div> + <!-- Expanded quicknav --> + <div id="quicknav" class="col-9"> + <ul> + <li class="design"> + <ul> + <li><a href="<?cs var:toroot ?>design/index.html">Get Started</a></li> + <li><a href="<?cs var:toroot ?>design/style/index.html">Style</a></li> + <li><a href="<?cs var:toroot ?>design/patterns/index.html">Patterns</a></li> + <li><a href="<?cs var:toroot ?>design/building-blocks/index.html">Building Blocks</a></li> + <li><a href="<?cs var:toroot ?>design/downloads/index.html">Downloads</a></li> + <li><a href="<?cs var:toroot ?>design/videos/index.html">Videos</a></li> + </ul> + </li> + <li class="develop"> + <ul> + <li><a href="<?cs var:toroot ?>training/index.html" + zh-tw-lang="訓練課程" + zh-cn-lang="培训" + ru-lang="Курсы" + ko-lang="교육" + ja-lang="トレーニング" + es-lang="Capacitación" + >Training</a></li> + <li><a href="<?cs var:toroot ?>guide/index.html" + zh-tw-lang="API 指南" + zh-cn-lang="API 指南" + ru-lang="Руководства по API" + ko-lang="API 가이드" + ja-lang="API ガイド" + es-lang="Guías de la API" + >API Guides</a></li> + <li><a href="<?cs var:toroot ?>reference/packages.html" + zh-tw-lang="參考資源" + zh-cn-lang="参考" + ru-lang="Справочник" + ko-lang="참조문서" + ja-lang="リファレンス" + es-lang="Referencia" + >Reference</a></li> + <li><a href="<?cs var:toroot ?>tools/index.html" + zh-tw-lang="相關工具" + zh-cn-lang="工具" + ru-lang="Инструменты" + ko-lang="도구" + ja-lang="ツール" + es-lang="Herramientas" + >Tools</a> + <ul><li><a href="<?cs var:toroot ?>sdk/index.html">Get the SDK</a></li></ul> + </li> + <li><a href="<?cs var:toroot ?>google/index.html">Google Services</a> + </li> + <?cs if:android.hasSamples ?> + <li><a href="<?cs var:toroot ?>samples/index.html">Samples</a> + </li> + <?cs /if ?> + </ul> + </li> + <li class="distribute last"> + <ul> + <li><a href="<?cs var:toroot ?>distribute/googleplay/index.html">Google Play</a></li> + <li><a href="<?cs var:toroot ?>distribute/essentials/index.html">Essentials</a></li> + <li><a href="<?cs var:toroot ?>distribute/users/index.html">Get Users</a></li> + <li><a href="<?cs var:toroot ?>distribute/engage/index.html">Engage & Retain</a></li> + <li><a href="<?cs var:toroot ?>distribute/monetize/index.html">Monetize</a></li> + <li><a href="<?cs var:toroot ?>distribute/tools/index.html">Tools & Reference</a></li> + <li><a href="<?cs var:toroot ?>distribute/stories/index.html">Developer Stories</a></li> + </ul> + </li> + </ul> + </div><!-- /Expanded quicknav --> + </div><!-- end header-wrap.wrap --> + </div><!-- end header --> - </div> - <!-- /New Search> - - - <!-- Expanded quicknav --> - <div id="quicknav" class="col-9"> - <ul> - <li class="design"> - <ul> - <li><a href="<?cs var:toroot ?>design/index.html">Get Started</a></li> - <li><a href="<?cs var:toroot ?>design/style/index.html">Style</a></li> - <li><a href="<?cs var:toroot ?>design/patterns/index.html">Patterns</a></li> - <li><a href="<?cs var:toroot ?>design/building-blocks/index.html">Building Blocks</a></li> - <li><a href="<?cs var:toroot ?>design/downloads/index.html">Downloads</a></li> - <li><a href="<?cs var:toroot ?>design/videos/index.html">Videos</a></li> - </ul> - </li> - <li class="develop"> - <ul> - <li><a href="<?cs var:toroot ?>training/index.html" - zh-tw-lang="訓練課程" - zh-cn-lang="培训" - ru-lang="Курсы" - ko-lang="교육" - ja-lang="トレーニング" - es-lang="Capacitación" - >Training</a></li> - <li><a href="<?cs var:toroot ?>guide/index.html" - zh-tw-lang="API 指南" - zh-cn-lang="API 指南" - ru-lang="Руководства по API" - ko-lang="API 가이드" - ja-lang="API ガイド" - es-lang="Guías de la API" - >API Guides</a></li> - <li><a href="<?cs var:toroot ?>reference/packages.html" - zh-tw-lang="參考資源" - zh-cn-lang="参考" - ru-lang="Справочник" - ko-lang="참조문서" - ja-lang="リファレンス" - es-lang="Referencia" - >Reference</a></li> - <li><a href="<?cs var:toroot ?>tools/index.html" - zh-tw-lang="相關工具" - zh-cn-lang="工具" - ru-lang="Инструменты" - ko-lang="도구" - ja-lang="ツール" - es-lang="Herramientas" - >Tools</a> - <ul><li><a href="<?cs var:toroot ?>sdk/index.html">Get the SDK</a></li></ul> - </li> - <li><a href="<?cs var:toroot ?>google/index.html">Google Services</a> - </li> - <?cs if:android.hasSamples ?> - <li><a href="<?cs var:toroot ?>samples/index.html">Samples</a> - </li> - <?cs /if ?> - </ul> - </li> - <li class="distribute last"> - <ul> - <li><a href="<?cs var:toroot ?>distribute/index.html">Google Play</a></li> - <li><a href="<?cs var:toroot ?>distribute/googleplay/publish/index.html">Publishing</a></li> - <li><a href="<?cs var:toroot ?>distribute/googleplay/promote/index.html">Promoting</a></li> - <li><a href="<?cs var:toroot ?>distribute/googleplay/quality/index.html">App Quality</a></li> - <li><a href="<?cs var:toroot ?>distribute/googleplay/spotlight/index.html">Spotlight</a></li> - <li><a href="<?cs var:toroot ?>distribute/open.html">Open Distribution</a></li> - </ul> - </li> - </ul> - </div> - <!-- /Expanded quicknav --> - </div> - </div> - <!-- /Header --> - - - <div id="searchResults" class="wrap" style="display:none;"> - <h2 id="searchTitle">Results</h2> - <div id="leftSearchControl" class="search-control">Loading...</div> - </div> - - <?cs if:training || guide || reference || tools || develop || google || samples ?> <!-- Secondary x-nav --> <div id="nav-x"> @@ -231,7 +137,7 @@ onkeyup="return search_changed(event, false, '<?cs var:toroot ?>')" /> ru-lang="Курсы" ko-lang="교육" ja-lang="トレーニング" - es-lang="Capacitación" + es-lang="Capacitación" >Training</a></li> <li class="guide"><a href="<?cs var:toroot ?>guide/index.html" zh-tw-lang="API 指南" @@ -239,7 +145,7 @@ onkeyup="return search_changed(event, false, '<?cs var:toroot ?>')" /> ru-lang="Руководства по API" ko-lang="API 가이드" ja-lang="API ガイド" - es-lang="Guías de la API" + es-lang="Guías de la API" >API Guides</a></li> <li class="reference"><a href="<?cs var:toroot ?>reference/packages.html" zh-tw-lang="參考資源" @@ -247,7 +153,7 @@ onkeyup="return search_changed(event, false, '<?cs var:toroot ?>')" /> ru-lang="Справочник" ko-lang="참조문서" ja-lang="リファレンス" - es-lang="Referencia" + es-lang="Referencia" >Reference</a></li> <li class="tools"><a href="<?cs var:toroot ?>tools/index.html" zh-tw-lang="相關工具" @@ -267,13 +173,98 @@ onkeyup="return search_changed(event, false, '<?cs var:toroot ?>')" /> <?cs /if ?> </ul> </div> - </div> <!-- /Sendondary x-nav --> + + <?cs elif:distribute || googleplay || essentials || users || engage || monetize || disttools || stories ?> + <!-- Secondary distribute x-nav --> + <div id="nav-x"> + <div class="wrap"> + <ul class="nav-x distribute"> + <li class="googleplay"><a href="<?cs var:toroot ?>distribute/googleplay/index.html" + >Google Play</a></li> + <li class="essentials"><a href="<?cs var:toroot ?>distribute/essentials/index.html" + >Essentials</a></li> + <li class="users"><a href="<?cs var:toroot ?>distribute/users/index.html" + >Get Users</a></li> + <li class="engage"><a href="<?cs var:toroot ?>distribute/engage/index.html" + >Engage & Retain</a></li> + <li class="monetize"><a href="<?cs var:toroot ?>distribute/monetize/index.html" + >Monetize</a> + </li> + <li class="disttools"><a href="<?cs var:toroot ?>distribute/tools/index.html" + >Tools</a> + </li> + <li class="stories"><a href="<?cs var:toroot ?>distribute/stories/index.html" + >Stories</a> + </li> + </ul> + <a href="https://play.google.com/apps/publish/" class="developer-console-btn">Developer Console</a> + </div> <!-- /Secondary distribute x-nav --> + </div> <?cs /if ?> -<?cs /if ?> -<?cs # end if/else !devsite ?> + <div id="searchResults" class="wrap" style="display:none;"> + <h2 id="searchTitle">Results</h2> + <div id="leftSearchControl" class="search-control">Loading...</div> + </div> + </div> <!--end header-wrapper --> + + <div id="sticky-header"> + <div> + <a class="logo" href="#top"></a> + <a class="top" href="#top"></a> + <ul class="breadcrumb"> + <?cs # More <li> elements added here with javascript ?> + <?cs if:!section.landing ?><li class="current"><?cs var:page.title ?></li><?cs + /if ?> + </ul> + </div> + </div> + +<?cs /if ?><?cs # end if/else !devsite ?> +<?cs /if ?><?cs # end if/else wear ?><?cs +/def ?> + +<?cs def:wear_masthead() ?> +<a name="top"></a> + +<!-- Header --> +<div id="header-wrapper"> + <div id="header"> + <div class="wrap" id="header-wrap"> + <div class="col_3 logo wear-logo"> + <a href="<?cs var:toroot ?>wear/index.html"> + <img src="<?cs var:toroot ?>wear/images/android-wear.png" height="16" alt="Android Wear" /> + </a> + </div> + <div class="col-8" style="margin:0"><h1 style="margin:1px 0 0 20px;padding:0;line-height:16px; +color:#666;font-weight:100;font-size:24px;">Developer Preview</h1></div> + + <?cs # ADD SEARCH AND MENU ?> + <?cs call:header_search_widget() ?> + + </div><!-- end header-wrap --> + </div><!-- /Header --> + + + <div id="searchResults" class="wrap" style="display:none;"> + <h2 id="searchTitle">Results</h2> + <div id="leftSearchControl" class="search-control">Loading...</div> + </div> +</div> <!--end header-wrapper --> + +<div id="sticky-header"> + <div> + <a class="logo" href="#top"></a> + <a class="top" href="#top"></a> + <ul class="breadcrumb"> + <?cs # More <li> elements added here with javascript ?> + <?cs if:!section.landing ?><li class="current"><?cs var:page.title ?></li><?cs + /if ?> + </ul> + </div> +</div> - <?cs + <?cs /def ?> diff --git a/tools/droiddoc/templates-sdk-dyn/customizations.cs b/tools/droiddoc/templates-sdk-dyn/customizations.cs index ed57f1c..27822d5 100644 --- a/tools/droiddoc/templates-sdk-dyn/customizations.cs +++ b/tools/droiddoc/templates-sdk-dyn/customizations.cs @@ -7,7 +7,6 @@ def:sdk_nav() ?> <div class="wrap clearfix" id="body-content"> <div class="col-4" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> <div id="devdoc-nav" class="scroll-pane"> -<a class="totop" href="#top" data-g-event="left-nav-top">to top</a> <?cs include:"../../../../frameworks/base/docs/html/sdk/sdk_toc.cs" ?> @@ -15,19 +14,53 @@ def:sdk_nav() ?> </div> </div> <!-- end side-nav --> -<?cs /def ?> +<?cs /def ?><?cs + +def:no_nav() ?> + <div class="wrap clearfix" id="body-content"> +<?cs /def ?><?cs + +def:tools_nav() ?> + <div class="wrap clearfix" id="body-content"> + <div class="col-3" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> + <div id="devdoc-nav" class="scroll-pane"> <?cs -def:resources_tab_nav() ?> + include:"../../../../frameworks/base/docs/html/tools/tools_toc.cs" ?> + + + </div> + </div> <!-- end side-nav --> + <script> + $(document).ready(function() { + scrollIntoView("devdoc-nav"); + }); + </script> +<?cs /def ?> +<?cs +def:training_nav() ?> <div class="wrap clearfix" id="body-content"> - <a <div class="col-4" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> <div id="devdoc-nav" class="scroll-pane"> -<a class="totop" href="#top" data-g-event="left-nav-top">to top</a> + <?cs - include:"../../../../frameworks/base/docs/html/resources/resources_toc.cs" ?> + include:"../../../../frameworks/base/docs/html/training/training_toc.cs" ?> + + </div> + </div> <!-- end side-nav --> + <script> + $(document).ready(function() { + scrollIntoView("devdoc-nav"); + }); + </script> +<?cs /def ?><?cs +def:googleplay_nav() ?> + <div class="wrap clearfix" id="body-content"> + <div class="col-3" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> + <div id="devdoc-nav" class="scroll-pane"> +<?cs include:"../../../../frameworks/base/docs/html/distribute/googleplay/googleplay_toc.cs" ?> </div> </div> <!-- end side-nav --> <script> @@ -35,17 +68,13 @@ def:resources_tab_nav() ?> scrollIntoView("devdoc-nav"); }); </script> -<?cs /def ?> -<?cs -def:tools_nav() ?> +<?cs /def ?><?cs + +def:essentials_nav() ?> <div class="wrap clearfix" id="body-content"> <div class="col-3" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> <div id="devdoc-nav" class="scroll-pane"> -<a class="totop" href="#top" data-g-event="left-nav-top">to top</a> -<?cs - include:"../../../../frameworks/base/docs/html/tools/tools_toc.cs" ?> - - +<?cs include:"../../../../frameworks/base/docs/html/distribute/essentials/essentials_toc.cs" ?> </div> </div> <!-- end side-nav --> <script> @@ -53,19 +82,69 @@ def:tools_nav() ?> scrollIntoView("devdoc-nav"); }); </script> -<?cs /def ?> -<?cs -def:training_nav() ?> +<?cs /def ?><?cs + +def:users_nav() ?> <div class="wrap clearfix" id="body-content"> - <div class="col-4" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> + <div class="col-3" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> <div id="devdoc-nav" class="scroll-pane"> -<a class="totop" href="#top" data-g-event="left-nav-top">to top</a> +<?cs include:"../../../../frameworks/base/docs/html/distribute/users/users_toc.cs" ?> + </div> + </div> <!-- end side-nav --> + <script> + $(document).ready(function() { + scrollIntoView("devdoc-nav"); + }); + </script> +<?cs /def ?><?cs + +def:engage_nav() ?> + <div class="wrap clearfix" id="body-content"> + <div class="col-3" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> + <div id="devdoc-nav" class="scroll-pane"> +<?cs include:"../../../../frameworks/base/docs/html/distribute/engage/engage_toc.cs" ?> + </div> + </div> <!-- end side-nav --> + <script> + $(document).ready(function() { + scrollIntoView("devdoc-nav"); + }); + </script> +<?cs /def ?><?cs +def:monetize_nav() ?> + <div class="wrap clearfix" id="body-content"> + <div class="col-3" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> + <div id="devdoc-nav" class="scroll-pane"> +<?cs include:"../../../../frameworks/base/docs/html/distribute/monetize/monetize_toc.cs" ?> + </div> + </div> <!-- end side-nav --> + <script> + $(document).ready(function() { + scrollIntoView("devdoc-nav"); + }); + </script> +<?cs /def ?><?cs -<?cs - include:"../../../../frameworks/base/docs/html/training/training_toc.cs" ?> - +def:disttools_nav() ?> + <div class="wrap clearfix" id="body-content"> + <div class="col-3" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> + <div id="devdoc-nav" class="scroll-pane"> +<?cs include:"../../../../frameworks/base/docs/html/distribute/tools/disttools_toc.cs" ?> + </div> + </div> <!-- end side-nav --> + <script> + $(document).ready(function() { + scrollIntoView("devdoc-nav"); + }); + </script> +<?cs /def ?><?cs +def:stories_nav() ?> + <div class="wrap clearfix" id="body-content"> + <div class="col-3" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> + <div id="devdoc-nav" class="scroll-pane"> +<?cs include:"../../../../frameworks/base/docs/html/distribute/stories/stories_toc.cs" ?> </div> </div> <!-- end side-nav --> <script> @@ -73,14 +152,12 @@ def:training_nav() ?> scrollIntoView("devdoc-nav"); }); </script> -<?cs /def ?> -<?cs +<?cs /def ?><?cs + def:guide_nav() ?> <div class="wrap clearfix" id="body-content"> <div class="col-4" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> <div id="devdoc-nav" class="scroll-pane"> -<a class="totop" href="#top" data-g-event="left-nav-top">to top</a> - <?cs include:"../../../../frameworks/base/docs/html/guide/guide_toc.cs" ?> @@ -99,7 +176,6 @@ def:design_nav() ?> <div class="wrap clearfix" id="body-content"> <div class="col-3" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> <div id="devdoc-nav" class="scroll-pane"> -<a class="totop" href="#top" data-g-event="left-nav-top">to top</a> <?cs @@ -119,7 +195,6 @@ def:distribute_nav() ?> <div class="wrap clearfix" id="body-content"> <div class="col-3" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> <div id="devdoc-nav" class="scroll-pane"> -<a class="totop" href="#top" data-g-event="left-nav-top">to top</a> <?cs include:"../../../../frameworks/base/docs/html/distribute/distribute_toc.cs" ?> @@ -139,7 +214,6 @@ def:samples_nav() ?> <div class="wrap clearfix" id="body-content"> <div class="col-4" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> <div id="devdoc-nav" class="scroll-pane"> -<a class="totop" href="#top" data-g-event="left-nav-top">to top</a> <?cs include:"../../../../frameworks/base/docs/html/samples/samples_toc.cs" ?> @@ -159,7 +233,6 @@ def:google_nav() ?> <div class="wrap clearfix" id="body-content"> <div class="col-4" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> <div id="devdoc-nav" class="scroll-pane"> -<a class="totop" href="#top" data-g-event="left-nav-top">to top</a> <?cs include:"../../../../frameworks/base/docs/html/google/google_toc.cs" ?> @@ -183,7 +256,6 @@ def:about_nav() ?> <div class="wrap clearfix" id="body-content"> <div class="col-3" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> <div id="devdoc-nav" class="scroll-pane"> -<a class="totop" href="#top" data-g-event="left-nav-top">to top</a> <?cs include:"../../../../frameworks/base/docs/html/about/about_toc.cs" ?> @@ -198,6 +270,26 @@ def:about_nav() ?> </script> <?cs /def ?> + +<?cs +def:wear_nav() ?> + <div class="wrap clearfix" id="body-content"> + <div class="col-4" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> + <div id="devdoc-nav" class="scroll-pane"> + +<?cs + include:"../../../../frameworks/base/docs/html/wear/wear_toc.cs" ?> + + + </div> + </div> <!-- end side-nav --> + <script> + $(document).ready(function() { + scrollIntoView("devdoc-nav"); + }); + </script> +<?cs /def ?> + <?cs # The default side navigation for the reference docs ?><?cs def:default_left_nav() ?> <?cs if:reference.gcm || reference.gms ?> @@ -206,8 +298,6 @@ def:default_left_nav() ?> <div class="wrap clearfix" id="body-content"> <div class="col-4" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> <div id="devdoc-nav"> - -<a class="totop" href="#top" data-g-event="left-nav-top">to top</a> <div id="api-nav-header"> <div id="api-level-toggle"> <label for="apiLevelCheckbox" class="disabled" @@ -308,10 +398,111 @@ def:default_left_nav() ?> <?cs /def ?> + +<?cs +def:header_search_widget() ?> +<div class="menu-container"> + <div class="moremenu"> + <div id="more-btn"></div> + </div> + <div class="morehover" id="moremenu"> + <div class="top"></div> + <div class="mid"> + <div class="header">Links</div> + <ul> + <li><a href="https://play.google.com/apps/publish/" target="_googleplay">Google Play Developer Console</a></li> + <li><a href="http://android-developers.blogspot.com/">Android Developers Blog</a></li> + <li><a href="<?cs var:toroot ?>about/index.html">About Android</a></li> + </ul> + <div class="header">Android Sites</div> + <ul> + <li><a href="http://www.android.com">Android.com</a></li> + <li class="active"><a>Android Developers</a></li> + <li><a href="http://source.android.com">Android Open Source Project</a></li> + </ul> + + <?cs # Include language switcher only in online docs ?> + <?cs if:android.whichdoc == "online" ?> + <div class="header">Language</div> + <div id="language" class="locales"> + <select name="language" onChange="changeLangPref(this.value, true)"> + <option value="en">English</option> + <option value="es">Español</option> + <option value="ja">日本語</option> + <option value="ko">한국어</option> + <option value="ru">Русский</option> + <option value="zh-cn">中文 (中国)</option> + <option value="zh-tw">中文 (台灣)</option> + </select> + </div> + <script type="text/javascript"> + <!-- + loadLangPref(); + //--> + </script> + <?cs /if ?> + <?cs # End of lang switcher ?> + <br class="clearfix" /> + </div><!-- end 'mid' --> + <div class="bottom"></div> + </div><!-- end 'moremenu' --> + + <div class="search" id="search-container"> + <div class="search-inner"> + <div id="search-btn"></div> + <div class="left"></div> + <form onsubmit="return submit_search()"> + <input id="search_autocomplete" type="text" value="" autocomplete="off" name="q" + onfocus="search_focus_changed(this, true)" onblur="search_focus_changed(this, false)" + onkeydown="return search_changed(event, true, '<?cs var:toroot ?>')" + onkeyup="return search_changed(event, false, '<?cs var:toroot ?>')" /> + </form> + <div class="right"></div> + <a class="close hide">close</a> + <div class="left"></div> + <div class="right"></div> + </div><!-- end search-inner --> + </div><!-- end search-container --> + + <div class="search_filtered_wrapper reference"> + <div class="suggest-card reference no-display"> + <ul class="search_filtered"> + </ul> + </div> + </div> + + <div class="search_filtered_wrapper docs"> + <div class="suggest-card dummy no-display"> </div> + <div class="suggest-card develop no-display"> + <ul class="search_filtered"> + </ul> + <div class="child-card guides no-display"> + </div> + <div class="child-card training no-display"> + </div> + <div class="child-card samples no-display"> + </div> + </div> + <div class="suggest-card design no-display"> + <ul class="search_filtered"> + </ul> + </div> + <div class="suggest-card distribute no-display"> + <ul class="search_filtered"> + </ul> + </div> + </div> +</div><!-- end menu-container (search and menu widget) --> +<?cs /def ?> + + + <?cs def:custom_left_nav() ?><?cs - if:fullpage ?><?cs - call:fullpage() ?><?cs + if:fullpage ?><?cs + call:fullpage() ?><?cs + elif:nonavpage ?><?cs + call:no_nav() ?><?cs elif:guide ?><?cs call:guide_nav() ?><?cs elif:design ?><?cs @@ -324,15 +515,31 @@ def:custom_left_nav() ?><?cs call:google_nav() ?><?cs elif:samples ?><?cs call:samples_nav() ?><?cs - elif:more ?><?cs - call:dist_more_nav() ?><?cs elif:distribute ?><?cs - call:distribute_nav() ?><?cs - elif:about ?><?cs - call:about_nav() ?><?cs - else ?><?cs - call:default_left_nav() ?> <?cs - /if ?><?cs + if:googleplay ?><?cs + call:googleplay_nav() ?><?cs + elif:essentials ?><?cs + call:essentials_nav() ?><?cs + elif:users ?><?cs + call:users_nav() ?><?cs + elif:engage ?><?cs + call:engage_nav() ?><?cs + elif:monetize ?><?cs + call:monetize_nav() ?><?cs + elif:disttools ?><?cs + call:disttools_nav() ?><?cs + elif:stories ?><?cs + call:stories_nav() ?><?cs + /if ?><?cs + elif:about ?><?cs + call:about_nav() ?><?cs + elif:distribute ?><?cs + call:distribute_nav() ?><?cs + elif:wear ?><?cs + call:wear_nav() ?><?cs + else ?><?cs + call:default_left_nav() ?> <?cs + /if ?><?cs /def ?> <?cs # appears at the bottom of every page ?><?cs diff --git a/tools/droiddoc/templates-sdk-dyn/docpage.cs b/tools/droiddoc/templates-sdk-dyn/docpage.cs index ea462c9..7eae405 100644 --- a/tools/droiddoc/templates-sdk-dyn/docpage.cs +++ b/tools/droiddoc/templates-sdk-dyn/docpage.cs @@ -2,19 +2,36 @@ <?cs include:"macros.cs" ?> <html<?cs if:devsite ?> devsite<?cs /if ?>> <?cs include:"head_tag.cs" ?> -<body class="gc-documentation <?cs if:(google || reference.gms || reference.gcm) ?>google<?cs /if ?> - <?cs if:(guide||develop||training||reference||tools||sdk||samples) ?>develop<?cs if:guide ?> guide<?cs /if ?><?cs if:samples ?> samples<?cs /if ?><?cs +<body class="gc-documentation + +<?cs +if:(google || reference.gms || reference.gcm) ?>google<?cs /if ?><?cs + if:(guide||develop||training||reference||tools||sdk||samples) ?>develop<?cs + if:guide ?> guide<?cs /if ?><?cs + if:samples ?> samples<?cs /if ?><?cs + elif:(distribute||googleplay||essentials||users||engage||monetize||disttools||stories) + ?>distribute<?cs + if:googleplay ?> googleplay<?cs /if ?><?cs + if:essentials ?> essentials<?cs /if ?><?cs + if:users ?> users<?cs /if ?><?cs + if:engage ?> engage<?cs /if ?><?cs + if:monetize ?> monetize<?cs /if ?><?cs + if:disttools ?> disttools<?cs /if ?><?cs + if:stories ?> stories<?cs /if ?><?cs elif:about ?>about<?cs elif:design ?>design<?cs - elif:distribute ?>distribute<?cs - /if ?><?cs - if:page.trainingcourse ?> trainingcourse<?cs /if ?>" itemscope itemtype="http://schema.org/Article"> -<?cs include:"header.cs" ?> +/if ?><?cs +if:page.trainingcourse ?> trainingcourse<?cs +/if ?>" itemscope itemtype="http://schema.org/Article"><?cs +include:"header.cs" ?> -<div <?cs if:fullpage -?>class="fullpage"<?cs elif:design||tools||about||sdk||distribute -?>class="col-13" id="doc-col"<?cs else -?>class="col-12" id="doc-col"<?cs /if ?> > +<div <?cs + if:fullpage + ?>class="fullpage"<?cs + elif:(design||tools||about||sdk||googleplay||essentials||users||monetize||disttools) && !nonavpage + ?>class="col-13" id="doc-col"<?cs + elif:!nonavpage + ?>class="col-12" id="doc-col"<?cs /if ?> > <?cs if:(design||training||walkthru) && !page.trainingcourse && !page.article ?><?cs # header logic for docs that provide previous/next buttons ?> <?cs if:header.hide ?> @@ -74,6 +91,7 @@ <?cs /if ?><?cs # end if training ?> </div> <?cs /if ?> + <?cs elif:samplesProjectIndex ?> <div id="api-info-block"> <div class="sum-details-links"> @@ -83,7 +101,10 @@ </div><!-- end sum-details-links --> </div><!-- end breadcurmb block --> <h1 itemprop="name"><?cs var:projectDir ?></h1> + <?cs else ?> + + <?cs if:(!fullpage && !header.hide) ?> <?cs if:page.landing ?><?cs # header logic for docs that are landing pages ?> <div class="landing-banner"> @@ -181,8 +202,6 @@ <?cs include:"footer.cs" ?> </div><!-- end doc-content --> -<?cs include:"trailer.cs" ?> - <!-- Start of Tag --> <script type="text/javascript"> var axel = Math.random() + ""; @@ -193,6 +212,15 @@ document.write('<iframe src="https://2507573.fls.doubleclick.net/activityi;src=2 <iframe src="https://2507573.fls.doubleclick.net/activityi;src=2507573;type=other026;cat=googl348;ord=1?" width="1" height="1" frameborder="0" style="display:none"></iframe> </noscript> <!-- End of Tag --> + + +<?cs include:"trailer.cs" ?> + <script src="https://developer.android.com/ytblogger_lists_unified.js" type="text/javascript"></script> + <script src="<?cs var:toroot ?>jd_lists_unified.js" type="text/javascript"></script> + <script src="<?cs var:toroot ?>jd_extras.js" type="text/javascript"></script> + <script src="<?cs var:toroot ?>jd_collections.js" type="text/javascript"></script> + <script src="<?cs var:toroot ?>jd_tag_helpers.js" type="text/javascript"></script> + </body> </html> diff --git a/tools/droiddoc/templates-sdk-dyn/head_tag.cs b/tools/droiddoc/templates-sdk-dyn/head_tag.cs index 54de169..732118f 100644 --- a/tools/droiddoc/templates-sdk-dyn/head_tag.cs +++ b/tools/droiddoc/templates-sdk-dyn/head_tag.cs @@ -15,13 +15,13 @@ ?><?cs # END if/else devsite ?> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> -<meta name="viewport" content="width=device-width" /> +<meta name="viewport" content="width=<?cs + if:page.viewport_width ?><?cs + var:page.viewport_width ?><?cs + else ?>device-width<?cs /if ?>" /> <?cs if:page.metaDescription ?> <meta name="Description" content="<?cs var:page.metaDescription ?>"><?cs - /if ?><?cs - if:page.customHeadTag ?> -<?cs var:page.customHeadTag ?><?cs /if ?> <link rel="shortcut icon" type="image/x-icon" href="<?cs var:toroot ?>favicon.ico" /> <title><?cs @@ -31,10 +31,16 @@ <!-- STYLESHEETS --> <link rel="stylesheet" -href="<?cs if:android.whichdoc != 'online' ?>http:<?cs /if ?>//fonts.googleapis.com/css?family=Roboto:regular,medium,thin,italic,mediumitalic,bold" title="roboto"> +href="<?cs +if:android.whichdoc != 'online' ?>http:<?cs +/if ?>//fonts.googleapis.com/css?family=Roboto+Condensed"> +<link rel="stylesheet" href="<?cs +if:android.whichdoc != 'online' ?>http:<?cs +/if ?>//fonts.googleapis.com/css?family=Roboto:light,regular,medium,thin,italic,mediumitalic,bold" + title="roboto"> <link href="<?cs var:toroot ?>assets/css/default.css" rel="stylesheet" type="text/css"> -<?cs if:reference && !(reference.gms || reference.gcm) ?> +<?cs if:reference && !(reference.gms || reference.gcm || wear) ?> <!-- FULLSCREEN STYLESHEET --> <link href="<?cs var:toroot ?>assets/css/fullscreen.css" rel="stylesheet" class="fullscreen" type="text/css"> @@ -47,7 +53,10 @@ if:devsite ?><script src="<?cs var:toroot ?>_static/js/android_3p-bundle.js" type="text/javascript"></script><?cs else ?><script src="<?cs var:toroot ?>assets/js/android_3p-bundle.js" type="text/javascript"></script><?cs -/if ?> +/if ?><?cs + if:page.customHeadTag ?> +<?cs var:page.customHeadTag ?><?cs + /if ?> <script type="text/javascript"> var toRoot = "<?cs var:toroot ?>"; var metaTags = [<?cs var:meta.tags ?>]; @@ -66,4 +75,4 @@ else var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); })(); </script> -</head>
\ No newline at end of file +</head> diff --git a/tools/droiddoc/templates-sdk-dyn/sample.cs b/tools/droiddoc/templates-sdk-dyn/sample.cs index 684e284..c6f28f8 100644 --- a/tools/droiddoc/templates-sdk-dyn/sample.cs +++ b/tools/droiddoc/templates-sdk-dyn/sample.cs @@ -7,7 +7,7 @@ <div <?cs if:fullpage ?>class="fullpage"<?cs elif:design||tools||about||sdk||distribute -?>class="col-13" id="doc-col"<?cs else +?>class="col-13" id="doc-col"<?cs else ?>class="col-12" id="doc-col"<?cs /if ?> > <!-- start breadcrumb block --> diff --git a/tools/droiddoc/templates-sdk-dyn/sdkpage.cs b/tools/droiddoc/templates-sdk-dyn/sdkpage.cs index d98146a..95f6596 100644 --- a/tools/droiddoc/templates-sdk-dyn/sdkpage.cs +++ b/tools/droiddoc/templates-sdk-dyn/sdkpage.cs @@ -11,7 +11,7 @@ <?cs else ?> <?cs include:"head_tag.cs" ?> <?cs /if ?> -<body class="gc-documentation +<body class="gc-documentation <?cs if:(guide||develop||training||reference||tools||sdk) ?>develop<?cs elif:design ?>design<?cs elif:distribute ?>distribute<?cs @@ -107,7 +107,7 @@ </td> <td><?cs var:ndk.win64_bytes ?></td> <td><?cs var:ndk.win64_checksum ?></td> - </tr> + </tr> <!-- <tr> <td> <a onClick="return onDownload(this)" @@ -199,12 +199,12 @@ <td><?cs var:ndk.debug_info_checksum ?></td> </tr> </table> - + <?cs ######## HERE IS THE JD DOC CONTENT ######### ?> <?cs call:tag_list(root.descr) ?> - + <script> function onDownload(link) { @@ -229,13 +229,13 @@ function onDownloadNdkForRealz(link) { if ($("input#agree").is(':checked')) { $("#tos").fadeOut('slow'); - + $('html, body').animate({ scrollTop: $("#Installing").offset().top }, 800, function() { $("#Installing").click(); }); - + return true; } else { $("label#agreeLabel").parent().stop().animate({color: "#258AAF"}, 200, @@ -254,7 +254,7 @@ </script> <?cs else ?> -<?cs # end if NDK ... +<?cs # end if NDK ... # # # @@ -281,11 +281,11 @@ <h4><a href='' class="expandable" onclick="toggleExpandable(this,'.pax');hideExpandable('.myide,.reqs');return false;" >DOWNLOAD FOR OTHER PLATFORMS</a></h4> - - + + <div class="pax col-13 online" style="display:none;margin:0;"> - + <p class="table-caption"><strong>ADT Bundle</strong></p> <table class="download"> <tr> @@ -298,7 +298,7 @@ <td>Windows 32-bit</td> <td> <a onClick="return onDownload(this)" id="win-bundle32" - href="http://dl.google.com/android/adt/<?cs var:sdk.win32_bundle_download ?>"><?cs var:sdk.win32_bundle_download ?></a> + href="http://dl.google.com/android/adt/<?cs var:sdk.version ?>/<?cs var:sdk.win32_bundle_download ?>"><?cs var:sdk.win32_bundle_download ?></a> </td> <td><?cs var:sdk.win32_bundle_bytes ?> bytes</td> <td><?cs var:sdk.win32_bundle_checksum ?></td> @@ -307,7 +307,7 @@ <td>Windows 64-bit</td> <td> <a onClick="return onDownload(this)" id="win-bundle64" - href="http://dl.google.com/android/adt/<?cs var:sdk.win64_bundle_download ?>"><?cs var:sdk.win64_bundle_download ?></a> + href="http://dl.google.com/android/adt/<?cs var:sdk.version ?>/<?cs var:sdk.win64_bundle_download ?>"><?cs var:sdk.win64_bundle_download ?></a> </td> <td><?cs var:sdk.win64_bundle_bytes ?> bytes</td> <td><?cs var:sdk.win64_bundle_checksum ?></td> @@ -316,7 +316,7 @@ <td><nobr>Mac OS X 64-bit</nobr></td> <td> <a onClick="return onDownload(this)" id="mac-bundle64" - href="http://dl.google.com/android/adt/<?cs var:sdk.mac64_bundle_download ?>"><?cs var:sdk.mac64_bundle_download ?></a> + href="http://dl.google.com/android/adt/<?cs var:sdk.version ?>/<?cs var:sdk.mac64_bundle_download ?>"><?cs var:sdk.mac64_bundle_download ?></a> </td> <td><?cs var:sdk.mac64_bundle_bytes ?> bytes</td> <td><?cs var:sdk.mac64_bundle_checksum ?></td> @@ -325,7 +325,7 @@ <td>Linux 32-bit</td> <td> <a onClick="return onDownload(this)" id="linux-bundle32" - href="http://dl.google.com/android/adt/<?cs var:sdk.linux32_bundle_download ?>"><?cs var:sdk.linux32_bundle_download ?></a> + href="http://dl.google.com/android/adt/<?cs var:sdk.version ?>/<?cs var:sdk.linux32_bundle_download ?>"><?cs var:sdk.linux32_bundle_download ?></a> </td> <td><?cs var:sdk.linux32_bundle_bytes ?> bytes</td> <td><?cs var:sdk.linux32_bundle_checksum ?></td> @@ -334,7 +334,7 @@ <td>Linux 64-bit</td> <td> <a onClick="return onDownload(this)" id="linux-bundle64" - href="http://dl.google.com/android/adt/<?cs var:sdk.linux64_bundle_download ?>"><?cs var:sdk.linux64_bundle_download ?></a> + href="http://dl.google.com/android/adt/<?cs var:sdk.version ?>/<?cs var:sdk.linux64_bundle_download ?>"><?cs var:sdk.linux64_bundle_download ?></a> </td> <td><?cs var:sdk.linux64_bundle_bytes ?> bytes</td> <td><?cs var:sdk.linux64_bundle_checksum ?></td> @@ -396,10 +396,10 @@ var:sdk.linux_download </div><!-- end col-13 for lower-half content --> - - - - + + + + <script> if (location.hash == "#Requirements") { $('.reqs').show(); @@ -440,17 +440,17 @@ var:sdk.linux_download } else { $('.pax').show(); } - - + + function onDownload(link, button, bundle) { - + /* set text for download button */ if (button) { $("#downloadForRealz").html($(link).text()); } else { $("#downloadForRealz").html("Download " + $(link).text()); } - + /* if it's a bundle, show the 32/64-bit picker */ if (bundle) { $("#downloadForRealz").attr('bundle','true'); @@ -482,7 +482,7 @@ var:sdk.linux_download function onAgreeChecked() { /* verify that the TOS is agreed and a bit version is chosen */ if ($("input#agree").is(":checked") && $("#bitpicker input:checked").length) { - + /* if downloading the bundle */ if ($("#downloadForRealz").attr('bundle')) { /* construct the name of the link we want based on the bit version */ @@ -490,7 +490,7 @@ var:sdk.linux_download /* set the real url for download */ $("a#downloadForRealz").attr("href", $(linkId).attr("href")); } - + /* reveal the download button */ $("a#downloadForRealz").removeClass('disabled'); } else { @@ -536,29 +536,29 @@ var:sdk.linux_download <p>Welcome developers! We are pleased to provide you with a preview SDK for the upcoming Android 3.0 release, to give you a head-start on developing applications for it. </p> - + <p>See the <a href="<?cs var:toroot ?>sdk/preview/start.html">Getting Started</a> document for more information about how to set up the preview SDK and get started.</p> <style type="text/css"> .non-preview { display:none; } </style> - + <?cs else ?><?cs # it's normal offline docs ?> - + <?cs ######## HERE IS THE JD DOC CONTENT FOR OFFLINE ######### ?> <?cs call:tag_list(root.descr) ?> <style type="text/css"> body .offline { display:block; } body .online { display:none; } - </style> + </style> <script> $('.reqs').show(); </script> <?cs /if ?> - + <?cs /if ?> <?cs # end if/else online ?> - + <?cs /if ?> <?cs # end if/else NDK ?> <?cs /if ?> <?cs # end if/else redirect ?> diff --git a/tools/droiddoc/templates-sdk/assets/css/default.css b/tools/droiddoc/templates-sdk/assets/css/default.css index aa30c8a..1c45596 100644 --- a/tools/droiddoc/templates-sdk/assets/css/default.css +++ b/tools/droiddoc/templates-sdk/assets/css/default.css @@ -98,7 +98,8 @@ body { #devdoc-nav.fixed { position: fixed; margin:0; - top: 20px; } + top: 65px; /* sticky-header height + 20px gutter */ +} #devdoc-nav span.small { font-size:12px; @@ -157,12 +158,6 @@ video.with-shadow { .layout-content-row { display: inline-block; margin-bottom: 10px; } - .layout-content-row:after { - content: "."; - display: block; - height: 0; - clear: both; - visibility: hidden; } * html .layout-content-row { height: 1px; } @@ -429,20 +424,19 @@ video.with-shadow { /* content header */ .content-header { height: 30px; - margin:20px 0 25px; - padding:0 0 10px;} + margin:36px 0 23px; /* same as h1 */ + padding:0 0 10px;} /* same as h1 */ .content-header.just-links { margin-bottom:0; padding-bottom:0;} .content-header h1 { - color:#000; margin:0; - border-bottom:0; padding:0; + width: 700px; } .content-header > div:first-child { - height:55px; /* set fixed height for the header div to ensure the + height:1px; /* set fixed height for the header div to ensure the next/prev links align with toc on training classes */ } @@ -712,6 +706,7 @@ ul#title-tabs li a:active { color: #33b5e5; border-bottom-color: #33b5e5; } } +h1:target, h2:target, h3:target { -webkit-animation-name: glowheader; @@ -893,7 +888,7 @@ scroll top left; .framed-nexus4-port-216 img { width: 216px; height: 360px; } - + .framed-nexus5-port-span-5 { background: transparent url(../images/styles/device_nexus5_blank_port_span5.png) no-repeat scroll top left; @@ -1101,12 +1096,13 @@ table, fieldset { } h1 { color:#333; - font-size: 22px; - margin: 20px 0 20px; + font-size: 34px; + margin: 36px 0 27px; padding:0 0 10px; + font-weight:300; } h1, h2 { - line-height: 32px; + line-height: 30px; } h1.short { margin-right:320px; @@ -1119,21 +1115,24 @@ h1.super { } h2 { color:#333; - font-size: 20px; - margin: 20px 0 20px; + font-size: 26px; + margin: 32px 0 20px; padding:0; + font-weight:300; } h3 { color:#333; - font-size: 18px; + font-size: 21px; + font-weight:400; + margin:21px 0 14px 0; } h3, h4 { - color:#333; - line-height: 20px; - margin: 10px 0; + line-height: 21px; } h4 { - font-size: 16px; + font-size: 18px; + margin: 12px 0; + font-weight:500; } h5 { font-size: 14px; @@ -1146,7 +1145,7 @@ h6 { } hr { /* applied to the bottom of h2 elements */ height: 1px; - margin: 5px 0 20px; + margin: 3px 0 12px; border: 0; background: #ccc; } @@ -1248,6 +1247,7 @@ th { tr:first-of-type th:first-of-type:empty { visibility: hidden; } + /* -------------------------------------------------------------------------- Footer */ @@ -1378,8 +1378,7 @@ color-stop(50%, #acbc00), color-stop(50%, #bdde00), color-stop(100%, #bdde00)); .training-nav-top, .training-nav-bottom, #doc-col .content-footer, .nav-x, .nav-y, - .paging-links, - a.totop { + .paging-links { display: none !important; } @@ -1504,7 +1503,8 @@ color-stop(50%, #acbc00), color-stop(50%, #bdde00), color-stop(100%, #bdde00)); Header, Login, Nav-X, Search */ #header { - padding: 2.2em 0 0.2em 0; + margin: 0; + padding: 0; } #header:before, #header:after { content: ""; @@ -1522,6 +1522,9 @@ Header, Login, Nav-X, Search color: #333; font-size: 16px; } +.about a.selected { + color: #9933CC; +} .design a.selected { color: #33b5e5; } @@ -1833,6 +1836,11 @@ EndColorStr='#ececec'); margin:0 0 0 20px; } +.training-nav-top { + position:relative; + top:73px; +} + .training-nav-bottom { padding:0 0 20px; } @@ -1841,12 +1849,12 @@ EndColorStr='#ececec'); #qv-wrapper { float:right; clear:right; - margin:0 0 0 20px; /* negative top-margin to counter the content-header bottom margin */ - padding:0 0 20px; + margin:6px 0 0 30px; /* negative top-margin to counter the content-header bottom margin */ + padding:0 0 30px; } #tb-wrapper { - margin:-29px 0 0 20px; /* negative top-margin to counter the content-header bottom margin */ + margin:51px 0 0 20px; /* negative top-margin to counter the content-header bottom margin */ } #tb, @@ -1930,6 +1938,10 @@ EndColorStr='#ececec'); margin:0 15px 10px 35px; } +#tb p { + margin:0 15px 10px; +} + #qv ol { list-style:none; margin:0 15px 15px; @@ -1958,28 +1970,12 @@ EndColorStr='#ececec'); /* related resources blocks in checklists */ -.rel-resources { - margin:10px 0px; - border:1px solid #ccc; - background-color:rgba(0, 0, 0, 0.027451); - border:1px solid #ccc; - font-size:13px; - color:#6f6f6f; -} +/* related resources sections that have dynamic content */ -.rel-resources ul { -padding: .5em 1em 0 1em; -} -.rel-resources a { -font-weight:500; -} -.rel-resources h3 { - margin:4px 15px 0px 15px; - font-size:13px; - font-weight:600; - text-transform:uppercase; +h3.rel-resources { +margin:1.25em auto; } /* -------------------------------------------------------------------------- @@ -2760,7 +2756,7 @@ table.blank th, table.blank td { .caption { margin: 0.5em 0 2em 0; color: #000; - font-size: 11.5px; + font-size: 11.5px; } .nolist, .nolist ul, .nolist ol { @@ -2884,26 +2880,6 @@ div.design-announce p { margin:0 0 10px; } -#devdoc-nav a.totop { - display:block; - top:0; - width:inherit; - background: transparent url(../images/styles/gototop.png) no-repeat scroll 50% 50%; - text-indent:-9999em; -} -#devdoc-nav a.totop { - position:fixed; - display:none; -} -#devdoc-nav a.totop:hover { - background-color:#33B5E5; -} - -.content-footer a.totop { - text-transform:uppercase; - line-height:30px; -} - .expandable { height:34px; padding-left:20px; @@ -3013,6 +2989,34 @@ a.header-toggle { } +/* for IDE instruction toggle (Studio/Eclipse/Other) */ +select.ide { + background: transparent; + border: 1px solid #bbb; + border-left: 0; + border-right: 0; + margin: 10px 0; + padding: 10px 0; + color:#666; +} +select.ide, +select.ide option { + font-family: inherit; + font-size:16px; + font-weight:500; +} +/* hide all except eclipse by default */ +.select-ide.studio, +.select-ide.other { + display:none; +} +/* ... unless eclipse also includes one of the others */ +.select-ide.eclipse.studio, +.select-ide.eclipse.other { + display:block; +} + + /* ----------------------------------------------- good/bad example containers */ @@ -3365,28 +3369,37 @@ Page-Specific Styles } #jd-header { - padding: 0 0 5px; - margin: 20px 0 10px; - font-size:13px; + padding: 0 0 12px; + margin: 20px 0 12px; + font-size:12px; + padding-bottom:12px; border-bottom:solid 1px #ccc; } #jd-header h1 { margin:0; - padding:0; + padding:0 0 6px 0; } +/* not sure if this is needed in the ref docs, disabling for now +.jd-descr h2 { + margin:16px 0; +} +*/ + /* page-top-right container for reference pages (holds links to summary tables) */ #api-info-block { - font-size:13px; + font-size:12px; margin:20px 0 0; padding:0 10px 6px; font-weight:normal; float:right; text-align:right; color:#999; - max-width:70%; + max-width:80%; + font-size: 12px; + line-height:14px; } #api-info-block div.api-level { @@ -3403,7 +3416,8 @@ links to summary tables) */ border-spacing:0; margin:0; padding:0; - font-size:13px; + font-size:12px; + line-height:14px; background-color:transparent; } .jd-inheritance-table tr td { @@ -3968,13 +3982,175 @@ EndColorStr='#ececec'); z-index:100; } -} +/************ STICKY NAV BAR ******************/ + +#header-wrapper { + background: #f9f9f9; + margin: 0 -10px 0 -10px; + padding: 31px 10px 0px 10px; + position: relative; +} +#header-wrapper #nav-x div.wrap { + max-width: 940px; + height: 38px; +} +#header-wrapper #nav-x ul.nav-x li { + margin-right: 36px !important; + margin-top: 5px; + margin-bottom: 0px; + height: 30px; +} +#header-wrapper #nav-x > div.wrap ul.nav-x li.active { + color: #669900; + border-bottom: 3px solid #669900; +} +#header-wrapper #nav-x > div.wrap ul.nav-x li.active a { + color: #669900; +} +#header-wrapper #nav-x > div.wrap ul.nav-x a { + font-size: 14.5px; +} +#header-wrapper .developer-console-btn { + float: right; + background: #fefefe; + border-radius: 4px; + padding: 8px 14px; + box-shadow: 1px 1px 0px #7a7a7a; + font-size: 14px; + margin-top: -6px; + cursor: pointer; + color: #464646; + margin-right: 20px; +} +/* not currently used */ +#header-wrapper .shadow { + width: 1034px; + height: 4px; + position: absolute; + left: 50%; + margin-left: -517px; + bottom: -4px; + background-image: url(../images/header-shadow.png); +} + +#context { + clear: both; + padding-top: 14px; +} +#context .breadcrumb { + float: left; + margin-bottom: 10px; +} +#context .util { + float: right; + margin-right: 20px; +} + +.breadcrumb { + list-style: none; + margin: 0; + padding: 0; + position: relative; +} +.breadcrumb li { + float: left; + padding: 0 20px 0 0; + color: #000; + white-space: nowrap; +} +.breadcrumb li a { + color: #000; +} +.breadcrumb li:after { + content: url(../images/breadcrumb.png); + position: relative; + top: 1px; + left: 10px; + width: 5px; + height: 10px; +} +.breadcrumb li.current { + font-weight: 700; +} +.breadcrumb li.current:after { + display: none; +} + +/* Sticky Nav overrides */ +.sticky-menu { + position: fixed; + width: 940px; + height: 0px; + z-index: 51; + top: 12px; +} +#sticky-header { + display: none; + padding: 0 10px; + position: fixed; + background: #f9f9f9; + top: 0px; + left: 0px; + right: 0px; + height: 45px; + box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.1); + border-bottom: 1px solid #a5c43a; + z-index: 50; +} +#sticky-header.design { + border-bottom: 1px solid #33b5e5; +} +#sticky-header.develop { + border-bottom: 1px solid #F80; +} +#sticky-header.distribute { + border-bottom: 1px solid #9C0; +} +#sticky-header.about { + border-bottom: 1px solid #9933CC; +} +#sticky-header > div { + overflow: hidden; + *zoom: 1; + width: 940px; + margin: 0 auto; + clear: both; + padding-top: 9px; +} +#sticky-header > div .logo { + float: left; + width: 26px; + height: 25px; + background: url(../images/dac_logo.png); + background-image: -webkit-image-set(url(../images/dac_logo.png) 1x, url(../images/dac_logo@2x.png) 2x); + z-index: 52; + position: relative; +} +#sticky-header > div .top { + float: left; + width: 38px; + height: 38px; + position: relative; + background: url(../images/styles/gototop.png); + z-index: 52; +} +#sticky-header > div .breadcrumb { + float: left; + padding: 0 0 0 10px; + border-left: 1px solid #d2d2d2; + line-height: 24px; + font-size: 14px; + position: relative; + top: 0px; + z-index: 52; +} +} @@ -4014,7 +4190,6 @@ EndColorStr='#ececec'); } .logo a { - width:123px; float:left; } @@ -4027,11 +4202,13 @@ EndColorStr='#ececec'); } -#header .logo-wear { +#header-wrap .logo.landing-logo { width:220px; margin:0; + padding:0; + margin-bottom:22px; } -#header .logo-wear img { +#header-wrap .logo.landing-logo img { padding:0 0 0 10px; } @@ -4103,7 +4280,7 @@ EndColorStr='#ececec'); #quicknav { float:none; clear:both; - margin-left:180px; + margin-left:0; margin-top:-30px; display:none; overflow:hidden; @@ -4118,6 +4295,10 @@ EndColorStr='#ececec'); padding:0; } +#quicknav ul li.about { + border-top:1px solid #9933CC; +} + #quicknav ul li.design { border-top:1px solid #33b5e5; } @@ -4447,7 +4628,9 @@ EndColorStr='#ececec'); } - +#landing h1 { + margin:17px 0 20px 0 !important; +} a.download-sdk { float:right; @@ -4458,11 +4641,11 @@ a.download-sdk { } #nav-x { - padding-top: 14px; + padding-top: 13px; } #nav-x .wrap { - min-height:34px; + min-height:32px; } #nav-x .wrap, @@ -4618,14 +4801,14 @@ a.download-sdk { /* Slideshow */ .slideshow-develop { - height: 300px; + height: 316px; width: 940px; position: relative; overflow:hidden; } .slideshow-develop .frame { width: 940px; - height: 300px; + height: 316px; } .slideshow-develop img.play { max-width:350px; @@ -4657,6 +4840,7 @@ a.download-sdk { padding:0; margin-bottom:10px; border:none; + font-size:24px; } .slideshow-develop .item { height: 300px; @@ -4804,53 +4988,6 @@ a.download-sdk { -/************ DISTRIBUTE HOMEPAGE ***************/ - -.marquee { - width: 760px; -} -.marquee .main-img { - float: left; - margin-top: 20px; - width: 490px; -} -.marquee .copy { - width: 270px; - float: left; - margin-top: 30px; -} -.distribute-features { - margin: 0; -} -.distribute-features ul { - margin: 0; -} -.distribute-features ul li { - list-style: none; - float: left; - border-top: 1px solid #9C0; - width: 220px; - margin-right: 50px; -} -.distribute-features ul li.last { - margin-right: 0px; -} - -.distribute-features .distribute-link li a { - color:red !important; -} - -.distribute-features .distribute-link li a, -.distribute-features .distribute-link li a:active { - color:#555 !important; -} - -.distribute-features .distribute-link li a:hover, -.distribute-features .distribute-link li a:hover * { - color:#7AA1B0 !important; -} - - /************ DEVELOP TOPIC CONTAINERS ************/ .landing-banner, @@ -4876,7 +5013,8 @@ a.download-sdk { margin-bottom:0; } .landing-banner h1 { - margin-top:0; + margin-top:16px; + padding-bottom:24px; } .landing-docs, .landing-banner { @@ -5028,3 +5166,2108 @@ a.download-sdk { .fullpage #footer { margin-top: -40px; } + +/************ DISTRIBUTE PAGES ******************/ + +.article-detail #body-content { + padding-top: 10px; +} + +/* A container for grid sets with uppercase h3 and rule */ +.dynamic-grid h3 { + font-size:14px; + line-height:21px; + color:#555; + text-transform:uppercase; + border-bottom:1px solid #CCC; + padding:8px 0 0 1px; + margin-bottom:14px; + clear:both; +} + +.top-right-float { + float: right; +} + +.clearfloat { + float: none; + clear: both; +} + +.border-img { + border: 1px solid #CCC; +} + +.center-img { + margin: auto; + text-align: center; +} +.center-img img { + margin-bottom: 15px; +} + +.figure img, .border-img { + margin-bottom: 15px; +} + +/************ RESOURCE CARDS ******************/ + +/* Resource cards, 12, 13, 16-col */ + +/* Basic card-styling with shadow */ +.resource-card { + border-radius: 1px; + box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.12); + background: #fefefe; +} + +/* Styling for background image including tinting and section icons in stacks */ +.card-bg { + display: block; + position: absolute; + vertical-align: top; + width: 100%; + left: 0; + top: 0; + background-size: cover; + background-repeat: no-repeat; + background-position: center; + background-image: url(../images/resource-card-default-android.jpg); +} +.card-bg:after { + content: ""; + display: block; + height: 100%; + width: 100%; + opacity: 1; + background: rgba(0, 0, 0, 0.2); + -webkit-transition: opacity 0.5s; + -moz-transition: opacity 0.5s; + -o-transition: opacity 0.5s; + transition: opacity 0.5s; +} +.card-bg .card-section-icon { + position: absolute; + top: 50%; + width: 100%; + margin-top: -35px; + text-align: center; + padding-top: 65px; + z-index: 100; +} +.card-bg .card-section-icon .icon { + position: absolute; + left: 50%; + margin-left: -28px; + top: 0px; + width: 56px; + height: 56px; + background-repeat: no-repeat; + background-position: 50% 50%; + background-image: url(../images/stack-icon.png); +} +.card-bg .card-section-icon .section { + text-transform: uppercase; + color: white; + font-size: 14px; +} + +.card-info { + position: absolute; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; + top: 0; + right: 0; + bottom: 0; + left: 0; + overflow: hidden; + background: #fefefe; + padding: 4px 12px 6px 12px; +} +.card-info .section { + text-transform: uppercase; + color: #898989; + font-size: 12px; + margin-bottom: 1px; +} +.card-info .title { + color: #363636; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + padding-bottom: 5px; + margin-bottom: -2px; + font-size: 16px; +} +.card-info .description { + overflow: hidden; +} +.card-info .description .text { + color: #464646; + font: 13px/15px Roboto Condensed; + overflow: hidden; + width:100%; +} +.card-info .description .util { + position: absolute; + right: 5px; + bottom: 70px; /*-2px;*/ + opacity: 0; + -webkit-transition: opacity 0.5s; + -moz-transition: opacity 0.5s; + -o-transition: opacity 0.5s; + transition: opacity 0.5s; +} +.card-info.empty-desc .title { + white-space: normal; + overflow: visible; +} +.card-info.empty-desc .description { + display: none; +} +/* Truncate card summaries at bounding box and + * and apply ellipsis at lower right */ +.ellipsis { + overflow: hidden; + float:right; + line-height: 15px; + width:100%; +} +.resource-card-6x6 .card-info .description .teddddddxt { + float:left; + position:relative; + margin-left:0; +} +.ellipsis:before { + content:""; + float: left; + width: 5px; + height:100%; +} +.ellipsis > *:first-child.text { + float: right; + width: 100% !important; + margin-left: -5px; +} +.ellipsis:after { + content: "\02026"; + height:17px; + padding-bottom:4px; + + box-sizing: content-box; + -webkit-box-sizing: content-box; + -moz-box-sizing: content-box; + + float: right; position: relative; + top: -16px; left: 100%; + width: 4em; margin-left: -4em; + padding-right: 5px; + + background: -webkit-gradient(linear, left top, right top, + from(rgba(255, 255, 255, 0)), to(white), color-stop(65%, white)); + background: -moz-linear-gradient(to right, rgba(255, 255, 255, 0), white 65%, white); + background: -o-linear-gradient(to right, rgba(255, 255, 255, 0), white 65%, white); + background: -ms-linear-gradient(to right, rgba(255, 255, 255, 0), white 65%, white); + background: linear-gradient(to right, rgba(255, 255, 255, 0), white 65%, white); +} +.ellipsis:after { + font-style: normal; color: #aaa; + font-size:13px; + text-align: right; +} + +/* Flow Layout */ +.resource-flow-layout { + display: inline-block; +} +.resource-flow-layout .resource-card, .resource-flow-layout .resource-card-stack { + float: left; + position: relative; +} +.resource-flow-layout .resource-card-stack > .resource-card { + margin-right: 0px !important; +} +.resource-flow-layout:after { + content: "."; + display: block; + height: 10; + position:relative; + clear: both; + visibility: hidden; +} +.resource-card:hover { + cursor: pointer; +} +.resource-card:hover .card-bg:after { + opacity: 0; +} +/* disabled to make way for fade/ellipsis truncation, + and the plusone moves up. +.resource-card:hover .card-info .description .text { + padding-right: 70px; +} */ +.resource-card:hover .card-info .description .util { + opacity: 1; +} + +/* Carousel Layout */ +/* Carousel styles for landing page */ +.resource-carousel-layout { + margin: 20px 0 20px 0; + position: relative; + overflow: hidden; +} +.resource-carousel-layout .slideshow-prev, .resource-carousel-layout .slideshow-next { + display: none; +} +.resource-carousel-layout .pagination { + bottom: 0px; +} +.resource-carousel-layout .frame li { + position: relative; +} +.resource-carousel-layout .frame li .card-bg { + height: 300px; +} +.resource-carousel-layout .frame li .card-info { + padding: 7px 15px 0px 15px; + top: 300px; +} +.resource-carousel-layout .frame li .card-info .section { + font-size: 13px; + margin-bottom: 7px; +} +.resource-carousel-layout .frame li .card-info .title { + font-size: 25px; + margin-bottom: 2px; +} +.resource-carousel-layout .frame li .card-info .description { + font-family: 15px/16px Roboto Condensed, sans-serif; +} +.resource-carousel-layout .frame li .card-info .description .text { + height: 40px; +} +.resource-carousel-layout .frame li .card-info .description .util { + bottom:97px; + right:4px; +} + +/* Stack Layout */ +.resource-stack-layout { + display: inline-block; +} +.resource-stack-layout .resource-card-stack { + float: left; + position: relative; +} +.resource-stack-layout .resource-card { + margin-bottom: 20px; + display: block; + position: relative; +} +.resource-stack-layout .section-card-menu > .card-info .section, .resource-stack-layout .section-card > .card-info .title { + /*text-transform: uppercase;*/ + color: #898989; + font-size: 17px; + line-height: 24px; + margin-bottom: 6px; +} +.resource-stack-layout .section-card { + height: 284px; +} +.resource-stack-layout .section-card > .card-bg { + height: 192px; +} +.resource-stack-layout .section-card > .card-info { + padding: 4px 12px 6px 12px; + top: 192px; +} +.resource-stack-layout .section-card > .card-info .section { + display: none; +} +.resource-stack-layout .section-card > .card-info .title { + font-size: 17px; + border-bottom: 1px solid #959595; + padding-bottom: 0px; +} +.resource-stack-layout .section-card > .card-info .description { + font-size: 13px; + line-height: 15px; +} +.resource-stack-layout .section-card > .card-info .description .text { + height: 30px; +} +.resource-stack-layout .related-card { + height: 90px; +} +.resource-stack-layout .related-card > .card-bg { + left: 0; + top: 0; + width: 90px; + height: 100%; + position: absolute; + display: block; +} +.resource-stack-layout .related-card > .card-info { + left: 90px; + padding: 4px 12px 4px 12px; +} +.resource-stack-layout .related-card > .card-info .section { + font-size: 12px; + margin-bottom: 1px; + display: none; +} +.resource-stack-layout .related-card > .card-info .title { + font-size: 16px; + margin-bottom: -2px; + white-space: normal; + overflow: visible; + text-overflow: ellipsis; +} +.resource-stack-layout .related-card > .card-info .title:after { + content: url(../images/link-out.png); + display: block; +} +.resource-stack-layout .related-card > .card-info .description { + display: none; +} +.resource-stack-layout .section-card-menu { + /* Flexible height */ + display: block; + height: auto; + width: auto; +} +.resource-stack-layout .section-card-menu .card-bg { + height: 155px; + /* Flexible height */ + position: relative; + display: inline-block; + vertical-align: top; +} +.resource-stack-layout .section-card-menu .card-info { + padding: 4px 12px 0px 12px; + /* Flexible height */ + position: relative; + left: auto; + top: auto; + right: auto; + bottom: auto; +} +.resource-stack-layout .section-card-menu .card-info ul { + list-style: none; + margin: 0; +} +.resource-stack-layout .section-card-menu .card-info ul li { + list-style: none; + margin: 0; + padding: 15px 0; + border-top-width: 1px; + border-top-style: solid; + border-top-color: #959595; +} +.resource-stack-layout .section-card-menu .card-info ul li a, .resource-stack-layout .section-card-menu .card-info ul li a:focus, .resource-stack-layout .section-card-menu .card-info ul li a:link, .resource-stack-layout .section-card-menu .card-info ul li a:visited, .resource-stack-layout .section-card-menu .card-info ul li a:active, .resource-stack-layout .section-card-menu .card-info ul li a:hover { + color: #363636 !important; +} +.resource-stack-layout .section-card-menu .card-info ul li:first-child { + border-top: none; +} +.resource-stack-layout .section-card-menu .card-info ul li:hover .title:after { + opacity: 1; + -webkit-transition: opacity 0.5s; + -moz-transition: opacity 0.5s; + -o-transition: opacity 0.5s; + transition: opacity 0.5s; +} +.resource-stack-layout .section-card-menu .card-info ul li:hover .description { + max-height: 30px; + opacity: 1; + -webkit-transition: max-height 0.5s, opacity 1s; + -moz-transition: max-height 0.5s, opacity 1s; + -o-transition: max-height 0.5s, opacity 1s; + transition: max-height 0.5s, opacity 1s; +} +.resource-stack-layout .section-card-menu .card-info .title { + font-size: 16px; + margin-bottom: -2px; + position: relative; +} +.resource-stack-layout .section-card-menu .card-info .title:after { + background: url(../images/stack-arrow-right.png); + content: ''; + opacity: 0; + -webkit-transition: opacity 0.25s; + -moz-transition: opacity 0.25s; + -o-transition: opacity 0.25s; + transition: opacity 0.25s; + position: absolute; + right: 0px; + top: 3px; + width: 10px; + height: 15px; +} +.resource-stack-layout .section-card-menu .card-info .title.more { + text-transform: uppercase; + color: #898989; + display: inline-block; +} +.resource-stack-layout .section-card-menu .card-info .title.more:after { + background: url(../images/stack-arrow-right.png); + content: ''; + display: block; + position: absolute; + right: -20px; + top: 3px; + width: 10px; + height: 15px; +} +.resource-stack-layout .section-card-menu .card-info .description { + max-height: 0px; + opacity: 0; + overflow: hidden; + font-size: 13px; + line-height: 15px; + /* Hover off */ + -webkit-transition: max-height 0.5s, opacity 0.5s; + -moz-transition: max-height 0.5s, opacity 0.5s; + -o-transition: max-height 0.5s, opacity 0.5s; + transition: max-height 0.5s, opacity 0.5s; +} +.resource-stack-layout .section-card-menu .card-info .description .text { + height: 30px; +} +.resource-stack-layout:after { + content: "."; + display: block; + height: 0; + clear: both; + visibility: hidden; +} + +/* Generate the flow layout styles for a 3-column 16-col span */ +.resource-flow-layout.col-16 { + margin: 0 -14px 0 0; + width: 954px; +} +.resource-flow-layout.col-16 .resource-card, .resource-flow-layout.col-16 .resource-card-stack { + margin: 0 14px 20px 0; +} +.resource-flow-layout.col-16 .resource-card-row-stack-last { + margin-bottom: 0px !important; +} +.resource-flow-layout.col-16 .resource-card-col-stack-last { + margin-bottom: 0px !important; +} +.resource-flow-layout.col-16 .resource-card-3x6 { + width: 145px; + height: 284px; +} +.resource-flow-layout.col-16 .resource-card-3x12 { + width: 145px; + height: 588px; +} +.resource-flow-layout.col-16 .resource-card-3x18 { + width: 145px; + height: 892px; +} +.resource-flow-layout.col-16 .resource-card-6x6 { + width: 304px; + height: 284px; +} +.resource-flow-layout.col-16 .resource-card-6x12 { + width: 304px; + height: 588px; +} +.resource-flow-layout.col-16 .resource-card-6x18 { + width: 304px; + height: 892px; +} +.resource-flow-layout.col-16 .resource-card-9x6 { + width: 463px; + height: 284px; +} +.resource-flow-layout.col-16 .resource-card-9x12 { + width: 463px; + height: 588px; +} +.resource-flow-layout.col-16 .resource-card-9x18 { + width: 463px; + height: 892px; +} +.resource-flow-layout.col-16 .resource-card-12x6 { + width: 622px; + height: 284px; +} +.resource-flow-layout.col-16 .resource-card-12x12 { + width: 622px; + height: 588px; +} +.resource-flow-layout.col-16 .resource-card-12x18 { + width: 622px; + height: 892px; +} +.resource-flow-layout.col-16 .resource-card-15x6 { + width: 781px; + height: 284px; +} +.resource-flow-layout.col-16 .resource-card-15x12 { + width: 781px; + height: 588px; +} +.resource-flow-layout.col-16 .resource-card-15x18 { + width: 781px; + height: 892px; +} +.resource-flow-layout.col-16 .resource-card-18x6 { + width: 940px; + height: 284px; +} +.resource-flow-layout.col-16 .resource-card-18x12 { + width: 940px; + height: 420px; +} +.resource-flow-layout.col-16 .resource-card-18x18 { + width: 940px; + height: 892px; +} +.resource-flow-layout.col-16 .resource-card-3x2 { + width: 145px; + height: 95px; +} +.resource-flow-layout.col-16 .resource-card-3x2x3 { + width: 145px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-16 .resource-card-3x3 { + width: 145px; + height: 142px; +} +.resource-flow-layout.col-16 .resource-card-3x3x2 { + width: 145px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-16 .resource-card-6x2 { + width: 304px; + height: 95px; +} +.resource-flow-layout.col-16 .resource-card-6x2x3 { + width: 304px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-16 .resource-card-6x3 { + width: 304px; + height: 142px; +} +.resource-flow-layout.col-16 .resource-card-6x3x2 { + width: 304px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-16 .resource-card-9x2 { + width: 463px; + height: 95px; +} +.resource-flow-layout.col-16 .resource-card-9x2x3 { + width: 463px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-16 .resource-card-9x3 { + width: 463px; + height: 142px; +} +.resource-flow-layout.col-16 .resource-card-9x3x2 { + width: 463px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-16 .resource-card-12x2 { + width: 622px; + height: 95px; +} +.resource-flow-layout.col-16 .resource-card-12x2x3 { + width: 622px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-16 .resource-card-12x3 { + width: 622px; + height: 142px; +} +.resource-flow-layout.col-16 .resource-card-12x3x2 { + width: 622px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-16 .resource-card-15x2 { + width: 781px; + height: 95px; +} +.resource-flow-layout.col-16 .resource-card-15x2x3 { + width: 781px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-16 .resource-card-15x3 { + width: 781px; + height: 142px; +} +.resource-flow-layout.col-16 .resource-card-15x3x2 { + width: 781px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-16 .resource-card-18x2 { + width: 940px; + height: 95px; +} +.resource-flow-layout.col-16 .resource-card-18x2x3 { + width: 940px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-16 .resource-card-18x3 { + width: 940px; + height: 142px; +} +.resource-flow-layout.col-16 .resource-card-18x3x2 { + width: 940px; + height: 138px; + margin-bottom: 8px; +} + +/* Generate the flow layout styles for a 3-column 16-col span */ +.resource-flow-layout.col-12 { + margin: 0 -14px 0 0; + width: 714px; +} + +.resource-flow-layout.col-12 .resource-card, .resource-flow-layout.col-12 .resource-card-stack { + margin: 0 14px 20px 0; +} +.resource-flow-layout.col-12 .resource-card-row-stack-last { + margin-bottom: 0px !important; +} +.resource-flow-layout.col-12 .resource-card-col-stack-last { + margin-bottom: 0px !important; +} +.resource-flow-layout.col-12 .resource-card-3x6 { + width: 105px; + height: 284px; +} +.resource-flow-layout.col-12 .resource-card-3x12 { + width: 105px; + height: 588px; +} +.resource-flow-layout.col-12 .resource-card-3x18 { + width: 105px; + height: 892px; +} +.resource-flow-layout.col-12 .resource-card-6x6 { + width: 224px; + height: 284px; +} +.resource-flow-layout.col-12 .resource-card-6x12 { + width: 224px; + height: 588px; +} +.resource-flow-layout.col-12 .resource-card-6x18 { + width: 224px; + height: 892px; +} +.resource-flow-layout.col-12 .resource-card-9x6 { + width: 343px; + height: 284px; +} +.resource-flow-layout.col-12 .resource-card-9x12 { + width: 343px; + height: 588px; +} +.resource-flow-layout.col-12 .resource-card-9x18 { + width: 343px; + height: 892px; +} +.resource-flow-layout.col-12 .resource-card-12x6 { + width: 462px; + height: 284px; +} +.resource-flow-layout.col-12 .resource-card-12x12 { + width: 462px; + height: 588px; +} +.resource-flow-layout.col-12 .resource-card-12x18 { + width: 462px; + height: 892px; +} +.resource-flow-layout.col-12 .resource-card-15x6 { + width: 581px; + height: 284px; +} +.resource-flow-layout.col-12 .resource-card-15x12 { + width: 581px; + height: 588px; +} +.resource-flow-layout.col-12 .resource-card-15x18 { + width: 581px; + height: 892px; +} +.resource-flow-layout.col-12 .resource-card-18x6 { + width: 700px; + height: 284px; +} +.resource-flow-layout.col-12 .resource-card-18x12 { + width: 700px; + height: 420px; +} +.resource-flow-layout.col-12 .resource-card-18x18 { + width: 700px; + height: 892px; +} +.resource-flow-layout.col-12 .resource-card-3x2 { + width: 105px; + height: 95px; +} +.resource-flow-layout.col-12 .resource-card-3x2x3 { + width: 105px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-12 .resource-card-3x3 { + width: 105px; + height: 142px; +} +.resource-flow-layout.col-12 .resource-card-3x3x2 { + width: 105px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-12 .resource-card-6x2 { + width: 224px; + height: 95px; +} +.resource-flow-layout.col-12 .resource-card-6x2x3 { + width: 224px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-12 .resource-card-6x3 { + width: 224px; + height: 142px; +} +.resource-flow-layout.col-12 .resource-card-6x3x2 { + width: 224px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-12 .resource-card-9x2 { + width: 343px; + height: 95px; +} +.resource-flow-layout.col-12 .resource-card-9x2x3 { + width: 343px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-12 .resource-card-9x3 { + width: 343px; + height: 142px; +} +.resource-flow-layout.col-12 .resource-card-9x3x2 { + width: 343px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-12 .resource-card-12x2 { + width: 462px; + height: 95px; +} +.resource-flow-layout.col-12 .resource-card-12x2x3 { + width: 462px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-12 .resource-card-12x3 { + width: 462px; + height: 142px; +} +.resource-flow-layout.col-12 .resource-card-12x3x2 { + width: 462px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-12 .resource-card-15x2 { + width: 581px; + height: 95px; +} +.resource-flow-layout.col-12 .resource-card-15x2x3 { + width: 581px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-12 .resource-card-15x3 { + width: 581px; + height: 142px; +} +.resource-flow-layout.col-12 .resource-card-15x3x2 { + width: 581px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-12 .resource-card-18x2 { + width: 700px; + height: 95px; +} +.resource-flow-layout.col-12 .resource-card-18x2x3 { + width: 700px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-12 .resource-card-18x3 { + width: 700px; + height: 142px; +} +.resource-flow-layout.col-12 .resource-card-18x3x2 { + width: 700px; + height: 138px; + margin-bottom: 8px; +} + +/* Generate the flow layout styles for a 3-column 13-col span */ + +.resource-flow-layout.col-13 { + margin: 0 -14px 0 0; + width: 774px; +} +.resource-flow-layout.col-13 .resource-card, .resource-flow-layout.col-13 .resource-card-stack { + margin: 0 14px 20px 0; +} +.resource-flow-layout.col-13 .resource-card-row-stack-last { + margin-bottom: 0px !important; +} +.resource-flow-layout.col-13 .resource-card-col-stack-last { + margin-bottom: 0px !important; +} +.resource-flow-layout.col-13 .resource-card-3x6 { + width: 115px; + height: 284px; +} +.resource-flow-layout.col-13 .resource-card-3x12 { + width: 115px; + height: 588px; +} +.resource-flow-layout.col-13 .resource-card-3x18 { + width: 115px; + height: 892px; +} +.resource-flow-layout.col-13 .resource-card-6x6 { + width: 244px; + height: 284px; +} +.resource-flow-layout.col-13 .resource-card-6x12 { + width: 244px; + height: 588px; +} +.resource-flow-layout.col-13 .resource-card-6x18 { + width: 244px; + height: 892px; +} +.resource-flow-layout.col-13 .resource-card-9x6 { + width: 373px; + height: 284px; +} +.resource-flow-layout.col-13 .resource-card-9x12 { + width: 373px; + height: 588px; +} +.resource-flow-layout.col-13 .resource-card-9x18 { + width: 373px; + height: 892px; +} +.resource-flow-layout.col-13 .resource-card-12x6 { + width: 502px; + height: 284px; +} +.resource-flow-layout.col-13 .resource-card-12x12 { + width: 502px; + height: 588px; +} +.resource-flow-layout.col-13 .resource-card-12x18 { + width: 502px; + height: 892px; +} +.resource-flow-layout.col-13 .resource-card-15x6 { + width: 631px; + height: 284px; +} +.resource-flow-layout.col-13 .resource-card-15x12 { + width: 631px; + height: 588px; +} +.resource-flow-layout.col-13 .resource-card-15x18 { + width: 631px; + height: 892px; +} +.resource-flow-layout.col-13 .resource-card-18x6 { + width: 760px; + height: 284px; +} +.resource-flow-layout.col-13 .resource-card-18x12 { + width: 760px; + height: 420px; +} +.resource-flow-layout.col-13 .resource-card-18x18 { + width: 760px; + height: 892px; +} +.resource-flow-layout.col-13 .resource-card-3x2 { + width: 115px; + height: 95px; +} +.resource-flow-layout.col-13 .resource-card-3x2x3 { + width: 115px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-13 .resource-card-3x3 { + width: 115px; + height: 142px; +} +.resource-flow-layout.col-13 .resource-card-3x3x2 { + width: 115px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-13 .resource-card-6x2 { + width: 244px; + height: 95px; +} +.resource-flow-layout.col-13 .resource-card-6x2x3 { + width: 244px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-13 .resource-card-6x3 { + width: 244px; + height: 142px; +} +.resource-flow-layout.col-13 .resource-card-6x3x2 { + width: 244px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-13 .resource-card-9x2 { + width: 373px; + height: 95px; +} +.resource-flow-layout.col-13 .resource-card-9x2x3 { + width: 373px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-13 .resource-card-9x3 { + width: 373px; + height: 142px; +} +.resource-flow-layout.col-13 .resource-card-9x3x2 { + width: 373px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-13 .resource-card-12x2 { + width: 502px; + height: 95px; +} +.resource-flow-layout.col-13 .resource-card-12x2x3 { + width: 502px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-13 .resource-card-12x3 { + width: 502px; + height: 142px; +} +.resource-flow-layout.col-13 .resource-card-12x3x2 { + width: 502px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-13 .resource-card-15x2 { + width: 631px; + height: 95px; +} +.resource-flow-layout.col-13 .resource-card-15x2x3 { + width: 631px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-13 .resource-card-15x3 { + width: 631px; + height: 142px; +} +.resource-flow-layout.col-13 .resource-card-15x3x2 { + width: 631px; + height: 138px; + margin-bottom: 8px; +} +.resource-flow-layout.col-13 .resource-card-18x2 { + width: 760px; + height: 95px; +} +.resource-flow-layout.col-13 .resource-card-18x2x3 { + width: 760px; + height: 90px; + margin-bottom: 7px; +} +.resource-flow-layout.col-13 .resource-card-18x3 { + width: 760px; + height: 142px; +} +.resource-flow-layout.col-13 .resource-card-18x3x2 { + width: 760px; + height: 138px; + margin-bottom: 8px; +} + +/* + The following are styles for cards in the flowlayout above, styled by the number of rows they span +*/ +/* Single row items, might be simpler to just apply a class */ +.resource-card-3x6 > .card-bg, .resource-card-6x6 > .card-bg, .resource-card-9x6 > .card-bg, .resource-card-12x6 > .card-bg, .resource-card-15x6 > .card-bg, .resource-card-18x6 > .card-bg { + height: 192px; +} +.resource-card-3x6 > .card-info, .resource-card-6x6 > .card-info, .resource-card-9x6 > .card-info, .resource-card-12x6 > .card-info, .resource-card-15x6 > .card-info, .resource-card-18x6 > .card-info { + padding: 4px 12px 6px 12px; + top: 192px; +} +.resource-card-3x6 > .card-info .section, .resource-card-6x6 > .card-info .section, .resource-card-9x6 > .card-info .section, .resource-card-12x6 > .card-info .section, .resource-card-15x6 > .card-info .section, .resource-card-18x6 > .card-info .section { + font-size: 12px; + margin-bottom: 1px; +} +.resource-card-3x6 > .card-info .title, .resource-card-6x6 > .card-info .title, .resource-card-9x6 > .card-info .title, .resource-card-12x6 > .card-info .title, .resource-card-15x6 > .card-info .title, .resource-card-18x6 > .card-info .title { + font-size: 16px; + margin-bottom: -2px; +} +.resource-card-3x6 > .card-info .description, .resource-card-6x6 > .card-info .description, .resource-card-9x6 > .card-info .description, .resource-card-12x6 > .card-info .description, .resource-card-15x6 > .card-info .description, .resource-card-18x6 > .card-info .description { + font-size: 13px; + line-height: 15px; +} +.resource-card-3x6 > .card-info .description .text, .resource-card-6x6 > .card-info .description .text, .resource-card-9x6 > .card-info .description .text, .resource-card-12x6 > .card-info .description .text, .resource-card-15x6 > .card-info .description .text, .resource-card-18x6 > .card-info .description .text { + height: 30px; +} + +/* Double row items */ +.resource-card-3x12 > .card-bg, .resource-card-6x12 > .card-bg, .resource-card-9x12 > .card-bg, .resource-card-12x12 > .card-bg, .resource-card-15x12 > .card-bg, .resource-card-18x12 > .card-bg { + height: 320px; +} +.resource-card-3x12 > .card-info, .resource-card-6x12 > .card-info, .resource-card-9x12 > .card-info, .resource-card-12x12 > .card-info, .resource-card-15x12 > .card-info, .resource-card-18x12 > .card-info { + padding: 4px 12px 6px 12px; + top: 320px; +} +.resource-card-3x12 > .card-info .section, .resource-card-6x12 > .card-info .section, .resource-card-9x12 > .card-info .section, .resource-card-12x12 > .card-info .section, .resource-card-15x12 > .card-info .section, .resource-card-18x12 > .card-info .section { + font-size: 12px; + margin-bottom: 1px; +} +.resource-card-3x12 > .card-info .title, .resource-card-6x12 > .card-info .title, .resource-card-9x12 > .card-info .title, .resource-card-12x12 > .card-info .title, .resource-card-15x12 > .card-info .title, .resource-card-18x12 > .card-info .title { + font-size: 16px; + margin-bottom: -2px; + white-space: normal; +} +.resource-card-3x12 > .card-info .description, .resource-card-6x12 > .card-info .description, .resource-card-9x12 > .card-info .description, .resource-card-12x12 > .card-info .description, .resource-card-15x12 > .card-info .description, .resource-card-18x12 > .card-info .description { + font-size: 13px; + line-height: 15px; +} + +/* 1/3 row items */ +.resource-card-3x2 > .card-bg, .resource-card-6x2 > .card-bg, .resource-card-9x2 > .card-bg, .resource-card-12x2 > .card-bg, .resource-card-15x2 > .card-bg, .resource-card-18x2 > .card-bg { + left: 0; + top: 0; + width: 90px; + height: 100%; + position: absolute; + display: block; +} +.resource-card-3x2 > .card-info, .resource-card-6x2 > .card-info, .resource-card-9x2 > .card-info, .resource-card-12x2 > .card-info, .resource-card-15x2 > .card-info, .resource-card-18x2 > .card-info { + left: 90px; + padding: 4px 12px 4px 12px; + height: 80px; + overflow: hidden; +} +.resource-card-3x2 > .card-info .section, .resource-card-6x2 > .card-info .section, .resource-card-6x3 > .card-info .section, .resource-card-9x2 > .card-info .section, .resource-card-12x2 > .card-info .section, .resource-card-15x2 > .card-info .section, .resource-card-18x2 > .card-info .section { + font-size: 12px; + margin-bottom: 1px; + /* display: none; */ +} +.resource-card-3x2 > .card-info .title, .resource-card-6x2 > .card-info .title, .resource-card-9x2 > .card-info .title, .resource-card-12x2 > .card-info .title, .resource-card-15x2 > .card-info .title, .resource-card-18x2 > .card-info .title { + font-size: 16px; + margin-bottom: -2px; + white-space: normal; + overflow: visible; + text-overflow: ellipsis; +} +.resource-card-3x2 > .card-info .title:after, .resource-card-6x2 > .card-info .title:after, .resource-card-9x2 > .card-info .title:after, .resource-card-12x2 > .card-info .title:after, .resource-card-15x2 > .card-info .title:after, .resource-card-18x2 > .card-info .title:after { + /* content: url(../images/link-out.png); */ + display: block; +} +.resource-card-3x2 > .card-info .description, .resource-card-6x2 > .card-info .description, .resource-card-9x2 > .card-info .description, .resource-card-12x2 > .card-info .description, .resource-card-15x2 > .card-info .description, .resource-card-18x2 > .card-info .description { + display: none; +} + +/* 1/2 row items */ +.resource-card-3x3 > .card-bg, .resource-card-6x3 > .card-bg, .resource-card-9x3 > .card-bg, .resource-card-12x3 > .card-bg, .resource-card-15x3 > .card-bg, .resource-card-18x3 > .card-bg { + left: 0; + top: 0; + width: 90px; + height: 100%; + position: absolute; + display: block; +} +.resource-card-3x3 > .card-info, .resource-card-6x3 > .card-info, .resource-card-9x3 > .card-info, .resource-card-12x3 > .card-info, .resource-card-15x3 > .card-info, .resource-card-18x3 > .card-info { + left: 90px; + padding: 4px 12px 0px 12px; +} +.resource-card-3x3 > .card-info .section, .resource-card-6x3 > .card-info .section, .resource-card-9x3 > .card-info .section, .resource-card-12x3 > .card-info .section, .resource-card-15x3 > .card-info .section, .resource-card-18x3 > .card-info .section { + font-size: 12px; + margin-bottom: 1px; + display: none; +} +.resource-card-3x3 > .card-info .title, .resource-card-6x3 > .card-info .title, .resource-card-9x3 > .card-info .title, .resource-card-12x3 > .card-info .title, .resource-card-15x3 > .card-info .title, .resource-card-18x3 > .card-info .title { + font-size: 16px; + margin-bottom: -2px; + white-space: normal; + overflow: visible; +} +.resource-card-3x3 > .card-info .description .text, .resource-card-6x3 > .card-info .description .text, .resource-card-9x3 > .card-info .description .text, .resource-card-12x3 > .card-info .description .text, .resource-card-15x3 > .card-info .description .text, .resource-card-18x3 > .card-info .description .text { + font-size: 12px; + line-height: 15px; + padding-right: 0px !important; + height: 80px; +} +.resource-card-3x3 > .card-info .description .util, .resource-card-6x3 > .card-info .description .util, .resource-card-9x3 > .card-info .description .util, .resource-card-12x3 > .card-info .description .util, .resource-card-15x3 > .card-info .description .util, .resource-card-18x3 > .card-info .description .util { + display: none; +} +/* placement of plusone */ +.resource-card-6x12 > .card-info .description .util, .resource-card-9x12 > .card-info .description .util, .resource-card-12x12 > .card-info .description .util, .resource-card-15x12 > .card-info .description .util { + bottom:2px; +} +.resource-card-18x12 > .card-info .description .util { + bottom:2px; +} +/* Overrides for col-16 6x6 cards linking to local content on landing pages. + Suppresses "section" and puts the title above a hairline rule. */ +.landing .card-info .section, .resource-flow-layout.col-16.landing .resource-card-9x6 .card-info .section { + display:none; +} +.landing .card-info .title { + color: #898989; + font-size: 17px; + line-height: 24px; + margin-bottom: 6px; + border-bottom: 1px solid #959595; + padding-bottom: 0px; +} +.landing .card-info .description { + font-size: 13px; + line-height: 15px; +} +.landing .card-info .description .text { +height:30px; +} +.landing .resource-card-6x6 > .card-info .description .util, .landing .resource-card-9x6 > .card-info .description .util { + bottom:2px; +} +/* + Generate a resource stack layout for a 3 column widget spanning 16 grid cols +*/ +.resource-stack-layout.col-16 { + margin: 0 -14px 0 0; + width: 954px; +} +.resource-stack-layout.col-16 .resource-card-stack { + margin: 0 14px 0 0; + width: 304px; +} + +/* Example of card menu tinting */ +.resource-widget[data-section=distribute\/tools] .section-card-menu +.card-bg:after { + background: rgba(126, 55, 148, 0.4) !important; +} +.resource-widget[data-section=distribute\/tools] .section-card-menu +.card-section-icon .icon { + background-color: #7e3794 !important; +} +.resource-widget[data-section=distribute\/tools] .section-card-menu +.card-info ul li { + border-top-color: #7e3794 !important; +} + +/* tinting for stacks */ + +div.jd-descr > .resource-widget[data-section=distribute\/tools] +.section-card-menu .card-info ul li { + border-top-color: #7e3794 !important; +} + +/** + * UTILITIES + */ + + +.border-box { + box-sizing: border-box; +} + +.vertical-center-outer { + display: table; + height: 100%; + width: 100%; +} + +.vertical-center-inner { + display: table-cell; + vertical-align: middle; +} + +/** + * TYPE STYLES + */ + +.landing-h1 { + font-weight: 100; + font-size: 60px; + line-height: 78px; + text-align: center; + letter-spacing: -1px; +} + +.landing-pre-h1 { + font-weight: 400; + font-size: 28px; + color: #93B73F; + line-height: 36px; + text-align: center; + letter-spacing: -1px; + text-transform: uppercase; + +} + +.landing-h1.hero { + text-align: left; +} + +.landing-h2 { + font-weight: 300; + font-size: 42px; + line-height: 64px; + text-align: center; +} + +.landing-subhead { + color: #999999; + font-size: 20px; + line-height: 28px; + font-weight:300; + text-align: center; +} +.landing-subhead.hero { + text-align: left; + color: white; +} + +.landing-hero-description { + text-align: left; + margin: 1em 0; +} + +.landing-hero-description p { + font-weight: 300; + margin: 0; + font-size: 18px; + line-height: 24px; +} + +.landing-body .landing-small { + font-size: 14px; + line-height: 19px; +} + +.landing-body.landing-align-center { + text-align: center; +} + +.landing-align-left { + text-align: left; +} + +/** + * LAYOUT + */ + +#body-content, +.fullpage, +#jd-content, +.jd-descr, +.landing-body-content { + height: 100%; +} + +.landing-section { + padding: 80px 10px 80px; + width: 100%; + margin-left: -10px; + text-rendering: optimizeLegibility; +} + +#extending-android-to-wearables { + padding-top: 30px; +} + +.landing-short-section { + padding: 40px 10px 28px; +} + +.landing-gray-background { + background-color: #e9e9e9; +} + +.landing-white-background { + background-color: white; +} + +.landing-red-background { + color: white; + background-color: hsl(8, 70%, 54%); +} + +.landing-subhead-red { + color: hsl(8, 71%, 84%); + text-align: left; +} + +.landing-subhead-red p { + margin-top: 20px; +} + +.landing-hero-container { + height: 100%; +} + + +.preview-hero { + height: calc(100% - 110px); + min-height: 504px; + margin-top: -5px; + padding-top: 0; + padding-bottom: 0; + background-image: url(../../preview/images/hero.jpg); + background-size: cover; + background-position: right center; + color: white; + position: relative; + overflow: hidden; +} + +.wear-hero { + height: calc(100% - 110px); + min-height: 504px; + margin-top: -5px; + padding-top: 0; + padding-bottom: 0; + background-image: url(../../wear/images/hero.jpg); + background-size: cover; + background-position: top center; + color: white; + position: relative; + overflow: hidden; +} + +.tv-hero { + height: calc(100% - 110px); + min-height: 504px; + margin-top: -5px; + padding-top: 0; + padding-bottom: 0; + background-image: url(../../tv/images/hero.jpg); + background-size: cover; + background-position: right center; + color: white; + position: relative; + overflow: hidden; +} + +.auto-hero { + height: calc(100% - 110px); + min-height: 504px; + margin-top: -5px; + padding-top: 0; + padding-bottom: 0; + background-image: url(../../auto/images/hero.jpg); + background-size: cover; + background-position: right center; + color: white; + position: relative; + overflow: hidden; +} + +.landing-hero-scrim { + background: black; + opacity: .2; + position: absolute; + width: 100%; + height: 100%; + margin-left: -10px; +} + +.landing-hero-wrap { + margin: 0 auto; + width: 940px; + clear: both; + height: 100%; + position: relative; +} + +.landing-section-header { + margin-bottom: 40px; +} + +.landing-hero-wrap .landing-section-header { + margin-bottom: 16px; +} + +.landing-body { + font-size: 18px; + line-height: 24px; +} + +.landing-button { + white-space: nowrap; + display: inline-block; + padding: 16px 32px; + font-size: 18px; + font-weight: 500; + line-height: 24px; + cursor: pointer; + color: white; + -webkit-user-select: none; + -moz-user-select: none; + -o-user-select: none; + user-select: none; + -webkit-transition: .2s background-color ease-in-out; + -moz-transition: .2s background-color ease-in-out; + -o-transition: .2s background-color ease-in-out; + transition: .2s background-color ease-in-out; +} + +.landing-primary { + background-color: hsl(8, 70%, 54%); /* #dc4b35 */ + color: #f8f8f8; +} + +.landing-button.landing-primary:hover { + background-color: hsl(8, 70%, 44%); /* #bf3722 */ +} + +.landing-button.landing-primary:active { + background-color: hsl(8, 70%, 36%); /* # */ +} + +.landing-button.landing-secondary { + background-color: hsl(8, 70%, 44%); +} + +.landing-button.landing-secondary:hover { + background-color: hsl(8, 70%, 36%); +} + +.landing-button.landing-secondary:active { + background-color: hsl(8, 70%, 30%); +} + +a.landing-button, +a.landing-button:hover, +a.landing-button:visited { + color: white !important; +} + +.landing-video-link { + white-space: nowrap; + display: inline-block; + padding: 16px 32px 16px 82px; + font-size: 18px; + font-weight: 400; + line-height: 24px; + cursor: pointer; + color: hsla(0, 0%, 100%, .8); + -webkit-user-select: none; + -moz-user-select: none; + -o-user-select: none; + user-select: none; + -webkit-transition: .2s color ease-in-out; + -moz-transition: .2s color ease-in-out; + -o-transition: .2s color ease-in-out; + transition: .2s color ease-in-out; +} + +.landing-video-link:before { + height: 64px; + width: 64px; + display: inline-block; + background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGAAAABgCAYAAADimHc4AAAFuklEQVR42u2dXWgcVRSAV9LWtBBTTZVWUhNqEQtq1QeroDRKFRFsROqTYPuo+JCiIoJKFC0USqlUfCiowRcfrBgVUUElefAPkW5T8aeaGn9aRbFsjP0x2cx8PuRMvFxmdjeb2Z17Z8+B85DsZPbO+eaec3/OPSkABdXsVI2gABSAqgJQAKoKQAGoKgAFoKoAFICqAlAAqgpAAai6DqDRAiwDeoFtwB7gPaAInABKwKToCWAMeB/YDdwJrAWWNLh9+QMAXABsBQ4A3wFTwAxQBmaBAAhjNJDPy3L938BXwAvArUCHAkh+kCXAVcA+YBw4bRg7MngtkgTlDPA98CywHmhTAP8/xCbgVeAvMZZpwDQllN7xB/AysKGlAQAXAvuBkzW85UVgCBgENlfQQbmuWAXELPAnsAvoaikAQBtwh/j3coLhS2LIfqCzzu/plL8fkvvFgZiR4L2lHrfkHQBgpQTFUwmGnwC212v0KjC2y/3jQPwDPA+05xYAcBHwubx1YZzhC02QBBBRbxgBzssdAOBy4JgRZE0ZTPuNr7FHDCbEhqNAd24AAN0yUbID7QSwsZChABut3hANXY8Bq70HIMb/Ocb4w81+66v0hmGrN0QQ1ngLQJYRvpWHMWWo4KDIaMnuCcVKgdlZAGL8t2J8vpPGrwChDLyWBMFlAA8D0z4ZvwKEs8D93gCQEc9Jy/jFgkdizaRDGUSs8wXAu1bQLQE9ngHosWbPAXDQeQAypT9rBd3+gociyxi2K9riLABZUj5iuZ6RgsciM2OzFxw2A7JrAO6VwGtKTwpG+Anoy9AVmb3gDHCPcwCAFcChRox6jPu9CazMeFQUAKNRL3AJwE2yopjq228BQPZ/d2bcCyaBTa4BeNGa8Q6naIA4GQWubiKEYWvBbp8zAGQt5VfL/fQ3GEAkTzXDLVkjokA2k5a7AuA2GaLNj/tTfvhq0pQgbcwLQtlQusYVALtlzSR191MjADNI9zbJDZWBR10BMGr5/4GMADQ0SAMDlht62xUAxy0AmzMEEMnhtIO0ZF2YAH5wITd0hQw/5wE04M1bjDyXZpC2hqMlYGnWAHqBf40APOEYgChI35VSWyasWfGqrAH0WVkOIw4CSC1IG2tDoSy7XJE1gPs8ArDoIG0BmJGk30wBDHgGYFFBOgbAtqwB7GxxAHerC8rOBU0Dt2gQzjYIb8gawDor+6HVhqFdrkzEwhabiAVOTMSkUb+06FLEUVfWgj5q0cW4g64AeNo66ZLlcnTDNmesBN4y8KArAG6QU42ttCEzBVzpCoAO4EfLDeV5SzIEvgHaXdqUP2BlQud1Ux55zj2uZUX02cPRnKalRLmu17qYmPWF5YbymJgVAh8Ay5wCII3ZEZOYm6fURGT2u9X43Mnk3CDHybmfmRVYXExPv9nKEcpLejqSC3SjdY2TBzTesHqB7wc0onTEV2KucxLApXKkJy9HlAI5anuJFwCkYQ/EuCJfD+mdBnYkXOssgHY53un7MdVZ4CVgqVcADAhjMafkfTioHc14P04yvvMApIEXy5F/+7S8y6UKolPyR4BVVf7Wi2IdawwIPhTrmAW+rmZ8bwBIQ7vloXwoVzNWS6UUrwAYy9YfOlqwKZDkgneA5Qu4l3cly84F9sqGhislywLmaozuYoGFXr0DII1ukxP1hxJ6QzR7HqLxRfumZaRzXZ3f4XXZyi7gCeB3kqsnzs+kSb9s5XHgMeD8RTxDLgq3rmeuYuFvNYCoR8wqujNi+L3UWBcu9wAMt3QZ8LiMlk5RuU50teq6kcEDgTolveIRYHUQBOek1O5cFu/ukLz7/ZJgNSm+OirebWpgaPS7slxfAr4EngGuX8jopqUBxGzyrAVuB54EXgc+lV4yLhO8cfn5E+ZqUD8kBu9sQvv0Hzj4rmoEBaAAVBWAAlBVAApAVQEoAFUFoABUFYACUFUACkC1CfofXVRJocowZVYAAAAASUVORK5CYII=); + background-size: contain; + position: absolute; + content: ""; + opacity: .7; + margin-top: -19px; + margin-left: -64px; + -webkit-transition: .2s opacity ease-in-out; + -moz-transition: .2s opacity ease-in-out; + -o-transition: .2s opacity ease-in-out; + transition: .2s opacity ease-in-out; +} + +.landing-video-link:hover { + color: hsla(0, 0%, 100%, 1); +} + +.landing-video-link:hover:before { + opacity: 1; +} + +.landing-social-image { + float: left; + margin-right: 14px; + height: 64px; + width: 64px; +} + +.landing-social-copy { + padding-left: 78px; +} + +.landing-scroll-down-affordance { + position: absolute; + bottom: 0; + width: 100%; + text-align: center; + z-index: 10; +} + +.landing-down-arrow { + padding: 24px; + display: inline-block; + opacity: .5; + -webkit-transition: .2s opacity ease-in-out; + -moz-transition: .2s opacity ease-in-out; + -o-transition: .2s opacity ease-in-out; + transition: .2s opacity ease-in-out; + + -webkit-animation-name: pulse-opacity; + -webkit-animation-duration: 4s; +} + +.landing-down-arrow:hover { + opacity: 1; +} + +.landing-down-arrow img { + height: 28px; + width: 28px; + margin: 0 auto; + display: block; +} + +.landing-divider { + display: inline-block; + height: 2px; + background-color: white; + position: relative; + margin: 10px 0; +} + +/* 3 CLOLUMN LAYOUT */ + +.landing-breakout { + margin-top: 40px; + margin-bottom: 40px; +} + +.landing-breakout img { + margin-bottom: 20px; +} + +.landing-partners img { + margin-bottom: 20px; +} + +.landing-breakout p { + padding: 0 23px; +} + +.landing-inset-video-container { + position: relative; +} + +.landing-inset-video-container img.gif { + max-width: 222px; + position: absolute; + top: 40px; + left: 40px; +} + +img.landing-bezel-only { + height:302px; + width:302px; +} + +.landing-breakout.landing-partners img { + margin-bottom: 20px; +} + +.col-3-wide { + display: inline; + float: left; + margin-left: 10px; + margin-right: 10px; +} + +.col-3-wide { + width: 302px; +} + +/** + * ANIMATION + */ + +@-webkit-keyframes pulse-opacity { + 0% { + opacity: .5; + } + 20% { + opacity: .5; + } + 40% { + opacity: 1; + } + 60% { + opacity: .5; + } + 80% { + opacity: 1; + } + 100% { + opacity: .5; + } +} + + + +/** + * VIDEO + */ + +#video-container { + display:none; + position:fixed; + top:0; + left:-10px; + width:102%; + height:100%; + background-color:rgba(0,0,0,0.7); + z-index:99; +} + +#video-frame { + width:940px; + height:526.4px; + margin:80px auto 0; + display:none; +} + +.video-close { +cursor: pointer; +position: relative; +left: 940px; +top: 0; +pointer-events: all; +} + +#icon-video-close { +background-image: url("../images/close.png"); +background-position: 0 0; +height: 36px; +width: 36px; +display:block; +} + + + + +/****************** +Styles for d.a.c/index: +*******************/ + + + +/* Generic full screen carousel styling to be used across pages. */ +.fullscreen-carousel { + margin: 0 -10px; + width: 100%; + overflow: hidden; + position: relative; +} + +.fullscreen-carousel-content { + width: 100%; + height: 100%; + position: relative; + display: table; /* For vertical centering */ +} + +.fullscreen-carousel .vcenter { + display: table-cell; + vertical-align: middle; + position: relative; +} + +.fullscreen-carousel .vcenter > div { + margin: 10px auto; +} + +/* Styles for the full-bleed hero image type. */ +.fullscreen-carousel .hero, .fullscreen-carousel .hero h1 { + color: #fff; +} + +.fullscreen-carousel .hero h1 { + font-weight: 300; + font-size: 60px; + line-height: 68px; + letter-spacing: -1px; + margin-top: 0; +} + +.fullscreen-carousel .hero p { + font-weight: 300; + font-size: 18px; + line-height: 24px; + -webkit-font-smoothing: antialiased; +} + +.fullscreen-carousel .hero .hero-bg { + background-size: cover; + width: 100%; + height: 100%; + position: absolute; + left: 0px; + top: 0px; +} + + +/* Full screen carousel styling for the resource flow layout type of content */ +.fullscreen-carousel .resource-flow-layout:after { + height: 0; /* Dont know why this is set at 10 in default.css */ +} + +.fullscreen-carousel .resource-flow-layout { + margin-bottom: 20px; +} + + + +/* Generic Tab carousel styling to be used across multiple pages. */ + +.tab-carousel .tab-nav { + list-style: none; + position: relative; + text-align: center; +} + +.tab-carousel .tab-nav li { + display: inline-block; + font-size: 22px; + font-weight: 400; + line-height: 50px; + list-style: none; + margin: 0; + padding: 0 25px; + position: relative; +} + +.tab-carousel .tab-nav li a, +.tab-carousel .tab-nav li a:hover { + color: #333 !important; + padding: 10px 10px 13px 10px; + position: relative; + z-index: 1000; +} + +.tab-carousel .tab-nav li:after { + background: #ddd; + bottom: 0; + content: ''; + height: 4px; + left: 0; + position: absolute; + width: 100%; + z-index: 0; +} + +.tab-carousel .tab-nav .highlight { + position: absolute; + height: 4px; + width: 100px; + bottom: 0; + background: #33b5e5; +} + +.tab-carousel .tab-carousel-content { + position: relative; + overflow: hidden; + white-space: nowrap; +} + +.tab-carousel .tab-carousel-content [data-tab] { + display: inline-block; + white-space: normal; +} + + + +/* + Resource styling for the tab carousel. The tab carousel contains either + a 3 column layout of resources or a single full-width resource. The + latter has the 18x12 class applied to it and can be styled differently + that way. +*/ + +.tab-carousel .resource .image { + width: 100%; + height: 250px; + background-repeat: no-repeat; + background-size: contain; + background-position: 50% 50%; +} + +.tab-carousel .resource .info .title { + font-size: 18px; + line-height: 24px; +} + +.tab-carousel .resource .info .summary, +.tab-carousel .resource .info .cta { + line-height: 24px; + font-size: 16px; +} + +.tab-carousel .resource-card-18x12 { + position: relative; + padding-left: 450px; + box-sizing: border-box; + display: table-cell; + vertical-align: middle; +} + +.tab-carousel .resource-card-18x12 .image { + position: absolute; + width: 420px; + height: 100%; + left: 0; + top: 0; +} + +.tab-carousel .resource-card-18x12 .info { + display: inline-block; +} + +.tab-carousel .resource-card-18x12 .info .title { + margin-bottom: 26px; +} + + + + + +/* + Styles for the entity link used in the actions bar and in the cta of + the resources that appear in the tab carousel. +*/ +.actions-bar a:after, +.resource .cta:after { + content: '›'; + font-weight: 400; + font-size: 22px; + left: 5px; + line-height: 1; + position: relative; + top: 1px; + transition: left 190ms ease-out; +} + +.actions-bar a:hover:after, +.resource .cta:hover:after { + left: 10px; +} + + + + +/* + Styles for the actions bar. +*/ +.actions-bar { + background: #9acd00; + margin: 0 -10px; + margin-top:-20px; + text-align: center; +} + +.actions-bar .actions { + padding: 30px 0 30px; + text-align: justify; + font-size: 0.1px; + line-height: 0.1px; + margin: 0 10px; +} + +.actions-bar .actions:after { + content: ''; + width: 100%; + display: inline-block; +} + +.actions-bar .actions > div { + display: inline-block; +} + +.actions-bar a { + font-size: 21px; + line-height: 27px; + color: #fff; + font-weight: 300; + -webkit-font-smoothing: antialiased; +} + +.actions-bar a:after { + top: 0px; + font-size: 22px; +} + +.actions-bar a:hover { + color: #fff !important; +} + + + + + +/* + Specific styles for new home page layout of the carousels. +*/ + +/* Big blue button */ +a.home-new-cta-btn, +.home-new-carousel-1 .resource-card-18x6 .cta { + white-space: nowrap; + display: inline-block; + padding: 14px 32px; + font-size: 18px; + font-weight: 500; + line-height: 24px; + cursor: pointer; + background: #33b5e6; + border-radius: 4px; + margin-top: 20px; + color: #fff; + transition: 0.2s background-color ease-in-out; +} + +.home-new-carousel-1 .resource-card-18x6 .cta:after { + display: none; /* Hide the entity for this button */ +} + +a.home-new-cta-btn:hover, +.home-new-carousel-1 .resource-card-18x6 .cta:hover { + color: #fff !important; + background: #2d9fca; +} + +.home-new-carousel-1 .resource-card-18x6 .cta { + position: absolute; + bottom: 20px; + left: 16px; +} + +/* Fullscreen carousel. */ +.home-new-carousel-1 { + max-height: 700px; /* Set max height so doesn't get too long */ + margin-top: 20px; +} + +.home-new-carousel-1 .fullscreen-carousel-content { + min-height: 450px; /* Set min height for all content */ +} + +.home-new-carousel-1 .hero { + background: #000; +} + +.home-new-carousel-1 .hero-bg { + background-image: url(/home-new/images/hero.jpg); + background-position: right center; + opacity: 0.85; +} + +/* + Styling for special top card of full screen layout resource layout. + We need to specifically style the 18x6 card to adjust its size and layout, + since it's not a standard card, not sure if this is unique to the home page + layout or should be namespaced within the fullscreen-carousel container. +*/ +.home-new-carousel-1 .resource-flow-layout.col-16 .resource-card-18x6 { + height: 334px; +} + +.home-new-carousel-1 .resource-card-18x6 .card-bg { + width: 636px; + height: 100%; +} + +.home-new-carousel-1 .resource-card-18x6 .card-info { + right: 0px; + left: 636px; + height: 100%; + top: 0px; + padding: 15px 22px; +} + +.home-new-carousel-1 .resource-card-18x6 .card-info .util { + display: none; +} + +.home-new-carousel-1 .resource-card-18x6 .card-info .title { + font-size: 20px; + font-weight: 500; + margin-top: 15px; + margin-bottom: 15px; +} + +.home-new-carousel-1 .resource-card-18x6 .card-info .text { + font-size: 15px; + line-height: 21px; +} + + +/* Tabbed carousel. */ +.home-new-carousel-2 { + margin: 35px auto 100px auto; +} + +.home-new-carousel-2 h1 { + font-size: 47px; + font-weight: 100; + line-height: 54px; + text-align: center; +} diff --git a/tools/droiddoc/templates-sdk/assets/css/fullscreen.css b/tools/droiddoc/templates-sdk/assets/css/fullscreen.css index 71cf65b..7912e34 100644 --- a/tools/droiddoc/templates-sdk/assets/css/fullscreen.css +++ b/tools/droiddoc/templates-sdk/assets/css/fullscreen.css @@ -170,7 +170,7 @@ body { max-width: 100%; } -#nav-x .wrap, +#header-wrapper #nav-x div.wrap, #searchResults.wrap { max-width:100%; } @@ -184,9 +184,17 @@ body { left:20px; /* !important ... for IE i think */ } +#sticky-header { + padding: 0 20px; +} +#sticky-header > div { + width: 100%; +} - +.sticky-menu { + width:100%; + left:-20px; } .col-right { diff --git a/tools/droiddoc/templates-sdk/assets/images/breadcrumb.png b/tools/droiddoc/templates-sdk/assets/images/breadcrumb.png Binary files differnew file mode 100644 index 0000000..407a318 --- /dev/null +++ b/tools/droiddoc/templates-sdk/assets/images/breadcrumb.png diff --git a/tools/droiddoc/templates-sdk/assets/images/dac_logo@2x.png b/tools/droiddoc/templates-sdk/assets/images/dac_logo@2x.png Binary files differnew file mode 100644 index 0000000..0f2784d --- /dev/null +++ b/tools/droiddoc/templates-sdk/assets/images/dac_logo@2x.png diff --git a/tools/droiddoc/templates-sdk/assets/images/link-out.png b/tools/droiddoc/templates-sdk/assets/images/link-out.png Binary files differnew file mode 100644 index 0000000..aa55f9a --- /dev/null +++ b/tools/droiddoc/templates-sdk/assets/images/link-out.png diff --git a/tools/droiddoc/templates-sdk/assets/images/resource-card-default-android.jpg b/tools/droiddoc/templates-sdk/assets/images/resource-card-default-android.jpg Binary files differnew file mode 100644 index 0000000..8050744 --- /dev/null +++ b/tools/droiddoc/templates-sdk/assets/images/resource-card-default-android.jpg diff --git a/tools/droiddoc/templates-sdk/assets/images/stack-arrow-right.png b/tools/droiddoc/templates-sdk/assets/images/stack-arrow-right.png Binary files differnew file mode 100644 index 0000000..46d6a50 --- /dev/null +++ b/tools/droiddoc/templates-sdk/assets/images/stack-arrow-right.png diff --git a/tools/droiddoc/templates-sdk/assets/js/docs.js b/tools/droiddoc/templates-sdk/assets/js/docs.js index 6630bf9..fb9f5b2 100644 --- a/tools/droiddoc/templates-sdk/assets/js/docs.js +++ b/tools/droiddoc/templates-sdk/assets/js/docs.js @@ -19,7 +19,6 @@ $.ajaxSetup({ /****** ON LOAD SET UP STUFF *********/ -var navBarIsFixed = false; $(document).ready(function() { // load json file for JD doc search suggestions @@ -64,7 +63,12 @@ $(document).ready(function() { $('.scroll-pane').jScrollPane( {verticalGutter:0} ); // add HRs below all H2s (except for a few other h2 variants) - $('h2').not('#qv h2').not('#tb h2').not('.sidebox h2').not('#devdoc-nav h2').not('h2.norule').css({marginBottom:0}).after('<hr/>'); + $('h2').not('#qv h2') + .not('#tb h2') + .not('.sidebox h2') + .not('#devdoc-nav h2') + .not('h2.norule').css({marginBottom:0}) + .after('<hr/>'); // set up the search close button $('.search .close').click(function() { @@ -167,10 +171,24 @@ $(document).ready(function() { // highlight Design tab if ($("body").hasClass("design")) { $("#header li.design a").addClass("selected"); + $("#sticky-header").addClass("design"); + // highlight About tabs + } else if ($("body").hasClass("about")) { + var rootDir = pagePathOriginal.substring(1,pagePathOriginal.indexOf('/', 1)); + if (rootDir == "about") { + $("#nav-x li.about a").addClass("selected"); + } else if (rootDir == "wear") { + $("#nav-x li.wear a").addClass("selected"); + } else if (rootDir == "tv") { + $("#nav-x li.tv a").addClass("selected"); + } else if (rootDir == "auto") { + $("#nav-x li.auto a").addClass("selected"); + } // highlight Develop tab } else if ($("body").hasClass("develop") || $("body").hasClass("google")) { $("#header li.develop a").addClass("selected"); + $("#sticky-header").addClass("develop"); // In Develop docs, also highlight appropriate sub-tab var rootDir = pagePathOriginal.substring(1,pagePathOriginal.indexOf('/', 1)); if (rootDir == "training") { @@ -195,12 +213,34 @@ $(document).ready(function() { // highlight Distribute tab } else if ($("body").hasClass("distribute")) { $("#header li.distribute a").addClass("selected"); + $("#sticky-header").addClass("distribute"); + + var baseFrag = pagePathOriginal.indexOf('/', 1) + 1; + var secondFrag = pagePathOriginal.substring(baseFrag, pagePathOriginal.indexOf('/', baseFrag)); + if (secondFrag == "users") { + $("#nav-x li.users a").addClass("selected"); + } else if (secondFrag == "engage") { + $("#nav-x li.engage a").addClass("selected"); + } else if (secondFrag == "monetize") { + $("#nav-x li.monetize a").addClass("selected"); + } else if (secondFrag == "tools") { + $("#nav-x li.disttools a").addClass("selected"); + } else if (secondFrag == "stories") { + $("#nav-x li.stories a").addClass("selected"); + } else if (secondFrag == "essentials") { + $("#nav-x li.essentials a").addClass("selected"); + } else if (secondFrag == "googleplay") { + $("#nav-x li.googleplay a").addClass("selected"); + } + } else if ($("body").hasClass("about")) { + $("#sticky-header").addClass("about"); } // set global variable so we can highlight the sidenav a bit later (such as for google reference) // and highlight the sidenav mPagePath = pagePath; highlightSidenav(); + buildBreadcrumbs(); // set up prev/next links if they exist var $selNavLink = $('#nav').find('a[href="' + pagePath + '"]'); @@ -323,7 +363,20 @@ false; // navigate across topic boundaries only in design docs // Set up the course landing pages for Training with class names and descriptions if ($('body.trainingcourse').length) { var $classLinks = $selListItem.find('ul li a').not('#nav .nav-section .nav-section ul a'); - var $classDescriptions = $classLinks.attr('description'); + + // create an array for all the class descriptions + var $classDescriptions = new Array($classLinks.length); + var lang = getLangPref(); + $classLinks.each(function(index) { + var langDescr = $(this).attr(lang + "-description"); + if (typeof langDescr !== 'undefined' && langDescr !== false) { + // if there's a class description in the selected language, use that + $classDescriptions[index] = langDescr; + } else { + // otherwise, use the default english description + $classDescriptions[index] = $(this).attr("description"); + } + }); var $olClasses = $('<ol class="class-list"></ol>'); var $liClass; @@ -335,7 +388,7 @@ false; // navigate across topic boundaries only in design docs $classLinks.each(function(index) { $liClass = $('<li></li>'); $h2Title = $('<a class="title" href="'+$(this).attr('href')+'"><h2>' + $(this).html()+'</h2><span></span></a>'); - $pSummary = $('<p class="description">' + $(this).attr('description') + '</p>'); + $pSummary = $('<p class="description">' + $classDescriptions[index] + '</p>'); $olLessons = $('<ol class="lesson-list"></ol>'); @@ -374,7 +427,7 @@ false; // navigate across topic boundaries only in design docs var stylesheet = $('link[rel="stylesheet"][class="fullscreen"]'); setNavBarLeftPos(); // do this even if sidenav isn't fixed because it could become fixed // make sidenav behave when resizing the window and side-scolling is a concern - if (navBarIsFixed) { + if (sticky) { if ((stylesheet.attr("disabled") == "disabled") || stylesheet.length == 0) { updateSideNavPosition(); } else { @@ -385,70 +438,6 @@ false; // navigate across topic boundaries only in design docs }); - // Set up fixed navbar - var prevScrollLeft = 0; // used to compare current position to previous position of horiz scroll - $(window).scroll(function(event) { - if ($('#side-nav').length == 0) return; - if (event.target.nodeName == "DIV") { - // Dump scroll event if the target is a DIV, because that means the event is coming - // from a scrollable div and so there's no need to make adjustments to our layout - return; - } - var scrollTop = $(window).scrollTop(); - var headerHeight = $('#header').outerHeight(); - var subheaderHeight = $('#nav-x').outerHeight(); - var searchResultHeight = $('#searchResults').is(":visible") ? - $('#searchResults').outerHeight() : 0; - var totalHeaderHeight = headerHeight + subheaderHeight + searchResultHeight; - // we set the navbar fixed when the scroll position is beyond the height of the site header... - var navBarShouldBeFixed = scrollTop > totalHeaderHeight; - // ... except if the document content is shorter than the sidenav height. - // (this is necessary to avoid crazy behavior on OSX Lion due to overscroll bouncing) - if ($("#doc-col").height() < $("#side-nav").height()) { - navBarShouldBeFixed = false; - } - - var scrollLeft = $(window).scrollLeft(); - // When the sidenav is fixed and user scrolls horizontally, reposition the sidenav to match - if (navBarIsFixed && (scrollLeft != prevScrollLeft)) { - updateSideNavPosition(); - prevScrollLeft = scrollLeft; - } - - // Don't continue if the header is sufficently far away - // (to avoid intensive resizing that slows scrolling) - if (navBarIsFixed && navBarShouldBeFixed) { - return; - } - - if (navBarIsFixed != navBarShouldBeFixed) { - if (navBarShouldBeFixed) { - // make it fixed - var width = $('#devdoc-nav').width(); - $('#devdoc-nav') - .addClass('fixed') - .css({'width':width+'px'}) - .prependTo('#body-content'); - // add neato "back to top" button - $('#devdoc-nav a.totop').css({'display':'block','width':$("#nav").innerWidth()+'px'}); - - // update the sidenaav position for side scrolling - updateSideNavPosition(); - } else { - // make it static again - $('#devdoc-nav') - .removeClass('fixed') - .css({'width':'auto','margin':''}) - .prependTo('#side-nav'); - $('#devdoc-nav a.totop').hide(); - } - navBarIsFixed = navBarShouldBeFixed; - } - - resizeNav(250); // pass true in order to delay the scrollbar re-initialization for performance - }); - - var navBarLeftPos; if ($('#devdoc-nav').length) { setNavBarLeftPos(); @@ -522,7 +511,11 @@ false; // navigate across topic boundaries only in design docs } } + // Resize once loading is finished resizeNav(); + // Check if there's an anchor that we need to scroll into view. + // A delay is needed, because some browsers do not immediately scroll down to the anchor + window.setTimeout(offsetScrollForSticky, 100); /* init the language selector based on user cookie for lang */ loadLangPref(); @@ -593,6 +586,28 @@ function initExpandableNavItems(rootTag) { }); } + +/** Create the list of breadcrumb links in the sticky header */ +function buildBreadcrumbs() { + var $breadcrumbUl = $("#sticky-header ul.breadcrumb"); + // Add the secondary horizontal nav item, if provided + var $selectedSecondNav = $("div#nav-x ul.nav-x a.selected").clone().removeClass("selected"); + if ($selectedSecondNav.length) { + $breadcrumbUl.prepend($("<li>").append($selectedSecondNav)) + } + // Add the primary horizontal nav + var $selectedFirstNav = $("div#header-wrap ul.nav-x a.selected").clone().removeClass("selected"); + // If there's no header nav item, use the logo link and title from alt text + if ($selectedFirstNav.length < 1) { + $selectedFirstNav = $("<a>") + .attr('href', $("div#header .logo a").attr('href')) + .text($("div#header .logo img").attr('alt')); + } + $breadcrumbUl.prepend($("<li>").append($selectedFirstNav)); +} + + + /** Highlight the current page in sidenav, expanding children as appropriate */ function highlightSidenav() { // if something is already highlighted, undo it. This is for dynamic navigation (Samples index) @@ -705,9 +720,8 @@ function resizeNav(delay) { // Then figure out based on scroll position whether the header is visible var windowHeight = $window.height(); var scrollTop = $window.scrollTop(); - var headerHeight = $('#header').outerHeight(); - var subheaderHeight = $('#nav-x').outerHeight(); - var headerVisible = (scrollTop < (headerHeight + subheaderHeight)); + var headerHeight = $('#header-wrapper').outerHeight(); + var headerVisible = scrollTop < stickyTop; // get the height of space between nav and top of window. // Could be either margin or top position, depending on whether the nav is fixed. @@ -717,7 +731,7 @@ function resizeNav(delay) { // Depending on whether the header is visible, set the side nav's height. if (headerVisible) { // The sidenav height grows as the header goes off screen - navHeight = windowHeight - (headerHeight + subheaderHeight - scrollTop) - topMargin; + navHeight = windowHeight - (headerHeight - scrollTop) - topMargin; } else { // Once header is off screen, the nav height is almost full window height navHeight = windowHeight - topMargin; @@ -903,9 +917,111 @@ function writeCookie(cookie, val, section, expiration) { /* ######### END COOKIES! ########## */ +var sticky = false; +var stickyTop; +var prevScrollLeft = 0; // used to compare current position to previous position of horiz scroll +/* Sets the vertical scoll position at which the sticky bar should appear. + This method is called to reset the position when search results appear or hide */ +function setStickyTop() { + stickyTop = $('#header-wrapper').outerHeight() - $('#sticky-header').outerHeight(); +} + +/* + * Displays sticky nav bar on pages when dac header scrolls out of view + */ +$(window).scroll(function(event) { + + setStickyTop(); + var hiding = false; + var $stickyEl = $('#sticky-header'); + var $menuEl = $('.menu-container'); + // Exit if there's no sidenav + if ($('#side-nav').length == 0) return; + // Exit if the mouse target is a DIV, because that means the event is coming + // from a scrollable div and so there's no need to make adjustments to our layout + if ($(event.target).nodeName == "DIV") { + return; + } + + var top = $(window).scrollTop(); + // we set the navbar fixed when the scroll position is beyond the height of the site header... + var shouldBeSticky = top >= stickyTop; + // ... except if the document content is shorter than the sidenav height. + // (this is necessary to avoid crazy behavior on OSX Lion due to overscroll bouncing) + if ($("#doc-col").height() < $("#side-nav").height()) { + shouldBeSticky = false; + } + // Account for horizontal scroll + var scrollLeft = $(window).scrollLeft(); + // When the sidenav is fixed and user scrolls horizontally, reposition the sidenav to match + if (sticky && (scrollLeft != prevScrollLeft)) { + updateSideNavPosition(); + prevScrollLeft = scrollLeft; + } + + // Don't continue if the header is sufficently far away + // (to avoid intensive resizing that slows scrolling) + if (sticky == shouldBeSticky) { + return; + } + + // If sticky header visible and position is now near top, hide sticky + if (sticky && !shouldBeSticky) { + sticky = false; + hiding = true; + // make the sidenav static again + $('#devdoc-nav') + .removeClass('fixed') + .css({'width':'auto','margin':''}) + .prependTo('#side-nav'); + // delay hide the sticky + $menuEl.removeClass('sticky-menu'); + $stickyEl.fadeOut(250); + hiding = false; + + // update the sidenaav position for side scrolling + updateSideNavPosition(); + } else if (!sticky && shouldBeSticky) { + sticky = true; + $stickyEl.fadeIn(10); + $menuEl.addClass('sticky-menu'); + + // make the sidenav fixed + var width = $('#devdoc-nav').width(); + $('#devdoc-nav') + .addClass('fixed') + .css({'width':width+'px'}) + .prependTo('#body-content'); + + // update the sidenaav position for side scrolling + updateSideNavPosition(); + + } else if (hiding && top < 15) { + $menuEl.removeClass('sticky-menu'); + $stickyEl.hide(); + hiding = false; + } + resizeNav(250); // pass true in order to delay the scrollbar re-initialization for performance +}); + +/* + * Manages secion card states and nav resize to conclude loading + */ +(function() { + $(document).ready(function() { + + // Stack hover states + $('.section-card-menu').each(function(index, el) { + var height = $(el).height(); + $(el).css({height:height+'px', position:'relative'}); + var $cardInfo = $(el).find('.card-info'); + $cardInfo.css({position: 'absolute', bottom:'0px', left:'0px', right:'0px', overflow:'visible'}); + }); + }); +})(); @@ -972,8 +1088,16 @@ function hideNestedItems(list, toggle) { } +/* Call this to add listeners to a <select> element for Studio/Eclipse/Other docs */ +function setupIdeDocToggle() { + $( "select.ide" ).change(function() { + var selected = $(this).find("option:selected").attr("value"); + $(".select-ide").hide(); + $(".select-ide."+selected).show(); - + $("select.ide").val(selected); + }); +} @@ -1724,6 +1848,7 @@ function search_changed(e, kd, toroot) $('.suggest-card').hide(); if ($("#searchResults").is(":hidden") && (search.value != "")) { // if results aren't showing (and text not empty), return true to allow search to execute + $('body,html').animate({scrollTop:0}, '500', 'swing'); return true; } else { // otherwise, results are already showing, so allow ajax to auto refresh the results @@ -1736,8 +1861,12 @@ function search_changed(e, kd, toroot) return false; } } - // Stop here if Google results are showing + // If Google results are showing, return true to allow ajax search to execute else if ($("#searchResults").is(":visible")) { + // Also, if search_results is scrolled out of view, scroll to top to make results visible + if ((sticky ) && (search.value != "")) { + $('body,html').animate({scrollTop:0}, '500', 'swing'); + } return true; } // 38 UP ARROW @@ -2278,13 +2407,13 @@ function submit_search() { var query = document.getElementById('search_autocomplete').value; location.hash = 'q=' + query; loadSearchResults(); - $("#searchResults").slideDown('slow'); + $("#searchResults").slideDown('slow', setStickyTop); return false; } function hideResults() { - $("#searchResults").slideUp(); + $("#searchResults").slideUp('fast', setStickyTop); $(".search .close").addClass("hide"); location.hash = ''; @@ -2401,27 +2530,47 @@ google.setOnLoadCallback(function(){ return; } else { // first time loading search results for this page - $('#searchResults').slideDown('slow'); + $('#searchResults').slideDown('slow', setStickyTop); $(".search .close").removeClass("hide"); loadSearchResults(); } }, true); +/* Adjust the scroll position to account for sticky header, only if the hash matches an id */ +function offsetScrollForSticky() { + var hash = location.hash; + var $matchingElement = $(hash); + // If there's no element with the hash as an ID, then look for an <a name=''> with it. + if ($matchingElement.length < 1) { + $matchingElement = $('a[name="' + hash.substr(1) + '"]'); + } + // Sanity check that hash is a real hash and that there's an element with that ID on the page + if ((hash.indexOf("#") == 0) && $matchingElement.length) { + // If the position of the target element is near the top of the page (<20px, where we expect it + // to be because we need to move it down 60px to become in view), then move it down 60px + if (Math.abs($matchingElement.offset().top - $(window).scrollTop()) < 20) { + $(window).scrollTop($(window).scrollTop() - 60); + } + } +} + // when an event on the browser history occurs (back, forward, load) requery hash and do search $(window).hashchange( function(){ - // Exit if the hash isn't a search query or there's an error in the query + // If the hash isn't a search query or there's an error in the query, + // then adjust the scroll position to account for sticky header, then exit. if ((location.hash.indexOf("q=") == -1) || (query == "undefined")) { // If the results pane is open, close it. if (!$("#searchResults").is(":hidden")) { hideResults(); } + offsetScrollForSticky(); return; } // Otherwise, we have a search to do var query = decodeURI(getQuery(location.hash)); searchControl.execute(query); - $('#searchResults').slideDown('slow'); + $('#searchResults').slideDown('slow', setStickyTop); $("#search_autocomplete").focus(); $(".search .close").removeClass("hide"); @@ -2529,7 +2678,7 @@ var maxLevel = 1; } function updateSidenavFixedWidth() { - if (!navBarIsFixed) return; + if (!sticky) return; $('#devdoc-nav').css({ 'width' : $('#side-nav').css('width'), 'margin' : $('#side-nav').css('margin') @@ -2540,7 +2689,7 @@ function updateSidenavFixedWidth() { } function updateSidenavFullscreenWidth() { - if (!navBarIsFixed) return; + if (!sticky) return; $('#devdoc-nav').css({ 'width' : $('#side-nav').css('width'), 'margin' : $('#side-nav').css('margin') @@ -3233,3 +3382,834 @@ function showSamples() { $("#samples").append($ul); } + + + +/* ########################################################## */ +/* ################### RESOURCE CARDS ##################### */ +/* ########################################################## */ + +/** Handle resource queries, collections, and grids (sections). Requires + jd_tag_helpers.js and the *_unified_data.js to be loaded. */ + +(function() { + // Prevent the same resource from being loaded more than once per page. + var addedPageResources = {}; + + $(document).ready(function() { + $('.resource-widget').each(function() { + initResourceWidget(this); + }); + + /* Pass the line height to ellipsisfade() to adjust the height of the + text container to show the max number of lines possible, without + showing lines that are cut off. This works with the css ellipsis + classes to fade last text line and apply an ellipsis char. */ + + //card text currently uses 15px line height. + var lineHeight = 15; + $('.card-info .text').ellipsisfade(lineHeight); + }); + + /* + Three types of resource layouts: + Flow - Uses a fixed row-height flow using float left style. + Carousel - Single card slideshow all same dimension absolute. + Stack - Uses fixed columns and flexible element height. + */ + function initResourceWidget(widget) { + var $widget = $(widget); + var isFlow = $widget.hasClass('resource-flow-layout'), + isCarousel = $widget.hasClass('resource-carousel-layout'), + isStack = $widget.hasClass('resource-stack-layout'); + + // find size of widget by pulling out its class name + var sizeCols = 1; + var m = $widget.get(0).className.match(/\bcol-(\d+)\b/); + if (m) { + sizeCols = parseInt(m[1], 10); + } + + var opts = { + cardSizes: ($widget.data('cardsizes') || '').split(','), + maxResults: parseInt($widget.data('maxresults') || '100', 10), + itemsPerPage: $widget.data('itemsperpage'), + sortOrder: $widget.data('sortorder'), + query: $widget.data('query'), + section: $widget.data('section'), + sizeCols: sizeCols, + /* Added by LFL 6/6/14 */ + resourceStyle: $widget.data('resourcestyle') || 'card', + stackSort: $widget.data('stacksort') || 'true' + }; + + // run the search for the set of resources to show + + var resources = buildResourceList(opts); + + if (isFlow) { + drawResourcesFlowWidget($widget, opts, resources); + } else if (isCarousel) { + drawResourcesCarouselWidget($widget, opts, resources); + } else if (isStack) { + /* Looks like this got removed and is not used, so repurposing for the + homepage style layout. + Modified by LFL 6/6/14 + */ + //var sections = buildSectionList(opts); + opts['numStacks'] = $widget.data('numstacks'); + drawResourcesStackWidget($widget, opts, resources/*, sections*/); + } + } + + /* Initializes a Resource Carousel Widget */ + function drawResourcesCarouselWidget($widget, opts, resources) { + $widget.empty(); + var plusone = true; //always show plusone on carousel + + $widget.addClass('resource-card slideshow-container') + .append($('<a>').addClass('slideshow-prev').text('Prev')) + .append($('<a>').addClass('slideshow-next').text('Next')); + + var css = { 'width': $widget.width() + 'px', + 'height': $widget.height() + 'px' }; + + var $ul = $('<ul>'); + + for (var i = 0; i < resources.length; ++i) { + var $card = $('<a>') + .attr('href', cleanUrl(resources[i].url)) + .decorateResourceCard(resources[i],plusone); + + $('<li>').css(css) + .append($card) + .appendTo($ul); + } + + $('<div>').addClass('frame') + .append($ul) + .appendTo($widget); + + $widget.dacSlideshow({ + auto: true, + btnPrev: '.slideshow-prev', + btnNext: '.slideshow-next' + }); + }; + + /* Initializes a Resource Card Stack Widget (column-based layout) + Modified by LFL 6/6/14 + */ + function drawResourcesStackWidget($widget, opts, resources, sections) { + // Don't empty widget, grab all items inside since they will be the first + // items stacked, followed by the resource query + var plusone = true; //by default show plusone on section cards + var cards = $widget.find('.resource-card').detach().toArray(); + var numStacks = opts.numStacks || 1; + var $stacks = []; + var urlString; + + for (var i = 0; i < numStacks; ++i) { + $stacks[i] = $('<div>').addClass('resource-card-stack') + .appendTo($widget); + } + + var sectionResources = []; + + // Extract any subsections that are actually resource cards + if (sections) { + for (var i = 0; i < sections.length; ++i) { + if (!sections[i].sections || !sections[i].sections.length) { + // Render it as a resource card + sectionResources.push( + $('<a>') + .addClass('resource-card section-card') + .attr('href', cleanUrl(sections[i].resource.url)) + .decorateResourceCard(sections[i].resource,plusone)[0] + ); + + } else { + cards.push( + $('<div>') + .addClass('resource-card section-card-menu') + .decorateResourceSection(sections[i],plusone)[0] + ); + } + } + } + + cards = cards.concat(sectionResources); + + for (var i = 0; i < resources.length; ++i) { + var $card = createResourceElement(resources[i], opts); + + if (opts.resourceStyle.indexOf('related') > -1) { + $card.addClass('related-card'); + } + + cards.push($card[0]); + } + + if (opts.stackSort != 'false') { + for (var i = 0; i < cards.length; ++i) { + // Find the stack with the shortest height, but give preference to + // left to right order. + var minHeight = $stacks[0].height(); + var minIndex = 0; + + for (var j = 1; j < numStacks; ++j) { + var height = $stacks[j].height(); + if (height < minHeight - 45) { + minHeight = height; + minIndex = j; + } + } + + $stacks[minIndex].append($(cards[i])); + } + } + + }; + + /* + Create a resource card using the given resource object and a list of html + configured options. Returns a jquery object containing the element. + */ + function createResourceElement(resource, opts, plusone) { + var $el; + + // The difference here is that generic cards are not entirely clickable + // so its a div instead of an a tag, also the generic one is not given + // the resource-card class so it appears with a transparent background + // and can be styled in whatever way the css setup. + if (opts.resourceStyle == 'generic') { + $el = $('<div>') + .addClass('resource') + .attr('href', cleanUrl(resource.url)) + .decorateResource(resource, opts); + } else { + var cls = 'resource resource-card'; + + $el = $('<a>') + .addClass(cls) + .attr('href', cleanUrl(resource.url)) + .decorateResourceCard(resource, plusone); + } + + return $el; + } + + /* Initializes a flow widget, see distribute.scss for generating accompanying css */ + function drawResourcesFlowWidget($widget, opts, resources) { + $widget.empty(); + var cardSizes = opts.cardSizes || ['6x6']; + var i = 0, j = 0; + var plusone = true; // by default show plusone on resource cards + + while (i < resources.length) { + var cardSize = cardSizes[j++ % cardSizes.length]; + cardSize = cardSize.replace(/^\s+|\s+$/,''); + // Some card sizes do not get a plusone button, such as where space is constrained + // or for cards commonly embedded in docs (to improve overall page speed). + plusone = !((cardSize == "6x2") || (cardSize == "6x3") || + (cardSize == "9x2") || (cardSize == "9x3") || + (cardSize == "12x2") || (cardSize == "12x3")); + + // A stack has a third dimension which is the number of stacked items + var isStack = cardSize.match(/(\d+)x(\d+)x(\d+)/); + var stackCount = 0; + var $stackDiv = null; + + if (isStack) { + // Create a stack container which should have the dimensions defined + // by the product of the items inside. + $stackDiv = $('<div>').addClass('resource-card-stack resource-card-' + isStack[1] + + 'x' + isStack[2] * isStack[3]) .appendTo($widget); + } + + // Build each stack item or just a single item + do { + var resource = resources[i]; + + var $card = createResourceElement(resources[i], opts, plusone); + + $card.addClass('resource-card-' + cardSize + + ' resource-card-' + resource.type); + + if (isStack) { + $card.addClass('resource-card-' + isStack[1] + 'x' + isStack[2]); + if (++stackCount == parseInt(isStack[3])) { + $card.addClass('resource-card-row-stack-last'); + stackCount = 0; + } + } else { + stackCount = 0; + } + + $card.appendTo($stackDiv || $widget); + + } while (++i < resources.length && stackCount > 0); + } + } + + /* Build a site map of resources using a section as a root. */ + function buildSectionList(opts) { + if (opts.section && SECTION_BY_ID[opts.section]) { + return SECTION_BY_ID[opts.section].sections || []; + } + return []; + } + + function buildResourceList(opts) { + var maxResults = opts.maxResults || 100; + + var query = opts.query || ''; + var expressions = parseResourceQuery(query); + var addedResourceIndices = {}; + var results = []; + + for (var i = 0; i < expressions.length; i++) { + var clauses = expressions[i]; + + // build initial set of resources from first clause + var firstClause = clauses[0]; + var resources = []; + switch (firstClause.attr) { + case 'type': + resources = ALL_RESOURCES_BY_TYPE[firstClause.value]; + break; + case 'lang': + resources = ALL_RESOURCES_BY_LANG[firstClause.value]; + break; + case 'tag': + resources = ALL_RESOURCES_BY_TAG[firstClause.value]; + break; + case 'collection': + var urls = RESOURCE_COLLECTIONS[firstClause.value].resources || []; + resources = urls.map(function(url){ return ALL_RESOURCES_BY_URL[url]; }); + break; + case 'section': + var urls = SITE_MAP[firstClause.value].sections || []; + resources = urls.map(function(url){ return ALL_RESOURCES_BY_URL[url]; }); + break; + } + // console.log(firstClause.attr + ':' + firstClause.value); + resources = resources || []; + + // use additional clauses to filter corpus + if (clauses.length > 1) { + var otherClauses = clauses.slice(1); + resources = resources.filter(getResourceMatchesClausesFilter(otherClauses)); + } + + // filter out resources already added + if (i > 1) { + resources = resources.filter(getResourceNotAlreadyAddedFilter(addedResourceIndices)); + } + + // add to list of already added indices + for (var j = 0; j < resources.length; j++) { + // console.log(resources[j].title); + addedResourceIndices[resources[j].index] = 1; + } + + // concat to final results list + results = results.concat(resources); + } + + if (opts.sortOrder && results.length) { + var attr = opts.sortOrder; + + if (opts.sortOrder == 'random') { + var i = results.length, j, temp; + while (--i) { + j = Math.floor(Math.random() * (i + 1)); + temp = results[i]; + results[i] = results[j]; + results[j] = temp; + } + } else { + var desc = attr.charAt(0) == '-'; + if (desc) { + attr = attr.substring(1); + } + results = results.sort(function(x,y) { + return (desc ? -1 : 1) * (parseInt(x[attr], 10) - parseInt(y[attr], 10)); + }); + } + } + + results = results.filter(getResourceNotAlreadyAddedFilter(addedPageResources)); + results = results.slice(0, maxResults); + + for (var j = 0; j < results.length; ++j) { + addedPageResources[results[j].index] = 1; + } + + return results; + } + + + function getResourceNotAlreadyAddedFilter(addedResourceIndices) { + return function(resource) { + return !addedResourceIndices[resource.index]; + }; + } + + + function getResourceMatchesClausesFilter(clauses) { + return function(resource) { + return doesResourceMatchClauses(resource, clauses); + }; + } + + + function doesResourceMatchClauses(resource, clauses) { + for (var i = 0; i < clauses.length; i++) { + var map; + switch (clauses[i].attr) { + case 'type': + map = IS_RESOURCE_OF_TYPE[clauses[i].value]; + break; + case 'lang': + map = IS_RESOURCE_IN_LANG[clauses[i].value]; + break; + case 'tag': + map = IS_RESOURCE_TAGGED[clauses[i].value]; + break; + } + + if (!map || (!!clauses[i].negative ? map[resource.index] : !map[resource.index])) { + return clauses[i].negative; + } + } + return true; + } + + function cleanUrl(url) + { + if (url && url.indexOf('//') === -1) { + url = toRoot + url; + } + + return url; + } + + + function parseResourceQuery(query) { + // Parse query into array of expressions (expression e.g. 'tag:foo + type:video') + var expressions = []; + var expressionStrs = query.split(',') || []; + for (var i = 0; i < expressionStrs.length; i++) { + var expr = expressionStrs[i] || ''; + + // Break expression into clauses (clause e.g. 'tag:foo') + var clauses = []; + var clauseStrs = expr.split(/(?=[\+\-])/); + for (var j = 0; j < clauseStrs.length; j++) { + var clauseStr = clauseStrs[j] || ''; + + // Get attribute and value from clause (e.g. attribute='tag', value='foo') + var parts = clauseStr.split(':'); + var clause = {}; + + clause.attr = parts[0].replace(/^\s+|\s+$/g,''); + if (clause.attr) { + if (clause.attr.charAt(0) == '+') { + clause.attr = clause.attr.substring(1); + } else if (clause.attr.charAt(0) == '-') { + clause.negative = true; + clause.attr = clause.attr.substring(1); + } + } + + if (parts.length > 1) { + clause.value = parts[1].replace(/^\s+|\s+$/g,''); + } + + clauses.push(clause); + } + + if (!clauses.length) { + continue; + } + + expressions.push(clauses); + } + + return expressions; + } +})(); + +(function($) { + + /* + Utility method for creating dom for the description area of a card. + Used in decorateResourceCard and decorateResource. + */ + function buildResourceCardDescription(resource, plusone) { + var $description = $('<div>').addClass('description ellipsis'); + + $description.append($('<div>').addClass('text').html(resource.summary)); + + if (resource.cta) { + $description.append($('<a>').addClass('cta').html(resource.cta)); + } + + if (plusone) { + var plusurl = resource.url.indexOf("//") > -1 ? resource.url : + "//developer.android.com/" + resource.url; + + $description.append($('<div>').addClass('util') + .append($('<div>').addClass('g-plusone') + .attr('data-size', 'small') + .attr('data-align', 'right') + .attr('data-href', plusurl))); + } + + return $description; + } + + + /* Simple jquery function to create dom for a standard resource card */ + $.fn.decorateResourceCard = function(resource,plusone) { + var section = resource.group || resource.type; + var imgUrl = resource.image || + 'assets/images/resource-card-default-android.jpg'; + + if (imgUrl.indexOf('//') === -1) { + imgUrl = toRoot + imgUrl; + } + + $('<div>').addClass('card-bg') + .css('background-image', 'url(' + (imgUrl || toRoot + + 'assets/images/resource-card-default-android.jpg') + ')') + .appendTo(this); + + $('<div>').addClass('card-info' + (!resource.summary ? ' empty-desc' : '')) + .append($('<div>').addClass('section').text(section)) + .append($('<div>').addClass('title').html(resource.title)) + .append(buildResourceCardDescription(resource, plusone)) + .appendTo(this); + + return this; + }; + + /* Simple jquery function to create dom for a resource section card (menu) */ + $.fn.decorateResourceSection = function(section,plusone) { + var resource = section.resource; + //keep url clean for matching and offline mode handling + var urlPrefix = resource.image.indexOf("//") > -1 ? "" : toRoot; + var $base = $('<a>') + .addClass('card-bg') + .attr('href', resource.url) + .append($('<div>').addClass('card-section-icon') + .append($('<div>').addClass('icon')) + .append($('<div>').addClass('section').html(resource.title))) + .appendTo(this); + + var $cardInfo = $('<div>').addClass('card-info').appendTo(this); + + if (section.sections && section.sections.length) { + // Recurse the section sub-tree to find a resource image. + var stack = [section]; + + while (stack.length) { + if (stack[0].resource.image) { + $base.css('background-image', 'url(' + urlPrefix + stack[0].resource.image + ')'); + break; + } + + if (stack[0].sections) { + stack = stack.concat(stack[0].sections); + } + + stack.shift(); + } + + var $ul = $('<ul>') + .appendTo($cardInfo); + + var max = section.sections.length > 3 ? 3 : section.sections.length; + + for (var i = 0; i < max; ++i) { + + var subResource = section.sections[i]; + if (!plusone) { + $('<li>') + .append($('<a>').attr('href', subResource.url) + .append($('<div>').addClass('title').html(subResource.title)) + .append($('<div>').addClass('description ellipsis') + .append($('<div>').addClass('text').html(subResource.summary)) + .append($('<div>').addClass('util')))) + .appendTo($ul); + } else { + $('<li>') + .append($('<a>').attr('href', subResource.url) + .append($('<div>').addClass('title').html(subResource.title)) + .append($('<div>').addClass('description ellipsis') + .append($('<div>').addClass('text').html(subResource.summary)) + .append($('<div>').addClass('util') + .append($('<div>').addClass('g-plusone') + .attr('data-size', 'small') + .attr('data-align', 'right') + .attr('data-href', resource.url))))) + .appendTo($ul); + } + } + + // Add a more row + if (max < section.sections.length) { + $('<li>') + .append($('<a>').attr('href', resource.url) + .append($('<div>') + .addClass('title') + .text('More'))) + .appendTo($ul); + } + } else { + // No sub-resources, just render description? + } + + return this; + }; + + + + + /* Render other types of resource styles that are not cards. */ + $.fn.decorateResource = function(resource, opts) { + var imgUrl = resource.image || + 'assets/images/resource-card-default-android.jpg'; + var linkUrl = resource.url; + + if (imgUrl.indexOf('//') === -1) { + imgUrl = toRoot + imgUrl; + } + + if (linkUrl && linkUrl.indexOf('//') === -1) { + linkUrl = toRoot + linkUrl; + } + + $(this).append( + $('<div>').addClass('image') + .css('background-image', 'url(' + imgUrl + ')'), + $('<div>').addClass('info').append( + $('<h4>').addClass('title').html(resource.title), + $('<p>').addClass('summary').html(resource.summary), + $('<a>').attr('href', linkUrl).addClass('cta').html('Learn More') + ) + ); + + return this; + }; +})(jQuery); + + +/* Calculate the vertical area remaining */ +(function($) { + $.fn.ellipsisfade= function(lineHeight) { + this.each(function() { + // get element text + var $this = $(this); + var remainingHeight = $this.parent().parent().height(); + $this.parent().siblings().each(function () + { + var h = $(this).height(); + remainingHeight = remainingHeight - h; + }); + + adjustedRemainingHeight = ((remainingHeight)/lineHeight>>0)*lineHeight + $this.parent().css({'height': adjustedRemainingHeight}); + $this.css({'height': "auto"}); + }); + + return this; + }; +}) (jQuery); + +/* + Fullscreen Carousel + + The following allows for an area at the top of the page that takes over the + entire browser height except for its top offset and an optional bottom + padding specified as a data attribute. + + HTML: + + <div class="fullscreen-carousel"> + <div class="fullscreen-carousel-content"> + <!-- content here --> + </div> + <div class="fullscreen-carousel-content"> + <!-- content here --> + </div> + + etc ... + + </div> + + Control over how the carousel takes over the screen can mostly be defined in + a css file. Setting min-height on the .fullscreen-carousel-content elements + will prevent them from shrinking to far vertically when the browser is very + short, and setting max-height on the .fullscreen-carousel itself will prevent + the area from becoming to long in the case that the browser is stretched very + tall. + + There is limited functionality for having multiple sections since that request + was removed, but it is possible to add .next-arrow and .prev-arrow elements to + scroll between multiple content areas. +*/ + +(function() { + $(document).ready(function() { + $('.fullscreen-carousel').each(function() { + initWidget(this); + }); + }); + + function initWidget(widget) { + var $widget = $(widget); + + var topOffset = $widget.offset().top; + var padBottom = parseInt($widget.data('paddingbottom')) || 0; + var maxHeight = 0; + var minHeight = 0; + var $content = $widget.find('.fullscreen-carousel-content'); + var $nextArrow = $widget.find('.next-arrow'); + var $prevArrow = $widget.find('.prev-arrow'); + var $curSection = $($content[0]); + + if ($content.length <= 1) { + $nextArrow.hide(); + $prevArrow.hide(); + } else { + $nextArrow.click(function() { + var index = ($content.index($curSection) + 1); + $curSection.hide(); + $curSection = $($content[index >= $content.length ? 0 : index]); + $curSection.show(); + }); + + $prevArrow.click(function() { + var index = ($content.index($curSection) - 1); + $curSection.hide(); + $curSection = $($content[index < 0 ? $content.length - 1 : 0]); + $curSection.show(); + }); + } + + // Just hide all content sections except first. + $content.each(function(index) { + if ($(this).height() > minHeight) minHeight = $(this).height(); + $(this).css({position: 'absolute', display: index > 0 ? 'none' : ''}); + }); + + // Register for changes to window size, and trigger. + $(window).resize(resizeWidget); + resizeWidget(); + + function resizeWidget() { + var height = $(window).height() - topOffset - padBottom; + $widget.width($(window).width()); + $widget.height(height < minHeight ? minHeight : + (maxHeight && height > maxHeight ? maxHeight : height)); + } + } +})(); + + + + + +/* + Tab Carousel + + The following allows tab widgets to be installed via the html below. Each + tab content section should have a data-tab attribute matching one of the + nav items'. Also each tab content section should have a width matching the + tab carousel. + + HTML: + + <div class="tab-carousel"> + <ul class="tab-nav"> + <li><a href="#" data-tab="handsets">Handsets</a> + <li><a href="#" data-tab="wearable">Wearable</a> + <li><a href="#" data-tab="tv">TV</a> + </ul> + + <div class="tab-carousel-content"> + <div data-tab="handsets"> + <!--Full width content here--> + </div> + + <div data-tab="wearable"> + <!--Full width content here--> + </div> + + <div data-tab="tv"> + <!--Full width content here--> + </div> + </div> + </div> + +*/ +(function() { + $(document).ready(function() { + $('.tab-carousel').each(function() { + initWidget(this); + }); + }); + + function initWidget(widget) { + var $widget = $(widget); + var $nav = $widget.find('.tab-nav'); + var $anchors = $nav.find('[data-tab]'); + var $li = $nav.find('li'); + var $contentContainer = $widget.find('.tab-carousel-content'); + var $tabs = $contentContainer.find('[data-tab]'); + var $curTab = $($tabs[0]); // Current tab is first tab. + var width = $widget.width(); + + // Setup nav interactivity. + $anchors.click(function(evt) { + evt.preventDefault(); + var query = '[data-tab=' + $(this).data('tab') + ']'; + transitionWidget($tabs.filter(query)); + }); + + // Add highlight for navigation on first item. + var $highlight = $('<div>').addClass('highlight') + .css({left:$li.position().left + 'px', width:$li.outerWidth() + 'px'}) + .appendTo($nav); + + // Store height since we will change contents to absolute. + $contentContainer.height($contentContainer.height()); + + // Absolutely position tabs so they're ready for transition. + $tabs.each(function(index) { + $(this).css({position: 'absolute', left: index > 0 ? width + 'px' : '0'}); + }); + + function transitionWidget($toTab) { + if (!$curTab.is($toTab)) { + var curIndex = $tabs.index($curTab[0]); + var toIndex = $tabs.index($toTab[0]); + var dir = toIndex > curIndex ? 1 : -1; + + // Animate content sections. + $toTab.css({left:(width * dir) + 'px'}); + $curTab.animate({left:(width * -dir) + 'px'}); + $toTab.animate({left:'0'}); + + // Animate navigation highlight. + $highlight.animate({left:$($li[toIndex]).position().left + 'px', + width:$($li[toIndex]).outerWidth() + 'px'}) + + // Store new current section. + $curTab = $toTab; + } + } + } +})();
\ No newline at end of file diff --git a/tools/droiddoc/templates-sdk/components/masthead.cs b/tools/droiddoc/templates-sdk/components/masthead.cs index 47639bb..55aaeb9 100644 --- a/tools/droiddoc/templates-sdk/components/masthead.cs +++ b/tools/droiddoc/templates-sdk/components/masthead.cs @@ -1,226 +1,159 @@ <?cs def:custom_masthead() ?> +<?cs if:preview ?> + <?cs call:preview_masthead() ?> +<?cs else ?> <a name="top"></a> -<?cs if:!devsite ?><?cs # leave out the global header for devsite; it's in devsite template ?> - <!-- Header --> +<?cs if:!devsite ?><?cs # leave out the global header for devsite; it is in devsite template ?> + <!-- Header --> + <div id="header-wrapper"> <div id="header"> - <div class="wrap" id="header-wrap"> - <div class="col-3 logo"> + <div class="wrap" id="header-wrap"> + <div class="col-3 logo"> <a href="<?cs var:toroot ?>index.html"> - <img src="<?cs var:toroot ?>assets/images/dac_logo.png" width="123" height="25" alt="Android Developers" /> + <img src="<?cs var:toroot ?>assets/images/dac_logo.png" + srcset="<?cs var:toroot ?>assets/images/dac_logo@2x.png 2x" + width="123" height="25" alt="Android Developers" /> </a> <div class="btn-quicknav" id="btn-quicknav"> - <a href="#" class="arrow-inactive">Quicknav</a> - <a href="#" class="arrow-active">Quicknav</a> + <a href="#" class="arrow-inactive">Quicknav</a> + <a href="#" class="arrow-active">Quicknav</a> </div> - </div> - <ul class="nav-x col-9"> - <li class="design"> - <a href="<?cs var:toroot ?>design/index.html" - zh-tw-lang="設計" - zh-cn-lang="设计" - ru-lang="Проектирование" - ko-lang="디자인" - ja-lang="設計" - es-lang="Diseñar" - >Design</a></li> - <li class="develop"><a href="<?cs var:toroot ?>develop/index.html" - zh-tw-lang="開發" - zh-cn-lang="开发" - ru-lang="Разработка" - ko-lang="개발" - ja-lang="開発" - es-lang="Desarrollar" - >Develop</a></li> - <li class="distribute last"><a href="<?cs var:toroot ?>distribute/index.html" - zh-tw-lang="發佈" - zh-cn-lang="分发" - ru-lang="Распространение" - ko-lang="배포" - ja-lang="配布" - es-lang="Distribuir" - >Distribute</a></li> - </ul> - - <!-- New Search --> - <div class="menu-container"> - <div class="moremenu"> - <div id="more-btn"></div> - </div> - <div class="morehover" id="moremenu"> - <div class="top"></div> - <div class="mid"> - <div class="header">Links</div> - <ul> - <li><a href="https://play.google.com/apps/publish/">Google Play Developer Console</a></li> - <li><a href="http://android-developers.blogspot.com/">Android Developers Blog</a></li> - <li><a href="<?cs var:toroot ?>about/index.html">About Android</a></li> - </ul> - <div class="header">Android Sites</div> - <ul> - <li><a href="http://www.android.com">Android.com</a></li> - <li class="active"><a>Android Developers</a></li> - <li><a href="http://source.android.com">Android Open Source Project</a></li> - </ul> - - <?cs # Include language switcher only in online docs ?> - <?cs if:android.whichdoc == "online" ?> - <div class="header">Language</div> - <div id="language" class="locales"> - <select name="language" onChange="changeLangPref(this.value, true)"> - <option value="en">English</option> - <option value="es">Español</option> - <option value="ja">日本語</option> - <option value="ko">한국어</option> - <option value="ru">Русский</option> - <option value="zh-cn">中文 (中国)</option> - <option value="zh-tw">中文 (台灣)</option> - </select> - </div> - <script type="text/javascript"> - <!-- - loadLangPref(); - //--> - </script> - <?cs /if ?> - <?cs # End of lang switcher ?> + </div> + <ul class="nav-x col-9"> + <li class="design"> + <a href="<?cs var:toroot ?>design/index.html" + zh-tw-lang="設計" + zh-cn-lang="设计" + ru-lang="Проектирование" + ko-lang="디자인" + ja-lang="設計" + es-lang="Diseñar" + >Design</a></li> + <li class="develop"><a href="<?cs var:toroot ?>develop/index.html" + zh-tw-lang="開發" + zh-cn-lang="开发" + ru-lang="Разработка" + ko-lang="개발" + ja-lang="開発" + es-lang="Desarrollar" + >Develop</a></li> + <li class="distribute last"><a href="<?cs var:toroot ?>distribute/<?cs + if:android.whichdoc == "offline" ?>googleplay/<?cs /if ?>index.html" + zh-tw-lang="發佈" + zh-cn-lang="分发" + ru-lang="Распространение" + ko-lang="배포" + ja-lang="配布" + es-lang="Distribuir" + >Distribute</a></li> + </ul> - <br class="clearfix" /> - </div> - <div class="bottom"></div> - </div> - <div class="search" id="search-container"> - <div class="search-inner"> - <div id="search-btn"></div> - <div class="left"></div> - <form onsubmit="return submit_search()"> - <input id="search_autocomplete" type="text" value="" autocomplete="off" name="q" -onfocus="search_focus_changed(this, true)" onblur="search_focus_changed(this, false)" -onkeydown="return search_changed(event, true, '<?cs var:toroot ?>')" -onkeyup="return search_changed(event, false, '<?cs var:toroot ?>')" /> - </form> - <div class="right"></div> - <a class="close hide">close</a> - <div class="left"></div> - <div class="right"></div> - </div> - </div> + <?cs # ADD SEARCH AND MENU ?> + <?cs call:header_search_widget() ?> - <div class="search_filtered_wrapper reference"> - <div class="suggest-card reference no-display"> - <ul class="search_filtered"> - </ul> - </div> - </div> - <div class="search_filtered_wrapper docs"> - <div class="suggest-card dummy no-display"> </div> - <div class="suggest-card develop no-display"> - <ul class="search_filtered"> - </ul> - <div class="child-card guides no-display"> - </div> - <div class="child-card training no-display"> - </div> - <div class="child-card samples no-display"> - </div> - </div> - <div class="suggest-card design no-display"> - <ul class="search_filtered"> - </ul> - </div> - <div class="suggest-card distribute no-display"> - <ul class="search_filtered"> - </ul> - </div> - </div> + <!-- Expanded quicknav --> + <div id="quicknav" class="col-13"> + <ul> + <li class="about"> + <ul> + <li><a href="<?cs var:toroot ?>about/index.html">About</a></li> + <li><a href="<?cs var:toroot ?>wear/index.html">Wear</a></li> + <li><a href="<?cs var:toroot ?>tv/index.html">TV</a></li> + <li><a href="<?cs var:toroot ?>auto/index.html">Auto</a></li> + </ul> + </li> + <li class="design"> + <ul> + <li><a href="<?cs var:toroot ?>design/index.html">Get Started</a></li> + <li><a href="<?cs var:toroot ?>design/style/index.html">Style</a></li> + <li><a href="<?cs var:toroot ?>design/patterns/index.html">Patterns</a></li> + <li><a href="<?cs var:toroot ?>design/building-blocks/index.html">Building Blocks</a></li> + <li><a href="<?cs var:toroot ?>design/downloads/index.html">Downloads</a></li> + <li><a href="<?cs var:toroot ?>design/videos/index.html">Videos</a></li> + </ul> + </li> + <li class="develop"> + <ul> + <li><a href="<?cs var:toroot ?>training/index.html" + zh-tw-lang="訓練課程" + zh-cn-lang="培训" + ru-lang="Курсы" + ko-lang="교육" + ja-lang="トレーニング" + es-lang="Capacitación" + >Training</a></li> + <li><a href="<?cs var:toroot ?>guide/index.html" + zh-tw-lang="API 指南" + zh-cn-lang="API 指南" + ru-lang="Руководства по API" + ko-lang="API 가이드" + ja-lang="API ガイド" + es-lang="Guías de la API" + >API Guides</a></li> + <li><a href="<?cs var:toroot ?>reference/packages.html" + zh-tw-lang="參考資源" + zh-cn-lang="参考" + ru-lang="Справочник" + ko-lang="참조문서" + ja-lang="リファレンス" + es-lang="Referencia" + >Reference</a></li> + <li><a href="<?cs var:toroot ?>sdk/index.html" + zh-tw-lang="相關工具" + zh-cn-lang="工具" + ru-lang="Инструменты" + ko-lang="도구" + ja-lang="ツール" + es-lang="Herramientas" + >Tools</a> + </li> + <li><a href="<?cs var:toroot ?>google/index.html">Google Services</a> + </li> + <?cs if:android.hasSamples ?> + <li><a href="<?cs var:toroot ?>samples/index.html">Samples</a> + </li> + <?cs /if ?> + </ul> + </li> + <li class="distribute last"> + <ul> + <li><a href="<?cs var:toroot ?>distribute/googleplay/index.html">Google Play</a></li> + <li><a href="<?cs var:toroot ?>distribute/essentials/index.html">Essentials</a></li> + <li><a href="<?cs var:toroot ?>distribute/users/index.html">Get Users</a></li> + <li><a href="<?cs var:toroot ?>distribute/engage/index.html">Engage & Retain</a></li> + <li><a href="<?cs var:toroot ?>distribute/monetize/index.html">Monetize</a></li> + <li><a href="<?cs var:toroot ?>distribute/tools/index.html">Tools & Reference</a></li> + <li><a href="<?cs var:toroot ?>distribute/stories/index.html">Developer Stories</a></li> + </ul> + </li> + </ul> + </div><!-- /Expanded quicknav --> + </div><!-- end header-wrap.wrap --> + </div><!-- end header --> - </div> - <!-- /New Search> - - - <!-- Expanded quicknav --> - <div id="quicknav" class="col-9"> - <ul> - <li class="design"> - <ul> - <li><a href="<?cs var:toroot ?>design/index.html">Get Started</a></li> - <li><a href="<?cs var:toroot ?>design/style/index.html">Style</a></li> - <li><a href="<?cs var:toroot ?>design/patterns/index.html">Patterns</a></li> - <li><a href="<?cs var:toroot ?>design/building-blocks/index.html">Building Blocks</a></li> - <li><a href="<?cs var:toroot ?>design/downloads/index.html">Downloads</a></li> - <li><a href="<?cs var:toroot ?>design/videos/index.html">Videos</a></li> - </ul> - </li> - <li class="develop"> - <ul> - <li><a href="<?cs var:toroot ?>training/index.html" - zh-tw-lang="訓練課程" - zh-cn-lang="培训" - ru-lang="Курсы" - ko-lang="교육" - ja-lang="トレーニング" - es-lang="Capacitación" - >Training</a></li> - <li><a href="<?cs var:toroot ?>guide/index.html" - zh-tw-lang="API 指南" - zh-cn-lang="API 指南" - ru-lang="Руководства по API" - ko-lang="API 가이드" - ja-lang="API ガイド" - es-lang="Guías de la API" - >API Guides</a></li> - <li><a href="<?cs var:toroot ?>reference/packages.html" - zh-tw-lang="參考資源" - zh-cn-lang="参考" - ru-lang="Справочник" - ko-lang="참조문서" - ja-lang="リファレンス" - es-lang="Referencia" - >Reference</a></li> - <li><a href="<?cs var:toroot ?>tools/index.html" - zh-tw-lang="相關工具" - zh-cn-lang="工具" - ru-lang="Инструменты" - ko-lang="도구" - ja-lang="ツール" - es-lang="Herramientas" - >Tools</a> - <ul><li><a href="<?cs var:toroot ?>sdk/index.html">Get the SDK</a></li></ul> - </li> - <li><a href="<?cs var:toroot ?>google/index.html">Google Services</a> - </li> - <?cs if:android.hasSamples ?> - <li><a href="<?cs var:toroot ?>samples/index.html">Samples</a> - </li> - <?cs /if ?> - </ul> - </li> - <li class="distribute last"> - <ul> - <li><a href="<?cs var:toroot ?>distribute/index.html">Google Play</a></li> - <li><a href="<?cs var:toroot ?>distribute/googleplay/publish/index.html">Publishing</a></li> - <li><a href="<?cs var:toroot ?>distribute/googleplay/promote/index.html">Promoting</a></li> - <li><a href="<?cs var:toroot ?>distribute/googleplay/quality/index.html">App Quality</a></li> - <li><a href="<?cs var:toroot ?>distribute/googleplay/spotlight/index.html">Spotlight</a></li> - <li><a href="<?cs var:toroot ?>distribute/open.html">Open Distribution</a></li> - </ul> - </li> - </ul> - </div> - <!-- /Expanded quicknav --> + <?cs if:about || wear || tv || auto ?> + <!-- Secondary x-nav --> + <div id="nav-x"> + <div class="wrap"> + <ul class="nav-x col-9 about" style="width:100%"> + <li class="about"><a href="<?cs var:toroot ?>about/index.html" + >About</a></li> + <li class="wear"><a href="<?cs var:toroot ?>wear/index.html" + >Wear</a></li> + <li class="tv"><a href="<?cs var:toroot ?>tv/index.html" + >TV</a></li> + <li class="auto"><a href="<?cs var:toroot ?>auto/index.html" + >Auto</a></li> + </ul> </div> </div> - <!-- /Header --> - - - <div id="searchResults" class="wrap" style="display:none;"> - <h2 id="searchTitle">Results</h2> - <div id="leftSearchControl" class="search-control">Loading...</div> - </div> - - - <?cs if:training || guide || reference || tools || develop || google || samples ?> + <!-- /Sendondary x-nav ABOUT --> + + + + <?cs elif:training || guide || reference || tools || develop || google || samples ?> <!-- Secondary x-nav --> <div id="nav-x"> <div class="wrap"> @@ -231,7 +164,7 @@ onkeyup="return search_changed(event, false, '<?cs var:toroot ?>')" /> ru-lang="Курсы" ko-lang="교육" ja-lang="トレーニング" - es-lang="Capacitación" + es-lang="Capacitación" >Training</a></li> <li class="guide"><a href="<?cs var:toroot ?>guide/index.html" zh-tw-lang="API 指南" @@ -239,7 +172,7 @@ onkeyup="return search_changed(event, false, '<?cs var:toroot ?>')" /> ru-lang="Руководства по API" ko-lang="API 가이드" ja-lang="API ガイド" - es-lang="Guías de la API" + es-lang="Guías de la API" >API Guides</a></li> <li class="reference"><a href="<?cs var:toroot ?>reference/packages.html" zh-tw-lang="參考資源" @@ -247,9 +180,9 @@ onkeyup="return search_changed(event, false, '<?cs var:toroot ?>')" /> ru-lang="Справочник" ko-lang="참조문서" ja-lang="リファレンス" - es-lang="Referencia" + es-lang="Referencia" >Reference</a></li> - <li class="tools"><a href="<?cs var:toroot ?>tools/index.html" + <li class="tools"><a href="<?cs var:toroot ?>sdk/index.html" zh-tw-lang="相關工具" zh-cn-lang="工具" ru-lang="Инструменты" @@ -267,13 +200,101 @@ onkeyup="return search_changed(event, false, '<?cs var:toroot ?>')" /> <?cs /if ?> </ul> </div> - </div> - <!-- /Sendondary x-nav --> + <!-- /Sendondary x-nav DEVELOP --> + + <?cs elif:distribute || googleplay || essentials || users || engage || monetize || disttools || stories ?> + <!-- Secondary distribute x-nav --> + <div id="nav-x"> + <div class="wrap"> + <ul class="nav-x distribute"> + <li class="googleplay"><a href="<?cs var:toroot ?>distribute/googleplay/index.html" + >Google Play</a></li> + <li class="essentials"><a href="<?cs var:toroot ?>distribute/essentials/index.html" + >Essentials</a></li> + <li class="users"><a href="<?cs var:toroot ?>distribute/users/index.html" + >Get Users</a></li> + <li class="engage"><a href="<?cs var:toroot ?>distribute/engage/index.html" + >Engage & Retain</a></li> + <li class="monetize"><a href="<?cs var:toroot ?>distribute/monetize/index.html" + >Monetize</a> + </li> + <li class="disttools"><a href="<?cs var:toroot ?>distribute/tools/index.html" + >Tools</a> + </li> + <li class="stories"><a href="<?cs var:toroot ?>distribute/stories/index.html" + >Stories</a> + </li> + </ul> + <a href="https://play.google.com/apps/publish/" class="developer-console-btn">Developer Console</a> + </div> <!-- /Secondary distribute x-nav --> + </div> + <!-- /Sendondary x-nav DISTRIBUTE --> <?cs /if ?> -<?cs /if ?> -<?cs # end if/else !devsite ?> + <div id="searchResults" class="wrap" style="display:none;"> + <h2 id="searchTitle">Results</h2> + <div id="leftSearchControl" class="search-control">Loading...</div> + </div> + </div> <!--end header-wrapper --> + + <div id="sticky-header"> + <div> + <a class="logo" href="#top"></a> + <a class="top" href="#top"></a> + <ul class="breadcrumb"> + <?cs # More <li> elements added here with javascript ?> + <?cs if:!section.landing ?><li class="current"><?cs var:page.title ?></li><?cs + /if ?> + </ul> + </div> + </div> - <?cs +<?cs /if ?><?cs # end if/else !devsite ?> +<?cs /if ?><?cs # end if/else preview ?><?cs /def ?> + +<?cs def:preview_masthead() ?> +<a name="top"></a> + + +<!-- Header --> +<div id="header-wrapper"> + <div id="header"> + <div class="wrap" id="header-wrap"> + <div class="col_3 logo landing-logo" style="width:240px"> + <a href="<?cs var:toroot ?>index.html"> + <img src="<?cs var:toroot ?>preview/images/android.png" + style="margin-top:8px" height="16" alt="L Developer Preview" /> + </a> + </div> + <div class="col-8" style="margin:0"><h1 style="margin: 8px 0 0 0px;padding:0;line-height:16px; +color:#666;font-weight:100;font-size:24px;">L Developer Preview</h1></div> + + <?cs # ADD SEARCH AND MENU ?> + <?cs call:header_search_widget() ?> + + </div><!-- end header-wrap --> + </div><!-- /Header --> + + + <div id="searchResults" class="wrap" style="display:none;"> + <h2 id="searchTitle">Results</h2> + <div id="leftSearchControl" class="search-control">Loading...</div> + </div> +</div> <!--end header-wrapper --> + +<div id="sticky-header"> + <div> + <a class="logo" href="#top"></a> + <a class="top" href="#top"></a> + <ul class="breadcrumb"> + <?cs # More <li> elements added here with javascript ?> + <?cs if:!section.landing ?><li class="current"><?cs var:page.title ?></li><?cs + /if ?> + </ul> + </div> +</div> + + <?cs +/def ?>
\ No newline at end of file diff --git a/tools/droiddoc/templates-sdk/customizations.cs b/tools/droiddoc/templates-sdk/customizations.cs index ed57f1c..79cdd89 100644 --- a/tools/droiddoc/templates-sdk/customizations.cs +++ b/tools/droiddoc/templates-sdk/customizations.cs @@ -7,7 +7,6 @@ def:sdk_nav() ?> <div class="wrap clearfix" id="body-content"> <div class="col-4" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> <div id="devdoc-nav" class="scroll-pane"> -<a class="totop" href="#top" data-g-event="left-nav-top">to top</a> <?cs include:"../../../../frameworks/base/docs/html/sdk/sdk_toc.cs" ?> @@ -15,19 +14,53 @@ def:sdk_nav() ?> </div> </div> <!-- end side-nav --> -<?cs /def ?> +<?cs /def ?><?cs + +def:no_nav() ?> + <div class="wrap clearfix" id="body-content"> +<?cs /def ?><?cs + +def:tools_nav() ?> + <div class="wrap clearfix" id="body-content"> + <div class="col-3" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> + <div id="devdoc-nav" class="scroll-pane"> <?cs -def:resources_tab_nav() ?> + include:"../../../../frameworks/base/docs/html/tools/tools_toc.cs" ?> + + + </div> + </div> <!-- end side-nav --> + <script> + $(document).ready(function() { + scrollIntoView("devdoc-nav"); + }); + </script> +<?cs /def ?> +<?cs +def:training_nav() ?> <div class="wrap clearfix" id="body-content"> - <a <div class="col-4" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> <div id="devdoc-nav" class="scroll-pane"> -<a class="totop" href="#top" data-g-event="left-nav-top">to top</a> + <?cs - include:"../../../../frameworks/base/docs/html/resources/resources_toc.cs" ?> + include:"../../../../frameworks/base/docs/html/training/training_toc.cs" ?> + + </div> + </div> <!-- end side-nav --> + <script> + $(document).ready(function() { + scrollIntoView("devdoc-nav"); + }); + </script> +<?cs /def ?><?cs +def:googleplay_nav() ?> + <div class="wrap clearfix" id="body-content"> + <div class="col-3" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> + <div id="devdoc-nav" class="scroll-pane"> +<?cs include:"../../../../frameworks/base/docs/html/distribute/googleplay/googleplay_toc.cs" ?> </div> </div> <!-- end side-nav --> <script> @@ -35,17 +68,13 @@ def:resources_tab_nav() ?> scrollIntoView("devdoc-nav"); }); </script> -<?cs /def ?> -<?cs -def:tools_nav() ?> +<?cs /def ?><?cs + +def:essentials_nav() ?> <div class="wrap clearfix" id="body-content"> <div class="col-3" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> <div id="devdoc-nav" class="scroll-pane"> -<a class="totop" href="#top" data-g-event="left-nav-top">to top</a> -<?cs - include:"../../../../frameworks/base/docs/html/tools/tools_toc.cs" ?> - - +<?cs include:"../../../../frameworks/base/docs/html/distribute/essentials/essentials_toc.cs" ?> </div> </div> <!-- end side-nav --> <script> @@ -53,19 +82,55 @@ def:tools_nav() ?> scrollIntoView("devdoc-nav"); }); </script> -<?cs /def ?> -<?cs -def:training_nav() ?> +<?cs /def ?><?cs + +def:users_nav() ?> <div class="wrap clearfix" id="body-content"> - <div class="col-4" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> + <div class="col-3" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> <div id="devdoc-nav" class="scroll-pane"> -<a class="totop" href="#top" data-g-event="left-nav-top">to top</a> +<?cs include:"../../../../frameworks/base/docs/html/distribute/users/users_toc.cs" ?> + </div> + </div> <!-- end side-nav --> + <script> + $(document).ready(function() { + scrollIntoView("devdoc-nav"); + }); + </script> +<?cs /def ?><?cs +def:engage_nav() ?> + <div class="wrap clearfix" id="body-content"> + <div class="col-3" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> + <div id="devdoc-nav" class="scroll-pane"> +<?cs include:"../../../../frameworks/base/docs/html/distribute/engage/engage_toc.cs" ?> + </div> + </div> <!-- end side-nav --> + <script> + $(document).ready(function() { + scrollIntoView("devdoc-nav"); + }); + </script> +<?cs /def ?><?cs -<?cs - include:"../../../../frameworks/base/docs/html/training/training_toc.cs" ?> - +def:monetize_nav() ?> + <div class="wrap clearfix" id="body-content"> + <div class="col-3" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> + <div id="devdoc-nav" class="scroll-pane"> +<?cs include:"../../../../frameworks/base/docs/html/distribute/monetize/monetize_toc.cs" ?> + </div> + </div> <!-- end side-nav --> + <script> + $(document).ready(function() { + scrollIntoView("devdoc-nav"); + }); + </script> +<?cs /def ?><?cs +def:disttools_nav() ?> + <div class="wrap clearfix" id="body-content"> + <div class="col-3" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> + <div id="devdoc-nav" class="scroll-pane"> +<?cs include:"../../../../frameworks/base/docs/html/distribute/tools/disttools_toc.cs" ?> </div> </div> <!-- end side-nav --> <script> @@ -73,14 +138,26 @@ def:training_nav() ?> scrollIntoView("devdoc-nav"); }); </script> -<?cs /def ?> -<?cs +<?cs /def ?><?cs + +def:stories_nav() ?> + <div class="wrap clearfix" id="body-content"> + <div class="col-3" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> + <div id="devdoc-nav" class="scroll-pane"> +<?cs include:"../../../../frameworks/base/docs/html/distribute/stories/stories_toc.cs" ?> + </div> + </div> <!-- end side-nav --> + <script> + $(document).ready(function() { + scrollIntoView("devdoc-nav"); + }); + </script> +<?cs /def ?><?cs + def:guide_nav() ?> <div class="wrap clearfix" id="body-content"> <div class="col-4" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> <div id="devdoc-nav" class="scroll-pane"> -<a class="totop" href="#top" data-g-event="left-nav-top">to top</a> - <?cs include:"../../../../frameworks/base/docs/html/guide/guide_toc.cs" ?> @@ -99,7 +176,6 @@ def:design_nav() ?> <div class="wrap clearfix" id="body-content"> <div class="col-3" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> <div id="devdoc-nav" class="scroll-pane"> -<a class="totop" href="#top" data-g-event="left-nav-top">to top</a> <?cs @@ -119,7 +195,6 @@ def:distribute_nav() ?> <div class="wrap clearfix" id="body-content"> <div class="col-3" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> <div id="devdoc-nav" class="scroll-pane"> -<a class="totop" href="#top" data-g-event="left-nav-top">to top</a> <?cs include:"../../../../frameworks/base/docs/html/distribute/distribute_toc.cs" ?> @@ -139,7 +214,6 @@ def:samples_nav() ?> <div class="wrap clearfix" id="body-content"> <div class="col-4" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> <div id="devdoc-nav" class="scroll-pane"> -<a class="totop" href="#top" data-g-event="left-nav-top">to top</a> <?cs include:"../../../../frameworks/base/docs/html/samples/samples_toc.cs" ?> @@ -159,7 +233,6 @@ def:google_nav() ?> <div class="wrap clearfix" id="body-content"> <div class="col-4" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> <div id="devdoc-nav" class="scroll-pane"> -<a class="totop" href="#top" data-g-event="left-nav-top">to top</a> <?cs include:"../../../../frameworks/base/docs/html/google/google_toc.cs" ?> @@ -183,7 +256,6 @@ def:about_nav() ?> <div class="wrap clearfix" id="body-content"> <div class="col-3" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> <div id="devdoc-nav" class="scroll-pane"> -<a class="totop" href="#top" data-g-event="left-nav-top">to top</a> <?cs include:"../../../../frameworks/base/docs/html/about/about_toc.cs" ?> @@ -198,6 +270,42 @@ def:about_nav() ?> </script> <?cs /def ?> + +<?cs +def:wear_nav() ?> + <div class="wrap clearfix" id="body-content"> + <div class="col-4" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> + <div id="devdoc-nav" class="scroll-pane"> + +<?cs + include:"../../../../frameworks/base/docs/html/wear/wear_toc.cs" ?> + + + </div> + </div> <!-- end side-nav --> + <script> + $(document).ready(function() { + scrollIntoView("devdoc-nav"); + }); + </script> +<?cs /def ?> + +<?cs +def:preview_nav() ?> + <div class="wrap clearfix" id="body-content"> + <div class="col-4" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> + <div id="devdoc-nav" class="scroll-pane"> + <?cs + include:"../../../../frameworks/base/docs/html/preview/preview_toc.cs" ?> + </div> + </div> <!-- end side-nav --> + <script> + $(document).ready(function() { + scrollIntoView("devdoc-nav"); + }); + </script> +<?cs /def ?> + <?cs # The default side navigation for the reference docs ?><?cs def:default_left_nav() ?> <?cs if:reference.gcm || reference.gms ?> @@ -206,8 +314,6 @@ def:default_left_nav() ?> <div class="wrap clearfix" id="body-content"> <div class="col-4" id="side-nav" itemscope itemtype="http://schema.org/SiteNavigationElement"> <div id="devdoc-nav"> - -<a class="totop" href="#top" data-g-event="left-nav-top">to top</a> <div id="api-nav-header"> <div id="api-level-toggle"> <label for="apiLevelCheckbox" class="disabled" @@ -308,10 +414,111 @@ def:default_left_nav() ?> <?cs /def ?> + +<?cs +def:header_search_widget() ?> +<div class="menu-container"> + <div class="moremenu"> + <div id="more-btn"></div> + </div> + <div class="morehover" id="moremenu"> + <div class="top"></div> + <div class="mid"> + <div class="header">Links</div> + <ul> + <li><a href="https://play.google.com/apps/publish/" target="_googleplay">Google Play Developer Console</a></li> + <li><a href="http://android-developers.blogspot.com/">Android Developers Blog</a></li> + <li><a href="<?cs var:toroot ?>about/index.html">About Android</a></li> + </ul> + <div class="header">Android Sites</div> + <ul> + <li><a href="http://www.android.com">Android.com</a></li> + <li class="active"><a>Android Developers</a></li> + <li><a href="http://source.android.com">Android Open Source Project</a></li> + </ul> + + <?cs # Include language switcher only in online docs ?> + <?cs if:android.whichdoc == "online" ?> + <div class="header">Language</div> + <div id="language" class="locales"> + <select name="language" onChange="changeLangPref(this.value, true)"> + <option value="en">English</option> + <option value="es">Español</option> + <option value="ja">日本語</option> + <option value="ko">한국어</option> + <option value="ru">Русский</option> + <option value="zh-cn">中文 (中国)</option> + <option value="zh-tw">中文 (台灣)</option> + </select> + </div> + <script type="text/javascript"> + <!-- + loadLangPref(); + //--> + </script> + <?cs /if ?> + <?cs # End of lang switcher ?> + <br class="clearfix" /> + </div><!-- end 'mid' --> + <div class="bottom"></div> + </div><!-- end 'moremenu' --> + + <div class="search" id="search-container"> + <div class="search-inner"> + <div id="search-btn"></div> + <div class="left"></div> + <form onsubmit="return submit_search()"> + <input id="search_autocomplete" type="text" value="" autocomplete="off" name="q" + onfocus="search_focus_changed(this, true)" onblur="search_focus_changed(this, false)" + onkeydown="return search_changed(event, true, '<?cs var:toroot ?>')" + onkeyup="return search_changed(event, false, '<?cs var:toroot ?>')" /> + </form> + <div class="right"></div> + <a class="close hide">close</a> + <div class="left"></div> + <div class="right"></div> + </div><!-- end search-inner --> + </div><!-- end search-container --> + + <div class="search_filtered_wrapper reference"> + <div class="suggest-card reference no-display"> + <ul class="search_filtered"> + </ul> + </div> + </div> + + <div class="search_filtered_wrapper docs"> + <div class="suggest-card dummy no-display"> </div> + <div class="suggest-card develop no-display"> + <ul class="search_filtered"> + </ul> + <div class="child-card guides no-display"> + </div> + <div class="child-card training no-display"> + </div> + <div class="child-card samples no-display"> + </div> + </div> + <div class="suggest-card design no-display"> + <ul class="search_filtered"> + </ul> + </div> + <div class="suggest-card distribute no-display"> + <ul class="search_filtered"> + </ul> + </div> + </div> +</div><!-- end menu-container (search and menu widget) --> +<?cs /def ?> + + + <?cs def:custom_left_nav() ?><?cs - if:fullpage ?><?cs - call:fullpage() ?><?cs + if:fullpage ?><?cs + call:fullpage() ?><?cs + elif:nonavpage ?><?cs + call:no_nav() ?><?cs elif:guide ?><?cs call:guide_nav() ?><?cs elif:design ?><?cs @@ -324,15 +531,33 @@ def:custom_left_nav() ?><?cs call:google_nav() ?><?cs elif:samples ?><?cs call:samples_nav() ?><?cs - elif:more ?><?cs - call:dist_more_nav() ?><?cs elif:distribute ?><?cs - call:distribute_nav() ?><?cs - elif:about ?><?cs - call:about_nav() ?><?cs - else ?><?cs - call:default_left_nav() ?> <?cs - /if ?><?cs + if:googleplay ?><?cs + call:googleplay_nav() ?><?cs + elif:essentials ?><?cs + call:essentials_nav() ?><?cs + elif:users ?><?cs + call:users_nav() ?><?cs + elif:engage ?><?cs + call:engage_nav() ?><?cs + elif:monetize ?><?cs + call:monetize_nav() ?><?cs + elif:disttools ?><?cs + call:disttools_nav() ?><?cs + elif:stories ?><?cs + call:stories_nav() ?><?cs + /if ?><?cs + elif:about ?><?cs + call:about_nav() ?><?cs + elif:distribute ?><?cs + call:distribute_nav() ?><?cs + elif:wear ?><?cs + call:wear_nav() ?><?cs + elif:preview ?><?cs + call:preview_nav() ?><?cs + else ?><?cs + call:default_left_nav() ?> <?cs + /if ?><?cs /def ?> <?cs # appears at the bottom of every page ?><?cs diff --git a/tools/droiddoc/templates-sdk/docpage.cs b/tools/droiddoc/templates-sdk/docpage.cs index ea462c9..97ad8f1 100644 --- a/tools/droiddoc/templates-sdk/docpage.cs +++ b/tools/droiddoc/templates-sdk/docpage.cs @@ -2,19 +2,36 @@ <?cs include:"macros.cs" ?> <html<?cs if:devsite ?> devsite<?cs /if ?>> <?cs include:"head_tag.cs" ?> -<body class="gc-documentation <?cs if:(google || reference.gms || reference.gcm) ?>google<?cs /if ?> - <?cs if:(guide||develop||training||reference||tools||sdk||samples) ?>develop<?cs if:guide ?> guide<?cs /if ?><?cs if:samples ?> samples<?cs /if ?><?cs - elif:about ?>about<?cs +<body class="gc-documentation + +<?cs +if:(google || reference.gms || reference.gcm) ?>google<?cs /if ?><?cs + if:(guide||develop||training||reference||tools||sdk||samples) ?>develop<?cs + if:guide ?> guide<?cs /if ?><?cs + if:samples ?> samples<?cs /if ?><?cs + elif:(distribute||googleplay||essentials||users||engage||monetize||disttools||stories) + ?>distribute<?cs + if:googleplay ?> googleplay<?cs /if ?><?cs + if:essentials ?> essentials<?cs /if ?><?cs + if:users ?> users<?cs /if ?><?cs + if:engage ?> engage<?cs /if ?><?cs + if:monetize ?> monetize<?cs /if ?><?cs + if:disttools ?> disttools<?cs /if ?><?cs + if:stories ?> stories<?cs /if ?><?cs + elif:(about||wear||tv||auto) ?>about<?cs elif:design ?>design<?cs - elif:distribute ?>distribute<?cs - /if ?><?cs - if:page.trainingcourse ?> trainingcourse<?cs /if ?>" itemscope itemtype="http://schema.org/Article"> -<?cs include:"header.cs" ?> +/if ?><?cs +if:page.trainingcourse ?> trainingcourse<?cs +/if ?>" itemscope itemtype="http://schema.org/Article"><?cs +include:"header.cs" ?> -<div <?cs if:fullpage -?>class="fullpage"<?cs elif:design||tools||about||sdk||distribute -?>class="col-13" id="doc-col"<?cs else -?>class="col-12" id="doc-col"<?cs /if ?> > +<div <?cs + if:fullpage + ?>class="fullpage"<?cs + elif:(design||tools||about||sdk||googleplay||essentials||users||monetize||disttools) && !nonavpage + ?>class="col-13" id="doc-col"<?cs + elif:!nonavpage + ?>class="col-12" id="doc-col"<?cs /if ?> > <?cs if:(design||training||walkthru) && !page.trainingcourse && !page.article ?><?cs # header logic for docs that provide previous/next buttons ?> <?cs if:header.hide ?> @@ -73,7 +90,8 @@ </div> <?cs /if ?><?cs # end if training ?> </div> - <?cs /if ?> + <?cs /if ?><?cs # end if header.hide ?> + <?cs elif:samplesProjectIndex ?> <div id="api-info-block"> <div class="sum-details-links"> @@ -83,7 +101,17 @@ </div><!-- end sum-details-links --> </div><!-- end breadcurmb block --> <h1 itemprop="name"><?cs var:projectDir ?></h1> + <?cs else ?> + <?cs if:training ?> +<?cs # horrible horrible hack to move TOC up when the next/prev links are not there ?> +<style> + #tb-wrapper { + margin-top:6px; + } +</style> + <?cs /if ?> + <?cs if:(!fullpage && !header.hide) ?> <?cs if:page.landing ?><?cs # header logic for docs that are landing pages ?> <div class="landing-banner"> @@ -182,17 +210,12 @@ </div><!-- end doc-content --> <?cs include:"trailer.cs" ?> + <script src="https://developer.android.com/ytblogger_lists_unified.js" type="text/javascript"></script> + <script src="<?cs var:toroot ?>jd_lists_unified.js" type="text/javascript"></script> + <script src="<?cs var:toroot ?>jd_extras.js" type="text/javascript"></script> + <script src="<?cs var:toroot ?>jd_collections.js" type="text/javascript"></script> + <script src="<?cs var:toroot ?>jd_tag_helpers.js" type="text/javascript"></script> -<!-- Start of Tag --> -<script type="text/javascript"> -var axel = Math.random() + ""; -var a = axel * 10000000000000; -document.write('<iframe src="https://2507573.fls.doubleclick.net/activityi;src=2507573;type=other026;cat=googl348;ord=' + a + '?" width="1" height="1" frameborder="0" style="display:none"></iframe>'); -</script> -<noscript> -<iframe src="https://2507573.fls.doubleclick.net/activityi;src=2507573;type=other026;cat=googl348;ord=1?" width="1" height="1" frameborder="0" style="display:none"></iframe> -</noscript> -<!-- End of Tag --> </body> </html> diff --git a/tools/droiddoc/templates-sdk/head_tag.cs b/tools/droiddoc/templates-sdk/head_tag.cs index 54de169..d8d3f49 100644 --- a/tools/droiddoc/templates-sdk/head_tag.cs +++ b/tools/droiddoc/templates-sdk/head_tag.cs @@ -15,13 +15,13 @@ ?><?cs # END if/else devsite ?> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> -<meta name="viewport" content="width=device-width" /> +<meta name="viewport" content="width=<?cs + if:page.viewport_width ?><?cs + var:page.viewport_width ?><?cs + else ?>device-width<?cs /if ?>" /> <?cs if:page.metaDescription ?> <meta name="Description" content="<?cs var:page.metaDescription ?>"><?cs - /if ?><?cs - if:page.customHeadTag ?> -<?cs var:page.customHeadTag ?><?cs /if ?> <link rel="shortcut icon" type="image/x-icon" href="<?cs var:toroot ?>favicon.ico" /> <title><?cs @@ -31,10 +31,16 @@ <!-- STYLESHEETS --> <link rel="stylesheet" -href="<?cs if:android.whichdoc != 'online' ?>http:<?cs /if ?>//fonts.googleapis.com/css?family=Roboto:regular,medium,thin,italic,mediumitalic,bold" title="roboto"> +href="<?cs +if:android.whichdoc != 'online' ?>http:<?cs +/if ?>//fonts.googleapis.com/css?family=Roboto+Condensed"> +<link rel="stylesheet" href="<?cs +if:android.whichdoc != 'online' ?>http:<?cs +/if ?>//fonts.googleapis.com/css?family=Roboto:light,regular,medium,thin,italic,mediumitalic,bold" + title="roboto"> <link href="<?cs var:toroot ?>assets/css/default.css" rel="stylesheet" type="text/css"> -<?cs if:reference && !(reference.gms || reference.gcm) ?> +<?cs if:reference && !(reference.gms || reference.gcm || preview) ?> <!-- FULLSCREEN STYLESHEET --> <link href="<?cs var:toroot ?>assets/css/fullscreen.css" rel="stylesheet" class="fullscreen" type="text/css"> @@ -47,7 +53,10 @@ if:devsite ?><script src="<?cs var:toroot ?>_static/js/android_3p-bundle.js" type="text/javascript"></script><?cs else ?><script src="<?cs var:toroot ?>assets/js/android_3p-bundle.js" type="text/javascript"></script><?cs -/if ?> +/if ?><?cs + if:page.customHeadTag ?> +<?cs var:page.customHeadTag ?><?cs + /if ?> <script type="text/javascript"> var toRoot = "<?cs var:toroot ?>"; var metaTags = [<?cs var:meta.tags ?>]; @@ -55,15 +64,16 @@ else </script> <script src="<?cs var:toroot ?>assets/js/docs.js" type="text/javascript"></script> -<script type="text/javascript"> - var _gaq = _gaq || []; - _gaq.push(['_setAccount', 'UA-5831155-1']); - _gaq.push(['_trackPageview']); +<script> + (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ + (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), + m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) + })(window,document,'script','//www.google-analytics.com/analytics.js','ga'); - (function() { - var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; - ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; - var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); - })(); + ga('create', 'UA-5831155-1', 'android.com'); + ga('create', 'UA-49880327-2', 'android.com', {'name': 'universal'}); // New tracker); + ga('send', 'pageview'); + ga('universal.send', 'pageview'); // Send page view for new tracker. </script> -</head>
\ No newline at end of file + +</head> diff --git a/tools/droiddoc/templates-sdk/sdkpage.cs b/tools/droiddoc/templates-sdk/sdkpage.cs index 95f6596..7652faf 100644 --- a/tools/droiddoc/templates-sdk/sdkpage.cs +++ b/tools/droiddoc/templates-sdk/sdkpage.cs @@ -280,7 +280,7 @@ <h4><a href='' class="expandable" onclick="toggleExpandable(this,'.pax');hideExpandable('.myide,.reqs');return false;" - >DOWNLOAD FOR OTHER PLATFORMS</a></h4> + >VIEW ALL DOWNLOADS AND SIZES</a></h4> <div class="pax col-13 online" style="display:none;margin:0;"> @@ -430,12 +430,12 @@ var:sdk.linux_download /* set up primary adt download button */ $('#download-bundle-button').show(); - $('#download-bundle-button').append("Download the SDK <br/><span class='small'>ADT Bundle for " + os + "</span>"); + $('#download-bundle-button').append("Download Eclipse ADT <br/><span class='small'>with the Android SDK for " + os + "</span>"); $('#download-bundle-button').click(function() {return onDownload(this,true,true);}).attr('href', bundlename); /* set up sdk tools only button */ $('#download-tools-button').show(); - $('#download-tools-button').append("Download the SDK Tools for " + os); + $('#download-tools-button').append("Download the stand-alone Android SDK Tools for " + os); $('#download-tools-button').click(function() {return onDownload(this,true);}).attr('href', $toolslink.attr('href')); } else { $('.pax').show(); @@ -501,9 +501,18 @@ var:sdk.linux_download function onDownloadForRealz(link) { if ($("input#agree").is(':checked') && $("#bitpicker input:checked").length) { $("div.sdk-terms").slideUp(); - $("#sdk-terms-form,.sdk-terms-intro").fadeOut('slow'); - $("#next-steps").fadeIn('slow'); - $("h1#tos-header").text('Get Ready to Code!'); + $("h1#tos-header").text('Now redirecting to the install instructions...'); + $("#sdk-terms-form,.sdk-terms-intro").fadeOut('slow', function() { + setTimeout(function() { + if ($("#downloadForRealz").attr('bundle') == 'true') { + // User downloaded the ADT Bundle + window.location = "/sdk/installing/index.html?pkg=adt"; + } else { + // User downloaded the SDK Tools + window.location = "/sdk/installing/index.html?pkg=tools"; + } + }, 500); + }); _gaq.push(['_trackEvent', 'SDK', 'ADT and Tools', $("#downloadForRealz").html()]); return true; } else { diff --git a/tools/releasetools/common.py b/tools/releasetools/common.py index f179717..d27be6f 100644 --- a/tools/releasetools/common.py +++ b/tools/releasetools/common.py @@ -342,9 +342,12 @@ def GetBootableImage(name, prebuilt_name, unpack_dir, tree_subdir, else: print "building image from target_files %s..." % (tree_subdir,) fs_config = "META/" + tree_subdir.lower() + "_filesystem_config.txt" - return File(name, BuildBootableImage(os.path.join(unpack_dir, tree_subdir), - os.path.join(unpack_dir, fs_config), - info_dict)) + data = BuildBootableImage(os.path.join(unpack_dir, tree_subdir), + os.path.join(unpack_dir, fs_config), + info_dict) + if data: + return File(name, data) + return None def UnzipTemp(filename, pattern=None): @@ -485,6 +488,8 @@ def CheckSize(data, target, info_dict): if target.endswith(".img"): target = target[:-4] mount_point = "/" + target + fs_type = None + limit = None if info_dict["fstab"]: if mount_point == "/userdata": mount_point = "/data" p = info_dict["fstab"][mount_point] diff --git a/tools/releasetools/img_from_target_files b/tools/releasetools/img_from_target_files index e894c42..d23d465 100755 --- a/tools/releasetools/img_from_target_files +++ b/tools/releasetools/img_from_target_files @@ -239,11 +239,14 @@ def main(argv): output_zip = zipfile.ZipFile(args[1], "w", compression=zipfile.ZIP_DEFLATED) - common.GetBootableImage( - "boot.img", "boot.img", OPTIONS.input_tmp, "BOOT").AddToZip(output_zip) - common.GetBootableImage( - "recovery.img", "recovery.img", OPTIONS.input_tmp, - "RECOVERY").AddToZip(output_zip) + boot_image = common.GetBootableImage( + "boot.img", "boot.img", OPTIONS.input_tmp, "BOOT") + if boot_image: + boot_image.AddToZip(output_zip) + recovery_image = common.GetBootableImage( + "recovery.img", "recovery.img", OPTIONS.input_tmp, "RECOVERY") + if recovery_image: + recovery_image.AddToZip(output_zip) if not bootable_only: AddSystem(output_zip) |
