breakpoint.module

You are here

Manage breakpoints and breakpoint groups for responsive designs.

Functions

Namesort descending Description
breakpoint_group_select_options Load all breakpoint groups as select options.
breakpoint_help Implements hook_help().
breakpoint_load Load one breakpoint by its identifier.
breakpoint_select_options Load all breakpoints as select options.

File

core/modules/breakpoint/breakpoint.module
View source
  1. <?php
  2. /**
  3. * @file
  4. * Manage breakpoints and breakpoint groups for responsive designs.
  5. */
  6. use Drupal\breakpoint\Entity\Breakpoint;
  7. use Drupal\breakpoint\Entity\BreakpointGroup;
  8. use Drupal\Core\Config\Entity\ConfigEntityStorage;
  9. /**
  10. * Implements hook_help().
  11. */
  12. function breakpoint_help($path, $arg) {
  13. switch ($path) {
  14. case 'admin/help#breakpoint':
  15. $output = '';
  16. $output .= '<h3>' . t('About') . '</h3>';
  17. $output .= '<p>' . t('The Breakpoint module keeps track of the height, width, and resolution breakpoints where a responsive design needs to change in order to respond to different devices being used to view the site. This module does not have a user interface, but contributed modules such as <a href="!breakpoint_ui">Breakpoint UI</a> may provide one. For more information, see the <a href="!docs">online documentation for the Breakpoint module</a>.', array('!docs' => 'https://drupal.org/documentation/modules/breakpoint', '!breakpoint_ui' => 'https://drupal.org/project/breakpoint_ui')) . '</p>';
  18. $output .= '<h4>' . t('Terminology') . '</h4>';
  19. $output .= '<dl>';
  20. $output .= '<dt>' . t('Breakpoint') . '</dt>';
  21. $output .= '<dd>' . t('A breakpoint separates the height or width of viewports (screens, printers, and other media output types) into steps. For instance, a width breakpoint of 40em creates two steps: one for widths up to 40em and one for widths above 40em. Breakpoints can be used to define when layouts should shift from one form to another, when images should be resized, and other changes that need to respond to changes in viewport height or width.') . '</dd>';
  22. $output .= '<dt>' . t('Media query') . '</dt>';
  23. $output .= '<dd>' . t('<a href="!w3">Media queries</a> are a formal way to encode breakpoints. For instance, a width breakpoint at 40em would be written as the media query "(min-width: 40em)". Breakpoints are really just media queries with some additional meta-data, such as a name and multiplier information.', array('!w3' => 'http://www.w3.org/TR/css3-mediaqueries/')) . '</dd>';
  24. $output .= '<dt>' . t('Resolution multiplier') . '</dt>';
  25. $output .= '<dd>' . t('Resolution multipliers are a measure of the viewport\'s device resolution, defined to be the ratio between the physical pixel size of the active device and the <a href="http://en.wikipedia.org/wiki/Device_independent_pixel">device-independent pixel</a> size. The Breakpoint module defines multipliers of 1, 1.5, and 2; when defining breakpoints, modules and themes can define which multipliers apply to each breakpoint.') . '</dd>';
  26. $output .= '<dt>' . t('Breakpoint group') . '</dt>';
  27. $output .= '<dd>' . t('Breakpoints can be organized into groups. Modules and themes should use groups to separate out breakpoints that are meant to be used for different purposes, such as breakpoints for layouts or breakpoints for image sizing.') . '</dd>';
  28. $output .= '</dl>';
  29. $output .= '<h3>' . t('Uses') . '</h3>';
  30. $output .= '<dl>';
  31. $output .= '<dt>' . t('Defining breakpoints and breakpoint groups') . '</dt>';
  32. $output .= '<dd>' . t('Modules and themes can use the API provided by the Breakpoint module to define breakpoints and breakpoint groups, and to assign resolution multipliers to breakpoints.') . '</dd>';
  33. $output .= '</dl>';
  34. return $output;
  35. }
  36. }
  37. /**
  38. * Load one breakpoint by its identifier.
  39. *
  40. * @param int $id
  41. * The id of the breakpoint to load.
  42. *
  43. * @return \Drupal\breakpoint\Entity\Breakpoint|null
  44. * The entity object, or NULL if there is no entity with the given id.
  45. *
  46. * @todo Remove this in a follow-up issue.
  47. * @see http://drupal.org/node/1798214
  48. */
  49. function breakpoint_load($id) {
  50. return entity_load('breakpoint', $id);
  51. }
  52. /**
  53. * Load all breakpoint groups as select options.
  54. *
  55. * @return array
  56. * An array containing breakpoint group labels indexed by their ids.
  57. */
  58. function breakpoint_group_select_options() {
  59. $options = array();
  60. $breakpoint_groups = entity_load_multiple('breakpoint_group');
  61. foreach ($breakpoint_groups as $breakpoint_group) {
  62. $options[$breakpoint_group->id()] = $breakpoint_group->label();
  63. }
  64. asort($options);
  65. return $options;
  66. }
  67. /**
  68. * Load all breakpoints as select options.
  69. *
  70. * @return array
  71. * An array containing breakpoints indexed by their ids.
  72. */
  73. function breakpoint_select_options() {
  74. $options = array();
  75. $breakpoints = entity_load_multiple('breakpoint');
  76. foreach ($breakpoints as $breakpoint) {
  77. $options[$breakpoint->id()] = $breakpoint->label() . ' (' . $breakpoint->source . ' - ' . $breakpoint->sourceType . ') [' . $breakpoint->mediaQuery . ']';
  78. }
  79. asort($options);
  80. return $options;
  81. }